Misc fixes

package.json

@@ -1,7 +1,7 @@
 {
     "_id": "[email protected]",
     "name": "@covalenthq/goldrush-kit",
-    "version": "0.0.2",
+    "version": "0.1.9",
     "types": "dist/index.d.ts",
     "exports": {
         ".": {
@@ -32,7 +32,7 @@
         "dev": "concurrently -n \"storybook-css,storybook\" -c \"blue,red\" \"npm run dev:css\" \"storybook dev -p 6006\"",
         "dev:css": "tailwindcss -w -i ./src/tailwind-input.css -o ./src/tailwind-output.css --minify",
         "lint": "eslint ./src/",
-        "prepublishOnly": "npm run build"
+        "prepublishOnly": "npm run build:library"
     },
     "devDependencies": {
         "@babel/core": "^7.23.2",
@@ -75,7 +75,8 @@
         "vite": "^4.5.0",
         "vite-plugin-dts": "^1.7.3",
         "vite-plugin-lib-inject-css": "^1.3.0",
-        "vite-tsconfig-paths": "^4.2.1"
+        "vite-tsconfig-paths": "^4.2.1",
+        "@covalenthq/client-sdk": "^0.6.6"
     },
     "peerDependencies": {
         "react": "^18.2.0",

src/components/Molecules/AccountCardView/AccountCardView.tsx

@@ -33,7 +33,7 @@ export const AccountCardView: React.FC<AccountCardViewProps> = ({
 
     return (
         <>
-            <div className="flex w-full items-center gap-x-4 rounded border p-2 md:w-min lg:w-min">
+            <div className="flex w-full items-center gap-x-4 rounded border p-2 md:max-w-[18rem] lg:max-w-[18rem]">
                 <AddressAvatar
                     type={type}
                     address={address}

src/components/Organisms/NFTs/NFTWalletTokenListView/NFTWalletTokenListView.tsx

@@ -101,8 +101,8 @@ export const NFTWalletTokenListView: React.FC<NFTWalletTokenListViewProps> = ({
                     <div className="flex flex-wrap place-content-between gap-2">
                         <AccountCardView address={address} />
 
-                        <div className="w-full rounded border p-2 md:w-min lg:w-min">
-                            <h2 className="text-base font-semibold  text-secondary ">
+                        <div className="w-full rounded border p-2 md:max-w-[15rem] lg:max-w-[15rem]">
+                            <h2 className="text-md  text-secondary ">
                                 Total Quote
                             </h2>
                             <div className="flex items-end gap-2">

src/components/Organisms/TokenBalances/AddressActivityListView/AddressActivityListView.stories.tsx

@@ -12,6 +12,6 @@ export default meta;
 
 export const AddressActivityList: Story = {
     args: {
-        address: "ganeshswami.eth",
+        address: "ganeshswami.eth"
     },
 };

src/components/Organisms/TokenBalances/AddressActivityListView/AddressActivityListView.tsx

@@ -28,102 +28,36 @@ import { GRK_SIZES } from "@/utils/constants/shared.constants";
 import { useGoldrush } from "@/utils/store/Goldrush";
 import { type AddressActivityListViewProps } from "@/utils/types/organisms.types";
 
-const columns: ColumnDef<ChainActivityEvent>[] = [
-    {
-        id: "select",
-        header: ({ table }) => (
-            <Checkbox
-                checked={table.getIsAllPageRowsSelected()}
-                onCheckedChange={(value) =>
-                    table.toggleAllPageRowsSelected(!!value)
-                }
-                aria-label="Select all"
-            />
-        ),
-        cell: ({ row }) => (
-            <Checkbox
-                checked={row.getIsSelected()}
-                onCheckedChange={(value) => row.toggleSelected(!!value)}
-                aria-label="Select row"
-            />
-        ),
-        enableSorting: false,
-        enableHiding: false,
-    },
-    {
-        accessorKey: "label",
-        header: ({ column }) => (
-            <TableHeaderSorting
-                align="left"
-                header_name={"Name"}
-                column={column}
-            />
-        ),
-        cell: ({ row }) => {
-            return (
-                <div className="flex items-center gap-x-1 ">
-                    <TokenAvatar
-                        is_chain_logo={true}
-                        token_url={row.original.logo_url}
-                        size={GRK_SIZES.EXTRA_EXTRA_SMALL}
-                    />
-                    {row.getValue("label")}
-                </div>
-            );
-        },
-    },
-    {
-        accessorKey: "last_seen_at",
-        header: ({ column }) => (
-            <TableHeaderSorting
-                align="left"
-                header_name={"Last Active"}
-                column={column}
-            />
-        ),
-        cell: ({ row }) => {
-            const t = (row.getValue("last_seen_at") as any).toString();
-
-            return <div>{timestampParser(t, "relative")}</div>;
-        },
-    },
-    {
-        accessorKey: "is_testnet",
-        header: ({ column }) => (
-            <TableHeaderSorting
-                align="center"
-                header_name={"Mainnet"}
-                column={column}
-            />
-        ),
-
-        cell: ({ row }) => {
-            const t = row.getValue("is_testnet");
-
-            return (
-                <div className="text-center">
-                    {t ? (
-                        ""
-                    ) : (
-                        <IconWrapper icon_class_name="playlist_add_check" />
-                    )}
-                </div>
-            );
-        },
-    },
-];
-
 export const AddressActivityListView: React.FC<
     AddressActivityListViewProps
-> = ({ address }) => {
+> = ({ address, get_all_row_selection, get_row_selection_state, row_selection_state }) => {
     const { covalentClient } = useGoldrush();
     const [sorting, setSorting] = useState<SortingState>([]);
-    const [rowSelection, setRowSelection] = useState({});
-
+    const [rowSelection, setRowSelection] = useState(row_selection_state ? row_selection_state : {});
     const [maybeResult, setResult] =
         useState<Option<ChainActivityEvent[]>>(None);
     const [error, setError] = useState({ error: false, error_message: "" });
 
+    useEffect(() => {
+        maybeResult.match({
+            None: () => null,
+            Some: (resp) => {
+                const chains_selected: ChainActivityEvent[] = [];
+                for (const i in rowSelection) {
+                    const index: number = parseInt(i);
+                    chains_selected.push(resp[index]);
+                }
+                if (get_all_row_selection) {
+                    get_all_row_selection(chains_selected);
+                }
+            }
+        });
+        if (get_row_selection_state) {
+            get_row_selection_state(rowSelection);
+        }
+    }, [maybeResult, rowSelection, row_selection_state]);
+
+
     useEffect(() => {
         (async () => {
             let response;
@@ -146,6 +80,94 @@ export const AddressActivityListView: React.FC<
         })();
     }, [address]);
 
+    const columns: ColumnDef<ChainActivityEvent>[] = [
+        {
+            id: "select",
+            header: ({ table }) => (
+                <Checkbox
+                    checked={table.getIsAllPageRowsSelected()}
+                    onCheckedChange={(value) => {
+                        table.toggleAllPageRowsSelected(!!value);
+                    }}
+                    aria-label="Select all"
+                />
+            ),
+            cell: ({ row }) => (
+                <Checkbox
+
+                    checked={row.getIsSelected()}
+                    onCheckedChange={(value) => {
+                        row.toggleSelected(!!value);
+                    }}
+                    aria-label="Select row"
+                />
+            ),
+            enableSorting: false,
+            enableHiding: false,
+        },
+        {
+            accessorKey: "label",
+            header: ({ column }) => (
+                <TableHeaderSorting
+                    align="left"
+                    header_name={"Name"}
+                    column={column}
+                />
+            ),
+            cell: ({ row }) => {
+                return (
+                    <div className="flex items-center gap-x-1 ">
+                        <TokenAvatar
+                            is_chain_logo={true}
+                            token_url={row.original.logo_url}
+                            size={GRK_SIZES.EXTRA_EXTRA_SMALL}
+                        />
+                        {row.getValue("label")}
+                    </div>
+                );
+            },
+        },
+        {
+            accessorKey: "last_seen_at",
+            header: ({ column }) => (
+                <TableHeaderSorting
+                    align="left"
+                    header_name={"Last Active"}
+                    column={column}
+                />
+            ),
+            cell: ({ row }) => {
+                const t = (row.getValue("last_seen_at") as any).toString();
+
+                return <div>{timestampParser(t, "relative")}</div>;
+            },
+        },
+        {
+            accessorKey: "is_testnet",
+            header: ({ column }) => (
+                <TableHeaderSorting
+                    align="center"
+                    header_name={"Mainnet"}
+                    column={column}
+                />
+            ),
+
+            cell: ({ row }) => {
+                const t = row.getValue("is_testnet");
+
+                return (
+                    <div className="text-center">
+                        {t ? (
+                            ""
+                        ) : (
+                            <IconWrapper iconClassName="playlist_add_check" />
+                        )}
+                    </div>
+                );
+            },
+        },
+    ];
+
     const table = useReactTable({
         data: maybeResult.match({
             None: () => [],
@@ -233,9 +255,9 @@ export const AddressActivityListView: React.FC<
 
     return (
         <div className="space-y-4 ">
-            <div className="flex place-content-between">
+            <div className="flex flex-wrap gap-2 place-content-between">
                 <AccountCardView address={address} />
-                <div className="rounded border p-2">
+                <div className="w-full rounded border p-2 md:max-w-[15rem] lg:max-w-[15rem]">
                     <div className="flex place-content-between items-center space-x-1">
                         {" "}
                         <span>Mainnet Chains Active</span>{" "}
@@ -301,10 +323,10 @@ export const AddressActivityListView: React.FC<
                                         {header.isPlaceholder
                                             ? null
                                             : flexRender(
-                                                  header.column.columnDef
-                                                      .header,
-                                                  header.getContext()
-                                              )}
+                                                header.column.columnDef
+                                                    .header,
+                                                header.getContext()
+                                            )}
                                     </TableHead>
                                 );
                             })}