{"id":28171110,"url":"https://github.com/bertovdev/kyctakehome","last_synced_at":"2025-05-15T18:16:35.814Z","repository":{"id":293195090,"uuid":"980715068","full_name":"BertovDev/KYCtakehome","owner":"BertovDev","description":null,"archived":false,"fork":false,"pushed_at":"2025-05-14T05:43:41.000Z","size":14581,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-14T06:49:05.122Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://ky-ctakehome.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/BertovDev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-09T15:32:50.000Z","updated_at":"2025-05-14T05:43:45.000Z","dependencies_parsed_at":"2025-05-14T06:59:11.437Z","dependency_job_id":null,"html_url":"https://github.com/BertovDev/KYCtakehome","commit_stats":null,"previous_names":["bertovdev/kyctakehome"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BertovDev%2FKYCtakehome","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BertovDev%2FKYCtakehome/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BertovDev%2FKYCtakehome/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BertovDev%2FKYCtakehome/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BertovDev","download_url":"https://codeload.github.com/BertovDev/KYCtakehome/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254394705,"owners_count":22063985,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-05-15T18:15:59.650Z","updated_at":"2025-05-15T18:16:35.801Z","avatar_url":"https://github.com/BertovDev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Multi-Step Signup Form\n\n### Install dependencies\n`npm install` \n\n### Start the application\n`npm run dev`\n\nThis application implements a multi-step signup process using the **Next.js App Router**, where each step is a separate route with its own form. The steps are sequential and state is preserved across them using context and `localStorage`.\n\n---\n\n### Routes Overview\n\n| Route                 | Description                                                   |\n| --------------------- | ------------------------------------------------------------- |\n| `/signup/`            | **Step 0:** Account creation (email \u0026 password)               |\n| `/signup/step-1`      | **Step 1:** Personal Information (name, address, etc.)        |\n| `/signup/step-2`      | **Step 2:** File Upload (ID and profile photo)                |\n| `/signup/step-3`      | **Step 3:** Review \u0026 confirmation                             |\n| `/signup/wallet-init` | **Final Step:** Confirmation and wallet initialization (mock) |\n\n---\n\n### How It Works\n\n- Each step is implemented on a **separate URL**, improving modularity and maintainability.\n- **Progressive Data Collection:**  \n   Data from each step is passed to the next using a centralized context (`SignupStepContext.tsx`).\n- **Access Control:**  \n   A user **cannot access a step** unless the previous step has been completed and its data is available.\n- **Persistence with localStorage:**  \n   All form data is saved to `localStorage` after each step, allowing users to resume the signup process in case of accidental reloads or navigation away from the page.\n\n---\n\n### `SignupStepContext.tsx`\n\nThis React context manages state across the signup flow and handles persistence:\n\n#### Provided Values:\n\n`{   data,         // Collected form data from all previous steps   \nsetData,      // Function to append new step data   \nisHydrated    // Boolean flag indicating if localStorage has been restored }`\n\n#### Responsibilities:\n\n- **State Sharing:** Shares form state across routes (`/signup/step-1` → `/signup/step-2`, etc.).\n- **Persistence:** Automatically saves and restores data from `localStorage`.\n- **Hydration Awareness:** Uses `isHydrated` to delay rendering until client-side state is available, avoiding hydration mismatch or blank form issues.\n\n---\n\n### Flow Summary\n\n1. User starts at `/signup/` and submits email \u0026 password.\n2. Redirected to `/signup/step-1` to provide personal info.\n3. Continues to `/signup/step-2` to upload ID and photo.\n4. Proceeds to `/signup/step-3` to review and confirm details.\n5. Final step `/signup/wallet-init` performs confirmation and mock wallet setup.\n6. At each step:\n\n   - Data is stored in `SignupStepContext` and persisted to `localStorage`.\n   - Navigation to the next step is allowed only if prior steps are completed.\n\n## Upload from Mobile Session\n\nThis flow enables a user to upload a file from a mobile device using a QR code-generated session. The upload is temporary and can later be retrieved from the desktop session.\n\n---\n\n### Session Handling\n\n#### `GET /api/session/status`\n\n**Description:**  \nCheck if a given `sessionId` is still active.\n\n**Query Parameters:**\n`sessionId: string\n`\n**Response:**\n`boolean // true if the session is active, false otherwise`\n\n---\n\n### Upload Endpoint\n\n#### `POST /api/upload`\n\n**Description:**  \nReceives a file upload via `FormData` from the mobile session and stores it temporarily.\n\n**Request Body:**\n\n- `FormData` with file(s)\n- Must include a valid `sessionId`\n\n**Behavior:**\n\n- Saves the uploaded file(s) associated with the given `sessionId`\n- Marks the session as inactive (disabling further uploads)\n\n---\n\n#### `GET /api/upload`\n\n**Description:**  \nFetch the uploaded file(s) associated with a session.\n\n**Query Parameters:**\n`sessionId: string`\n\n**Response (Mocked for Testing):**\n`{ name: string;   url: string;   size: number;   type: string; }`\n\n---\n\n### Frontend Behavior\n\n#### `ConnectMobileComponent.tsx` (Desktop)\n\n1. **On Mount:**\n   - Generates a new `sessionId` and embeds it into a QR code along with the current URL.\n2. **Starts Polling:**\n   - Calls `/api/session/status?sessionId=...` every 2 seconds to check if the mobile has uploaded a file.\n3. **When Session Becomes Inactive:**\n   - Fetches the uploaded file(s) using `GET /api/upload?sessionId=...`\n   - Appends the files to the main form data\n\n---\n\n#### Mobile Upload Page\n\n**Path:**\n`/signup/upload/[sessionId]`\n\n**Behavior:**\n\n- Reads the `sessionId` from the URL\n- Uploads the file using `POST /api/upload`\n- Once the file is uploaded, the session is deactivated to prevent multiple uploads\n\n---\n\n### Flow Summary\n\n1. Desktop user opens a page with `ConnectMobileComponent.tsx`\n2. A QR code is shown, containing a new `sessionId` and upload URL\n3. Mobile user scans the QR code and navigates to `/signup/upload/[sessionId]`\n4. Mobile user uploads a file\n5. The session is marked as inactive after upload\n6. Desktop client detects the change and fetches the uploaded file\n\n### Schema Validation\n\nThe App use zod for schema creation and validation. Each step of the form has ir own schema and validation process.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbertovdev%2Fkyctakehome","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbertovdev%2Fkyctakehome","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbertovdev%2Fkyctakehome/lists"}