Test

PR Type

Enhancement, Other

---

Description

• Major application setup: Complete Next.js application with TypeScript, authentication, and multi-tenant architecture • Authentication system: NextAuth integration with Azure AD provider and route protection • Multi-application support: Separate layouts and configurations for KIR and Lucy applications • Comprehensive UI components: Reusable components including modals, accordions, toast notifications, form inputs, and navigation elements • State management: Zustand store for user configuration and toast context provider • Mock data and configuration: Extensive mock data for logs, applications, storefronts, and environments • Styling system: Global CSS with Tailwind, custom themes, and design tokens • Development tooling: Prettier, linting, Husky hooks, and folder structure documentation • Utility functions: Date helpers, mobile detection, debounce hooks, and responsive utilities

---

Diagram Walkthrough

flowchart LR
  Auth["Authentication System"] --> Layout["Application Layouts"]
  Layout --> KIR["KIR App"]
  Layout --> Lucy["Lucy App"]
  Components["UI Components"] --> KIR
  Components --> Lucy
  Store["State Management"] --> Components
  MockData["Mock Data"] --> KIR
  Config["Configuration"] --> Layout
  Utils["Utilities & Hooks"] --> Components

File Walkthrough

	Relevant files
Tests	1 files logsData.ts Add mock logs data for testing and development                      src/utils/data/logsData.ts • Creates mock log data with 14 sample log entries containing various error types and status codes • Includes fields like customStatusCode, exceptionType, exception, appName, stackTrace, createdBy, createdRefId, and createdTime • Provides diverse examples of application errors from different services (BillingService, OrderValidator, CatalogService, etc.) • Exports data as LogsResponse type with logs array and total count +161/-0
Configuration changes	19 files ui.ts Add comprehensive UI constants and labels                                src/utils/constants/ui.ts • Defines UI constants for applications (Lucy Portal, Kir Portal) with logos, titles, and descriptions • Creates comprehensive UI_CONSTANTS object with actions, loading states, error messages, success messages, confirmations • Includes constants for date range picker, dropdown options, search bar, and pagination • Adds LABELS object with configuration portal labels and selector-specific constants +130/-0  kirConfigurationData.ts Add KIR application configuration data structure                  src/utils/data/kirConfigurationData.ts • Creates configuration data array for KIR application with 9 configuration items • Each item includes id, label, icon component, and onClick handler • Covers various configuration areas like roles, privileges, return status, shipment methods, storefront details, mail settings, NetSuite settings, and UPS integration • Uses SVG React components for icons +63/-0    auth.ts Add authentication constants and branding information        src/utils/constants/auth.ts • Defines authentication-related text constants including page titles, company information, form labels and placeholders • Includes demo credentials, system status, feature descriptions, and testimonial data • Provides constants for Microsoft 365 integration and email sign-in options • Contains company branding information for AKG Group/Automotive Keys Holdings +55/-0    LogDetailsColumns.ts Add log details table column configuration                              src/app/kir/config/LogDetailsColumns.ts • Defines table column configuration for log details display • Creates 9 columns including ID, status code, exception type, message, app name, stack trace, created by, reference ID, and created time • Specifies column properties like width, sortability, and text alignment • Uses TextAlignment enum and Column interface for type safety +64/-0    applicationList.ts Add application list configuration data                                    src/utils/data/applicationList.ts • Defines application configuration data with 4 applications (KIR, Lucy, DKS, UHS) • Each application includes id, name, description, icon, status, and storefront code • Extends BaseItem interface with storefront_code property • Uses SVG React components for application icons +44/-0    app.ts Add application-wide enums and UI constants                            src/utils/enums/app.ts • Defines various enums for UI components including FeedbackType, ButtonVariants, ButtonTypes, ButtonColors, BadgeTypes, TextAlignment, ToolTipPosition • Adds width variants object for responsive design • Includes loader types configuration • Provides type-safe constants for component styling and behavior +54/-0    themes.ts Add theme configuration for UI components                                src/utils/themes.ts • Adds theme configurations for different UI components (app, environment, selector) • Defines SelectorTheme interface with color properties for primary, secondary, accent, selected states • Creates three theme objects with Tailwind CSS classes for consistent styling • Provides centralized theme management for component theming +31/-1    storefrontList.ts Add storefront configuration data structure                            src/utils/data/storefrontList.ts • Creates storefront configuration data with 2 storefront entries (Key Innovations, UHS Hardware) • Extends BaseItem with storefront-specific properties like storehash, faviconUrl, and phone • Includes configuration for different store environments • Uses SVG React components for storefront icons +30/-0    environmentSettings.ts Add environment settings configuration data                            src/utils/data/environmentSettings.ts • Defines environment configuration data with production and development environments • Extends BaseItem interface with iconColor and statusColor properties • Includes status information and color theming for different environments • Uses SVG React components for environment icons +29/-0    app.ts Add general application constants and configurations          src/utils/constants/app.ts • Defines weekdays array, page size options for pagination, and general app labels • Creates sidebar and dropdown position configuration constants • Includes dropdown options with label-value pairs for UI components • Provides centralized constants for common app functionality +28/-0    route-paths.ts Add centralized route path constants                                          src/utils/constants/route-paths.ts • Defines centralized route path constants for authentication, selector, dashboard, Lucy, and KIR sections • Organizes routes by application area with nested structure • Provides type-safe route management across the application • Includes paths for sign-in, application selection, storefront selection, and feature-specific routes +19/-0    next-env.d.ts Add Next.js TypeScript environment definitions                      next-env.d.ts • Adds Next.js TypeScript reference types • Includes references for Next.js core types and image types • Provides TypeScript support for Next.js specific features • Contains standard Next.js TypeScript configuration +6/-2      svg.d.ts Add SVG React component type declarations                                src/types/svg.d.ts • Declares module type for SVG files imported with ?react suffix • Enables TypeScript support for SVG React components • Provides type safety for SVG imports throughout the application • Allows SVG files to be used as React functional components +5/-0      next.config.js Add Next.js configuration with SVG support                              next.config.js • Configures Next.js with React strict mode enabled • Sets up SVG handling for both Turbopack and Webpack with SVGR loader • Enables SVG files to be imported as React components • Provides build configuration for development and production environments +31/-1    postcss.config.js Add PostCSS configuration for Tailwind CSS                              postcss.config.js • Configures PostCSS with Tailwind CSS plugin • Enables Tailwind CSS processing for the application • Provides build-time CSS processing configuration • Sets up modern CSS toolchain integration +6/-2      package.json Initialize Next.js project with dependencies and tooling  package.json • Initializes Next.js project with TypeScript and React 19 • Configures development scripts with Turbo and linting setup • Adds dependencies for authentication, theming, and state management • Sets up Husky and lint-staged for code quality enforcement +50/-2    tsconfig.json Configure TypeScript with path aliases and strict settings tsconfig.json • Configures TypeScript compiler options for Next.js project • Sets up path aliases for organized imports (@/, @/components/, etc.) • Enables strict type checking and modern ES features • Includes SVG type definitions and Next.js plugin configuration +36/-2    .env Add Azure AD and NextAuth environment configuration            .env • Adds Azure AD configuration for authentication integration • Sets up NextAuth secret and URL for session management • Includes client credentials and tenant ID for OAuth flow • Configures Azure AD secret ID for additional security +8/-1      .prettierrc Add Prettier configuration for code formatting                      .prettierrc • Configures Prettier code formatting rules • Sets tab width to 4 spaces and enables semicolons • Defines print width of 100 characters and ES5 trailing commas • Configures automatic line ending handling +9/-2
Enhancement	35 files userConfigStore.ts Add user configuration state management store                        src/store/userConfigStore.ts • Creates Zustand store for managing user application configuration state • Manages application, environment, and storefront selections with setters and getters • Includes methods for resetting selections and retrieving selected items by ID • Provides type-safe interface for configuration management across the application +39/-0    route.ts Add NextAuth authentication API configuration                        src/app/api/auth/[...nextauth]/route.ts • Implements NextAuth configuration with Azure AD provider • Sets up JWT session strategy with 24-hour max age and 15-minute update age • Includes sign-in callback with user logging • Exports GET and POST handlers for authentication endpoints +26/-0    date-utils.ts Add date utility helper functions                                                src/utils/helpers/date-utils.ts • Implements calendar matrix generation function for date picker components • Adds date range formatting utility function • Uses date-fns library for date manipulation and formatting • Provides helper functions for calendar and date range functionality +21/-0    useIsMobile.ts Add mobile detection custom hook                                                  src/utils/hooks/useIsMobile.ts • Creates custom React hook for detecting mobile screen size (≤768px) • Implements window resize listener for responsive behavior • Returns boolean indicating mobile state • Includes cleanup for event listener on component unmount +20/-1    useDebounce.ts Add debounce custom hook for input optimization                    src/utils/hooks/useDebounce.ts • Implements custom React hook for debouncing string values • Uses setTimeout to delay value updates by specified delay • Includes cleanup to prevent memory leaks • Provides performance optimization for search and input components +17/-1    LoggerResponse.ts Add logger response type definitions                                          src/models/response/LoggerResponse.ts • Defines TypeScript interfaces for logger response data structure • Creates LogsResponse interface with logs array and total count • Defines LogDetails interface with optional properties for log entries • Provides type safety for log data throughout the application +18/-0    BaseItem.ts Add base item interface for selectable components                src/types/BaseItem.ts • Defines base interface for selectable items with id, name, description, icon, and status properties • Uses React component type for SVG icons • Provides foundation interface for configuration items across the application • Enables consistent structure for dropdown and selector components +7/-0      OffCanvas.tsx Add configurable OffCanvas sliding panel component              src/components/shared/OffCanvas.tsx • Creates a new reusable OffCanvas component with configurable position, size, and behavior • Implements sliding panel functionality with backdrop overlay and close button • Supports four positions (left, right, top, bottom) with responsive default sizing • Includes customizable trigger button and accessibility features +114/-0  Sidebar.tsx Add collapsible sidebar navigation component                          src/components/common/Sidebar.tsx • Creates a collapsible sidebar component with expand/collapse functionality • Implements header section with logo, title, and description display • Integrates with SidebarMenu component for navigation items • Supports configurable positioning (left/right) and width settings +111/-0  page.tsx Add logs management page with filtering and pagination      src/app/kir/logs/page.tsx • Creates logs page with statistics cards, filtering, and data table • Implements search, date range, role, and status filtering functionality • Integrates pagination component for table navigation • Uses debounced search and configurable page size options +94/-0    WelcomeSection.tsx Add branded welcome section for authentication                      src/app/(auth)/signin/WelcomeSection.tsx • Creates welcome section component for authentication pages • Displays company branding with logo, name, and description • Shows feature highlights with icons for security, admin, and analytics • Implements responsive design with gradient styling +65/-0    Accordion.tsx Add customizable accordion component with animations          src/components/shared/Accordion.tsx • Creates customizable accordion component with expand/collapse functionality • Supports multiple sections with individual expand states • Implements smooth animations and configurable styling options • Includes callback for tracking expanded sections +88/-0    Toast.tsx Add toast notification component with auto-dismiss              src/components/shared/Toast.tsx • Creates toast notification component with multiple feedback types • Implements auto-dismiss functionality with configurable duration • Supports success, error, warning, and info message types • Includes close button and smooth transition animations +85/-0    layout.tsx Add Lucy application layout with sidebar navigation            src/app/lucy/layout.tsx • Creates layout component for Lucy application with sidebar navigation • Defines sidebar configuration with various menu items and icons • Implements click handlers for navigation items • Sets up responsive layout structure with collapsible sidebar +89/-0    SelectInput.tsx Add floating label select input component                                src/components/shared/SelectInput.tsx • Creates floating label select input component with validation • Implements focus/blur state management for label animations • Supports error display and disabled states • Includes customizable styling and required field validation +85/-0    TextInput.tsx Add floating label text input component                                    src/components/shared/TextInput.tsx • Creates floating label text input component with validation • Implements focus/blur state management for smooth label transitions • Supports error display, disabled states, and required validation • Includes customizable input types and placeholder functionality +74/-0    Button.tsx Add reusable button component with multiple variants          src/components/shared/Button.tsx • Creates reusable button component with multiple variants and states • Supports filled, outline, and default styling variants • Implements loading, disabled, and selection states • Includes icon support and customizable dimensions +67/-0    StatCard.tsx Add statistics card component with responsive layout          src/components/common/StatCard.tsx • Creates statistics card component for displaying metrics • Implements responsive grid layout with configurable columns • Supports colored borders and icons for different data types • Includes predefined color schemes for various metric categories +67/-0    ToastProvider.tsx Add toast context provider for global notifications            src/utils/context/ToastProvider.tsx • Creates toast context provider for global notification management • Implements toast queue with maximum limit and auto-removal • Provides useToast hook for easy toast triggering • Supports configurable duration and positioning +71/-0    Modal.tsx Add modal dialog component with actions                                    src/components/shared/Modal.tsx • Creates modal dialog component with backdrop and close functionality • Implements submit and cancel actions with customizable labels • Supports scrollable content area with maximum height constraint • Includes close button and backdrop click handling +61/-0    SearchBar.tsx Add debounced search bar component                                              src/components/shared/SearchBar.tsx • Creates search input component with debounced functionality • Implements Enter key handling and configurable delay • Supports disabled state and customizable placeholder text • Includes responsive width and focus styling +64/-0    Navbar.tsx Add navigation header with user session management              src/components/common/Navbar.tsx • Creates navigation header with user session display • Implements sign-out functionality with redirect handling • Shows user avatar and name from session data • Includes gradient styling and responsive layout +49/-0    Tabs.tsx Add tab navigation component with content switching            src/components/shared/Tabs.tsx • Creates tab navigation component with content switching • Implements active tab state management and selection handling • Supports dynamic tab content rendering • Includes responsive styling and overflow handling +51/-0    layout.tsx Add selector layout with dynamic titles and greeting          src/app/selector/layout.tsx • Creates layout for application selector with dynamic titles • Implements route-based title updates using pathname • Displays personalized greeting with user session data • Provides centered layout structure for selector pages +35/-0    SidebarMenu.tsx Add sidebar menu item component with states                            src/components/common/SidebarMenu.tsx • Creates sidebar menu item component with active state styling • Implements hover effects and icon support • Supports collapsed state with icon-only display • Includes click handling and visual feedback +41/-0    AuthGuard.tsx Add authentication guard with route protection                      src/app/(auth)/AuthGuard.tsx • Creates authentication guard component for route protection • Implements automatic redirects based on session state • Defines public routes that don't require authentication • Shows loading state during session verification +38/-0    InfoCard.tsx Add information card component with customizable styling  src/app/selector/application/InfoCard.tsx • Creates information card component with icon and content • Supports customizable icon colors and background styling • Implements responsive layout with icon and text sections • Includes flexible styling options for different use cases +35/-0    layout.tsx Add root layout with session and toast providers                  src/app/layout.tsx • Creates root layout with session provider and authentication • Implements conditional navbar display based on route • Sets up toast provider for global notifications • Configures responsive height management and styling +35/-0    CheckBox.tsx Add checkbox component with label and styling                        src/components/shared/CheckBox.tsx • Creates checkbox input component with label support • Implements controlled state management with change handling • Supports customizable styling and accessibility features • Includes proper label association for screen readers +41/-0    layout.tsx Add KIR application layout with sidebar navigation              src/app/kir/layout.tsx • Creates layout for KIR application with sidebar navigation • Integrates with KIR configuration data for menu items • Implements click handling for navigation interactions • Sets up responsive layout with collapsible sidebar +27/-0    Badge.tsx Add badge component with color theming                                      src/components/shared/Badge.tsx • Creates badge component for status and category display • Implements color theming for different badge types • Supports success, error, information, and warning variants • Includes pill styling with centered text alignment +27/-0    page.tsx Add sign-in page with welcome section layout                          src/app/(auth)/signin/page.tsx • Creates sign-in page layout with welcome section and form • Implements responsive design with gradient background • Combines WelcomeSection and SignIn components • Sets up authentication page structure +15/-0    page.tsx Add KIR root page with logs component                                        src/app/kir/page.tsx • Creates KIR root page that renders logs component • Imports and passes logs data to the Logs component • Sets up basic page structure with centered layout • Serves as entry point for KIR application +12/-0    page.tsx Add home page with playground component                                    src/app/page.tsx • Creates home page that renders Playground component • Sets up basic page structure with main element • Serves as application entry point • Imports and displays development playground +9/-0      page.tsx Add Lucy application root page                                                      src/app/lucy/page.tsx • Creates Lucy application root page with welcome message • Implements basic page structure for Lucy app • Serves as entry point for Lucy application features • Provides placeholder content for future development +5/-0
Formatting	1 files globals.css Add global CSS styles and design system                                    src/app/globals.css • Imports Tailwind CSS and defines comprehensive CSS custom properties for color palette • Includes primary, secondary, tertiary, success, warning, and error color schemes • Defines responsive font size utilities for different screen sizes • Adds custom animations for loading components, gradient utilities, and scrollbar styling +546/-0
Documentation	1 files folder-structure.sh Add application folder structure documentation                      folder-structure.sh • Documents the application folder structure with detailed organization • Shows separation between client and server code organization • Includes examples for authentication, application-specific layouts, and API structure • Provides guidance for code organization and architectural patterns +69/-1

---