feat: working wallet with provisioning

Author: coodos

infrastructure/eid-wallet/package.json

@@ -35,7 +35,8 @@
         "flag-icons": "^7.3.2",
         "import": "^0.0.6",
         "svelte-loading-spinners": "^0.3.6",
-        "tailwind-merge": "^3.0.2"
+        "tailwind-merge": "^3.0.2",
+        "uuid": "^11.1.0"
     },
     "devDependencies": {
         "@biomejs/biome": "^1.9.4",

infrastructure/eid-wallet/src/lib/fragments/IdentityCard/IdentityCard.svelte

@@ -110,7 +110,7 @@
             {#if variant === "eName"}
                 <p class="text-gray font-normal">Your eName</p>
                 <div class="flex items-center justify-between w-full">
-                    <p class="text-white w-full font-medium">@{userId}</p>
+                    <p class="text-white w-full font-medium">{userId}</p>
                 </div>
             {:else if variant === "ePassport"}
                 <div class="flex gap-2 flex-col">

infrastructure/eid-wallet/src/lib/global/controllers/evault.ts

@@ -0,0 +1,42 @@
+import type { Store } from "@tauri-apps/plugin-store";
+
+export class VaultController {
+    #store: Store;
+    constructor(store: Store) {
+        this.#store = store;
+    }
+
+    set vault(
+        vault:
+            | Promise<Record<string, string> | undefined>
+            | Record<string, string>
+            | undefined,
+    ) {
+        if (vault instanceof Promise) {
+            vault
+                .then((resolvedUser) => {
+                    this.#store.set("vault", resolvedUser);
+                })
+                .catch((error) => {
+                    console.error("Failed to set vault:", error);
+                });
+        } else {
+            this.#store.set("vault", vault);
+        }
+    }
+
+    get vault() {
+        return this.#store
+            .get<Record<string, string>>("vault")
+            .then((vault) => {
+                if (!vault) {
+                    return undefined;
+                }
+                return vault;
+            })
+            .catch((error) => {
+                console.error("Failed to get vault:", error);
+                return undefined;
+            });
+    }
+}

infrastructure/eid-wallet/src/lib/global/state.ts

@@ -1,6 +1,7 @@
 import { Store } from "@tauri-apps/plugin-store";
 import { SecurityController } from "./controllers/security";
 import { UserController } from "./controllers/user";
+import { VaultController } from "./controllers/evault";
 /**
  * @author SoSweetHam <[email protected]>
  * @description A centralized state that can be used to control the global state of the application, meant to be used as a singleton through the main layout component.
@@ -23,10 +24,13 @@ export class GlobalState {
     #store: Store;
     securityController: SecurityController;
     userController: UserController;
+    vaultController: VaultController;
+
     private constructor(store: Store) {
         this.#store = store;
         this.securityController = new SecurityController(store);
         this.userController = new UserController(store);
+        this.vaultController = new VaultController(store);
     }
 
     /**

infrastructure/eid-wallet/src/routes/(app)/main/+page.svelte

@@ -9,6 +9,8 @@
     import { getContext, onMount, type Snippet } from "svelte";
 
     let userData: Record<string, unknown> = $state();
+    let greeting = $state();
+    let ename = $state();
 
     let shareQRdrawerOpen = $state(false);
 
@@ -21,12 +23,22 @@
 
     onMount(async () => {
         userData = await globalState.userController.user;
+        const vaultData = await globalState.vaultController.vault;
+        ename = vaultData.ename;
+
+        const currentHour = new Date().getHours();
+        greeting =
+            currentHour > 17
+                ? "Good Evening"
+                : currentHour > 12
+                  ? "Good Afternoon"
+                  : "Good Morning";
     });
 </script>
 
 <Hero
-    title="Good morning!"
-    subtitle="Don't forget to drink water."
+    title={greeting ?? "Hi!"}
+    subtitle="Welcome back to your eID Wallet"
     showSettings
 />
 
@@ -40,7 +52,7 @@
 {#snippet eName()}
     <IdentityCard
         variant="eName"
-        userId="caa0f630-2413-5aceaa2c-4628ce93e497"
+        userId={ename ?? "Loading..."}
         viewBtn={() => alert("View button clicked!")}
         shareBtn={() => (shareQRdrawerOpen = true)}
     />

infrastructure/eid-wallet/src/routes/(auth)/e-passport/+page.svelte

@@ -4,14 +4,19 @@
     import IdentityCard from "$lib/fragments/IdentityCard/IdentityCard.svelte";
     import type { GlobalState } from "$lib/global";
     import { ButtonAction } from "$lib/ui";
-    import { getContext } from "svelte";
+    import { getContext, onMount } from "svelte";
 
+    let userData = $state();
     let globalState: GlobalState =
         getContext<() => GlobalState>("globalState")();
 
     const handleFinish = async () => {
         await goto("/main");
     };
+
+    onMount(async () => {
+        userData = await globalState.userController.user;
+    });
 </script>
 
 <main
@@ -23,10 +28,7 @@
             subtitle="Log into any W3DS platform without passwords. It’s tied to this phone; if lost, you’ll need to revoke and reissue it on a new device."
             class="mb-2"
         />
-        <IdentityCard
-            variant="ePassport"
-            userData={globalState.userController.user}
-        />
+        <IdentityCard variant="ePassport" {userData} />
     </section>
     <section class="mt-[4svh] mb-[9svh]">
         <h4>Your eVault</h4>
@@ -35,7 +37,7 @@
             personal data. W3DS platforms access it directly, keeping you in
             control.
         </p>
-        <IdentityCard variant="eVault" usedStorage={15} totalStorage={80} />
+        <IdentityCard variant="eVault" usedStorage={0.1} totalStorage={10} />
     </section>
     <ButtonAction class="w-full" callback={handleFinish}>Finish</ButtonAction>
 </main>

infrastructure/eid-wallet/src/routes/(auth)/review/+page.svelte

@@ -1,21 +1,35 @@
 <script lang="ts">
-import { goto } from "$app/navigation";
-import { Hero, IdentityCard } from "$lib/fragments";
-import { ButtonAction } from "$lib/ui";
+    import { goto } from "$app/navigation";
+    import { Hero, IdentityCard } from "$lib/fragments";
+    import type { GlobalState } from "$lib/global";
+    import { ButtonAction } from "$lib/ui";
+    import axios from "axios";
+    import { getContext, onMount } from "svelte";
 
-const handleNext = async () => {
-    await goto("/e-passport");
-};
+    let globalState = getContext<() => GlobalState>("globalState")();
+    let ename = $state();
+
+    const handleNext = async () => {
+        await goto("/e-passport");
+    };
+
+    onMount(async () => {
+        const vault = await globalState.vaultController.vault;
+        ename = vault.ename;
+    });
 </script>
 
-<main class="h-screen pt-[5.2svh] px-[5vw] pb-[4.5svh] flex flex-col justify-between">
+<main
+    class="h-screen pt-[5.2svh] px-[5vw] pb-[4.5svh] flex flex-col justify-between"
+>
     <section>
         <Hero
             title="Here’s your eName"
             subtitle="This identifier is permanently yours, and it stays with you for your whole life."
             class="mb-4"
         />
-        <IdentityCard variant="eName" userId= "acbsdjk-14n14k43-12412"/>
+        <IdentityCard variant="eName" userId={`${ename ?? "Loading..."}`} />
     </section>
     <ButtonAction class="w-full" callback={handleNext}>Next</ButtonAction>
-</main>
+</main>
+

infrastructure/eid-wallet/src/routes/(auth)/verify/+page.svelte

@@ -7,7 +7,11 @@
     import { capitalize } from "$lib/utils";
     import Drawer from "$lib/ui/Drawer/Drawer.svelte";
     import axios from "axios";
-    import { PUBLIC_PROVISIONER_URL } from "$env/static/public";
+    import { v4 as uuidv4 } from "uuid";
+    import {
+        PUBLIC_PROVISIONER_URL,
+        PUBLIC_REGISTRY_URL,
+    } from "$env/static/public";
     import {
         DocFront,
         verificaitonId,
@@ -17,11 +21,14 @@
     } from "./store";
     import Passport from "./steps/passport.svelte";
     import Selfie from "./steps/selfie.svelte";
+    import { load } from "@tauri-apps/plugin-store";
+    import { Shadow } from "svelte-loading-spinners";
 
     let globalState: GlobalState | undefined = $state(undefined);
     let showVeriffModal = $state(false);
     let person: Record<string, unknown>;
     let document: Record<string, unknown>;
+    let loading = $state(false);
 
     async function handleVerification() {
         const { data } = await axios.post(
@@ -68,6 +75,8 @@
         handleContinue = async () => {
             if ($status !== "approved") return verifStep.set(0);
             if (!globalState) throw new Error("Global state is not defined");
+
+            loading = true;
             globalState.userController.user = {
                 name: capitalize(
                     person.firstName.value + " " + person.lastName.value,
@@ -85,8 +94,28 @@
                 ).toDateString(),
                 "Verified On": new Date().toDateString(),
             };
-            console.log(globalState.userController.user);
-            await goto("/register");
+            const {
+                data: { token: registryEntropy },
+            } = await axios.get(
+                new URL("/entropy", PUBLIC_REGISTRY_URL).toString(),
+            );
+            const { data } = await axios.post(
+                new URL("/provision", PUBLIC_PROVISIONER_URL).toString(),
+                {
+                    registryEntropy,
+                    namespace: uuidv4(),
+                    verificationId: $verificaitonId,
+                },
+            );
+            if (data.success === true) {
+                globalState.vaultController.vault = {
+                    uri: data.uri,
+                    ename: data.w3id,
+                };
+            }
+            setTimeout(() => {
+                goto("/register");
+            }, 10_000);
         };
     });
 </script>
@@ -97,7 +126,8 @@
     <section>
         <Hero
             title="Verify your account"
-            subtitle="Get your passport ready. You’ll be directed to a site where you can verify your account in a swift and secure process"
+            subtitle="Get your passport ready. You’ll be directed to present
+            your passport and take a quick selfie."
         />
         <img class="mx-auto mt-20" src="images/Passport.svg" alt="passport" />
     </section>
@@ -109,6 +139,15 @@
             <Passport></Passport>
         {:else if $verifStep === 1}
             <Selfie></Selfie>
+        {:else if loading}
+            <div class="my-20">
+                <div
+                    class="align-center flex w-full flex-col items-center justify-center gap-6"
+                >
+                    <Shadow size={40} color="rgb(142, 82, 255);" />
+                    <h3>Generating your eName</h3>
+                </div>
+            </div>
         {:else}
             <div class="flex flex-col gap-6">
                 {#if $status === "approved"}

infrastructure/evault-provisioner/src/controllers/VerificationController.ts

@@ -208,18 +208,19 @@ export class VerificationController {
                 ];
                 if (
                     affirmativeStatusTypes.includes(
-                        body.data.verification.status,
+                        body.data.verification.decision,
                     )
                 ) {
                     const approved =
-                        body.data.verification.status === "approved";
+                        body.data.verification.decision === "approved";
                     await this.verificationService.findByIdAndUpdate(id, {
                         approved,
                         data: {
-                            status: body.data.verification.status,
                             person: body.data.verification.person,
+                            document: body.data.verification.document,
                         },
-                        documentId: body.data.verification.document.id
+                        documentId:
+                            body.data.verification.document.number.value,
                     });
                 }
 

infrastructure/evault-provisioner/src/index.ts

@@ -58,6 +58,7 @@ interface ProvisionRequest {
 interface ProvisionResponse {
     success: boolean;
     uri?: string;
+    w3id?: string;
     message?: string;
     error?: string | unknown;
 }
@@ -75,8 +76,8 @@ app.post(
         res: Response<ProvisionResponse>,
     ) => {
         try {
-            if (!process.env.PUBLIC_REGISTRY_URI)
-                throw new Error("PUBLIC_REGISTRY_URI is not set");
+            if (!process.env.PUBLIC_REGISTRY_URL)
+                throw new Error("PUBLIC_REGISTRY_URL is not set");
             const { registryEntropy, namespace, verificationId } = req.body;
             if (!registryEntropy || !namespace || !verificationId) {
                 return res.status(400).json({
@@ -97,7 +98,7 @@ app.post(
             const jwksResponse = await axios.get(
                 new URL(
                     `/.well-known/jwks.json`,
-                    process.env.PUBLIC_REGISTRY_URI,
+                    process.env.PUBLIC_REGISTRY_URL,
                 ).toString(),
             );
 
@@ -119,7 +120,7 @@ app.post(
             await axios.post(
                 new URL(
                     "/register",
-                    process.env.PUBLIC_REGISTRY_URI,
+                    process.env.PUBLIC_REGISTRY_URL,
                 ).toString(),
                 {
                     ename: w3id,
@@ -135,6 +136,7 @@ app.post(
 
             res.json({
                 success: true,
+                w3id,
                 uri,
             });
         } catch (error) {