Skip to content

feat:Build reset password page#998

Merged
yusuftomilola merged 2 commits into
DistinctCodes:mainfrom
SheyeJDev:feat/Build-reset-password-page
Jun 26, 2026
Merged

feat:Build reset password page#998
yusuftomilola merged 2 commits into
DistinctCodes:mainfrom
SheyeJDev:feat/Build-reset-password-page

Conversation

@SheyeJDev

Copy link
Copy Markdown
Contributor

PR Title

feat(frontend): implement 2FA login flow, password reset page, asset transfer modal, and asset edit functionality

PR Description
Summary

This PR completes four unfinished frontend workflows across authentication and asset management:

Added a complete Two-Factor Authentication (2FA) login flow.
Added the Reset Password page and token-based password reset process.
Connected the Transfer Asset action to a fully functional modal workflow.
Connected the Edit Asset action to a reusable asset edit modal with pre-filled data.

These changes improve authentication security, complete the password recovery experience, and enable full asset lifecycle management directly from the asset detail page.

Changes Included

  1. Two-Factor Authentication Login Flow

Implemented support for backend responses that require TOTP verification before issuing JWT tokens.

Features
Detects requiresTwoFactor: true during login.
Stores temporary authentication token.
Introduces a second-step verification UI.
Allows users to return to the email/password form.
Completes login using /auth/2fa/authenticate.
Displays validation and error states.
Prevents page navigation between authentication steps.
Files
frontend/store/auth.store.ts
frontend/app/(auth)/login/page.tsx
frontend/lib/auth-api.ts
2. Password Reset Page

Implemented a dedicated reset password page that consumes reset tokens from the URL.

Features
Reads token using useSearchParams().
Handles missing or invalid tokens.
Zod validation for:
New password
Confirm password
Calls /auth/reset-password.
Success state with redirect to login.
Error handling for expired/invalid tokens.
Files
frontend/app/(auth)/reset-password/page.tsx
frontend/lib/query/mutations/auth.ts
frontend/lib/auth-api.ts
3. Asset Transfer Workflow

Connected the Transfer button to a fully functional transfer modal.

Features
Searchable user selector.
Department selector.
Optional transfer notes.
Validation requiring a destination user or department.
Displays current assignment details.
Executes asset transfer mutation.
Invalidates asset queries after success.
Success/error toast notifications.
Files
frontend/components/assets/transfer-asset-modal.tsx
frontend/app/(dashboard)/assets/[id]/page.tsx
frontend/lib/query/hooks/useAsset.ts
4. Asset Editing Workflow

Connected the Edit button to an edit asset modal.

Features
Pre-filled asset data.
Reuses create asset form logic.
Calls update asset mutation.
Displays inline errors.
Invalidates asset detail query after updates.
Success notifications.
Modal title includes asset name.
Files
frontend/components/assets/edit-asset-modal.tsx
frontend/components/assets/create-asset-modal.tsx
frontend/app/(dashboard)/assets/[id]/page.tsx
frontend/lib/query/hooks/useAsset.ts
Folder Structure
frontend/

├── app/
│ ├── (auth)/
│ │ ├── login/
│ │ │ └── page.tsx
│ │ │
│ │ ├── forgot-password/
│ │ │ └── page.tsx
│ │ │
│ │ └── reset-password/
│ │ └── page.tsx
│ │
│ └── (dashboard)/
│ └── assets/
│ └── [id]/
│ └── page.tsx

├── components/
│ └── assets/
│ ├── create-asset-modal.tsx
│ ├── edit-asset-modal.tsx
│ └── transfer-asset-modal.tsx

├── lib/
│ ├── auth-api.ts
│ │
│ └── query/
│ ├── hooks/
│ │ └── useAsset.ts
│ │
│ └── mutations/
│ └── auth.ts

└── store/
└── auth.store.ts
Acceptance Criteria Checklist
FE-2FA Login
Detect requiresTwoFactor
Store temporary token
Show OTP step
Back button supported
Call /auth/2fa/authenticate
Handle invalid codes
Single-page experience
FE-Reset Password
Reset password page created
Token validation
Zod form validation
Password reset API integration
Success redirect
Expired token handling
FE-Transfer Asset
Transfer modal created
User selector
Department selector
Validation rules
Transfer mutation integration
Query invalidation
Toast feedback
FE-Edit Asset
Edit modal created
Existing values pre-filled
Update mutation integration
Query invalidation
Success/error handling
Asset-specific modal title
Impact

This PR completes several critical user workflows that were previously blocked by missing frontend implementations, bringing authentication and asset management features to production-ready status.

Closes #941
Closes #943
Closes #945
Closes #939

@vercel

vercel Bot commented Jun 25, 2026

Copy link
Copy Markdown

@renoschubert is attempting to deploy a commit to the naijabuz's projects Team on Vercel.

A member of the Team first needs to authorize it.

@drips-wave

drips-wave Bot commented Jun 25, 2026

Copy link
Copy Markdown

@SheyeJDev Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@yusuftomilola yusuftomilola merged commit bb67318 into DistinctCodes:main Jun 26, 2026
6 of 8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment