Skip to content

Commit

Permalink
🚧
Browse files Browse the repository at this point in the history
  • Loading branch information
Quentin Burg committed Apr 3, 2024
1 parent 990e572 commit 4e05db0
Show file tree
Hide file tree
Showing 7 changed files with 88 additions and 49 deletions.
10 changes: 7 additions & 3 deletions components/Alias.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { useContext, useMemo } from "react";
import { AppStateContext } from "../context/state";
import { useTzktAccountAlias } from "../utils/getTzktAlias";
import Copy from "./Copy";

const Alias = ({
Expand All @@ -14,6 +15,8 @@ const Alias = ({
disabled?: boolean;
}) => {
const state = useContext(AppStateContext)!;
const tzktAlias = useTzktAccountAlias(address);
console.log("🚀 ~ tzktAlias:", tzktAlias);
const formatted = useMemo(
() =>
`${(address ?? "").substring(0, length)}...${(address ?? "").substring(
Expand All @@ -25,11 +28,12 @@ const Alias = ({
const toDisplay = useMemo(
() =>
state.aliases[address] === ""
? formatted
: state.aliases[address] ?? formatted,
[state, address, formatted]
? tzktAlias ?? formatted
: state.aliases[address],
[state.aliases, address, formatted, tzktAlias]
);

console;
return (
<Copy value={address} text="Copy address" disabled={disabled}>
<span className={className} title={address}>
Expand Down
13 changes: 9 additions & 4 deletions components/Sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ import { version } from "../types/display";
import useIsOwner from "../utils/useIsOwner";
import { signers, toStorage } from "../versioned/apis";
import { hasTzip27Support } from "../versioned/util";
import Alias from "./Alias";
import Copy from "./Copy";
import Tooltip from "./Tooltip";

Expand Down Expand Up @@ -68,7 +69,7 @@ const SelectedItem = ({
<p className="text-xl text-white">{name}</p>
<p>{threshold}</p>
</div>
<Copy value={address ?? ""} disabled={disableCopy}>
{/* <Copy value={address ?? ""} disabled={disableCopy}>
<span className="mt-1 text-sm text-zinc-400" data-name="copy">
{!address ? (
<span>...</span>
Expand All @@ -78,7 +79,9 @@ const SelectedItem = ({
)}`
)}
</span>
</Copy>
</Copy> */}

<Alias address={address} disabled />
<div className="mt-2 flex items-center justify-between">
<Tooltip text={formattedBalance.toString() + " Tez"}>
<p className="text-lg">{formattedBalance.toFixed(2)} Tez</p>
Expand Down Expand Up @@ -256,9 +259,11 @@ const Sidebar = ({
className="radix-disabled:opacity-50 relative flex select-none items-center rounded-md px-8 py-2 text-sm font-medium text-zinc-300 focus:bg-zinc-800 focus:bg-zinc-900 focus:outline-none"
>
<Select.ItemText>
<p className="text-xl text-white">
{/* <p className="text-xl text-white">
{state.aliases[address]}
</p>
</p> */}

<Alias address={address} />

<p className="mt-1 text-sm text-zinc-400">
{address.substring(0, 5)}...
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { TriangleDownIcon } from "@radix-ui/react-icons";
import BigNumber from "bignumber.js";
import { useMemo, useState } from "react";
import { TransferType } from "../types/display";
import Alias from "./Alias";
import { fa1_2Token } from "./FA1_2";
import { fa2Token } from "./FA2Transfer";
import { TransferType } from "../../types/display";
import Alias from "../Alias";
import { fa1_2Token } from "../FA1_2";
import { fa2Token } from "../FA2Transfer";

type props = {
transferType: TransferType;
Expand Down
40 changes: 40 additions & 0 deletions components/history/HistoryTransfer.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import { mutezToTez } from "../../utils/tez";
import Alias from "../Alias";

type HistoryTransferProps = {
proposal: Array<unknown>;
};

const HistoryTransfer = ({ proposal }: HistoryTransferProps) => {
return (
<div
key={(proposal[1] as any).timestamp}
className="grid h-16 w-full grid-cols-3 items-center gap-8 rounded border-b border-zinc-900 bg-zinc-800 px-6 py-4 text-white lg:grid-cols-4"
>
<span className="justify-self-start font-bold md:ml-11">
<span className="hidden md:block">Received Tez</span>
<span className="md:hidden">Received</span>
</span>
<span className="text-center font-light text-zinc-300 md:min-w-[7rem] md:text-left">
<span className="hidden md:inline">From:</span>{" "}
<Alias address={(proposal[1] as any).sender.address} />
</span>
<span className="truncate font-light text-zinc-300 md:min-w-[7rem]">
<span className="hidden md:inline">Amount:</span>{" "}
{mutezToTez((proposal[1] as any).amount)} Tez
</span>
<span className="hidden justify-self-end lg:block">
{new Date((proposal[1] as any).timestamp).toLocaleDateString()} -{" "}
{`${new Date((proposal[1] as any).timestamp)
.getHours()
.toString()
.padStart(2, "0")}:${new Date((proposal[1] as any).timestamp)
.getMinutes()
.toString()
.padStart(2, "0")}`}
</span>
</div>
);
};

export default HistoryTransfer;
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "env-cmd -f ./config/.env.dev next dev",
"dev": "env-cmd -f ./config/.env next dev",
"sandbox": "env-cmd -f ./config/.env.sandbox next dev --port 4000",
"build": "next build",
"start": "next start --port 80",
Expand Down
42 changes: 5 additions & 37 deletions pages/[walletAddress]/history.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@ import { tzip16 } from "@taquito/tzip16";
import { validateContractAddress, ValidationResult } from "@taquito/utils";
import { useContext, useEffect, useMemo, useReducer, useRef } from "react";
import Alias from "../../components/Alias";
import HistoryFaToken from "../../components/HistoryFaToken";
import ProposalCard from "../../components/ProposalCard";
import Spinner from "../../components/Spinner";
import HistoryFaToken from "../../components/history/HistoryFaToken";
import HistoryTransfer from "../../components/history/HistoryTransfer";
import Meta from "../../components/meta";
import Modal from "../../components/modal";
import ProposalSignForm from "../../components/proposalSignForm";
Expand Down Expand Up @@ -149,6 +150,7 @@ const getLatestTimestamp = (og: {

const History = () => {
const globalState = useContext(AppStateContext)!;
console.log("🚀 ~ History ~ globalState:", globalState);
const globalDispatch = useContext(AppDispatchContext)!;

const walletTokens = useWalletTokens();
Expand Down Expand Up @@ -380,44 +382,10 @@ const History = () => {
filteredProposals.length > 0 && (
<div className="space-y-6">
{filteredProposals.map(x => {
console.log("x", x, (x[1] as any)?.sender?.address);
switch (x[0]) {
case TransferType.MUTEZ:
return (
<div
key={(x[1] as any).timestamp}
className="grid h-16 w-full grid-cols-3 items-center gap-8 rounded border-b border-zinc-900 bg-zinc-800 px-6 py-4 text-white lg:grid-cols-4"
>
<span className="justify-self-start font-bold md:ml-11">
<span className="hidden md:block">
Received Tez
</span>
<span className="md:hidden">Received</span>
</span>
<span className="text-center font-light text-zinc-300 md:min-w-[7rem] md:text-left">
<span className="hidden md:inline">From:</span>{" "}
<Alias address={(x[1] as any).sender.address} />
</span>
<span className="truncate font-light text-zinc-300 md:min-w-[7rem]">
<span className="hidden md:inline">Amount:</span>{" "}
{mutezToTez((x[1] as any).amount)} Tez
</span>
<span className="hidden justify-self-end lg:block">
{new Date(
(x[1] as any).timestamp
).toLocaleDateString()}{" "}
-{" "}
{`${new Date((x[1] as any).timestamp)
.getHours()
.toString()
.padStart(2, "0")}:${new Date(
(x[1] as any).timestamp
)
.getMinutes()
.toString()
.padStart(2, "0")}`}
</span>
</div>
);
<HistoryTransfer proposal={x} />;
case TransferType.FA2:
case TransferType.FA1_2:
return (
Expand Down
22 changes: 22 additions & 0 deletions utils/getTzktAlias.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import { useEffect, useState } from "react";
import { TZKT_API_URL } from "../context/config";

export const useTzktAccountAlias = (accountAddress: string) => {
const [alias, setAlias] = useState<string | undefined>(undefined);

useEffect(() => {
(async () =>
fetch(`${TZKT_API_URL}/v1/accounts/${accountAddress}`).then(
async response => {
if (response.status >= 200 && response.status < 300) {
const json = await response.json();
if (json["alias"]) {
setAlias(json["alias"]);
}
}
}
))();
}, [accountAddress]);

return alias;
};

0 comments on commit 4e05db0

Please sign in to comment.