From 2b3381fa75a92f260a474fe57dc85b44fe5f53a5 Mon Sep 17 00:00:00 2001
From: Dong-Ha Kim <dongha.kim210@gmail.com>
Date: Wed, 8 Nov 2023 17:39:41 +0100
Subject: [PATCH] review requests

---
 src/components/DepositsTable/DataRow.tsx                | 5 ++---
 src/components/DepositsTable/DepositsTable.tsx          | 4 ++--
 src/components/DepositsTable/PaginatedDepositsTable.tsx | 2 +-
 src/components/Pagination/Pagination.styles.tsx         | 1 -
 src/utils/constants.ts                                  | 3 +++
 5 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/components/DepositsTable/DataRow.tsx b/src/components/DepositsTable/DataRow.tsx
index b07187730..667ebaf54 100644
--- a/src/components/DepositsTable/DataRow.tsx
+++ b/src/components/DepositsTable/DataRow.tsx
@@ -9,6 +9,7 @@ import {
   fallbackSuggestedRelayerFeePct,
   suggestedFeesDeviationBufferMultiplier,
   fixedPointAdjustment,
+  pendingStateTimeUntilSlow,
 } from "utils";
 
 import { HeaderCells, ColumnKey } from "./HeadRow";
@@ -33,8 +34,6 @@ type Props = {
 
 const config = getConfig();
 
-const MAX_PENDING_STATE_TIME_UNTIL_SLOW = 30 * 60; // 30 mins
-
 function isColumnDisabled(disabledColumns: ColumnKey[], column: ColumnKey) {
   return disabledColumns.includes(column);
 }
@@ -61,7 +60,7 @@ export function DataRow({
     deposit.status === "pending" &&
     Math.abs(
       DateTime.fromSeconds(deposit.depositTime).diffNow("seconds").as("seconds")
-    ) > MAX_PENDING_STATE_TIME_UNTIL_SLOW;
+    ) > pendingStateTimeUntilSlow;
 
   // Hide unsupported or unknown token deposits
   if (!token) {
diff --git a/src/components/DepositsTable/DepositsTable.tsx b/src/components/DepositsTable/DepositsTable.tsx
index e6f82445e..f660f17c8 100644
--- a/src/components/DepositsTable/DepositsTable.tsx
+++ b/src/components/DepositsTable/DepositsTable.tsx
@@ -4,7 +4,7 @@ import { HeadRow, headerCells, ColumnKey } from "./HeadRow";
 import { DataRow } from "./DataRow";
 import { Deposit } from "hooks/useDeposits";
 
-export type Props = {
+export type DepositsTableProps = {
   disabledColumns?: ColumnKey[];
   onClickSpeedUp?: (deposit: Deposit) => void;
   deposits: Deposit[];
@@ -14,7 +14,7 @@ export function DepositsTable({
   disabledColumns = [],
   deposits,
   onClickSpeedUp,
-}: Props) {
+}: DepositsTableProps) {
   return (
     <Wrapper>
       <StyledTable>
diff --git a/src/components/DepositsTable/PaginatedDepositsTable.tsx b/src/components/DepositsTable/PaginatedDepositsTable.tsx
index 4f1e5c48b..a8f3f5725 100644
--- a/src/components/DepositsTable/PaginatedDepositsTable.tsx
+++ b/src/components/DepositsTable/PaginatedDepositsTable.tsx
@@ -1,7 +1,7 @@
 import styled from "@emotion/styled";
 
 import Pagination, { paginate } from "components/Pagination";
-import { DepositsTable, Props as DepositsTableProps } from "./DepositsTable";
+import { DepositsTable, DepositsTableProps } from "./DepositsTable";
 
 type Props = DepositsTableProps & {
   currentPage: number;
diff --git a/src/components/Pagination/Pagination.styles.tsx b/src/components/Pagination/Pagination.styles.tsx
index 4f0206a97..e9bbf8324 100644
--- a/src/components/Pagination/Pagination.styles.tsx
+++ b/src/components/Pagination/Pagination.styles.tsx
@@ -40,7 +40,6 @@ export const PageSizeSelectButton = styled(UnstyledButton)`
   }
 
   @media ${QUERIESV2.sm.andDown} {
-    margin-bottom: 1rem;
     padding: 10px 20px;
   }
 `;
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 940b2d73d..82c6aa79c 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -688,3 +688,6 @@ export const walletBlacklist = (process.env.REACT_APP_WALLET_BLACKLIST || "")
 
 // Pre-computed gas expenditure for deposits used for estimations
 export const gasExpenditureDeposit = BigNumber.from(90_000);
+
+// Used to determine whether to show the "slow" warning in the deposits table
+export const pendingStateTimeUntilSlow = 30 * 60; // 30 mins