# Beneficiary User

### Splash screen <a href="#gmalddkr7sac" id="gmalddkr7sac"></a>

* Contains language selection (by default English) and two buttons for Seekers registration and Login

<br>

<figure><img src="https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FsUUoXRtxWj4KDXHGCELT%2Fsplash.png?alt=media&#x26;token=960bf5d9-53fb-4764-8b63-d5f59c4c4158" alt="" width="563"><figcaption></figcaption></figure>

## Registration

* New users can create an account by clicking the Register button on the splash screen.
* Fill out the required details to complete the registration process.
* On success: The system displays a username and redirects to the login page.

<figure><img src="https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FRcsuk5Cr2YYF8bvx8nPE%2Fregister.png?alt=media&#x26;token=7d7abdd7-041d-4712-b5a2-f2d2cc5ce724" alt=""><figcaption></figcaption></figure>

### Login <a href="#rz3j2jv6u30u" id="rz3j2jv6u30u"></a>

* Use your registered username and password to log in.
* Upon successful login, you will be redirected to the Home screen.
* The Login screen includes a "Register" button for users who do not have an account. On clicking "Register", the user will be redirected to the Registration page.

<figure><img src="https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FlSjaFhUr0jl6fUKkEyZa%2Flogin.png?alt=media&#x26;token=ade301b2-b713-4210-846d-93fc31a1a428" alt=""><figcaption></figcaption></figure>

### Home <a href="#rz3j2jv6u30u" id="rz3j2jv6u30u"></a>

* If the user is newly registered and logs into the system, they will be prompted with a Terms and Conditions consent dialog containing all the Terms and Conditions along with "Accept" and "Deny" buttons. If the user selects "Deny", they will be logged out of the system. If they select "Accept", their consent will be securely recorded in the system, and they will be redirected to the Home page.

<figure><img src="https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FlPnBuo6fdIlD7Vl4XHMl%2FHOME.png?alt=media&#x26;token=e4768754-6b57-46c1-8e0c-fafb445db1ba" alt=""><figcaption></figcaption></figure>

* The Home section allows beneficiaries to manage their personal information and required documents for applying for benefits.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FoFlgFM1MTeZwnGNK4fqK%2F4.png?alt=media)

#### How It Works <a href="#b953n9cx04" id="b953n9cx04"></a>

* After login, the user is redirected to the Home screen.
* Use the Scan and Upload Documents button to scan documents.

### Steps to Complete Your Profile (Blue dot) <a href="#mmmdnjmmphun" id="mmmdnjmmphun"></a>

#### 1. Scan Document QR&#x20;

* Upon clicking Start camera scan button, the camera will open and allow the user to scan the document.
* While the camera is open, there is also an option to stop the camera scan in case the user wants to cancel or pause the scanning process. If the camera scan is stopped, the option to start the camera scan will remain available to resume the scanning when needed.
* Upon clicking Start camera scan button, the camera will open and allow the user to scan the document.
* While the camera is open, there is also an option to stop the camera scan in case the user wants to cancel or pause the scanning process. If the camera scan is stopped, the option to start the camera scan will remain available to resume the scanning when needed.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FmQq9qOHginlBxMRl0eHU%2F7.jpeg?alt=media)

* The scanned VC is verified using the integrated Verification SDK before it is uploaded to ensure authenticity and data integrity.
* If the scan is successful, a message will be displayed confirming that the document was imported successfully.
* Once a document is uploaded, a "Re-upload" button will be available next to it, allowing the user to scan and upload the document again if needed.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FDBtFAVyaeg3IKGVJt4qk%2F8.png?alt=media)

* If the scan fails, an appropriate error message will be shown.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2Fa0sWnH6OOmvmYV6taWv2%2F9.png?alt=media)

#### 2. Upload Document from e-wallet

* Navigate to the Home section from the bottom navigation menu.
* Click on Upload Document from wallet
  * System validates wallet connectivity and authentication
  * Application opens embedded iframe with wallet service, User sees their wallet's document selection interface

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FoZWdfvuP0mTlR4d9Daw6%2F10.png?alt=media)<br>

* User browses available documents in their wallet
* User selects one or more documents to import
* Selected documents are imported in the beneficiary application
* The system will automatically update your profile with the details from the uploaded document. On the Home screen, users can view documents marked with a green icon and perform three actions: preview the verified credential (VC), preview the original document image, and delete the document.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2F6pg5aAjezLYBRIgl8wEr%2F11.jpeg?alt=media)

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FIiqrSPAJ1s47K4lyqnfr%2F12.png?alt=media)

* Documents marked with a yellow icon indicate missing or incomplete documents.
* Documents marked with a green icon indicate that the document is uploaded.
* Documents marked with a red icon indicate that the document is expired.
* A list of required documents is displayed. Each document item shows:
  * The document name
  * The expiry date, if applicable (If the document is expired, the expiry date is highlighted in red to indicate its invalidity)

Each document item includes three actions:

#### Preview VC <a href="#qp9nir7xbdau" id="qp9nir7xbdau"></a>

A View Document icon , which opens a preview of the document in JSON format when clicked.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2Fu9UdNTstG31e0ajHpWYT%2F13.jpeg?alt=media)

#### Preview Original Documents used during VC creation <a href="#id-7alkjix9vde5" id="id-7alkjix9vde5"></a>

Image Icon, Opens the original VC image for the document in a viewer.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2F6vFR6CRyLn73YR0Di5ZG%2F14.png?alt=media)

#### Delete VC <a href="#wmkd9qubarq1" id="wmkd9qubarq1"></a>

A Delete icon on the right side of the document.When the Delete icon is clicked, a confirmation dialog appears with a warning message: "Are you sure you want to delete this document?” If the user selects "Okay", the document will be deleted from the profile

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FplUdf7BKVHLowvdIPD0F%2F15.png?alt=media)

### Explore Benefits <a href="#nkq82pcxwk1i" id="nkq82pcxwk1i"></a>

#### Benefit listing: <a href="#id-1crxjuvprhlq" id="id-1crxjuvprhlq"></a>

#### The benefits are displayed under two separate tabs: <a href="#omx8ym53rpsf" id="omx8ym53rpsf"></a>

* **My Benefits:**
  * Shows only the benefits the user is eligible for, based on Eligibility SDK integration.
  * Includes a search bar for quick lookup.
  * Supports pagination to navigate through long lists.
* **All Benefits:**
  * Displays all available benefits from the network.Also Includes filters such as gender , Income range and caste and Includes a search bar for quick lookup.Displays all available benefits from the network.
  * Includes filters: Gender, Income Range, caste
  * Includes a search bar for quick lookup.
  * Supports pagination to navigate through long lists.
  * On clicking "View Detail", the user is navigated to the Benefit Details page of the selected benefit.

### View Benefit Details <a href="#id-81cn1rydy8e7" id="id-81cn1rydy8e7"></a>

* Clicking "View Detail" opens the Benefit Detail page.
* The Benefit Detail page shows:
  * Description of the benefit
  * Benefits to the beneficiary
  * Eligibility criteria
  * Required documents which includes Options to preview JSON format and Original document image
  * A "Proceed to Apply" button
* A "Proceed to Apply" button

### Apply for Benefits <a href="#mbuvzfv6jk5r" id="mbuvzfv6jk5r"></a>

* When the user clicks "Proceed to Apply" system checks for expired documents
  * If any required documents are expired, an alert is shown. Example: “Your OTR Certificate and Income Certificate have expired. Please upload valid documents to proceed further.”
  * The user cannot proceed until valid documents are uploaded.
* If all required documents are valid, the system checks eligibility using the Eligibility SDK.
  * If the user is eligible:Redirect to the pre-filled application form.
  * If the user is not eligible:Show alert: "You are not eligible for this benefit." Restrict user from submitting application

### Steps to Apply <a href="#au1e0oeywmoj" id="au1e0oeywmoj"></a>

* Go to the Explore Benefits section.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FdzMyXG36CunotYn3qGTG%2F16.png?alt=media)

* Click View Details for the selected benefit.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2Fu0qJXqSLqhRfvJaMpmxO%2F17.png?alt=media)

* Click "Proceed to Apply".

User who is not eligible will be restricted from accessing the form

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2F9TWgH35lezZwwOpNN9xF%2F18.png?alt=media)

* Review the prepopulated form, fill in any missing fields, and submit the application.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FbOtQFFd4AYF8hrtlLvfC%2F19.png?alt=media)

* After successful submission, you’ll be redirected to My Application.

![](https://3805274988-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3ZeWgjh9EKqEsem61L5Z%2Fuploads%2FHcs7CANJeXgs6BnEzBN7%2F20.jpeg?alt=media)

### My Applications <a href="#ar0hhohv2jzg" id="ar0hhohv2jzg"></a>

* The My Applications section allows beneficiaries to track their application progress and view application history.
* Track Application Status: Monitor the progress of your submitted applications.
* View Submitted Details: Click on an application to see all the details you provided during submission.

#### Steps to Track Application Progress <a href="#id-2p57v5fl1qfb" id="id-2p57v5fl1qfb"></a>

* Navigate to My Application from the bottom navigation menu.
* Select an application to review.
* View its details, including status and submission data.Profile (Navbar Menu)
* The Profile section is accessible from the navbar menu and allows you to view and update your personal information.

#### Features <a href="#vuw38h7fhkzp" id="vuw38h7fhkzp"></a>

* View basic details such as Name, Date of Birth, Caste, Income, etc.
* A list of documents is displayed:
  * Documents with a yellow mark indicate missing or incomplete documents.
  * Use the Import Documents button to fetch documents from your e-wallet.
  * Imported documents will appear in the list with a green tick once successfully fetched.

### Logout <a href="#i2dy9wpzfbh4" id="i2dy9wpzfbh4"></a>

#### How to Logout <a href="#bimbnr5geju6" id="bimbnr5geju6"></a>

* Open the navbar menu.
* Click the Logout option to log out of the application.
* You will be redirected to the login screen.

### Navigation Options <a href="#u3zxxa8hvusc" id="u3zxxa8hvusc"></a>

#### Bottom Navigation Menu: <a href="#iyw5l392hk1t" id="iyw5l392hk1t"></a>

* Home
* Explore Benefits
* My Application
* Navbar Menu:
  * Profile: View and update personal details.
  * Logout: Log out of the application.

### Troubleshooting <a href="#q8il94kkuoi4" id="q8il94kkuoi4"></a>

#### 1. Login Issues <a href="#id-7fyzmkyro3si" id="id-7fyzmkyro3si"></a>

**Problem: Incorrect Email or Password**

* Solution:
  * Verify that your username and password are correct.
  * Ensure that the Caps Lock key is off.
  * If you are a new user, click the Register button on the splash screen and complete the registration process.

**Problem: Unable to Access the Login Page**

* Solution:
  * Check your internet connection.
  * Ensure the URL is correct.
  * Clear your browser cache and cookies, then try again.

#### 2. Registration Issues <a href="#loohqxwq0xcv" id="loohqxwq0xcv"></a>

**Problem: Registration Form Validation Errors**

* Solution:
  * Ensure all fields are filled out as per the specified format (e.g., first name, last name , phone number ).
  * Check for any error messages next to the fields and correct them.

**Problem: Unable to Complete Registration**

* Solution:
  * Verify the network connection and retry.
  * Check for server errors or maintenance announcements.

#### 3. Home Section Issues <a href="#nl658lxoqyxa" id="nl658lxoqyxa"></a>

**Problem: Documents Not Displayed**

* Solution:
  * Refresh the page or restart the application.
  * Ensure that the backend API for fetching documents is functioning properly.

**Problem: The Scan Documents Not Working**

* Solution:
  * Verify your internet connection.
  * Check the browser console (F12 > Console) for any error messages.
  * Ensure scanner is clear

#### 4. Explore Benefits Issues <a href="#id-95xgi9vyfpgt" id="id-95xgi9vyfpgt"></a>

**Problem: Benefits List Not Displayed**

* Solution:
  * Clear the browser cache and refresh the page.
  * Use the browser network tab (F12 > Network) to verify the API call status.
  * Ensure the backend API is running and responding correctly.

**Problem: Filters Not Working**

* Solution:
  * Refresh the page and try applying filters again.
  * Check if the backend API supports filtering options and if the filter logic is implemented correctly.

**Problem: Application Form Fields Are Not Prepopulated**

* Solution:
  * Ensure that your profile is fully updated with the necessary details.
  * Check the backend API for fetching user profile data.

**Problem: Unable to Submit Application**

* Solution:
  * Verify that all mandatory fields (e.g., Bank Details) are filled.
  * Check for any validation errors and correct them.
  * Inspect network activity (F12 > Network) to ensure the form submission API succeeded.

#### 5. My Application Issues <a href="#id-6c3kkubbcdp2" id="id-6c3kkubbcdp2"></a>

**Problem: Application Status Not Updating**

* Solution:
  * Clear the browser cache and refresh the page.
  * Ensure that the backend API for tracking applications is functioning correctly.

**Problem: Unable to View Application Details**

* Solution:
  * Check for errors in the browser console or network tab.
  * Verify that the backend API endpoint for fetching application details is accessible.

#### 6. Profile Section Issues <a href="#oj39grwu3fuh" id="oj39grwu3fuh"></a>

**Problem: Profile Data Not Updating**

* Solution:
  * Ensure that all required fields are filled before updating.
  * Refresh the page and retry the update process.
  * Verify that the backend API for updating the profile is operational.

**Problem: Unable to Import Documents**

* Solution:
  * Check your internet connection and retry.
  * Ensure that the e-wallet API is accessible and configured correctly.

#### 7. Logout Issues <a href="#id-6nnameufonwr" id="id-6nnameufonwr"></a>

**Problem: The logout Button Not Working**

* Solution:
  * Refresh the page and try again.
  * Verify that the session or token handling logic is implemented correctly on the backend.

#### 8. General Navigation Issues <a href="#qhwhew6r973e" id="qhwhew6r973e"></a>

**Problem: Bottom Navigation Menu Options Not Responding**

* Solution:
  * Ensure that your browser or app is up-to-date.
  * Verify that the routes or navigation logic in the app is correctly implemented.

**Problem: Navbar Menu Options Not Accessible**

* Solution:
  * Refresh the page or restart the application.
  * Check for errors in the browser console or app logs.

### Admin Panel- User guide <a href="#jaxkrrsuaavr" id="jaxkrrsuaavr"></a>

### Overview <a href="#ujv60b2s5hlz" id="ujv60b2s5hlz"></a>

The Admin Panel provides comprehensive field configuration and document mapping capabilities for a beneficiary app. The system enables Admins to define custom form fields, configure document types, and establish mappings between form fields and document verification credentials (VCs).

### Use Cases <a href="#ggnjp9ervvzz" id="ggnjp9ervvzz"></a>

#### **1: Manage Form Fields** <a href="#id-4glnc4z69zua" id="id-4glnc4z69zua"></a>

Actor: Beneficiary Admin Goal: Create, edit, and delete custom form fields for user registration

Preconditions:

* Admin has access to admin panel
* System is connected to backend API

Main Flow:

1. Admin navigates to Add Fields page
2. System displays current list of fields in table format<br>
3. Admin clicks "Add Field" button\
   System opens field creation modal\
   \
   \&#xNAN;*Field creation modal opened with empty form*
4. Admin fills required field information:
   * Label (display name)
   * Name (internal identifier)
   * Type (text, numeric, date, boolean, dropdown)
   * Ordering (display sequence)
   * Required flag
   * Editable flag
   * Options (for dropdown type)

&#x20;*Modal with all field information filled out*

1. *Admin clicks Add field button*
2. System validates field data
3. System calls API to persist field
4. System refreshes field list\
   &#x20;*Updated fields table showing newly added field*
5. System displays success confirmation

Alternative Flows:

* AF-001a: Edit existing field
* AF-001b: Delete field

Business Rules:

* Field names must be unique
* Ordering must be numeric and positive
* Dropdown fields must have at least one option
* Fields in use cannot be deleted

#### **2: Configure Document Types** <a href="#id-6pvvk6y753zq" id="id-6pvvk6y753zq"></a>

Actor: Beneficiary Admin Goal: Define document types and their VC field schemas for verification

Preconditions:

* Admin has access to admin panel
* VC schemas are defined on issuance platform

Main Flow:

1. Admin navigates to Document Config page
2. System displays current document configurations\
   &#x20;*Document Configuration page with existing configurations*
3. Admin reviews/adds document configuration:
   * Document Name (display name)
   * Document Label (user-friendly label)
   * Document Type (category)
   * Document Sub Type (specific identifier)
   * VC Fields (JSON schema defining available fields)

*Document configuration form with all required fields*

1. Admin enters all fields  *Step 4: VC Fields textarea with JSON schema input*
2. System validates JSON structure\
   &#x20;*Real-time JSON validation*
3. Admin saves all configurations\
   \&#xNAN;*Save All Configurations button highlighted*
4. System persists configurations via API
5. System displays success confirmation\
   ￼ Step 8:*Success toast showing number of configurations saved*

Alternative Flows:

* AF-002a: Add new document configuration
* AF-002b: Remove document configuration
  * Admin clicks delete icon\
    &#x20;*AF-002b: Delete icon on configuration block*
  * System removes configuration from list<br>
* AF-002c: Invalid JSON format

Business Rules:

* All document fields are required
* VC fields must be valid JSON object
* Each field in VC schema must have a "type" property
* Document sub types should be unique

#### **3: Map Fields to Documents** <a href="#m0qsch1r5cf9" id="m0qsch1r5cf9"></a>

Actor: Beneficiary Admin Goal: Create mappings between form fields and document VC fields

Preconditions:

* Form fields are configured in system
* Documents are configured with VC schemas

Main Flow:

1. Admin navigates to Field Mapping Config page
2. System loads available form fields and document types\
   &#x20;*Field Mapping Configuration page with loaded data*
3. Admin creates field mapping:
4. Admin can add multiple document mappings per field\
   \&#xNAN;*Multiple document mappings for single field*
5. System validates all mappings
6. Admin saves all mappings\
   \&#xNAN;*Save All Mappings button highlighted*
7. System persists mapping configuration via API\
   \&#xNAN;*Success toast with mapping statistics*

Alternative Flows:

Business Rules:

* Each field mapping must have at least one document mapping
* Document and VC field selections are required
* Transformation JSON must be valid format
* Form fields can map to multiple documents/field

### Data Flow <a href="#id-7xzyz8c08nek" id="id-7xzyz8c08nek"></a>

#### Field Management Flow <a href="#bw0j8icnb4rd" id="bw0j8icnb4rd"></a>

1. Load: Fetch existing fields from API
2. Display: Render fields in table format
3. Interact: User initiates add/edit/delete
4. Validate: Client-side validation of input
5. Submit: API call with validated data
6. Refresh: Update local state and UI
7. Feedback: Success/error notification

#### Document Configuration Flow <a href="#k9zhz9a4u17c" id="k9zhz9a4u17c"></a>

1. Initialize: Load existing configurations
2. Configure: User enters document details
3. Validate: JSON schema validation for VC fields
4. Bulk Save: Submit all configurations together
5. Persist: Backend storage of configurations
6. Confirm: Success notification

#### Field Mapping Flow <a href="#b020705pz74z" id="b020705pz74z"></a>

1. Prepare: Load fields and documents
2. Parse: Extract VC fields from document schemas
3. Map: User creates field-to-document relationships
4. Transform: Optional JSON transformation rules
5. Validate: Ensure all required mappings
6. Save: Persist mapping configuration
7. Apply: Mappings available for form processing
