Next.js Supabase shadcn/ui PWA

1## Key Principles
2 
3- **Code Quality & Style**
4 
5  - Write concise, maintainable, and strongly typed code with accurate TypeScript implementations.
6  - Embrace functional, declarative programming. Avoid OOP and classes.
7  - Limit files to a maximum of 150 lines; refactor into smaller modules if exceeded.
8  - Prefer iteration and modularization over duplication.
9  - Use descriptive, semantic variable names with auxiliary verbs (e.g., `isLoading`, `hasError`).
10  - Use lowercase with dashes for directories and files (e.g., `components/auth-wizard`).
11  - Favor named exports for components.
12  - Adopt RORO (Receive an Object, Return an Object) for function parameters/returns.
13  - Always attain to use DRY (Don't Repeat Yourself) principles.
14  - Conduct regular code reviews and frequent refactoring sessions to ensure consistency and quality.
15  - Check and improve Web Vitals (LCP, CLS, FID) to maintain performance and user experience.
16 
17- **Create 'Build Notes':**
18 
19  - You must create a 'Build Notes' file for each task group to track the progress of the task group we work on.
20  - **Clarity & Brevity:** Keep notes concise, direct, and focused on the task at hand.
21  - **Logical Naming:** Use a consistent naming convention that ties each notes file to a specific task and date.
22  - **Incremental Updates:** Update notes as plans evolve or tasks are completed. Append rather than overwrite.
23  - **Traceability:** Ensure that each decision or change in approach is recorded and easy to follow.
24 
25- **Review 'Project Contexts':**
26 
27  - You must review the `projectContext.md` as we need to ensure that the project context is up to date and accurate.
28  - **Stability:** Treat context files as stable references, not daily scratchpads.
29  - **Selective Updates:** Update context files only when there are significant, approved changes to requirements or project scope.
30  - **Accessibility:** Make context files easily understandable and organized so future developers can quickly grasp the project’s core guidance.
31 
32- **Stack and Framework Conventions**
33 
34  - Target **Next.js 15+** and leverage the App Router, React Server Components (RSC), and SSR capabilities.
35  - Use Zustand for state management in client components when necessary.
36  - Maintain proper Shadcn UI management using `npx shadcn@latest add` for new components.
37  - Follow a mobile-first approach and responsive design patterns.
38  - Emphasize server-side logic, minimizing the usage of `use client` and other client-only APIs.
39  - Structure project as Progressive Web App (PWA) with offline capabilities, app-like experience, and installability across devices.
40 
41- **Monorepo & Tooling**
42 
43  - If using a monorepo structure, place shared code in a `packages/` directory and app-specific code in `app/`.
44  - Use `Taskfile.yml` commands for development, testing, and deployment tasks.
45  - Keep environment variables and sensitive data outside of code and access them through `.env` files or similar configuration.
46 
47Below is a structured guideline to provide to the AI development agent, incorporating key principles and detailed rules for maintaining the `/ProjectDocs/Build_Notes/` and `/ProjectDocs/contexts/` directories.
48 
49---
50 
51### Rules for Build Notes Files
52 
531. **Location & Naming:**
54 
55   - Store all notes files in `/ProjectDocs/Build_Notes/`.
56   - Use a logical, descriptive naming convention, e.g., `build-title_phase-#_task-group-name.md`.
57   - Use the `<build-title>` to describe the build task.
58   - Use the `<phase-#>` to apply the Phase # to the build task.
59   - Use the `<task-group-name>` to describe the task group name.
60   - Example: `supabase-schema-standardization_phase-1_preparation-and-code-analysis.md`
61     - `supabase-schema-standardization` is the build title
62     - `phase-1` is the phase number
63     - `preparation-and-code-analysis` is the task group name
64 
652. **Content Structure:**
66 
67   - Begin with a brief **Task Objective** that summarizes what you aim to achieve.
68   - Provide **Current State Assessment**: a short description of the current state of the project pertaining to the build tasks.
69   - Provide **Future State Goal**: a short description of the future state of the project pertaining to the build tasks.
70   - Follow with a **Implementation Plan**: a numbered list of **steps** containing checklist **tasks** to achieve the future state.
71   - Update the **Implementation Plan** as tasks are completed and line out not applicable tasks. NEVER DELETE TASKS FROM THE PLAN.
72   - If the plan changes or evolves, add new **steps** or **tasks**, rather than overwriting previous content.
73 
743. **When to Update:**
75 
76   - **At Task Start:** Create or open the task-specific notes file and record the initial plan before coding.
77   - **During Task Execution:** Add updates when plans change, difficulties arise, or new insights emerge.
78   - **At Task Completion:** Append a summary of what was done and verify it aligns with the original objective.
79 
804. **Style & Tone:**
81 
82   - Keep notes succinct, on-topic, and free of unrelated commentary.
83   - Maintain a logical sequence so that future readers can understand the decision-making process without confusion.
84 
855. **Completion of Build Notes:**
86 
87   - Once the build notes are complete, move the file to the `/ProjectDocs/Build_Notes/completed/` directory.
88   - If build notes are deprecated and no longer needed, move the file to the `/ProjectDocs/Build_Notes/archived/` directory.
89 
90---
91 
92### Rules for Context Files
93 
941. **Master Project Context (`projectContext.md`):**
95 
96   - Located in `/ProjectDocs/contexts/`.
97   - Provides the overarching project scope, requirements, and design principles.
98   - Only update this file if there are major changes to the project’s fundamental direction or scope.
99 
1002. **Additional Context Files:**
101 
102   - Supplementary files (e.g., `uiContext.md`, `featureAContext.md`) may be created for more detailed specifications on certain functionalities, designs, or areas of the application.
103   - Keep these files stable. Update them only when new, approved changes need to be documented.
104   - Reference these files frequently to ensure development aligns with established guidelines.
105 
1063. **Change Management:**
107 
108   - Record any changes to context files within the corresponding build notes file for that task.
109   - Maintain a clear rationale for context changes to preserve transparency and alignment with the core project goals.
110 
111---
112 
113## Project Structure
114 
115Adopt a clear, modular directory structure:
116 
117 
118