fix(stats-web): linting issues

akash-network · May 25, 2024 · bd3bc87 · bd3bc87
1 parent 0b836cc
commit bd3bc87
Show file tree

Hide file tree

Showing 8 changed files with 65 additions and 28 deletions.
diff --git a/stats-web/src/app/addresses/[address]/deployments/[dseq]/DeploymentInfo.tsx b/stats-web/src/app/addresses/[address]/deployments/[dseq]/DeploymentInfo.tsx
@@ -8,15 +8,14 @@ import { Title } from "@/components/Title";
 import { Badge } from "@/components/ui/badge";
 import { Card, CardContent } from "@/components/ui/card";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
-import { useFriendlyMessageType } from "@/hooks/useFriendlyMessageType";
 import { getSplitText } from "@/hooks/useShortText";
 import { roundDecimal, udenomToDenom } from "@/lib/mathHelpers";
 import { bytesToShrink } from "@/lib/unitUtils";
 import { UrlService } from "@/lib/urlUtils";
-import { cn } from "@/lib/utils";
 import { DeploymentDetail } from "@/types";
 import Link from "next/link";
 import { FormattedNumber, FormattedTime } from "react-intl";
+import { EventRow } from "./EventRow";
 
 interface IProps {
   deployment: DeploymentDetail;
@@ -90,17 +89,7 @@ export function DeploymentInfo({ deployment }: IProps) {
 
               <TableBody>
                 {deployment.events.map((event, i) => (
-                  <TableRow key={`${event.txHash}_${i}`}>
-                    <TableCell>
-                      <Link href={UrlService.transaction(event.txHash)} target="_blank">
-                        {getSplitText(event.txHash, 6, 6)}
-                      </Link>
-                    </TableCell>
-                    <TableCell align="center">{useFriendlyMessageType(event.type)}</TableCell>
-                    <TableCell align="center">
-                      <FormattedTime value={event.date} day="2-digit" month="2-digit" year="numeric" />
-                    </TableCell>
-                  </TableRow>
+                  <EventRow key={`${event.txHash}_${i}`} event={event} />
                 ))}
               </TableBody>
             </Table>

diff --git a/stats-web/src/app/addresses/[address]/deployments/[dseq]/EventRow.tsx b/stats-web/src/app/addresses/[address]/deployments/[dseq]/EventRow.tsx
@@ -0,0 +1,30 @@
+import { TableCell, TableRow } from "@/components/ui/table";
+import { useFriendlyMessageType } from "@/hooks/useFriendlyMessageType";
+import { getSplitText } from "@/hooks/useShortText";
+import { UrlService } from "@/lib/urlUtils";
+import Link from "next/link";
+import { FormattedTime } from "react-intl";
+
+export const EventRow = ({
+  event
+}: React.PropsWithChildren<{
+  event: {
+    txHash: string;
+    date: string;
+    type: string;
+  };
+}>) => {
+  return (
+    <TableRow>
+      <TableCell>
+        <Link href={UrlService.transaction(event.txHash)} target="_blank">
+          {getSplitText(event.txHash, 6, 6)}
+        </Link>
+      </TableCell>
+      <TableCell align="center">{useFriendlyMessageType(event.type)}</TableCell>
+      <TableCell align="center">
+        <FormattedTime value={event.date} day="2-digit" month="2-digit" year="numeric" />
+      </TableCell>
+    </TableRow>
+  );
+};
diff --git a/stats-web/src/app/addresses/[address]/transactions/TransactionTypeCell.tsx b/stats-web/src/app/addresses/[address]/transactions/TransactionTypeCell.tsx
@@ -0,0 +1,22 @@
+import { Badge } from "@/components/ui/badge";
+import { useFriendlyMessageType } from "@/hooks/useFriendlyMessageType";
+import { TransactionRowType } from "@/lib/zod/transactionRow";
+import { Row } from "@tanstack/react-table";
+
+export const EventRow = ({
+  row
+}: React.PropsWithChildren<{
+  row: Row<TransactionRowType>;
+}>) => {
+  const friendlyMessage = useFriendlyMessageType(row.original.messages[0].type);
+  const firstMessageType = row.original.messages[0].isReceiver ? "Receive" : friendlyMessage;
+
+  return (
+    <>
+      <Badge className="h-4 max-w-[120px] bg-primary">
+        <span className="truncate">{firstMessageType}</span>
+      </Badge>
+      <span className="text-xs">{row.original.messages.length > 1 ? " +" + (row.original.messages.length - 1) : ""}</span>
+    </>
+  );
+};
diff --git a/stats-web/src/app/addresses/[address]/transactions/columns.tsx b/stats-web/src/app/addresses/[address]/transactions/columns.tsx
@@ -4,12 +4,11 @@ import { DataTableColumnHeader } from "@/components/table/data-table-column-head
 import { UrlService } from "@/lib/urlUtils";
 import { AccessorColumnDef } from "@tanstack/react-table";
 import Link from "next/link";
-import { Badge } from "@/components/ui/badge";
 import { getSplitText } from "@/hooks/useShortText";
-import { useFriendlyMessageType } from "@/hooks/useFriendlyMessageType";
 import { AKTAmount } from "@/components/AKTAmount";
 import { FormattedRelativeTime } from "react-intl";
 import { TransactionRowType } from "@/lib/zod/transactionRow";
+import { EventRow } from "./TransactionTypeCell";
 
 export const columns: AccessorColumnDef<TransactionRowType>[] = [
   {
@@ -28,16 +27,7 @@ export const columns: AccessorColumnDef<TransactionRowType>[] = [
     enableSorting: false,
     header: ({ column }) => <DataTableColumnHeader column={column} title="Type" />,
     cell: ({ row }) => {
-      const firstMessageType = row.original.messages[0].isReceiver ? "Receive" : useFriendlyMessageType(row.original.messages[0].type);
-
-      return (
-        <>
-          <Badge className="h-4 max-w-[120px] bg-primary">
-            <span className="truncate">{firstMessageType}</span>
-          </Badge>
-          <span className="text-xs">{row.original.messages.length > 1 ? " +" + (row.original.messages.length - 1) : ""}</span>
-        </>
-      );
+      return <EventRow row={row} />;
     }
   },
   {

diff --git a/stats-web/src/components/SearchBar.tsx b/stats-web/src/components/SearchBar.tsx
@@ -29,6 +29,7 @@ const SearchBar: React.FunctionComponent<Props> = ({}) => {
 
   useEffect(() => {
     setSearchType(getSearchType(searchTerms));
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [searchTerms]);
 
   function onSearchTermsChange(ev: React.ChangeEvent<HTMLInputElement>) {

diff --git a/stats-web/src/components/blockchain/TransactionRow.tsx b/stats-web/src/components/blockchain/TransactionRow.tsx
@@ -18,7 +18,8 @@ type Props = {
 
 export const TransactionRow: React.FunctionComponent<Props> = ({ transaction, blockHeight, isSimple }) => {
   const txHash = getSplitText(transaction.hash, 6, 6);
-  const firstMessageType = transaction.messages[0].isReceiver ? "Receive" : useFriendlyMessageType(transaction.messages[0].type);
+  const friendlyMessage = useFriendlyMessageType(transaction.messages[0].type);
+  const firstMessageType = transaction.messages[0].isReceiver ? "Receive" : friendlyMessage;
 
   return (
     <TableRow>
@@ -46,7 +47,7 @@ export const TransactionRow: React.FunctionComponent<Props> = ({ transaction, bl
         <Link href={UrlService.block(blockHeight)}>{blockHeight}</Link>
       </TableCell>
       <TableCell align="center">
-        <span className="text-sm whitespace-nowrap">
+        <span className="whitespace-nowrap text-sm">
           <FormattedRelativeTime
             value={(new Date(transaction.datetime).getTime() - new Date().getTime()) / 1000}
             numeric="auto"

diff --git a/stats-web/src/components/table/data-table.tsx b/stats-web/src/components/table/data-table.tsx
@@ -118,6 +118,7 @@ export function DataTable<TData, TValue>({
 
       table.resetPageIndex();
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [sorting]);
 
   useEffect(() => {
@@ -126,6 +127,7 @@ export function DataTable<TData, TValue>({
 
       table.resetPageIndex();
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [columnFilters]);
 
   return (

diff --git a/stats-web/src/store/networkStore.ts b/stats-web/src/store/networkStore.ts
@@ -59,6 +59,8 @@ export const initiateNetworkData = async () => {
 
 const selectedNetwork = atom<Network>(networks[0]);
 
-export default {
+const networkStore = {
   selectedNetwork
 };
+
+export default networkStore;