From 495d8edfa24eba2197d83f503be6e467e58f85a3 Mon Sep 17 00:00:00 2001 From: MananTank Date: Tue, 25 Mar 2025 01:49:04 +0000 Subject: [PATCH] [TOOL-3757] Dashboard: Prefill last used project in contract deployment page (#6534) --- .../components/SaveLastUsedProject.ts | 23 ++++++++++ .../[team_slug]/[project_slug]/layout.tsx | 2 + .../contract-deploy-form/custom-contract.tsx | 45 +++++++++++++++++-- 3 files changed, 67 insertions(+), 3 deletions(-) create mode 100644 apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/SaveLastUsedProject.ts diff --git a/apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/SaveLastUsedProject.ts b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/SaveLastUsedProject.ts new file mode 100644 index 00000000000..462baf165b2 --- /dev/null +++ b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/SaveLastUsedProject.ts @@ -0,0 +1,23 @@ +"use client"; + +import { useEffect } from "react"; + +export const LAST_USED_PROJECT_ID = "last-used-project-id"; +export const LAST_USED_TEAM_ID = "last-used-team-id"; + +export function SaveLastUsedProject(props: { + projectId: string; + teamId: string; +}) { + // eslint-disable-next-line no-restricted-syntax + useEffect(() => { + try { + localStorage.setItem(LAST_USED_PROJECT_ID, props.projectId); + localStorage.setItem(LAST_USED_TEAM_ID, props.teamId); + } catch { + // ignore localStorage errors + } + }, [props.projectId, props.teamId]); + + return null; +} diff --git a/apps/dashboard/src/app/team/[team_slug]/[project_slug]/layout.tsx b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/layout.tsx index b281cd8617b..eeb3c1ed4b2 100644 --- a/apps/dashboard/src/app/team/[team_slug]/[project_slug]/layout.tsx +++ b/apps/dashboard/src/app/team/[team_slug]/[project_slug]/layout.tsx @@ -4,6 +4,7 @@ import { redirect } from "next/navigation"; import { getValidAccount } from "../../../account/settings/getAccount"; import { getAuthTokenWalletAddress } from "../../../api/lib/getAuthToken"; import { TeamHeaderLoggedIn } from "../../components/TeamHeader/team-header-logged-in.client"; +import { SaveLastUsedProject } from "./components/SaveLastUsedProject"; import { ProjectTabs } from "./tabs"; export default async function TeamLayout(props: { @@ -61,6 +62,7 @@ export default async function TeamLayout(props: { />
{props.children}
+ ); } diff --git a/apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx b/apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx index a0c5f22fa26..fe5a75cbd62 100644 --- a/apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx +++ b/apps/dashboard/src/components/contract-components/contract-deploy-form/custom-contract.tsx @@ -44,10 +44,16 @@ import { useActiveAccount, useActiveWalletChain } from "thirdweb/react"; import { upload } from "thirdweb/storage"; import { isZkSyncChain } from "thirdweb/utils"; import { FormHelperText, FormLabel, Text } from "tw-components"; +import { + LAST_USED_PROJECT_ID, + LAST_USED_TEAM_ID, +} from "../../../app/team/[team_slug]/[project_slug]/components/SaveLastUsedProject"; import { useAddContractToProject } from "../../../app/team/[team_slug]/[project_slug]/hooks/project-contracts"; import { useCustomFactoryAbi, useFunctionParamsFromABI } from "../hooks"; import { AddToProjectCardUI, + type MinimalProject, + type MinimalTeam, type MinimalTeamsAndProjects, } from "./add-to-project-card"; import { Fieldset } from "./common"; @@ -151,9 +157,42 @@ export const CustomContractForm: React.FC = ({ const thirdwebClient = useThirdwebClient(jwt); const [isImportEnabled, setIsImportEnabled] = useState(true); - const [importSelection, setImportSelection] = useState({ - team: teamsAndProjects[0]?.team, - project: teamsAndProjects[0]?.projects[0], + + const [importSelection, setImportSelection] = useState<{ + team: MinimalTeam | undefined; + project: MinimalProject | undefined; + }>(() => { + const defaultSelection = { + team: teamsAndProjects[0]?.team, + project: teamsAndProjects[0]?.projects[0], + }; + + try { + const lastUsedTeamSlug = localStorage.getItem(LAST_USED_TEAM_ID); + const lastUsedProjectSlug = localStorage.getItem(LAST_USED_PROJECT_ID); + + if (!lastUsedTeamSlug || !lastUsedProjectSlug) { + return defaultSelection; + } + + const teamWithProjects = teamsAndProjects.find( + (t) => t.team.id === lastUsedTeamSlug, + ); + const project = teamWithProjects?.projects.find( + (p) => p.id === lastUsedProjectSlug, + ); + + if (teamWithProjects && project) { + return { + team: teamWithProjects.team, + project, + }; + } + } catch { + // ignore localStorage errors + } + + return defaultSelection; }); const activeAccount = useActiveAccount();