From f265972f065156d4e686b550203e56da601371ec Mon Sep 17 00:00:00 2001
From: Pratap2018 <pratapmridha@gmail.com>
Date: Tue, 23 Jun 2026 16:05:30 +0530
Subject: [PATCH 01/12] feat: Configure Age verification

---
 src/views/playground/WidgetConfig/Index.vue | 179 +++++---------------
 1 file changed, 41 insertions(+), 138 deletions(-)

diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index 48ee527..1719504 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -117,14 +117,13 @@ ul {
   list-style-type: none;
 }
 
-.zkbadge {
+/* .zkbadge {
   background-color: lightblue;
   margin-left: 3px;
   margin-top: 3px;
   color: black;
   min-height: 20px;
   align-content: center;
-  /* display: flex; */
   padding: 5px;
   font-size: x-small;
   font-weight: bold;
@@ -134,7 +133,7 @@ ul {
 
 .zkbadge:hover {
   background-color: lightcoral;
-}
+} */
 </style>
 <template>
   <b-container fluid class="py-3" :class="isContainerShift ? 'homeShift' : 'home'">
@@ -217,7 +216,7 @@ ul {
 
               </div>
             </div>
-            <div class="col">
+            <!-- <div class="col">
               <div class="row">
                 <div class="col">
                   <div class="row">
@@ -231,7 +230,7 @@ ul {
 
                 </div>
               </div>
-            </div>
+            </div> -->
           </div>
         </li>
         <li class="list-group-item">
@@ -259,12 +258,12 @@ ul {
               <div class="row">
                 <div class="col-md-12">
                   <b-form-checkbox switch size="lg" v-model="widgetConfigTemp.zkProof.enabled">{{
-                    this.widgetConfigUI.zkProof.label }}<HFBeta></HFBeta>
+                    this.widgetConfigUI.zkProof.ageProof.label }}<HFBeta></HFBeta>
                   </b-form-checkbox>
-                  <small v-html="this.widgetConfigUI.zkProof.description"></small>
+                  <small v-html="this.widgetConfigUI.zkProof.ageProof.description"></small>
                 </div>
               </div>
-              <div class="mt-2 mx-0 p-1"
+              <!-- <div class="mt-2 mx-0 p-1"
                 style="border: 2px solid #8080802e; border-radius: 10px; min-height: 80px; padding:10px"
                 v-if="widgetConfigTemp.zkProof.proofs.length > 0">
                 <div class="">
@@ -280,33 +279,15 @@ ul {
 
                     <b-icon class="trash" style="color:red" icon="trash" aria-hidden="true"></b-icon></span>
                 </div>
-              </div>
+              </div> -->
             </div>
 
             <div class="col" v-if="widgetConfigTemp.zkProof.enabled">
               <div class="row">
                 <div class="col">
-                  <label for=""><strong>Select Proof Type: </strong></label>
-
-
-                  <b-input-group>
-                    <!-- Dropdown -->
-                    <b-form-select v-model="slectProof" :options="proofTypeOptions" class="form-select"></b-form-select>
-
-                    <b-input-group-append v-if="selectedProofData.criteria">
-                      <b-form-input v-model="selectedProofData.criteriaValue" placeholder="Enter age"
-                        :type="selectedProofData.criteriaType"></b-form-input>
-                    </b-input-group-append>
-
-                    <!-- Add Button -->
-                    <b-input-group-append v-if="selectedProofData.value != null">
-                      <HfButtons name="" customClass="btn btn-outline-secondary" iconClass="fa fa-plus"
-                        @executeAction="addZkProof(selectedProofData.value, selectedProofData.criteriaValue)">
-                      </HfButtons>
-                    </b-input-group-append>
-                  </b-input-group>
-                  <small>{{ selectedProofData.description }}</small>
-
+                  <label for="age-proof-criteria"><strong>Minimum Age: </strong></label>
+                  <b-form-input id="age-proof-criteria" v-model="ageProofCriteria" placeholder="Enter age"
+                    type="number" min="1"></b-form-input>
                 </div>
               </div>
             </div>
@@ -362,13 +343,6 @@ import { isAccessDeniedError } from '../../../utils/accessDenied';
 // import TrustedIssuer from './components/TrustedIssuer.vue';
 import MarketplaceList from '../../../components/MarketplaceList.vue';
 import HFBeta from '../../../components/element/HFBeta.vue';
-// const SupportedZkProofTypes = Object.freeze({
-//   PROOF_OF_KYC: 'zkProofOfKYC',
-//   PROOF_OF_PERSONHOOD: 'zkProofOfPersonHood',
-//   PROOF_OF_AGE: 'zkProofOfAge',
-//   PROOF_OF_MEMBERSHIP: 'zkProofOfMembership',
-//   PROOF_OF_DOB: 'zkProofOfDOB',
-// })
 
 export default {
   name: "WidgetConfig",
@@ -403,14 +377,6 @@ export default {
       return this.containerShift
     },
 
-    selectedProofData() {
-
-      if (!this.slectProof) {
-        return {}
-      }
-      return this.proofTypeOptions.find(x => x.value == this.slectProof)
-    },
-
     onchainconfigsOptions() {
       const options = [];
       options.push({
@@ -495,6 +461,10 @@ export default {
     if (!this.widgetConfigTemp.zkProof.proofs) {
       this.widgetConfigTemp.zkProof.proofs = []
     }
+    const ageProof = this.widgetConfigTemp.zkProof.proofs.find(
+      proof => proof.proofType === this.SupportedZkProofTypes.PROOF_OF_AGE
+    )
+    this.ageProofCriteria = ageProof?.criteria || ''
     // this.widgetConfigTemp.zkProof = {
     //   enabled: false,
     //   proofType: null,
@@ -503,11 +473,7 @@ export default {
   data() {
     return {
       SupportedZkProofTypes: Object.freeze({
-        PROOF_OF_KYC: 'zkProofOfKYC',
-        PROOF_OF_PERSONHOOD: 'zkProofOfPersonHood',
         PROOF_OF_AGE: 'zkProofOfAge',
-        PROOF_OF_MEMBERSHIP: 'zkProofOfMembership',
-        PROOF_OF_DOB: 'zkProofOfDOB',
       }),
       widgetConfigUI: {
         faceRecog: {
@@ -532,8 +498,10 @@ export default {
           description: "Enable users to mint SBT of their credentials in a privacy preserving manner and verify on configured blockchain"
         },
         zkProof: {
-          label: "Enable Zero Knowledge Proof",
-          description: 'Enable users to share only proof of their data for enhanced data privacy and compliance. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-document-verification" target="_blank">here</a></b>.'
+          ageProof:{
+            label: "Configure Age Verification",
+            description: 'Enable users to share only proof of their data for enhanced data privacy and compliance. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-document-verification" target="_blank">here</a></b>.'
+          }
         },
         emailNotification: {
            label: "Enable Email Notifications",
@@ -573,6 +541,7 @@ export default {
         issuerVerificationMethodId: "",
       },
       selectedIssuerDids: new Set(),
+      ageProofCriteria: '',
       documentTypeOptions: [
         {
           value: null,
@@ -588,51 +557,6 @@ export default {
         },
       ],
 
-      slectProof: null,
-      proofTypeOptions: [
-        {
-          value: null,
-          text: "Choose zk proof type"
-        },
-        {
-          value: 'zkProofOfKYC',
-          text: "Proof Of KYC",
-          description: "Proves that user has finished his/her KYC",
-          enabled: true,
-          criteria: false,
-        },
-        {
-          value: 'zkProofOfPersonHood',
-          text: "Proof Of Personhood",
-          description: "Proves that user is not a bot",
-          enabled: true,
-          criteria: false,
-        },
-        {
-          value: 'zkProofOfAge',
-          text: "Proof Of Age",
-          description: "Proves user is above the specified age",
-          enabled: true,
-          criteria: true,
-          criteriaValue: "",
-          criteriaLabel: "Specify Age (> than)",
-          criteriaType: 'number'
-        },
-
-        // {
-        //   value: 'zkProofOfDOB',
-        //   text: "Proof Of DOB",
-        //   description: "Proves user's date of birth (discloses DOB, nothing else)",
-        //   enabled: true,
-        // },
-        // {
-        //   value: 'zkProofOfMembership',
-        //   text: "Proof Of Membership Country",
-        //   description: "Proves user is not citizen of specified countries",
-        //   enabled: true,
-        // },
-      ],
-
     }
   },
   methods: {
@@ -663,6 +587,21 @@ export default {
         .filter(did => !!did && !!did.trim())
         .join(',')
     },
+    syncAgeProof() {
+      if (!this.widgetConfigTemp.zkProof.proofs) {
+        this.widgetConfigTemp.zkProof.proofs = []
+      }
+
+      if (!this.widgetConfigTemp.zkProof.enabled || !this.ageProofCriteria) {
+        this.widgetConfigTemp.zkProof.proofs = []
+        return
+      }
+
+      this.widgetConfigTemp.zkProof.proofs = [{
+        proofType: this.SupportedZkProofTypes.PROOF_OF_AGE,
+        criteria: this.ageProofCriteria,
+      }]
+    },
     validateField() {
       if (!this.widgetConfigTemp.issuerDID) {
         throw new Error('Issuer DID is required')
@@ -694,11 +633,11 @@ export default {
       }
 
       if (this.widgetConfigTemp.zkProof.enabled) {
+        if (!this.ageProofCriteria) {
+          throw new Error('Kindly specify age criteria to generate proof')
+        }
         if (!this.widgetConfigTemp.idOcr.enabled) {
-          const t = this.widgetConfigTemp.zkProof.proofs.filter(x => (x.proofType != this.SupportedZkProofTypes.PROOF_OF_PERSONHOOD))
-          if (t.length > 0) {
-            throw new Error('You are trying to configure zk proof types which required ID Documentation verification. Please enabled ID document to proceed.')
-          }
+          throw new Error('Age verification requires ID document verification. Please enable ID document verification to proceed.')
         }
       }
     },
@@ -706,6 +645,7 @@ export default {
       try {
         //TODO validate all fields
         this.isLoading = true;
+        this.syncAgeProof()
         this.validateField()
         this.setWidgetConfig(this.widgetConfigTemp)
         await this.createAppsWidgetConfig()
@@ -721,48 +661,11 @@ export default {
       }
     },
 
-    deleteZkProof(proof) {
-      this.widgetConfigTemp.zkProof.proofs = this.widgetConfigTemp.zkProof.proofs.filter(x => x.proofType != proof)
-      // User must click Save/Update to persist — consistent with addZkProof
-    },
-    addZkProof(proofType, criteria) {
-
-      if (!proofType) {
-        return this.notifyErr(`Proof Type must be slected`)
-      }
-
-      if (this.widgetConfigTemp.zkProof.enabled) {
-        if (!this.widgetConfigTemp.zkProof.proofs) {
-          this.widgetConfigTemp.zkProof.proofs = []
-        }
-
-        if (proofType == this.SupportedZkProofTypes.PROOF_OF_AGE) {
-          if (!criteria) {
-            return this.notifyErr('Kindly specify age criteria to generate proof')
-          }
-        } else {
-          criteria = null
-        }
-
-        if (this.widgetConfigTemp.zkProof.proofs.find(x => x.proofType === proofType)) {
-          this.slectProof = null
-          return this.notifyErr(`Proof Type ${proofType} is already added`)
-        }
-
-        this.widgetConfigTemp.zkProof.proofs.push({
-          proofType,
-          criteria,
-        })
-      }
-      this.slectProof = null
-
-      // this.updateConfiguration()
-    },
-
     async updateConfiguration() {
       try {
         //TODO validate all field
         this.isLoading = true;
+        this.syncAgeProof()
         this.validateField()
 
         this.setWidgetConfig(this.widgetConfigTemp)

From 33022c1ab211a87a38a740a6910166d4fbcac4f6 Mon Sep 17 00:00:00 2001
From: Pratap2018 <pratapmridha@gmail.com>
Date: Wed, 24 Jun 2026 16:35:35 +0530
Subject: [PATCH 02/12] zk card and tiles

---
 src/views/playground/Sessions.vue        |  25 +++-
 src/views/playground/SessionsDetails.vue | 176 +++++++++++++++++++++++
 2 files changed, 200 insertions(+), 1 deletion(-)

diff --git a/src/views/playground/Sessions.vue b/src/views/playground/Sessions.vue
index 2b7336b..6aee84b 100644
--- a/src/views/playground/Sessions.vue
+++ b/src/views/playground/Sessions.vue
@@ -273,7 +273,7 @@
                       <template v-slot:activator="{ on, attrs }">
                         <v-icon v-bind="attrs" v-on="on" small color="red darken-1">mdi-alert-circle-outline</v-icon>
                       </template>
-                      <span>{{ getFailureReason(row.failureInfo && row.failureInfo.failureReason, row.failureInfo && row.failureInfo.failureStep) }}</span>
+                      <span>{{ getRowFailureReason(row) }}</span>
                     </v-tooltip>
                   </div>
                 </td>
@@ -330,6 +330,7 @@ export default {
         { field: 'step_start', icon: 'fa-flag', title: 'Started' },
         { field: 'step_liveliness', icon: 'fa-user', title: 'Liveliness Check' },
         { field: 'step_ocrIdVerification', icon: 'fa-address-card', title: 'Document Verification' },
+        { field: 'step_zkProofVerification', icon: 'fa-user-check', title: 'Age Verification' },
         { field: 'step_mintSbt', icon: 'fa-address-book', title: 'Mint SBT' },
         { field: 'step_userConsent', icon: 'fa-thumbs-up', title: 'User Consent' },
         { field: 'step_finish', icon: 'fa-check', title: 'Finished' },
@@ -412,7 +413,18 @@ export default {
     filteredSteps(row) {
       return this.allSteps.filter(step => row[step.field] !== null && row[step.field] !== undefined);
     },
+    getRowFailureReason(row) {
+      if (row.status !== 'Failed' || !row.failureInfo) {
+        return 'Unknown error';
+      }
+
+      return this.getFailureReason(row.failureInfo.failureReason, row.failureInfo.failureStep);
+    },
     getFailureReason(errorCode, errorType = 'step_liveliness') {
+      if (typeof errorCode === 'string' && isNaN(Number(errorCode))) {
+        return errorCode;
+      }
+
       if (errorType == 'step_liveliness') {
         return Config['LivelinessError'][errorCode] || 'Unknown error';
       }
@@ -420,6 +432,17 @@ export default {
       if (errorType == 'step_ocrIdVerification') {
         return Config['FaicalAuthenticationError'][errorCode] || 'Unknown error';
       }
+
+      if (errorType == 'step_zkProofVerification') {
+        const zkpVerificationErrors = {
+          0: 'Age verification could not be performed',
+          1: 'Age verification failed',
+          2: 'Age verification uncertain',
+        };
+        return zkpVerificationErrors[errorCode] || 'Age verification failed';
+      }
+
+      return 'Unknown error';
     },
     getAvatarStyle() {
       // const colors = ['#607d8b', '#3f51b5', '#009688', '#ff5722', '#795548', '#673ab7', '#e91e63'];
diff --git a/src/views/playground/SessionsDetails.vue b/src/views/playground/SessionsDetails.vue
index b571dd7..7b43c86 100644
--- a/src/views/playground/SessionsDetails.vue
+++ b/src/views/playground/SessionsDetails.vue
@@ -641,6 +641,47 @@
         </div>
       </v-col>
 
+      <!-- Age Verification -->
+      <v-col
+        cols="12"
+        md="6"
+        lg="4"
+        id="zkp-verification-info"
+        v-if="zkpVerificationDataFound"
+      >
+        <div class="detail-card p-4">
+          <div class="card-section-title">
+            <i class="fa fa-user-check mr-2"></i>Age Verification
+          </div>
+          <table class="data-table w-100">
+            <tbody>
+              <tr v-if="zkpVerificationResultFound">
+                <td>Status</td>
+                <td>
+                  <span
+                    v-if="zkpVerificationPassed"
+                    style="color: #28a745; font-weight: 600"
+                  >
+                    <i class="fa fa-check-circle mr-1"></i>Passed
+                  </span>
+                  <span v-else style="color: #dc3545; font-weight: 600">
+                    <i class="fa fa-times-circle mr-1"></i>Failed
+                  </span>
+                </td>
+              </tr>
+              <tr v-if="zkpVerificationResultFound">
+                <td>Result</td>
+                <td>{{ zkpVerificationResultForDisplay }}</td>
+              </tr>
+              <tr v-if="session.zkpVerificationDetails.createdAt">
+                <td>Verified At</td>
+                <td>{{ formatDate(session.zkpVerificationDetails.createdAt) }}</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </v-col>
+
       <!-- Soul Bound Token -->
       <v-col
         cols="12"
@@ -845,6 +886,13 @@ const FaicalAuthenticationError = {
   6: "Duplicate document was used",
 };
 
+const ZkpVerificationResultEnum = {
+  0: "Age verification could not be performed",
+  1: "Age verification failed",
+  2: "Age verification uncertain",
+  3: "Age verification passed",
+};
+
 export default {
   name: "sessionDetails",
   components: {
@@ -963,6 +1011,21 @@ export default {
     sbtDataFound() {
       return this.session?.mintsbtsDetails && this.session.mintsbtsDetails.length > 0;
     },
+    zkpVerificationDataFound() {
+      return this.hasObjectData(this.session?.zkpVerificationDetails);
+    },
+    zkpVerificationResultFound() {
+      return this.hasValue(
+        this.session?.zkpVerificationDetails?.serviceZkpVerificationResult
+      );
+    },
+    zkpVerificationPassed() {
+      return this.session?.zkpVerificationDetails?.serviceZkpVerificationResult == 3;
+    },
+    zkpVerificationResultForDisplay() {
+      const result = this.session?.zkpVerificationDetails?.serviceZkpVerificationResult;
+      return ZkpVerificationResultEnum[result] || `Result ${result}`;
+    },
     startFinishDiffInSeconds() {
       if (this.userConsentDataFound) {
         const startDate = new Date(this.session.createdAt);
@@ -1184,9 +1247,24 @@ export default {
             }
           }
 
+          if (this.isZkpVerificationTimelineDetail(newItem)) {
+            newItem.stepName = "Age verification";
+            if (this.hasValue(newItem.result) && newItem.result != 3) {
+              newItem.error =
+                ZkpVerificationResultEnum[newItem.result] || "Age verification failed";
+            }
+          }
+
           return newItem;
         });
       }
+
+      const zkpTimelineDetail = this.buildZkpVerificationTimelineDetail();
+      if (zkpTimelineDetail && !this.timeLineDetails.some(this.isZkpVerificationTimelineDetail)) {
+        this.timeLineDetails.push(zkpTimelineDetail);
+      }
+
+      this.applySessionFailureToTimeline();
     } catch (e) {
       this.notifyErr(e.message);
       this.isLoading = false;
@@ -1205,6 +1283,104 @@ export default {
       const d = new Date(date);
       return d.toLocaleString(); // Customize formatting if needed
     },
+    applySessionFailureToTimeline() {
+      if (this.session?.status !== "Failed") return;
+
+      const failureInfo = this.session?.failureInfo;
+      if (!failureInfo) {
+        return;
+      }
+
+      const failureReason = this.getFailureReason(
+        failureInfo.failureReason,
+        failureInfo.failureStep
+      );
+
+      this.timeLineDetails = this.timeLineDetails.map((item) => {
+        if (!this.isTimelineDetailForFailureStep(item, failureInfo.failureStep)) {
+          return item;
+        }
+
+        return {
+          ...item,
+          error: failureReason,
+        };
+      });
+    },
+    isTimelineDetailForFailureStep(item, failureStep) {
+      const stepName = item?.step_name || item?.stepName;
+      const failureStepMap = {
+        step_liveliness: ["liveliness", "Selfie uploaded"],
+        step_ocrIdVerification: ["ocrIdDoc", "Document uploaded"],
+        step_zkProofVerification: [
+          "zkpVerification",
+          "zkProofVerification",
+          "Age verification",
+        ],
+        step_zkpVerification: [
+          "zkpVerification",
+          "zkProofVerification",
+          "Age verification",
+        ],
+        step_mintSbt: ["mintSbt", "Mint SBT", "Soul Bound Token"],
+      };
+
+      return (failureStepMap[failureStep] || []).includes(stepName);
+    },
+    getFailureReason(errorCode, errorType) {
+      if (typeof errorCode === "string" && isNaN(Number(errorCode))) {
+        return errorCode;
+      }
+
+      if (errorType === "step_liveliness") {
+        return ServiceLivenessResultEnum[errorCode] || "Liveliness check failed";
+      }
+
+      if (errorType === "step_ocrIdVerification") {
+        return FaicalAuthenticationError[errorCode] || "Document verification failed";
+      }
+
+      if (
+        errorType === "step_zkProofVerification" ||
+        errorType === "step_zkpVerification"
+      ) {
+        return ZkpVerificationResultEnum[errorCode] || "Age verification failed";
+      }
+
+      if (errorType === "step_mintSbt") {
+        return "SBT minting failed";
+      }
+
+      return "Verification failed";
+    },
+    isZkpVerificationTimelineDetail(item) {
+      return (
+        item?.step_name === "zkpVerification" ||
+        item?.step_name === "zkProofVerification" ||
+        item?.stepName === "zkpVerification" ||
+        item?.stepName === "zkProofVerification" ||
+        item?.stepName === "Age verification"
+      );
+    },
+    buildZkpVerificationTimelineDetail() {
+      const details = this.session?.zkpVerificationDetails;
+      if (!details?.createdAt) return null;
+
+      const result = details.serviceZkpVerificationResult;
+      const timelineDetail = {
+        step_name: "zkpVerification",
+        stepName: "Age verification",
+        createdAt: details.createdAt,
+        result,
+      };
+
+      if (this.hasValue(result) && result != 3) {
+        timelineDetail.error =
+          ZkpVerificationResultEnum[result] || "Age verification failed";
+      }
+
+      return timelineDetail;
+    },
     formatFieldValue(key, value) {
       if (!value && value !== 0) return value;
       const dateKeys = /date|dob|birth|expir|issued|valid/i;

From 0d953152076625ef3036086641bfb60539c778f7 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Thu, 25 Jun 2026 13:16:47 +0530
Subject: [PATCH 03/12] Showing error message from api response

---
 src/views/playground/SessionsDetails.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/playground/SessionsDetails.vue b/src/views/playground/SessionsDetails.vue
index 7b43c86..087cd5d 100644
--- a/src/views/playground/SessionsDetails.vue
+++ b/src/views/playground/SessionsDetails.vue
@@ -875,6 +875,7 @@ const ServiceLivenessResultEnum = {
   16: "Face is obstructed",
   17: "No life detected",
   18: "Eyes closed",
+  66: "Eye is obstructed"
 };
 
 const FaicalAuthenticationError = {
@@ -1250,8 +1251,7 @@ export default {
           if (this.isZkpVerificationTimelineDetail(newItem)) {
             newItem.stepName = "Age verification";
             if (this.hasValue(newItem.result) && newItem.result != 3) {
-              newItem.error =
-                ZkpVerificationResultEnum[newItem.result] || "Age verification failed";
+              newItem.error = newItem?.failureReason||"Age verification failed"
             }
           }
 

From 1c2768c1787e57359ba1b2c098bd4709fd257e52 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Thu, 25 Jun 2026 15:49:10 +0530
Subject: [PATCH 04/12] set default age for widget

---
 src/views/playground/WidgetConfig/Index.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index 1719504..df71fe8 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -362,6 +362,9 @@ export default {
         if (!newValue) {
           this.widgetConfigTemp.onChainId.enabled = false
         }
+        if (newValue && !this.ageProofCriteria) {
+        this.ageProofCriteria = 18;
+      }
       },
       deep: true
     },

From 714ba618dd1e10b76e9db588cc7e8b7ad8115c65 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Thu, 25 Jun 2026 15:58:19 +0530
Subject: [PATCH 05/12] chnaged the label

---
 src/views/playground/WidgetConfig/Index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index df71fe8..fb158ff 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -503,7 +503,7 @@ export default {
         zkProof: {
           ageProof:{
             label: "Configure Age Verification",
-            description: 'Enable users to share only proof of their data for enhanced data privacy and compliance. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-document-verification" target="_blank">here</a></b>.'
+            description: "Enable users to prove they meet a minimum age requirement without sharing their exact date of birth. Read more <b><a href=\"https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-document-verification\" target=\"_blank\">here</a></b>."
           }
         },
         emailNotification: {

From 64eece3d69b380b81de492c2f3e38988b39fd6c4 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Fri, 26 Jun 2026 14:31:25 +0530
Subject: [PATCH 06/12] disabling zk-proof verification if document disabled

---
 src/views/playground/WidgetConfig/Index.vue | 47 +++++++++++++++------
 1 file changed, 35 insertions(+), 12 deletions(-)

diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index fb158ff..9a6dcbd 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -257,7 +257,8 @@ ul {
             <div class="col-md-6">
               <div class="row">
                 <div class="col-md-12">
-                  <b-form-checkbox switch size="lg" v-model="widgetConfigTemp.zkProof.enabled">{{
+                  <b-form-checkbox switch size="lg" v-model="widgetConfigTemp.zkProof.enabled"
+                  :disabled="!widgetConfigTemp.idOcr.enabled">{{
                     this.widgetConfigUI.zkProof.ageProof.label }}<HFBeta></HFBeta>
                   </b-form-checkbox>
                   <small v-html="this.widgetConfigUI.zkProof.ageProof.description"></small>
@@ -355,20 +356,42 @@ export default {
     // TrustedIssuer
   },
   // TODO : check why this is not working... we need to trigger warning that its an experimental feature once user enables zk
-  watch: {
-    'widgetConfigTemp.zkProof.enabled':
-    {
-      handler(newValue) {
-        if (!newValue) {
-          this.widgetConfigTemp.onChainId.enabled = false
-        }
-        if (newValue && !this.ageProofCriteria) {
+ watch: {
+  'widgetConfigTemp.zkProof.enabled': {
+    handler(enabled) {
+      // Don't allow enabling ZK Proof unless ID OCR is enabled
+      if (enabled && !this.widgetConfigTemp.idOcr.enabled) {
+        this.widgetConfigTemp.zkProof.enabled = false;
+        return;
+      }
+      // Default age
+      if (enabled && !this.ageProofCriteria) {
         this.ageProofCriteria = 18;
       }
-      },
-      deep: true
-    },
+      // Disable dependent feature
+      if (!enabled) {
+        this.widgetConfigTemp.onChainId.enabled = false;
+        this.widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration = null;
+        this.widgetConfigTemp.zkProof.proofs = [];
+      }
+    }
   },
+
+  'widgetConfigTemp.idOcr.enabled': {
+    handler(enabled) {
+      // If ID Document is disabled,
+      // automatically disable all dependent features.
+      if (!enabled) {
+        this.widgetConfigTemp.zkProof.enabled = false;
+        this.widgetConfigTemp.zkProof.proofs = [];
+
+        this.widgetConfigTemp.onChainId.enabled = false;
+        this.widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration = null;
+       
+    }
+    }
+  }
+},
   computed: {
     ...mapState({
       containerShift: state => state.playgroundStore.containerShift,

From 740ae7485e6cd638b7638b3de2d92b5353e2894b Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Fri, 26 Jun 2026 14:40:37 +0530
Subject: [PATCH 07/12] removed zk-proof icon

---
 src/views/playground/Sessions.vue        | 2 +-
 src/views/playground/SessionsDetails.vue | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/views/playground/Sessions.vue b/src/views/playground/Sessions.vue
index 6aee84b..c22e778 100644
--- a/src/views/playground/Sessions.vue
+++ b/src/views/playground/Sessions.vue
@@ -330,7 +330,7 @@ export default {
         { field: 'step_start', icon: 'fa-flag', title: 'Started' },
         { field: 'step_liveliness', icon: 'fa-user', title: 'Liveliness Check' },
         { field: 'step_ocrIdVerification', icon: 'fa-address-card', title: 'Document Verification' },
-        { field: 'step_zkProofVerification', icon: 'fa-user-check', title: 'Age Verification' },
+        // { field: 'step_zkProofVerification', icon: 'fa-user-check', title: 'Age Verification' },
         { field: 'step_mintSbt', icon: 'fa-address-book', title: 'Mint SBT' },
         { field: 'step_userConsent', icon: 'fa-thumbs-up', title: 'User Consent' },
         { field: 'step_finish', icon: 'fa-check', title: 'Finished' },
diff --git a/src/views/playground/SessionsDetails.vue b/src/views/playground/SessionsDetails.vue
index 087cd5d..e4ed761 100644
--- a/src/views/playground/SessionsDetails.vue
+++ b/src/views/playground/SessionsDetails.vue
@@ -669,10 +669,10 @@
                   </span>
                 </td>
               </tr>
-              <tr v-if="zkpVerificationResultFound">
+              <!-- <tr v-if="zkpVerificationResultFound">
                 <td>Result</td>
                 <td>{{ zkpVerificationResultForDisplay }}</td>
-              </tr>
+              </tr> -->
               <tr v-if="session.zkpVerificationDetails.createdAt">
                 <td>Verified At</td>
                 <td>{{ formatDate(session.zkpVerificationDetails.createdAt) }}</td>

From a9aff9ce3af63a60bf61d22f313f189e5d0bc3e0 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Mon, 29 Jun 2026 19:44:39 +0530
Subject: [PATCH 08/12] added chnage log

---
 Changelog.md | 19 ++++++++++++++++++-
 package.json |  2 +-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/Changelog.md b/Changelog.md
index 2f8b575..00da196 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -1,8 +1,25 @@
 # Changelog
 
 ## [Unreleased]
-### [3.10.5] - 2026-06-11
+### [3.11.1] - 2026-06-18
+### Added
+- Show tile for zkp
+- show zkp error message
+- change the zkp label to normal user readable text
+- added toggle button for widget zkp configure
 
+### Added
+- Added toggel to disable widget login
+### [3.11.0] - 2026-06-18
+
+### Added
+- Added toggel to disable widget login
+### [3.11.0] - 2026-06-18
+
+### Added
+- Added toggel to disable widget login
+
+### [3.10.5] - 2026-06-11
 
 ### Fixed
 - Fixed busines icon
diff --git a/package.json b/package.json
index 86d6215..56f96f1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "entity-developer-dashboard",
-  "version": "3.10.5",
+  "version": "3.11.1",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve --mode production",

From f87eb68e02d13c615a26a3ec19f8188410fea212 Mon Sep 17 00:00:00 2001
From: Pratap2018 <pratapmridha@gmail.com>
Date: Tue, 30 Jun 2026 11:18:02 +0530
Subject: [PATCH 09/12] Revert "Merge branch 'develop' into zkp/widget-config"

This reverts commit a02a11e42650083cbf3b0f685dacba0e626402a7, reversing
changes made to a9aff9ce3af63a60bf61d22f313f189e5d0bc3e0.
---
 Changelog.md                                |  8 ----
 src/views/GettingStarted.vue                |  1 -
 src/views/playground/WidgetConfig/Index.vue | 42 ++++-----------------
 3 files changed, 8 insertions(+), 43 deletions(-)

diff --git a/Changelog.md b/Changelog.md
index 3dba6b8..00da196 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -8,14 +8,6 @@
 - change the zkp label to normal user readable text
 - added toggle button for widget zkp configure
 
-### [3.11.0] - 2026-06-18
-
-### Added
-- Added toggel to disable widget login
-
-
-### [3.10.5] - 2026-06-11
-
 ### Added
 - Added toggel to disable widget login
 ### [3.11.0] - 2026-06-18
diff --git a/src/views/GettingStarted.vue b/src/views/GettingStarted.vue
index e5e084d..9e4b85d 100644
--- a/src/views/GettingStarted.vue
+++ b/src/views/GettingStarted.vue
@@ -80,7 +80,6 @@
             depressed
             small
             color="white"
-
             class="text-none font-weight-bold"
             :href="`#/studio/kyb-webpage-generator/${appId()}`"
           >
diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index 046d5dc..9a6dcbd 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -325,20 +325,6 @@ ul {
             </div>
           </div>
         </li>
-         <li class="list-group-item">
-          <div class="row">
-            <div class="col-md-6">
-              <b-form-checkbox
-                switch
-                size="lg"
-                v-model="widgetConfigTemp.isWidgetLogin"
-              >
-                {{ widgetConfigUI.widgetLogin.label }}
-              </b-form-checkbox>
-              <small v-html="widgetConfigUI.widgetLogin.description"></small>
-            </div>
-          </div>
-        </li>
       </ul>
     </div>
 
@@ -452,9 +438,6 @@ export default {
     if (Object.keys(this.widgetConfig).length > 0) {
       this.widgetConfigTemp = JSON.parse(JSON.stringify(this.widgetConfig))
     }
-    if (typeof this.widgetConfigTemp.isWidgetLogin !== 'boolean') {
-      this.$set(this.widgetConfigTemp, 'isWidgetLogin', true)
-    }
 
     this.trustedIssuersList = [...this.getMarketPlaceApps];
     this.appId = this.$route.params.appId;
@@ -521,20 +504,20 @@ export default {
       widgetConfigUI: {
         faceRecog: {
           label: "Enable Facial Recoginition",
-          description: 'Enable users verify if they are human and generate Personhood Credential. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#f[...]
+          description: 'Enable users verify if they are human and generate Personhood Credential. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#facial-recognition" target="_blank">here</a></b>.'
         },
         idOcr: {
           label: "Enable ID Document Verification",
-          description: 'Enable users verify their ID Document and generate their ID Credential. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-[...]
+          description: 'Enable users verify their ID Document and generate their ID Credential. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#id-document-verification" target="_blank">here</a></b>.'
         },
         userConsent: {
           label: "Enable User Consent",
-          description: 'Specify a reason for requesting user KYC data. This information will be displayed on the user consent screen in the KYC widget, helping users understand who is requesting [...]
+          description: 'Specify a reason for requesting user KYC data. This information will be displayed on the user consent screen in the KYC widget, helping users understand who is requesting their data and why. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#user-consent" target="_blank">here</a></b>.'
         },
         
         trustedIssuer: {
           label: "Configure Trusted Issuer(s)",
-          description: 'Select one or more trusted issuers, with the default being "self". This pertains to Reusable ID. If configured, users who already possess KYC credentials issued by these t[...]
+          description: 'Select one or more trusted issuers, with the default being "self". This pertains to Reusable ID. If configured, users who already possess KYC credentials issued by these trusted issuers in their data vault will not need to repeat the KYC steps in the widget. They can simply authorize the sharing of their existing credentials with your app, streamlining user onboarding for your company and providing a smoother experience for your users. Read more <b><a href="https://docs.hypersign.id/hypersign-kyc/integrations/widget-configuration#trusted-issuer" target="_blank">here</a></b>.'
         },
         onChainId: {
           label: "Enable Onchain KYC",
@@ -550,10 +533,6 @@ export default {
            label: "Enable Email Notifications",
            description: "Notify users via email regarding the status of their ID verification. When enabled, users will receive automated updates upon the successful completion or rejection of their verification attempt."
         },
-        widgetLogin: {
-          label: "Enable Built-in Login & Identity Vault",
-          description: "Users sign in through the ID Widget and receive a personal identity vault for storing reusable credentials. Disable this if your application handles authentication."
-        },
       },
       fullPage: true,
       isLoading: false,
@@ -583,8 +562,6 @@ export default {
           proofs: []
         },
         trustedIssuer: true,
-        isWidgetLogin: true,
-        isVaultEnabled: true,
         isEmailNotificationEnabled: true,
         issuerDID: "",
         issuerVerificationMethodId: "",
@@ -601,10 +578,10 @@ export default {
           text: "Passport"
         },
          {
-           value: 'govId',
-           text: "Government ID"
-         },
-       ],
+          value: 'govId',
+          text: "Government ID"
+        },
+      ],
 
     }
   },
@@ -652,9 +629,6 @@ export default {
       }]
     },
     validateField() {
-      this.widgetConfigTemp.isWidgetLogin = this.widgetConfigTemp.isWidgetLogin !== false
-
-
       if (!this.widgetConfigTemp.issuerDID) {
         throw new Error('Issuer DID is required')
       }

From 929a7beba302ac5023b588361174fc9e4e9234bc Mon Sep 17 00:00:00 2001
From: varsha <91577031+varsha766@users.noreply.github.com>
Date: Tue, 30 Jun 2026 11:34:37 +0530
Subject: [PATCH 10/12] Feature/widget enhancement (#197)

* Updated id widget

* updated label

* used watcher for toggel

---------

Co-authored-by: Pratap Mridha <pratapmridha@gmail.com>
---
 Changelog.md                                |  2 ++
 src/views/playground/WidgetConfig/Index.vue | 25 +++++++++++++++++++++
 2 files changed, 27 insertions(+)

diff --git a/Changelog.md b/Changelog.md
index 00da196..d28538d 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -1,12 +1,14 @@
 # Changelog
 
 ## [Unreleased]
+
 ### [3.11.1] - 2026-06-18
 ### Added
 - Show tile for zkp
 - show zkp error message
 - change the zkp label to normal user readable text
 - added toggle button for widget zkp configure
+- Added toggel to disable widget login
 
 ### Added
 - Added toggel to disable widget login
diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index 9a6dcbd..1354a1e 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -325,6 +325,20 @@ ul {
             </div>
           </div>
         </li>
+         <li class="list-group-item">
+          <div class="row">
+            <div class="col-md-6">
+              <b-form-checkbox
+                switch
+                size="lg"
+                v-model="widgetConfigTemp.isWidgetLogin"
+              >
+                {{ widgetConfigUI.widgetLogin.label }}
+              </b-form-checkbox>
+              <small v-html="widgetConfigUI.widgetLogin.description"></small>
+            </div>
+          </div>
+        </li>
       </ul>
     </div>
 
@@ -438,6 +452,9 @@ export default {
     if (Object.keys(this.widgetConfig).length > 0) {
       this.widgetConfigTemp = JSON.parse(JSON.stringify(this.widgetConfig))
     }
+    if (typeof this.widgetConfigTemp.isWidgetLogin !== 'boolean') {
+      this.$set(this.widgetConfigTemp, 'isWidgetLogin', true)
+    }
 
     this.trustedIssuersList = [...this.getMarketPlaceApps];
     this.appId = this.$route.params.appId;
@@ -533,6 +550,10 @@ export default {
            label: "Enable Email Notifications",
            description: "Notify users via email regarding the status of their ID verification. When enabled, users will receive automated updates upon the successful completion or rejection of their verification attempt."
         },
+        widgetLogin: {
+          label: "Enable Built-in Login & Identity Vault",
+          description: "Users sign in through the ID Widget and receive a personal identity vault for storing reusable credentials. Disable this if your application handles authentication."
+        },
       },
       fullPage: true,
       isLoading: false,
@@ -562,6 +583,8 @@ export default {
           proofs: []
         },
         trustedIssuer: true,
+        isWidgetLogin: true,
+        isVaultEnabled: true,
         isEmailNotificationEnabled: true,
         issuerDID: "",
         issuerVerificationMethodId: "",
@@ -629,6 +652,8 @@ export default {
       }]
     },
     validateField() {
+      this.widgetConfigTemp.isWidgetLogin = this.widgetConfigTemp.isWidgetLogin !== false
+
       if (!this.widgetConfigTemp.issuerDID) {
         throw new Error('Issuer DID is required')
       }

From 196916db1b82c676e7f34cfd6d7b8f4b265cbc81 Mon Sep 17 00:00:00 2001
From: Pratap2018 <pratapmridha@gmail.com>
Date: Tue, 30 Jun 2026 11:40:32 +0530
Subject: [PATCH 11/12] fix: addloader

---
 src/views/ServiceConfig.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/views/ServiceConfig.vue b/src/views/ServiceConfig.vue
index 6da3c29..3a2e49c 100644
--- a/src/views/ServiceConfig.vue
+++ b/src/views/ServiceConfig.vue
@@ -1,5 +1,6 @@
 <template>
     <b-container fluid class="py-3">
+        <load-ing :active.sync="isLoading" :can-cancel="true" :is-full-page="fullPage"></load-ing>
         
         <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap">
             <div>
@@ -332,11 +333,14 @@ import messages from "../mixins/messages";
 import { mapGetters, mapActions, mapMutations, mapState } from 'vuex/dist/vuex.common.js';
 import LogoUploader from "../components/element/LogoUploader.vue";
 import CorsChipsInput from "../components/element/CorsChips.vue";
+import LoadIng from "../components/element/LoadIng.vue";
 import { normalizeCorsOrigin } from '../utils/utils.js';
 export default {
     name: "ServiceConfig",
     data() {
         return {
+            isLoading: false,
+            fullPage: true,
             isEditing: false,
             // allow editing domain independently of full-form edit
             isEditingDomain: false,
@@ -385,6 +389,7 @@ export default {
         HfPopUp,
         LogoUploader,
         CorsChipsInput,
+        LoadIng,
     },
     async created() {
         this.formData = { ...this.getSelectedService };

From 5e17f43bb5573e1c1778ddd92eccd8748e8865a5 Mon Sep 17 00:00:00 2001
From: Varsha Kumari <varshakumari370@gmail.com>
Date: Fri, 3 Jul 2026 12:27:23 +0530
Subject: [PATCH 12/12] fixed a issue

---
 Changelog.md                                | 3 ---
 src/views/playground/WidgetConfig/Index.vue | 6 ++++++
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/Changelog.md b/Changelog.md
index d28538d..882aeaf 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -12,10 +12,7 @@
 
 ### Added
 - Added toggel to disable widget login
-### [3.11.0] - 2026-06-18
 
-### Added
-- Added toggel to disable widget login
 ### [3.11.0] - 2026-06-18
 
 ### Added
diff --git a/src/views/playground/WidgetConfig/Index.vue b/src/views/playground/WidgetConfig/Index.vue
index 1354a1e..9fffb1b 100644
--- a/src/views/playground/WidgetConfig/Index.vue
+++ b/src/views/playground/WidgetConfig/Index.vue
@@ -404,6 +404,12 @@ export default {
        
     }
     }
+  },
+  'widgetConfigTemp.isWidgetLogin': {
+    handler(newValue) {
+      this.widgetConfigTemp.isVaultEnabled = newValue !== false
+    },
+    immediate: true
   }
 },
   computed: {