Open kkatusic opened 5 days ago
The latest updates on your projects. Learn more about Vercel for Git ↗︎
Name | Status | Preview | Comments | Updated (UTC) |
---|---|---|---|---|
giveth-dapps-v2 | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 26, 2024 0:32am |
The changes introduce new labels in multiple languages for indicating missing section information, update dependencies in package.json
, and refine the verification page functionality. Enhancements include the ability to navigate through verification steps without mandatory completion, visual feedback for incomplete steps, and new logic for updating and checking verification states.
Files | Change Summary |
---|---|
lang/ca.json, lang/en.json, lang/es.json | Added a new label "label.some_section_missing" with translations for missing section information. |
package.json | Updated the @giveth/ui-design-system dependency version from 1.11.28 to 1.11.33 . |
src/apollo/types/types.ts | Added IPersonalInfo interface and updated IProjectVerification . Extended EVerificationSteps . |
src/components/views/verification/*.tsx | Enhanced the verification components with new states, checks, and conditional renderings. |
src/components/views/verification/menu/*.tsx | Refined menu components with verification step checks and new properties for interactivity. |
src/context/verification.context.tsx | Integrated helpers and menu list for determining incomplete steps in the verification process. |
src/helpers/projects.ts | Introduced functions for checking verification steps and finding the first incomplete step. |
sequenceDiagram
actor User
participant UI as User Interface
participant VF as Verification Functions
participant DB as Database
User ->> UI: Navigate to Verification Page
UI ->> VF: Fetch Verification Data
VF ->> DB: Get User Verification Status
DB -->> VF: Verification Data
VF -->> UI: Update Verification State
UI ->> User: Render Verification Steps
User ->> UI: Move to Next Step
UI ->> VF: Check Step Completion
VF -->> UI: Step Status
UI ->> User: Indicate Incomplete Steps
User ->> UI: Finish Verification
UI ->> VF: Validate All Steps
VF ->> DB: Update Verification Status
DB -->> VF: Status Updated
VF -->> UI: Confirmation
UI ->> User: Display Completion Status
Objective | Addressed | Explanation |
---|---|---|
Allow user to click next to see other pages of the verification page (#1982) | ✅ | |
Introduce new status for verification tabs showing "Has issue" for missing information (#1982) | ✅ | |
Last tab "Finish" button changes if issues remain (#1982) | ✅ | |
Update to match new UI designs (#1982) | ✅ |
In code we trust, enhancements gleam,\ Sections checked like a river's stream,\ From Catalan to English, and Spanish too,\ Labels for missing, a clearer view.\ Verification steps, a guided way,\ Ensures all fields in perfect array.
src/components/views/verification/menu/DesktopMenu.tsx
[error] 38-38: Missing key property for this element in iterable. (lint/correctness/useJsxKeyInIterable) The order of the items may change, and having a key can help React identify which item was moved. Check the React documentation. --- [error] 40-40: Missing key property for this element in iterable. (lint/correctness/useJsxKeyInIterable) The order of the items may change, and having a key can help React identify which item was moved. Check the React documentation.src/helpers/projects.ts
[error] 75-76: Change to an optional chain. (lint/complexity/useOptionalChain) Unsafe fix: Change to an optional chain.src/components/views/verification/PersonalInfo.tsx
[error] 84-91: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse) Unsafe fix: Omit the else clause. --- [error] 89-91: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
src/components/views/verification/WarningCircle.tsx (1)
`8-25`: **Well-structured new component `WarningCircle`.** The `WarningCircle` component is well-implemented with a clear and concise structure, using styled components effectively. The use of the `IconWarning16` from the `@giveth/ui-design-system` ensures consistency in iconography across the application.src/components/views/verification/menu/menuList.ts (1)
`4-21`: **Enhanced navigation with structured menu items.** The update to `menuList` introduces a clear structure for navigation items, using labels and slugs from the `EVerificationSteps` enum. This approach enhances maintainability and ensures that navigation elements are consistent and type-safe.src/components/views/verification/menu/MobileMenu.tsx (1)
`25-25`: **Correct use of internationalization for menu labels.** By accessing the `label` property from `menuList`, the application ensures that menu labels are correctly localized, enhancing the user experience on mobile devices.src/context/verification.context.tsx (2)
`17-18`: **Imported functions and data to support step navigation.** The imports of `findFirstIncompleteStep` and `menuList` are essential for the logic that determines the next step in the verification process based on the completion status. This aligns with the PR objectives to allow navigation through verification steps without completion. --- `64-81`: **Logic to determine the next step based on verification status.** The logic here effectively checks for incomplete steps and sets the current step accordingly. It handles various scenarios: - If the email is not confirmed, it sets the step to 1. - If there are incomplete steps, it navigates to the first incomplete step. - If all steps are completed but the project is still a draft, it sets the step to 7. This logic supports the new feature of navigating through verification steps without needing to complete each one, which is beneficial for demonstrations as mentioned in the PR objectives.src/helpers/projects.ts (2)
`90-104`: **Implementation of `checkAllVerificationsSteps` function.** This function iterates over the `menuList` to check the completion status of each step, skipping certain steps as specified. It returns `true` if all steps are completed. This function is crucial for the feature that allows users to navigate through the verification steps without completing them, as it checks the overall completion status. The implementation is concise and aligns with the PR objectives. --- `113-130`: **Finding the first incomplete verification step.** The `findFirstIncompleteStep` function loops through the `menuList` to find the first step that is not complete. This is essential for directing the user back to the first incomplete step, which is a key part of the new navigation feature in the verification process. The function is implemented correctly and efficiently.src/apollo/types/types.ts (2)
Line range hint `381-406`: **New interfaces and updates to existing interfaces to support verification process.** The introduction of the `IPersonalInfo` interface and the update to the `IProjectVerification` interface with the `personalInfo` field are crucial for handling personal information in the verification process. These changes are well-designed to support the new features described in the PR objectives. The structure of these interfaces aligns with the needs of the verification process, ensuring that all necessary data is correctly handled. --- `427-429`: **Updated `EVerificationSteps` enum with new steps.** The addition of new steps such as `BEFORE_START` and `SOCIAL_PROFILES` to the `EVerificationSteps` enum is essential for the expanded verification process. These new steps provide clear navigational points within the verification process, supporting the PR's objective to allow easier navigation for demonstrations. The updates are appropriate and enhance the clarity of the verification process.lang/ca.json (1)
`838-838`: **New label addition approved.** The addition of `"label.some_section_missing": "Algunes seccions no tenen informació."` correctly implements the required changes for indicating missing sections in the user interface. This aligns with the objectives outlined in the PR.
Resolve #1982
@RamRamez before we can test this I need to submit also PR to the backend and you need check that, thx
Summary by CodeRabbit
New Features
ca
,en
, andes
languages.WarningCircle
component to display warning icons in the user interface.TermsAndConditions
,DesktopMenu
,MenuModal
, andMobileMenu
.Bug Fixes
PersonalInfo
component to ensure the verification step proceeds correctly.Dependencies
@giveth/ui-design-system
dependency to version1.11.33
.Refactor
menuList
to include specific slugs from theEVerificationSteps
enum.Chores