Skip to content

FRONTEND: Implement Middleware for Route Protection in Next.js #313

Description

@yusuftomilola

Description:
We need to add a middleware to protect authenticated routes in the AssetsUp frontend. The middleware should check if a user is authenticated before granting access to restricted routes (e.g., /dashboard, /assets, /departments). If the user is not authenticated, they should be redirected to the /login page.

This will ensure that unauthorized users cannot directly access protected pages via URL.


Tasks:

  • Create a middleware.ts file in the project root.
  • Configure the middleware to run only on specific protected routes (/dashboard, /assets, /departments, etc.).
  • Implement logic to check authentication tokens (from cookies, headers, or local storage).
  • Redirect unauthenticated users to /login.
  • Allow public routes (e.g., /, /login, /register) to bypass the middleware.
  • Add TypeScript typings for request/response handling.
  • Write documentation (docs/auth-middleware.md) explaining how the middleware works and how to extend it for new protected routes.

Acceptance Criteria:

  • Visiting /dashboard while not logged in redirects to /login.
  • Visiting /assets while authenticated loads successfully.
  • Public routes (/, /login, /register) remain accessible to everyone.
  • Middleware logic is reusable and easy to extend for future routes.

Metadata

Metadata

Labels

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions