feat: update user model and wallet schema to include DRep key

- Updated `package.json` to use the latest version of `@meshsdk/react`.
- Modified `User` model in Prisma schema to add `drepKeyHash` field.
- Updated `Wallet` model in Prisma schema to include `signersDRepKeys` array.
- Enhanced `RootLayout` component to handle DRep key retrieval and user updates.
- Added logic in `EditSigners` component to manage DRep keys for signers.
- Implemented `updateUser` mutation in user router to allow updating of DRep key.
- Updated wallet router to handle DRep keys in signers' data.
- Created migration script to add new columns for DRep keys in the database.

Author: QSchlegel

package-lock.json

@@ -23,7 +23,7 @@
     "@meshsdk/core": "^1.9.0-beta.18",
     "@meshsdk/core-csl": "^1.9.0-beta.18",
     "@meshsdk/core-cst": "^1.9.0-beta.19",
-    "@meshsdk/react": "^1.9.0-beta.18",
+    "@meshsdk/react": "^1.9.0-beta.69",
     "@octokit/core": "^6.1.2",
     "@prisma/client": "^6.4.1",
     "@radix-ui/react-accordion": "^1.2.0",

package.json

@@ -0,0 +1,5 @@
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "drepKeyHash" TEXT NOT NULL DEFAULT '';
+
+-- AlterTable
+ALTER TABLE "Wallet" ADD COLUMN     "signersDRepKeys" TEXT[];

prisma/migrations/20250804021426_add_drep_key/migration.sql

@@ -14,6 +14,7 @@ model User {
   id           String @id @default(cuid())
   address      String @unique
   stakeAddress String @unique
+  drepKeyHash  String @default("")
   nostrKey     String @unique
   discordId    String @default("")
 }
@@ -24,6 +25,7 @@ model Wallet {
   description         String?
   signersAddresses    String[]
   signersStakeKeys    String[]
+  signersDRepKeys     String[]
   signersDescriptions String[]
   numRequiredSigners  Int?
   verified            String[]

prisma/schema.prisma

@@ -9,7 +9,7 @@ import useUser from "@/hooks/useUser";
 import { useUserStore } from "@/lib/zustand/user";
 import useAppWallet from "@/hooks/useAppWallet";
 
-import SessionProvider from "@/components/SessionProvider"
+import SessionProvider from "@/components/SessionProvider";
 import { getServerSession } from "next-auth";
 
 import MenuWallets from "@/components/common/overall-layout/menus/wallets";
@@ -52,6 +52,9 @@ export default function RootLayout({
   const { mutate: createUser } = api.user.createUser.useMutation({
     onError: (e) => console.error(e),
   });
+  const { mutate: updateUser } = api.user.updateUser.useMutation({
+    onError: (e) => console.error(e),
+  });
 
   // Single effect for address + user creation
   useEffect(() => {
@@ -63,30 +66,51 @@ export default function RootLayout({
       if (!address) address = (await wallet.getUnusedAddresses())[0];
       if (address) setUserAddress(address);
 
-      // 2) If user doesn't exist, create it
+      // 2) Get stake address
+      const stakeAddress = (await wallet.getRewardAddresses())[0];
+      if (!stakeAddress || !address) {
+        console.error("No stake address or payment address found");
+        return;
+      }
+
+      // 3) Get DRep key hash
+      const dRepKey = await wallet.getDRep();
+      if (!dRepKey) {
+        console.error("No DRep key found");
+        return;
+      }
+      const drepKeyHash = dRepKey.publicKeyHash;
+      if (!drepKeyHash) {
+        console.error("No DRep key hash found:", drepKeyHash);
+        return;
+      }
+
+      // 4) If user doesn't exist create it
       if (!isLoading && user === null) {
-        const stakeAddress = (await wallet.getRewardAddresses())[0];
-        if (!stakeAddress || !address) {
-          console.error("No stake address or payment address found");
-          return;
-        }
         const nostrKey = generateNsec();
         createUser({
           address,
           stakeAddress,
+          drepKeyHash,
           nostrKey: JSON.stringify(nostrKey),
         });
       }
+
+      // 5) If user exists but missing fields, update it
+      if (
+        !isLoading &&
+        user &&
+        user !== null &&
+        (user.stakeAddress !== stakeAddress || user.drepKeyHash !== drepKeyHash)
+      ) {
+        updateUser({
+          address,
+          stakeAddress,
+          drepKeyHash,
+        });
+      }
     })();
-  }, [
-    connected,
-    wallet,
-    user,
-    isLoading,
-    createUser,
-    generateNsec,
-    setUserAddress,
-  ]);
+  }, [connected, wallet, user, isLoading, generateNsec, setUserAddress]);
 
   const isWalletPath = router.pathname.includes("/wallets/[wallet]");
   const walletPageRoute = router.pathname.split("/wallets/[wallet]/")[1];
@@ -99,12 +123,18 @@ export default function RootLayout({
       {isLoading && <Loading />}
 
       {/* Sidebar for larger screens */}
-      <aside className="hidden border-r border-gray-200/30 dark:border-white/[0.03] bg-muted/40 md:block">
+      <aside className="hidden border-r border-gray-200/30 bg-muted/40 dark:border-white/[0.03] md:block">
         <div className="flex h-full max-h-screen flex-col">
-          <header className="flex h-14 items-center border-b border-gray-200/30 dark:border-white/[0.03] px-4 lg:h-16 lg:px-6" id="logo-header" data-header="sidebar">
+          <header
+            className="flex h-14 items-center border-b border-gray-200/30 px-4 dark:border-white/[0.03] lg:h-16 lg:px-6"
+            id="logo-header"
+            data-header="sidebar"
+          >
             <Link href="/" className="flex items-center gap-3">
               <Logo />
-              <span className="font-medium text-sm md:text-base lg:text-lg tracking-[-0.01em] select-none">Multi-Sig Platform</span>
+              <span className="select-none text-sm font-medium tracking-[-0.01em] md:text-base lg:text-lg">
+                Multi-Sig Platform
+              </span>
             </Link>
           </header>
           <nav className="flex-1 pt-2">
@@ -117,27 +147,35 @@ export default function RootLayout({
 
       {/* Main content area */}
       <div className="flex h-screen flex-col">
-        <header className="pointer-events-auto relative z-10 border-b border-gray-200/30 dark:border-white/[0.03] bg-muted/40 px-4 lg:px-6" data-header="main">
+        <header
+          className="pointer-events-auto relative z-10 border-b border-gray-200/30 bg-muted/40 px-4 dark:border-white/[0.03] lg:px-6"
+          data-header="main"
+        >
           <div className="flex h-14 items-center gap-4 lg:h-16">
             {/* Mobile menu button */}
             <MobileNavigation isWalletPath={isWalletPath} />
-            
+
             {/* Logo in mobile header - centered */}
-            <div className="flex-1 flex justify-center md:hidden">
-              <Link href="/" className="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100/50 dark:hover:bg-gray-800/50 transition-colors">
+            <div className="flex flex-1 justify-center md:hidden">
+              <Link
+                href="/"
+                className="flex items-center gap-2 rounded-md px-2 py-1 transition-colors hover:bg-gray-100/50 dark:hover:bg-gray-800/50"
+              >
                 <svg
-                  className="h-7 w-7 text-foreground flex-shrink-0"
+                  className="h-7 w-7 flex-shrink-0 text-foreground"
                   enableBackground="new 0 0 300 200"
                   viewBox="0 0 300 200"
                   xmlns="http://www.w3.org/2000/svg"
                   fill="currentColor"
                 >
                   <path d="m289 127-45-60-45-60c-.9-1.3-2.4-2-4-2s-3.1.7-4 2l-37 49.3c-2 2.7-6 2.7-8 0l-37-49.3c-.9-1.3-2.4-2-4-2s-3.1.7-4 2l-45 60-45 60c-1.3 1.8-1.3 4.2 0 6l45 60c.9 1.3 2.4 2 4 2s3.1-.7 4-2l37-49.3c2-2.7 6-2.7 8 0l37 49.3c.9 1.3 2.4 2 4 2s3.1-.7 4-2l37-49.3c2-2.7 6-2.7 8 0l37 49.3c.9 1.3 2.4 2 4 2s3.1-.7 4-2l45-60c1.3-1.8 1.3-4.2 0-6zm-90-103.3 32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0l-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0zm-90 0 32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0l-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0zm-53 152.6-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0zm90 0-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0zm90 0-32.5-43.3c-1.3-1.8-1.3-4.2 0-6l32.5-43.3c2-2.7 6-2.7 8 0l32.5 43.3c1.3 1.8 1.3 4.2 0 6l-32.5 43.3c-2 2.7-6 2.7-8 0z" />
                 </svg>
-                <span className="text-base font-medium text-foreground whitespace-nowrap">Multi-Sig Platform</span>
+                <span className="whitespace-nowrap text-base font-medium text-foreground">
+                  Multi-Sig Platform
+                </span>
               </Link>
             </div>
-            
+
             {/* Wallet selection + breadcrumb row on desktop */}
             {isLoggedIn && (
               <div className="hidden md:block">
@@ -184,7 +222,7 @@ export default function RootLayout({
               ) : (
                 <>
                   {/* Desktop buttons */}
-                  <div className="hidden md:flex items-center space-x-2">
+                  <div className="hidden items-center space-x-2 md:flex">
                     <WalletDataLoaderWrapper mode="button" />
                     <DialogReportWrapper mode="button" />
                     <UserDropDownWrapper mode="button" />
@@ -194,7 +232,7 @@ export default function RootLayout({
                     <WalletDataLoaderWrapper mode="menu-item" />
                     <DialogReportWrapper mode="menu-item" />
                     <UserDropDownWrapper mode="menu-item" />
-                    <div className="h-px bg-border -mx-2 my-1" />
+                    <div className="-mx-2 my-1 h-px bg-border" />
                     <LogoutWrapper mode="menu-item" />
                   </MobileActionsMenu>
                 </>

src/components/common/overall-layout/layout.tsx

@@ -57,6 +57,7 @@ export default function EditSigners({
       walletId: appWallet.id,
       signersDescriptions: signersDescriptions,
       signersStakeKeys: updatedStakeKeys,
+      signersDRepKeys: updatedDRepKeys,
     });
   }
 
@@ -77,6 +78,23 @@ export default function EditSigners({
     return skList;
   }, [signersAddresses, signersStakeKeys, userAddress, user?.stakeAddress]);
 
+  const updatedDRepKeys = useMemo(() => {
+    const dkList: string[] = Array(signersAddresses.length).fill("");
+    for (let i = 0; i < signersAddresses.length; i++) {
+      const drepKey = user?.drepKeyHash;
+      if (
+        signersAddresses[i] === userAddress &&
+        drepKey !== undefined &&
+        !appWallet.signersDRepKeys?.[i]
+      ) {
+        dkList[i] = drepKey;
+      } else {
+        dkList[i] = appWallet.signersDRepKeys?.[i] ?? "";
+      }
+    }
+    return dkList;
+  }, [signersAddresses, appWallet.signersDRepKeys, userAddress, user?.drepKeyHash]);
+
   const newStakekey = (index: number) => {
     const stakeAddr = user?.stakeAddress;
     return (
@@ -86,6 +104,15 @@ export default function EditSigners({
     );
   };
 
+  const newDRepKey = (index: number) => {
+    const drepKey = user?.drepKeyHash;
+    return (
+      signersAddresses[index] === userAddress &&
+      drepKey !== undefined &&
+      appWallet.signersDRepKeys?.[index] !== drepKey
+    );
+  };
+
   return (
     <>
       <Table>
@@ -137,6 +164,30 @@ export default function EditSigners({
                       Click Update to add your stake key to the multisig wallet.
                     </Label>
                   )}
+                  <div className="grid grid-cols-4 items-start gap-4">
+                    <Label className="text-right mt-2">DRep Key</Label>
+                    <textarea
+                      placeholder="drep1..."
+                      className={`col-span-3 flex min-h-[36px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-none ${newDRepKey(index) && "text-green-500"}`}
+                      value={
+                        signersAddresses[index] === userAddress
+                          ? user?.drepKeyHash ?? ""
+                          : appWallet.signersDRepKeys?.[index] ?? ""
+                      }
+                      disabled
+                      rows={1}
+                      onInput={(e) => {
+                        const target = e.target as HTMLTextAreaElement;
+                        target.style.height = 'auto';
+                        target.style.height = target.scrollHeight + 'px';
+                      }}
+                    />
+                  </div>
+                  {newDRepKey(index) && (
+                    <Label className="text-right">
+                      Click Update to add your DRep key to the multisig wallet.
+                    </Label>
+                  )}
                   <div className="grid grid-cols-4 items-center gap-4">
                     <Label className="text-right">Description</Label>
                     <Input

src/components/pages/wallet/info/signers/card-edit-signers.tsx

@@ -18,6 +18,7 @@ export const userRouter = createTRPCRouter({
       z.object({
         address: z.string(),
         stakeAddress: z.string(),
+        drepKeyHash: z.string(),
         nostrKey: z.string(),
       }),
     )
@@ -26,11 +27,56 @@ export const userRouter = createTRPCRouter({
         data: {
           address: input.address,
           stakeAddress: input.stakeAddress,
+          drepKeyHash: input.drepKeyHash,
           nostrKey: input.nostrKey,
         },
       });
     }),
 
+  updateUser: publicProcedure
+    .input(
+      z.object({
+        address: z.string().optional(),
+        stakeAddress: z.string().optional(),
+        drepKeyHash: z.string().optional(),
+      }),
+    )
+    .mutation(async ({ ctx, input }) => {
+      const { address, stakeAddress, drepKeyHash } = input;
+
+      if (!address && !stakeAddress && !drepKeyHash) {
+        throw new Error("At least one of address, stakeAddress, or drepKeyHash must be provided.");
+      }
+
+      const user = await ctx.db.user.findFirst({
+        where: {
+          OR: [
+            address ? { address } : undefined,
+            stakeAddress ? { stakeAddress } : undefined,
+            drepKeyHash ? { drepKeyHash } : undefined,
+          ].filter(Boolean) as any,
+        },
+      });
+
+      if (!user) {
+        throw new Error("User not found.");
+      }
+
+      const data: Record<string, string> = {};
+      if (address && address !== user.address) data.address = address;
+      if (stakeAddress && stakeAddress !== user.stakeAddress) data.stakeAddress = stakeAddress;
+      if (drepKeyHash && drepKeyHash !== user.drepKeyHash) data.drepKeyHash = drepKeyHash;
+
+      if (Object.keys(data).length === 0) {
+        throw new Error("No updatable fields provided.");
+      }
+
+      return ctx.db.user.update({
+        where: { id: user.id },
+        data,
+      });
+    }),
+
   getNostrKeysByAddresses: publicProcedure
     .input(z.object({ addresses: z.array(z.string()) }))
     .query(async ({ ctx, input }) => {

src/server/api/routers/users.ts

@@ -103,6 +103,7 @@ export const walletRouter = createTRPCRouter({
       z.object({
         walletId: z.string(),
         signersStakeKeys: z.array(z.string()),
+        signersDRepKeys: z.array(z.string()),
         signersDescriptions: z.array(z.string()),
       }),
     )
@@ -114,6 +115,7 @@ export const walletRouter = createTRPCRouter({
         data: {
           signersDescriptions: input.signersDescriptions,
           signersStakeKeys: input.signersStakeKeys,
+          signersDRepKeys: input.signersDRepKeys,
         },
       });
     }),