Skip to content

workflow.md

Latest commit

 

History

History
48 lines (33 loc) · 1.76 KB

workflow.md

File metadata and controls

48 lines (33 loc) · 1.76 KB
Raw

Workflow for Issue #202: Add mobile vault lock detail screen design

This document outlines the steps to resolve issue #202.

1. Understand the Existing Vault Feature

  • Review the existing code related to the vault feature to understand its current implementation.
  • Affected files:
    • app/(tabs)/vault.tsx
    • src/components/VaultLockList.tsx
    • src/store/vaultStore.ts
    • src/features/vault/

2. Create Mock Data for Vault Locks

  • Create a new mock data file for vault locks to be used for UI development, as per the issue's suggestion.
  • This will likely be in tests/fixtures/.

3. Create the Vault Lock Detail Screen

  • Create a new screen file for the vault lock detail view. A suitable location would be app/vault/[id].tsx to follow the existing routing patterns.
  • This screen will fetch the lock details based on the ID from the route.

4. Develop the UI Component for Lock Details

  • Create a reusable React component VaultLockDetail.tsx in src/components/.
  • This component will display:
    • Amount
    • Created Date
    • Unlock Date
    • Status
    • Withdrawal Eligibility
    • Related Actions (e.g., a "Withdraw" button)
  • The design should be consistent with the existing application's theme and components.

5. Integrate Navigation

  • Update the VaultLockList.tsx component to navigate to the new detail screen when a lock item is pressed.
  • Pass the lock ID as a parameter during navigation.

6. Handle Edge Cases

  • Ensure the detail screen gracefully handles cases where lock data is missing or unavailable. This might involve showing a loading state or an error message.

7. Final Review

  • Review the implementation against the acceptance criteria in the issue.
  • Ensure the new screen is well-designed and the code follows project conventions.