PR#11 Bank onboarding workflow with Test credentials

.env.example

@@ -1,4 +1,14 @@
-DOCK_API_URL=https://api-testnet.dock.io
-DOCK_API_TOKEN=  # you can generate a key at https://certs.dock.io/keys
+NEXT_PUBLIC_DOCK_API_URL="https://api-testnet.dock.io"
+DOCK_API_TOKEN = # You API KEY
 DOCK_API_DID= # the DID to use for the issuer. You can generate one here: https://certs.dock.io/dids
-NEXT_PUBLIC_SERVER_URL= # the URL where this app is listening (e.g. http://192.168.0.100:3000 or http://localhost:3000)
+NEXT_PUBLIC_SERVER_URL= http://localhost:3000
+
+# Proof-Request Template Ids
+QUOTIENT_PROOF_TEMPLATE_ID=""
+EQUINET_PROOF_TEMPLATE_ID=""
+URBANSCAPE_PROOF_TEMPLATE_ID=""
+
+# Organization Profiles
+NEXT_PUBLIC_QUOTIENT_ISSUER_ID=""
+NEXT_PUBLIC_FORSUR_ISSUER_ID=""
+NEXT_PUBLIC_EQUINET_ISSUER_ID=""

.eslintrc.json

@@ -7,9 +7,21 @@
     "browser": true,
     "es6": true
   },
-  "extends": ["next", "eslint:recommended", "plugin:react/recommended", "airbnb-base"],
+  "extends": [
+    "next",
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "airbnb-base"
+  ],
   "rules": {
-    "no-use-before-define": ["error", { "functions": false, "classes": true, "variables": true }],
+    "no-use-before-define": [
+      "error",
+      {
+        "functions": false,
+        "classes": true,
+        "variables": false
+      }
+    ],
     "class-methods-use-this": "off",
     "no-console": "off",
     "no-nested-ternary": "off",
@@ -27,16 +39,48 @@
     "indent": "off",
     "implicit-arrow-linebreak": "off",
     "function-paren-newline": "off",
-    "no-confusing-arrow": "off"
+    "no-confusing-arrow": "off",
+    "no-unused-vars": "off",
+    "no-trailing-spaces": "off",
+    "import/prefer-default-export": "off",
+    "no-shadow": "off",
+    "react/react-in-jsx-scope": "off", // Disable react/react-in-jsx-scope rule
+    "linebreak-style": ["off"]
   },
   "settings": {
     "import/resolver": {
+      "node": {
+        "extensions": [
+          ".js",
+          ".jsx",
+          "ts",
+          "tsx"
+        ],
+        "moduleDirectory": [
+          ".",
+          "node_modules"
+        ]
+      },
       "alias": {
         "map": [
-          ["components", "./components"],
-          ["utils", "./utils"]
+          [
+            "components",
+            "./components"
+          ],
+          [
+            "utils",
+            "./utils"
+          ],
+          [
+            "store",
+            "./store"
+          ],
+          [
+            "lib",
+            "./lib"
+          ]
         ]
       }
     }
   }
-}
+}

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

_credentials/equinet.js

@@ -0,0 +1,37 @@
+import { v4 as uuidv4 } from "uuid";
+import { getRandomNumber } from "utils";
+import { dockUrl } from "utils/constants";
+
+export function createCreditScoreCredential({ receiverDid }) {
+
+  console.log("Creating EquiNet - Credit Score Credential for:", receiverDid);
+
+  return {
+    url: `${dockUrl}/credentials`,
+    body: {
+      anchor: false,
+      persist: true,
+      password: "1234",
+      distribute: true,
+      credential: {
+        id: `https://creds-testnet.dock.io/${uuidv4()}`,
+        name: "EquiNet - Credit Score",
+        description: "This schema represents a Verified Credit Score Credential, issued by EquiNet. It standardizes the presentation of credit scores for reliable and efficient verification processes.",
+        type: [
+          "VerifiableCredential",
+          "EquiNetCreditScore"
+        ],
+        issuer: {
+          name: "EquiNET",
+          description: "EquiNet is the credit bureau.",
+          logo: "https://img.dock.io/9f327cafda3be5f0cff0da2df44c55da",
+          id: process.env.NEXT_PUBLIC_EQUINET_ISSUER_ID
+        },
+        credentialSubject: {
+          id: receiverDid,
+          credit_score: getRandomNumber(700, 800),
+        }
+      }
+    }
+  };
+}

_credentials/forsur.js

@@ -0,0 +1,45 @@
+import { v4 as uuidv4 } from "uuid";
+import { dockUrl } from "utils/constants";
+
+export function createBiometricsCredential({
+  receiverDid,
+  enrollmentId,
+  biometricData,
+}
+) {
+
+  console.log("Creating ForSur - Biometric Enrollment Credential for:", receiverDid);
+
+  return {
+    url: `${dockUrl}/credentials`,
+    body: {
+      anchor: true,
+      persist: true,
+      password: "1234",
+      distribute: true,
+      credential: {
+        id: `https://creds-testnet.dock.io/${uuidv4()}`,
+        name: "ForSur - Biometric",
+        description: "The \"ForSur - Biometric\" schema is specifically developed for the secure registration and storage of biometric data.",
+        type: [
+          "VerifiableCredential",
+          "ForSurBiometric"
+        ],
+        issuer: {
+          name: "Forsur",
+          description: "Forsur is the biometric provider.",
+          logo: "https://img.dock.io/80f154126a78bba321b413c3ffb8d4a7",
+          id: process.env.NEXT_PUBLIC_FORSUR_ISSUER_ID
+        },
+        CredentialSubject: {
+          id: receiverDid,
+          biometric: {
+            id: enrollmentId,
+            created: new Date().toISOString(),
+            data: biometricData,
+          }
+        }
+      }
+    }
+  };
+}

_credentials/quotient.js

@@ -0,0 +1,50 @@
+import { v4 as uuidv4 } from "uuid";
+import { dockUrl } from "utils/constants";
+
+export function createBankIdCredential({
+  receiverDid,
+  receiverName,
+  receiverAddress,
+  enrollmentId,
+  biometricData
+}) {
+
+  console.log("Creating Quotient Bank Identity Credential for:", receiverDid);
+
+  return {
+    url: `${dockUrl}/credentials`,
+    body: {
+      anchor: true,
+      persist: true,
+      password: "1234",
+      distribute: true,
+      algorithm: "dockbbs+",
+      credential: {
+        id: `https://creds-testnet.dock.io/${uuidv4()}`,
+        name: "Quotient - Bank Identity",
+        description: "The \"Quotient - Bank Identity\" schema provides a secure and standardized format for representing key aspects of an individual's bank identity.",
+        type: [
+          "VerifiableCredential",
+          "QuotientBankIdentity"
+        ],
+        issuer: {
+          name: "Quotient Credit Union",
+          description: "Quotient is our credit union",
+          logo: "https://img.dock.io/06d78272268c606a172d5fd1cd559b46",
+          id: process.env.NEXT_PUBLIC_QUOTIENT_ISSUER_ID
+        },
+        credentialSubject: {
+          id: receiverDid,
+          name: receiverName,
+          address: receiverAddress,
+          account_number: `ABC${uuidv4()}`,
+          biometric: {
+            id: enrollmentId,
+            created: new Date().toISOString(),
+            data: biometricData,
+          }
+        }
+      }
+    }
+  };
+}

components.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": false,
+  "tsx": false,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "styles/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "/components",
+    "utils": "/lib/utils"
+  }
+}

components/bank-auth.jsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Separator } from 'components/ui/separator';
+import { QRCodeGenerator } from 'components/qr-generator';
+import useQrCode from 'utils/useQrCode';
+import BankCredentials from './org/quotient/bank-credentials';
+/**
+ * @description Bank QR code authenticator.
+ * @todo setUserInfo param
+ * @param {*} setUserInfo setter once qr code triggered from mobile app and returns user info
+ * @param {*} isAuth shows BankCredentials
+ * @memberof QuotientBankForm, UrbanScapePage
+ * @returns React.FC 
+ */
+const BankQrAuthentication = ({ isAuth = false, proofTemplateId }) => {
+    const { qrCodeUrl } = useQrCode({ proofTemplateId });
+
+    return (
+        <div className='grid gap-2 p-4 bg-neutral-50 rounded-lg space-y-5 h-fit'>
+            <h2>Authenticate with your mobile banking app and providing the needed credentials including a validated credit score over 600.</h2>
+            <Separator />
+            <p className='text-start'>Scan the QR code below with your mobile banking app.</p>
+
+            {qrCodeUrl !== '' ? (<QRCodeGenerator url={qrCodeUrl} />) : null}
+            <Separator />
+            <div>
+                <h3>Required credentials:</h3>
+                <BankCredentials isAuth={isAuth} />
+            </div>
+        </div>
+    );
+};
+
+export default BankQrAuthentication;