Skip to content

Commit

Permalink
Merge pull request #43 from Monobladegg/main
Browse files Browse the repository at this point in the history 
Table redesign
  • Loading branch information
@grandmotivator
grandmotivator authored Aug 16, 2024
2 parents e91f038 + 5f753cf commit 87c4e33
Show file tree
Hide file tree
Showing 5 changed files with 100 additions and 42 deletions.
6 changes: 3 additions & 3 deletions app/testnet/account/testnet.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -515,7 +515,7 @@ const PublicNet: FC<Props> = ({ id }) => {
aria-label={issuer.paging_token}
className="asset-link"
>
{issuer.asset_code}
{issuer?.asset_code}
</a>
</Link>
&nbsp;
Expand Down Expand Up @@ -734,10 +734,10 @@ const PublicNet: FC<Props> = ({ id }) => {
className="asset-link"
>
{/* <span className="asset-icon icon icon-stellar"></span> */}
{item.asset_code ==
{item?.asset_code ==
undefined
? "XLM"
: item.asset_code}
: item?.asset_code}
</span>
</span>
</a>
Expand Down
1 change: 1 addition & 0 deletions src/pages/public/account/(BalanceItem)/index.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export {default} from "./ui"
55 changes: 55 additions & 0 deletions src/pages/public/account/(BalanceItem)/ui/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import { FC } from "react";
import Link from "next/link";
import { collapseAccount } from "@/pages/public/account/publicnet";
import { Balance } from "@/shared/types";

interface Props {
number: string;
decimal: string;
item: Balance;
}

const BalanceItem: FC<Props> = ({ number, decimal, item }) => {
return (
<tr>
<td
style={{
textAlign: "left",
width: "25%",
}}
>
{number}
{decimal}
</td>
<td
style={{
textAlign: "left",
width: "33.3%",
}}
>
<a
aria-label={item?.asset_code || "Asset"}
className="asset-link"
href={`https://stellar.expert/explorer/public/asset/${
item?.asset_code || "XLM"
}-${item?.asset_issuer}`}
target="_blank"
>
{item?.asset_code || "XLM"}
</a>
</td>
<td
style={{
textAlign: "left",
width: "33.3%",
}}
>
<Link href={`/public/account?id=${item?.asset_issuer}`}>
{collapseAccount(item?.asset_issuer || "")}
</Link>
</td>
</tr>
);
};

export default BalanceItem;
79 changes: 40 additions & 39 deletions src/pages/public/account/publicnet.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

"use client";

import { MainLayout } from "@/widgets";
Expand All @@ -17,6 +16,7 @@ import { useShallow } from "zustand/react/shallow";
import { Balance, Information, Signer } from "@/shared/types";
import { DocumentInfo, Issuer } from "@/shared/types";
import { processKeys } from "@/shared/lib";
import BalanceItem from "@/pages/public/account/(BalanceItem)";

interface Props {
id: string | undefined | null;
Expand All @@ -32,7 +32,7 @@ export const collapseAccount = (accountId: string) => {
};

const PublicNet: FC<Props> = ({ id }) => {
const account = id
const account = id;
const { net } = useStore(useShallow((state) => ({ net: state.net })));
const [information, setInformation] = useState<Information>(
{} as Information
Expand Down Expand Up @@ -135,7 +135,6 @@ const PublicNet: FC<Props> = ({ id }) => {
handler();
}, [account]);


return (
<MainLayout>
<div className="container">
Expand Down Expand Up @@ -419,7 +418,7 @@ const PublicNet: FC<Props> = ({ id }) => {
aria-label={issuer.paging_token}
className="asset-link"
>
{issuer.asset_code}
{issuer?.asset_code}
</a>
</Link>
&nbsp;
Expand Down Expand Up @@ -582,42 +581,44 @@ const PublicNet: FC<Props> = ({ id }) => {
</i>
</h3>
<hr className="flare"></hr>
<div className="all-account-balances micro-space text-header">
{information?.balances?.map(
(item: Balance, key: number) => {
const totalInfo = item.balance.split(".");
const number = totalInfo[0];
const decimal =
Number(totalInfo[1]) == 0 ? "" : "." + totalInfo[1];
<div>
<div className="asset-list-view">
<table
className="table exportable space"
style={{ width: "100%" }}
>
<tbody>
{information?.balances?.filter((item: Balance) => !item?.asset_code).map(
(item: Balance, index: number) => {
const totalInfo = item.balance.split(".");
const number = totalInfo[0];
const decimal =
Number(totalInfo[1]) === 0
? ""
: "." + totalInfo[1];

return (
<a href="#" key={key} className="account-balance">
<div className="condensed">
{number}
<span className="text-small">{decimal}</span>
</div>
<div className="text-tiny condensed">
{item.asset_issuer && (
<div>
{collapseAccount(item.asset_issuer)}
</div>
)}
</div>
<span className="text-small">
<span
aria-label={item.asset_issuer}
className="asset-link"
>
{/* <span className="asset-icon icon icon-stellar"></span> */}
{item.asset_code == undefined
? "XLM"
: item.asset_code}
</span>
</span>
</a>
);
}
)}
return (
<BalanceItem key={index} number={number} decimal={decimal} item={item} />
);
}
)}
{information?.balances?.filter((item: Balance) => item?.asset_code).map(
(item: Balance, index: number) => {
const totalInfo = item.balance.split(".");
const number = totalInfo[0];
const decimal =
Number(totalInfo[1]) === 0
? ""
: "." + totalInfo[1];

return (
<BalanceItem key={index} number={number} decimal={decimal} item={item} />
);
}
)}
</tbody>
</table>
</div>
</div>
</div>
</div>
Expand Down
1 change: 1 addition & 0 deletions src/shared/types/information/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@ export type Balance = {
balance: string;
asset_code?: string;
asset_issuer?: string;
asset_type?: string;
}

export type TomlInfo = {
Expand Down

0 comments on commit 87c4e33

Please sign in to comment.