[TOOL-3757] Dashboard: Prefill last used project in contract deployment page (#6534)

Author: MananTank

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;
+}

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: {
         />
       </div>
       <div className="flex grow flex-col">{props.children}</div>
+      <SaveLastUsedProject projectId={project.id} teamId={team.id} />
     </div>
   );
 }

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<CustomContractFormProps> = ({
   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();