Skip to content

Commit

Permalink
Misc fixes (#6)
Browse files Browse the repository at this point in the history
Co-authored-by: Ganesh Swami <[email protected]>
  • Loading branch information
nguyenlejoe and gane5h committed Dec 3, 2023
1 parent 69f729e commit acf8a03
Show file tree
Hide file tree
Showing 11 changed files with 495 additions and 241 deletions.
446 changes: 332 additions & 114 deletions package-lock.json

Large diffs are not rendered by default.

7 changes: 4 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -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": {
".": {
Expand Down Expand Up @@ -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",
Expand Down Expand Up @@ -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",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,6 @@ export default meta;

export const AddressActivityList: Story = {
args: {
address: "ganeshswami.eth",
address: "ganeshswami.eth"
},
};
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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: () => [],
Expand Down Expand Up @@ -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>{" "}
Expand Down Expand Up @@ -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>
);
})}
Expand Down
Loading

0 comments on commit acf8a03

Please sign in to comment.