feat: build Next.js 16 frontend for Secure App#1
Conversation
Create core infrastructure, auth pages, dashboard layout, and admin pages Co-authored-by: SX1109 <109422266+SX110903@users.noreply.github.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR establishes a Next.js 16 frontend foundation for the Secure App, implementing authentication flows, dashboard layouts, and administrative interfaces with TypeScript and Tailwind CSS.
Changes:
- Implemented authentication system with JWT token management and role-based access control
- Built reusable UI components using Radix UI primitives and custom styling
- Created dashboard layout with sidebar navigation and protected route guards
Reviewed changes
Copilot reviewed 32 out of 34 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| types/auth.ts | Defines TypeScript interfaces for authentication, users, roles, and API responses |
| tsconfig.json | Configures TypeScript compiler options for Next.js 16 |
| tailwind.config.ts | Sets up Tailwind CSS theme with custom color system and design tokens |
| postcss.config.mjs | Configures PostCSS with Tailwind and Autoprefixer |
| package.json | Declares project dependencies including Next.js 16, React 19, and UI libraries |
| next.config.mjs | Disables ESLint and TypeScript checks during builds |
| lib/utils.ts | Provides utility functions for class merging, date formatting, and initials generation |
| lib/auth.tsx | Implements authentication context with login, registration, and token management |
| lib/api.ts | Handles API communication with token refresh and error handling |
| components/ui/* | Provides reusable UI components (buttons, cards, tables, inputs, etc.) |
| components/layout/* | Implements sidebar navigation and header components |
| app/page.tsx | Root page that redirects to login |
| app/layout.tsx | Root layout with font loading and authentication provider |
| app/globals.css | Defines CSS custom properties for light and dark themes |
| app/(dashboard)/* | Dashboard pages for user profile, admin panel, and user management |
| app/(auth)/* | Authentication pages for login, registration, and password reset |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| const nextConfig = { | ||
| eslint: { | ||
| ignoreDuringBuilds: true, | ||
| }, | ||
| typescript: { | ||
| ignoreBuildErrors: true, | ||
| }, | ||
| } |
There was a problem hiding this comment.
Disabling both ESLint and TypeScript error checking during builds bypasses important code quality safeguards and can allow bugs and type errors to reach production. Remove these configuration overrides and address the underlying issues instead.
| const nextConfig = { | |
| eslint: { | |
| ignoreDuringBuilds: true, | |
| }, | |
| typescript: { | |
| ignoreBuildErrors: true, | |
| }, | |
| } | |
| const nextConfig = {} |
| export function getInitials(name: string): string { | ||
| return name | ||
| .split(" ") | ||
| .map((n) => n[0]) | ||
| .join("") | ||
| .toUpperCase() | ||
| .slice(0, 2) | ||
| } |
There was a problem hiding this comment.
The function will throw an error if any name part is an empty string (e.g., "John Doe" with double space). Add a filter to remove empty strings before mapping: .split(" ").filter(n => n.length > 0).map((n) => n[0]).
| <tfoot | ||
| ref={ref} | ||
| className={cn( | ||
| "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", |
There was a problem hiding this comment.
Corrected CSS selector syntax from '[&>tr]:last:border-b-0' to '[&>tr]:last-child:border-b-0'.
| "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", | |
| "border-t bg-muted/50 font-medium [&>tr:last-child]:border-b-0", |
Clean up lockfile and remove conflicting Tailwind v4 PostCSS plugin Co-authored-by: SX1109 <109422266+SX110903@users.noreply.github.com>
This PR establishes the foundational frontend architecture for the Secure App, utilizing Next.js 16 to provide a robust and scalable user interface.
Problem/Issue/Goal:
Fix/Solution:
Chat link: https://v0.app/chat/G0fL0JaJ1cf