Init zustand

encryption/models/secret-key.ts

@@ -4,9 +4,12 @@ import { decryptIV, encryptIV, pbkdf2, randomBytes } from "../crypto.ts";
 export const SECRET_KEY_IV_LENGTH = 16;
 export const SECRET_KEY_PASSPORT_LENGTH = 32;
 export const SECRET_KEY_PASSPORT_ITERATIONS = 100000;
-export const SECRET_KEY_BLOB_LENGTH = 80;
+export const SECRET_KEY_BLOB_LENGTH = 32;
+export const SECRET_KEY_BLOB_ENCRYPTED_LENGTH = 80;
 export const SECRET_KEY_LENGTH =
-  SECRET_KEY_IV_LENGTH + SECRET_KEY_PASSPORT_LENGTH + SECRET_KEY_BLOB_LENGTH;
+  SECRET_KEY_IV_LENGTH +
+  SECRET_KEY_PASSPORT_LENGTH +
+  SECRET_KEY_BLOB_ENCRYPTED_LENGTH;
 
 export default class SecretKey {
   iv: string;

encryption/models/secret-lock.ts

@@ -5,27 +5,27 @@ export const SECRET_LOCK_DERIVED_LENGTH = 32;
 export const SECRET_LOCK_NC_ITERATIONS = 100000;
 
 export default class SecretLock {
-  nc: string;
-  password: string;
+  pk: string;
+  pw: string;
 
-  constructor(nc: string, password: string) {
-    this.nc = nc;
-    this.password = password;
+  constructor(nc: string, pw: string) {
+    this.pk = nc;
+    this.pw = pw;
   }
 
   toString(): string {
-    return "[nc=" + this.nc + ", password=" + this.password + "]";
+    return "[nc=" + this.pk + ", pw=" + this.pw + "]";
   }
 
-  static async withPassword(password: string): Promise<SecretLock> {
+  static async withPassword(pw: string): Promise<SecretLock> {
     const nc = await randomBytes(SECRET_LOCK_NC_LENGTH);
-    return new SecretLock(nc, password);
+    return new SecretLock(nc, pw);
   }
 
   async derive(): Promise<string> {
     return await pbkdf2(
-      this.password,
-      this.nc,
+      this.pw,
+      this.pk,
       SECRET_LOCK_NC_ITERATIONS,
       SECRET_LOCK_DERIVED_LENGTH,
     );

web/app/pages.gen.ts

@@ -13,6 +13,7 @@ import { createFileRoute } from "@tanstack/react-router";
 // Import Routes
 
 import { Route as rootRoute } from "./../pages/__root";
+import { Route as HelloImport } from "./../pages/hello";
 import { Route as AuthImport } from "./../pages/auth";
 import { Route as AboutImport } from "./../pages/about";
 import { Route as IndexImport } from "./../pages/index";
@@ -28,6 +29,11 @@ const FaqLazyRoute = FaqLazyImport.update({
   getParentRoute: () => rootRoute,
 } as any).lazy(() => import("./../pages/faq.lazy").then((d) => d.Route));
 
+const HelloRoute = HelloImport.update({
+  path: "/hello",
+  getParentRoute: () => rootRoute,
+} as any);
+
 const AuthRoute = AuthImport.update({
   path: "/auth",
   getParentRoute: () => rootRoute,
@@ -59,6 +65,10 @@ declare module "@tanstack/react-router" {
       preLoaderRoute: typeof AuthImport;
       parentRoute: typeof rootRoute;
     };
+    "/hello": {
+      preLoaderRoute: typeof HelloImport;
+      parentRoute: typeof rootRoute;
+    };
     "/faq": {
       preLoaderRoute: typeof FaqLazyImport;
       parentRoute: typeof rootRoute;
@@ -72,6 +82,7 @@ export const routeTree = rootRoute.addChildren([
   IndexRoute,
   AboutRoute,
   AuthRoute,
+  HelloRoute,
   FaqLazyRoute,
 ]);
 

web/app/zustand.ts

@@ -0,0 +1,43 @@
+import SecretKey from "encryption/models/secret-key";
+import { create } from "zustand";
+import { createJSONStorage, persist } from "zustand/middleware";
+import type Note from "encryption/models/note";
+
+type UserStore = {
+  username: string | undefined;
+  pk: string | undefined;
+
+  authenticate: (username: string, nc: string) => void;
+};
+
+type SessionStore = {
+  secretKey: SecretKey | undefined;
+  notes: Note[];
+
+  initialize: (secretKey: string) => void;
+};
+
+export const useUserStore = create(
+  persist<UserStore>(
+    (set) => ({
+      username: undefined,
+      pk: undefined,
+
+      authenticate: (username: string, pk: string) => set({ username, pk }),
+    }),
+    {
+      name: "user",
+      storage: createJSONStorage(() => sessionStorage),
+    },
+  ),
+);
+
+export const useSessionStore = create<SessionStore>((set) => ({
+  secretKey: undefined,
+  notes: [],
+
+  initialize: (secretKey: string) =>
+    set({ secretKey: SecretKey.fromString(secretKey) }),
+}));
+
+// 6#AjzB$c

web/components/ui/sonner.tsx

@@ -0,0 +1,31 @@
+"use client"
+
+import { useTheme } from "next-themes"
+import { Toaster as Sonner } from "sonner"
+
+type ToasterProps = React.ComponentProps<typeof Sonner>
+
+const Toaster = ({ ...props }: ToasterProps) => {
+  const { theme = "system" } = useTheme()
+
+  return (
+    <Sonner
+      theme={theme as ToasterProps["theme"]}
+      className="toaster group"
+      toastOptions={{
+        classNames: {
+          toast:
+            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+          description: "group-[.toast]:text-muted-foreground",
+          actionButton:
+            "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+          cancelButton:
+            "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
+        },
+      }}
+      {...props}
+    />
+  )
+}
+
+export { Toaster }