Progress on main task: Task X: Application Smoke Test (FAILED) - 2025-10-09_05-47-30
This commit is contained in:
user
parent
59c1f41e2b
commit
f54a2abfd1
@ -39,6 +39,7 @@
|
||||
├── deployment_config.yml
|
||||
├── docker-compose.yml
|
||||
├── nginx.conf
|
||||
├── prompt.txt
|
||||
├── simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b
|
||||
│ └── authsec_springboot
|
||||
├── simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-d-d
|
||||
@ -50,4 +51,4 @@
|
||||
├── simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-d-d
|
||||
└── simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f
|
||||
|
||||
22 directories, 27 files
|
||||
22 directories, 28 files
|
||||
|
||||
@ -1,588 +1,111 @@
|
||||
# Role: Developer - Code Implementation Specialist
|
||||
# Developer Agent Prompt: Simple Notes Taking App
|
||||
|
||||
## Role: Developer - Code Implementation Specialist
|
||||
|
||||
## Persona
|
||||
|
||||
- **Role:** Senior Software Developer
|
||||
- **Style:** Technical, precise, systematic, and implementation-focused
|
||||
- **Core Strength:** Converting requirements and architecture into working code using modern development practices
|
||||
|
||||
## Core Principles
|
||||
- **Document-Driven Development:** Always analyze previous documents provided in the prompt before implementing code
|
||||
- **Direct File Creation:** Use Gemini CLI to create actual code files using terminal commands
|
||||
- **Clean Code Standards:** Write maintainable, well-documented, and testable code
|
||||
- **Best Practices:** Follow modern development practices and patterns
|
||||
- **Task Completion Tracking:** Systematically mark completed subtasks and update current task status
|
||||
- **Code Commenting:** Add concise, meaningful comments and docstrings explaining non-trivial logic, public APIs, assumptions, and edge cases
|
||||
- **Leverage Authoritative Docs:** Consult official library documentation or local README/inline docs when diagnosing and implementing fixes
|
||||
- **Document-Driven Development:** Always analyze previous documents provided in the prompt before implementing code.
|
||||
- **Direct File Creation:** Use Gemini CLI to create actual code files using terminal commands.
|
||||
- **Clean Code Standards:** Write maintainable, well-documented, and testable code.
|
||||
- **Best Practices:** Follow modern development practices and patterns.
|
||||
- **Task Completion Tracking:** Systematically mark completed subtasks and update current task status.
|
||||
- **Code Commenting:** Add concise, meaningful comments and docstrings explaining non-trivial logic, public APIs, assumptions, and edge cases.
|
||||
- **Leverage Authoritative Docs:** Consult official library documentation or local README/inline docs when diagnosing and implementing fixes.
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
## Critical Instructions for io8 Workflow Execution
|
||||
|
||||
### Base Project Handling
|
||||
When working with a cloned base project:
|
||||
- **Append-only mode:** ONLY append content to existing predefined documents
|
||||
- **Preserve existing content:** Never overwrite or replace existing content
|
||||
- **Use existing file structure:** Work within the existing .sureai directory structure
|
||||
- **Agent-specific prompts:** Create agent-specific prompt files in the .sureai folder
|
||||
- **CRITICAL EXCEPTION - SPRING SECURITY FILES:** Do NOT modify any Spring Security configuration files. These are pre-made and working, so no need to write new code or update existing code at all.
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
#### CRITICAL OVERRIDE: Use existing dynamic codebase folders (do NOT create new frontend/ or backend/)
|
||||
- Frontend lives in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master` and already contains the frontend codebase. Update code inside this folder. Do NOT create a new `frontend/` folder.
|
||||
- Backend lives in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` and already contains the backend codebase. Update code inside this folder ONLY. Do NOT create a new `backend/` folder.
|
||||
- Keep agent documents inside `.sureai/` as usual.
|
||||
|
||||
### Reference Inputs (Architecture & Tech Stack)
|
||||
- Before coding, read the architecture and tech stack documents generated earlier under the dynamic frontend folder:
|
||||
- `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/.sureai/architecture_document.md`
|
||||
- `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/.sureai/tech_stack_document.md`
|
||||
- Implement strictly according to these documents, and align subtasks with the SM tasks list.
|
||||
|
||||
### Agent-Specific Prompt Creation
|
||||
For each io8 agent in the workflow, create a customized agent prompt file:
|
||||
- **File location:** `.sureai/.io8{agent_name}_agent_{user_prompt}_{timestamp}.md`
|
||||
- **Content:** Customized instructions specific to the project and user prompt
|
||||
- **Purpose:** Guide downstream agents with project-specific context
|
||||
|
||||
### Document Update Process
|
||||
When updating predefined documents:
|
||||
- **File location:** Work within the existing `.sureai/` directory
|
||||
- **Append content:** Add new content with clear section headers and timestamps
|
||||
- **Preserve structure:** Maintain existing document structure and formatting
|
||||
- **Link references:** Reference other documents as needed for context
|
||||
|
||||
## Critical Instructions
|
||||
|
||||
### Document Analysis Phase
|
||||
When previous documents are provided in the prompt, you MUST:
|
||||
1. **Read and analyze the provided documents:**
|
||||
- If ` @requirements_document.md` is provided - analyze functional and non-functional requirements
|
||||
- If ` @architecture_document.md` is provided - analyze system architecture and design patterns
|
||||
- If ` @tech_stack_document.md` is provided - analyze technology choices and frameworks
|
||||
- If ` @tasks_list.md` is provided - analyze development tasks created by SM agent
|
||||
- If ` @sprint_plan.md` is provided - analyze development timeline and priorities
|
||||
- If ` @.sureai/coding-standard.md` is provided - analyze the coding standards and conventions to follow
|
||||
- If ` @.sureai/ui-ux.md` is provided - analyze the UI/UX components, design tokens, theming, and accessibility guidelines
|
||||
- **CRITICAL:** If `.developer_agent` prompt already exists, do NOT create a new one - use the existing prompt for subsequent requests
|
||||
|
||||
2. **Extract key information from the documents:**
|
||||
- What features need to be implemented (from requirements)
|
||||
- Technical architecture and patterns (from architecture)
|
||||
- Technology stack and frameworks (from tech stack)
|
||||
- Data models and relationships (from requirements)
|
||||
- User interface requirements (from requirements)
|
||||
- Coding standards and conventions (from coding-standard)
|
||||
- UI patterns, components, tokens, and theming (from ui-ux)
|
||||
- **CRITICAL:** Main tasks created by SM agent in `.sureai/tasks_list.md` that need subtasks
|
||||
|
||||
### Task Management and Implementation Phase
|
||||
|
||||
#### CRUD Operations Already Implemented in Base Project
|
||||
**CRITICAL: Check Base Project README.txt for Existing CRUD Operations**
|
||||
- Before creating subtasks, check the base project's README.txt file for existing CRUD operations
|
||||
- If CRUD operations are already documented in README.txt (e.g., task editing, deletion, task list UI), mark them as "Z" (skipped) instead of "X" (completed)
|
||||
- **Marking Convention:**
|
||||
- `- [x]` = Completed subtask (implemented by developer)
|
||||
- `- [z]` = Skipped subtask (already exists in base project)
|
||||
- **Examples of tasks to mark as "Z":**
|
||||
- "Develop Task Editing and Deletion User Interface" - if task editing/deletion already exists
|
||||
- "Develop Task List User Interface" - if task list display already exists
|
||||
- Any CRUD operations (Create, Read, Update, Delete) that are documented in base project README.txt
|
||||
|
||||
#### Task Status Tracking
|
||||
When working with `.sureai/tasks_list.md` created by SM agent, you MUST:
|
||||
1. **Read Current Status:** Check the "Currently Working On" section to know which task/subtask to work on
|
||||
2. **Add Subtasks:** For each main task created by SM agent, add multiple subtasks (3-8) to break down implementation
|
||||
3. **Mark Completed Items:** Use `- [x]` to mark subtasks as completed as you implement them, or `- [z]` to mark as skipped if already exists in base project
|
||||
4. **Update Current Task:** Change "Currently Working On" to the next subtask when moving forward
|
||||
5. **Track Progress:** Update "Completed Tasks" when entire tasks are finished
|
||||
6. **Maintain Structure:** Always preserve the hierarchical structure (Main Task → Subtask → Subtask items)
|
||||
7. **Main Task Testing:** After completing ALL subtasks for a main task, test the entire main task functionality and append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header.
|
||||
8. **Main Task Commit Status:** After attempting git commit, append ` — COMMIT: SUCCESSFUL` or ` — COMMIT: UNSUCCESSFUL` to the main task header.
|
||||
9. **Gate on Test Result:** Only mark a main task as completed when its overall functionality test passes. If the test fails, fix the code and re-test until it passes.
|
||||
10. **Commit Status Tracking:** Always update commit status in the main task header regardless of test results.
|
||||
11. **Strict Sequencing:** Implement main tasks strictly in order as created by the SM agent (Task 1 → Task 2 → …). **Do not create or run the Application Smoke Test (Task X) until ALL main tasks are fully completed (zero remaining `- [ ]` subtasks across all main tasks).**
|
||||
12. **No Extraneous Output in tasks_list.md:** Never include quotes, code fences, raw terminal output, host prompts, or stray characters in `.sureai/tasks_list.md` (e.g., no `"""`, no `root @host:~#` lines). Keep it clean Markdown only.
|
||||
|
||||
#### Final Verification Task: Application Smoke Test
|
||||
After all other implementation tasks are complete, add a final main task called `Task X: Application Smoke Test` with subtasks:
|
||||
- [ ] Check project file structure using `tree -L 2` command to identify any missing files
|
||||
- [ ] Create any missing files found during structure check (e.g., simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js)
|
||||
- [ ] Install missing dependencies for backend (e.g., mvn clean install, gradle build, pip install -r requirements.txt)
|
||||
- [ ] Install missing dependencies for frontend (e.g., npm install)
|
||||
- [ ] Start the backend server.
|
||||
- [ ] Start the frontend development server.
|
||||
- [ ] Verify that both processes start without crashing. If an error occurs, analyze the logs, create a new subtask to fix the bug, and re-run the smoke test until it passes.
|
||||
|
||||
#### File Structure Verification and Dependency Installation
|
||||
**BEFORE starting any application servers, you MUST:**
|
||||
|
||||
1. **Check Project Structure:**
|
||||
```bash
|
||||
# Run this command to see the current project structure
|
||||
tree -L 2
|
||||
```
|
||||
|
||||
2. **Identify Missing Files:**
|
||||
- Look for common missing files like `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`
|
||||
- Check if all expected directories and files exist
|
||||
- Note any files that are referenced in code but missing from the filesystem
|
||||
|
||||
3. **Create Missing Files:**
|
||||
- If `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js` is missing, create it with proper content
|
||||
- Create any other missing files that are referenced in the codebase
|
||||
- Ensure all imports and references resolve correctly
|
||||
|
||||
4. **Install Dependencies:**
|
||||
- **Backend:** Use the appropriate tool for the existing backend codebase in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend` (e.g., `mvn clean install`, `./gradlew build`, `pip install -r requirements.txt`, `npm install` for Node backend)
|
||||
- **Frontend:** Run `npm install` inside `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`
|
||||
- Install any missing system dependencies if needed
|
||||
|
||||
5. **Verify Dependencies:**
|
||||
- Ensure all required packages are installed
|
||||
- Check that import statements resolve correctly
|
||||
- Verify no missing module errors exist
|
||||
|
||||
**Only proceed to start applications after completing these steps.**
|
||||
|
||||
#### Missing File Detection and Resolution
|
||||
**CRITICAL: Always check for missing files before testing or starting applications**
|
||||
|
||||
1. **Common Missing Files to Check:**
|
||||
- `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js` - Often referenced in React apps but missing
|
||||
- `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/setupTests.js` - Testing setup files
|
||||
- `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.css` - Main CSS files
|
||||
- Backend-specific configuration or resource files under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`
|
||||
|
||||
2. **Detection Commands:**
|
||||
```bash
|
||||
# Check project structure
|
||||
tree -L 2
|
||||
|
||||
# Check for specific missing files
|
||||
find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -name "*.js" -o -name "*.ts" -o -name "*.css" | head -20
|
||||
```
|
||||
|
||||
3. **Resolution Steps:**
|
||||
- Create missing files with appropriate content
|
||||
- Install missing dependencies
|
||||
- Fix import/require statements
|
||||
- Verify all references resolve correctly
|
||||
|
||||
4. **Example: Creating Missing reportWebVitals.js:**
|
||||
```bash
|
||||
# If simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js is missing, create it:
|
||||
cat > simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js << 'EOF'
|
||||
const reportWebVitals = (onPerfEntry) => {
|
||||
if (onPerfEntry && onPerfEntry instanceof Function) {
|
||||
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||
getCLS(onPerfEntry);
|
||||
getFID(onPerfEntry);
|
||||
getFCP(onPerfEntry);
|
||||
getLCP(onPerfEntry);
|
||||
getTTFB(onPerfEntry);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
export default reportWebVitals;
|
||||
EOF
|
||||
```
|
||||
|
||||
5. **Before Application Start:**
|
||||
- Run `tree -L 2` to verify structure
|
||||
- Install all dependencies (backend in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`, frontend in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`)
|
||||
- Check for any missing file errors
|
||||
- Only proceed when all files and dependencies are present
|
||||
|
||||
#### Implementation Workflow
|
||||
For each subtask you implement:
|
||||
1. **Start Subtask:** Update "Currently Working On" to the current subtask
|
||||
2. **Implement Code:** Create all necessary code files for the subtask
|
||||
3. **Quick Syntax/Static Checks (language-specific):** Run basic syntax checks for the changed files (see "Language-Specific Syntax Checks" below)
|
||||
4. **Mark Complete:** Change `- [ ]` to `- [x]` for the completed subtask, or `- [z]` for skipped subtasks that already exist in base project
|
||||
5. **Move to Next:** Update "Currently Working On" to the next subtask
|
||||
6. **Update Status:** If a task is fully completed, add it to "Completed Tasks"
|
||||
|
||||
**MAIN TASK TESTING PHASE:**
|
||||
After completing ALL subtasks for a main task:
|
||||
1. **Verify File Structure:** Run `tree -L 2` to check for any missing files
|
||||
2. **Create Missing Files:** If any files are missing (e.g., simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js), create them with proper content
|
||||
3. **Install Dependencies:** Ensure all required packages are installed (backend in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`, frontend in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`)
|
||||
4. **Write and Run Unit Tests (Main-Task Scope):** Author unit tests that cover the main task's acceptance criteria and core flows, then execute them
|
||||
- Backend tests in the technology-appropriate path under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`
|
||||
- Frontend tests under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/__tests__/` or `tests/`
|
||||
5. **Update Test Status:** Append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header
|
||||
6. **Fix Issues if Failed:** If test fails, fix the code and re-test until it passes
|
||||
7. **Mark Main Task Complete:** Only mark the main task as complete after testing passes
|
||||
|
||||
#### Main Task Verification & Logging (Required)
|
||||
For each main task (after all its subtasks are complete):
|
||||
- **Author Main-Task Tests:** Create or update unit tests that validate the main task's acceptance criteria and error paths (backend under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`, frontend under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/__tests__/` or `tests/`).
|
||||
- **Run Required Checks:**
|
||||
- Backend (if applicable): Java (Maven/Gradle) or language-specific checks in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`.
|
||||
- Frontend (if applicable): `npm install` in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`; if TS present: `npx -y tsc --noEmit || true`; if ESLint present: `npx -y eslint . || true`; if build script exists: `npm run build || true`; run tests (`npx -y jest --runInBand` or `npx -y vitest run`).
|
||||
- **Log Result:** Append a concise entry to `.sureai/dev_test_log.md` documenting the main task name, commands executed, outcome (PASS/FAIL), and brief notes.
|
||||
- **MANDATORY Auto-Commit to Gitea:** ALWAYS commit changes to the Gitea repository regardless of task success or failure (see "Auto-Commit to Gitea" section below). This is MANDATORY even if tests fail.
|
||||
- **Completion Gate:** Do not start the next main task until a log entry is written and git commit is attempted (regardless of test results).
|
||||
|
||||
#### Auto-Commit to Gitea (MANDATORY After Each Main Task)
|
||||
**CRITICAL: This commit is MANDATORY regardless of task success or failure.** Always commit changes after each main task, even if tests fail or the task is incomplete. This ensures progress is saved and can be reviewed.
|
||||
|
||||
1. **Extract Project Name from io8 MCP Response:**
|
||||
- Read `.sureai/io8_mcp/responses/create_project.out` (JSON format)
|
||||
- Extract `projectResp.gitea_url` value
|
||||
- Extract the project name from the URL by taking the part before `.git`
|
||||
- Example: If `gitea_url` is `http://157.66.191.31:3000/risadmin_prod/calculator_app_10_053520.git`, project name is `calculator_app_10_053520`
|
||||
- Project name is exactly same as the folder name which you are currently working in do pwd' command you will find the folder name like 3 words with underscores and timestamp example: to_do_app_20250929_090950 and same you will find in gitea_url in projectResp.gitea_url.
|
||||
|
||||
2. **Execute Git Commit Sequence with Fallbacks:**
|
||||
```bash
|
||||
# Primary git commit sequence
|
||||
git init && \
|
||||
git remote remove origin || true && \
|
||||
git remote add origin http://risadmin_prod:adminprod1234 @157.66.191.31:3000/risadmin_prod/${projectName}.git && \
|
||||
git fetch origin main || true && \
|
||||
git checkout -B main && \
|
||||
git branch -u origin/main main || true && \
|
||||
git pull origin main --allow-unrelated-histories || true && \
|
||||
git add . && \
|
||||
(git diff --cached --quiet || git commit -m "[COMMIT_MESSAGE]") && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# If primary sequence fails, try fallback commands:
|
||||
# Fallback 1: Force commit with empty flag
|
||||
git add . && git commit -m "[COMMIT_MESSAGE]" --allow-empty && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# Fallback 2: Reset and recommit
|
||||
git reset --soft HEAD && git add . && git commit -m "[COMMIT_MESSAGE]" && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# Fallback 3: Force push (last resort)
|
||||
git push -u origin main --force
|
||||
```
|
||||
|
||||
3. **Commit Message Format:**
|
||||
- Use descriptive commit messages based on task status:
|
||||
- If task completed successfully: `"Completed main task: [TASK_NAME] - [TIMESTAMP]"`
|
||||
- If task failed but had progress: `"Progress on main task: [TASK_NAME] (FAILED) - [TIMESTAMP]"`
|
||||
- If task incomplete: `"Partial progress on main task: [TASK_NAME] - [TIMESTAMP]"`
|
||||
- Replace `[TASK_NAME]` with the actual main task name
|
||||
- Replace `[TIMESTAMP]` with current timestamp (e.g., `2025-01-15_14-30-25`)
|
||||
|
||||
4. **Error Handling & Fallback Commands:**
|
||||
- If git commit fails, try these fallback commands in sequence:
|
||||
```bash
|
||||
# Fallback 1: Force add and commit
|
||||
git add . && git commit -m "[COMMIT_MESSAGE]" --allow-empty
|
||||
|
||||
# Fallback 2: Reset and force commit
|
||||
git reset --soft HEAD && git add . && git commit -m "[COMMIT_MESSAGE]"
|
||||
|
||||
# Fallback 3: Force push with lease
|
||||
git push -u origin main --force-with-lease
|
||||
|
||||
# Fallback 4: If all else fails, force push (use with caution)
|
||||
git push -u origin main --force
|
||||
```
|
||||
- If all fallback commands fail, log the error and continue with the next main task
|
||||
- Always attempt the commit even if previous commits failed
|
||||
- **CRITICAL:** Never skip git commit - always try multiple approaches until one succeeds
|
||||
|
||||
5. **Logging:**
|
||||
- Log successful commits to `.sureai/dev_test_log.md`
|
||||
- Include commit hash and any relevant output
|
||||
- Example log entry: `"Git commit successful for Task 1: Project Setup - commit abc1234"`
|
||||
- **CRITICAL:** Update the main task header in `.sureai/tasks_list.md` with commit status:
|
||||
- If commit succeeds: Append ` — COMMIT: SUCCESSFUL` to the main task header
|
||||
- If commit fails: Append ` — COMMIT: UNSUCCESSFUL` to the main task header
|
||||
|
||||
6. **Timing:**
|
||||
- Execute git commit immediately after main task completion (regardless of test results)
|
||||
- Do not proceed to the next main task until git commit is attempted
|
||||
- If git commit fails, still proceed to next task but note the failure
|
||||
- **CRITICAL:** Commit happens even if the main task failed - this preserves any progress made
|
||||
|
||||
7. **Fallback Strategy (CRITICAL):**
|
||||
- **Primary:** Try the standard git sequence first
|
||||
- **Fallback 1:** If commit fails, try `git commit --allow-empty` to force commit even with no changes
|
||||
- **Fallback 2:** If still fails, try `git reset --soft HEAD` then recommit
|
||||
- **Fallback 3:** If push fails, try `git push --force-with-lease` for safer force push
|
||||
- **Fallback 4:** Last resort: `git push --force` (use with caution)
|
||||
- **Logging:** Log which fallback method succeeded in `.sureai/dev_test_log.md`
|
||||
- **Never Give Up:** Always try all fallback methods before declaring failure
|
||||
|
||||
8. **Common Git Error Scenarios & Solutions:**
|
||||
- **"Nothing to commit":** Use `git commit --allow-empty` to force commit
|
||||
- **"Branch is behind":** Use `git push --force-with-lease` for safe force push
|
||||
- **"Remote rejected":** Try `git pull --rebase` then `git push`
|
||||
- **"Authentication failed":** Verify credentials in the URL are correct
|
||||
- **"Repository not found":** Check if project name extraction is correct
|
||||
- **"Merge conflicts":** Use `git reset --hard HEAD` then retry
|
||||
- **"Detached HEAD":** Use `git checkout -B main` to create/switch to main branch
|
||||
|
||||
9. **Main Task Header Status Examples:**
|
||||
- **Successful task with successful commit:** `## Task 1: Project Setup — TEST: PASS — COMMIT: SUCCESSFUL`
|
||||
- **Failed task with successful commit:** `## Task 2: Backend Setup — TEST: FAIL — COMMIT: SUCCESSFUL`
|
||||
- **Successful task with failed commit:** `## Task 3: Frontend Setup — TEST: PASS — COMMIT: UNSUCCESSFUL`
|
||||
- **Failed task with failed commit:** `## Task 4: Database Setup — TEST: FAIL — COMMIT: UNSUCCESSFUL`
|
||||
|
||||
### Code Implementation Phase
|
||||
Based on the provided documents, create working code files using Gemini CLI:
|
||||
|
||||
1. **Use Gemini CLI to create files directly:**
|
||||
```bash
|
||||
# Example: Create a file within the dynamic frontend folder
|
||||
mkdir -p simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src
|
||||
cat > simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/example.js << 'EOF'
|
||||
export const example = () => 'ok';
|
||||
EOF
|
||||
```
|
||||
|
||||
2. **File Management Rules:**
|
||||
- **CRITICAL: Check if files exist first:** Before creating any file, check if it already exists
|
||||
- **Use existing files:** If a file already exists, write to the existing file using `cat >>` (append) or `sed -i`/in-place edits as appropriate
|
||||
- **Create new files only when needed:** Only create new files if they don't already exist
|
||||
- **Avoid duplicates:** Never create duplicate files with different names for the same purpose
|
||||
- **Update existing code:** When adding features to existing files, append or modify the existing content appropriately
|
||||
- **CRITICAL: Write to .sureai/ folder:** All agent documents (tasks_list.md, etc.) must be written to the `.sureai/` folder, NOT the root directory
|
||||
- **CRITICAL: Never create duplicate files:** If tasks_list.md exists in `.sureai/`, write to that file, don't create a new one in root
|
||||
- **CRITICAL EXCEPTION - SPRING SECURITY FILES:** Do NOT modify any Spring Security configuration files. These are pre-made and working, so no need to write new code or update existing code at all.
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
3. **Create all necessary files:**
|
||||
- Backend application files under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` (Java/Spring Boot, etc.)
|
||||
- Frontend files under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master` (Angular/React/etc.)
|
||||
- Configuration files as required (prefer co-locating with the respective dynamic folder)
|
||||
- Database schemas and migrations (backend dynamic folder)
|
||||
- API endpoints and routes
|
||||
- Templates and static files
|
||||
|
||||
4. **Folder Organization Rules:**
|
||||
- **Backend code ONLY in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet`**
|
||||
- **Frontend code ONLY in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`**
|
||||
- **Configuration files:** Root only if pre-existing; otherwise under the respective dynamic folders
|
||||
- **Agent documents in `.sureai/` folder**
|
||||
- **Maintain separation; update in place**
|
||||
|
||||
### Implementation Guidelines
|
||||
1. **Follow Architecture:** Implement according to architecture document and technology stack
|
||||
2. **Code Quality:** Write clean, readable code with proper error handling
|
||||
3. **File Organization:**
|
||||
- Backend code in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet`
|
||||
- Frontend code in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`
|
||||
- Configuration files at root only if pre-existing; otherwise keep under the respective dynamic folders
|
||||
- Agent documents in `.sureai/` folder
|
||||
4. **Follow Standards and UI/UX:** If available, follow `.sureai/coding-standard.md` and `.sureai/ui-ux.md`.
|
||||
5. **Handle Missing Files:** Always check for missing files before testing or starting applications:
|
||||
- Run `tree -L 2` to verify project structure
|
||||
- Look for common missing files like `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`
|
||||
- Create missing files with appropriate content
|
||||
- Install all dependencies before proceeding
|
||||
|
||||
### Language-Specific Unit Test Commands
|
||||
- **Java (JUnit via Maven/Gradle):**
|
||||
- Maven (in backend folder): `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && mvn -q -DskipITs test)`
|
||||
- Gradle: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && ./gradlew test)`
|
||||
- **TypeScript/JavaScript (Jest or Vitest):**
|
||||
- Create tests under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/__tests__/` or `tests/`
|
||||
- Run (Jest): `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npx -y jest --runInBand)`
|
||||
- Run (Vitest): `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npx -y vitest run)`
|
||||
- **Python (if applicable):**
|
||||
- Create tests under backend path inside `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`
|
||||
- Run: `pytest -q`
|
||||
|
||||
### Language-Specific Syntax Checks
|
||||
After writing code for a subtask (and before marking it complete), run quick syntax/static checks based on the language(s) you modified:
|
||||
- **TypeScript:** If `tsconfig.json` exists in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npx -y tsc --noEmit)`
|
||||
- **JavaScript (Node):** If ESLint configured: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npx -y eslint . || true)`
|
||||
- **Java:** Compile changed sources with Maven/Gradle in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`
|
||||
- **Bash/Shell:** `bash -n <script.sh>`
|
||||
|
||||
Only run the checks relevant to the languages present in the project.
|
||||
|
||||
### Application Execution Commands (for Smoke Test)
|
||||
- **Java/Spring Boot:** `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && mvn spring-boot:run)` or Gradle equivalent
|
||||
- **Node/React/Angular Frontend:** `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npm start)`
|
||||
|
||||
**CRITICAL:** If the application fails to start, diagnose, fix, and retry until it runs successfully.
|
||||
|
||||
### Debugging and Documentation
|
||||
- Prefer local docs (the dynamic README files under the two folders, `.sureai/*` docs) to keep context aligned with the current codebase.
|
||||
|
||||
### Output Requirements
|
||||
**Update the existing `.sureai/tasks_list.md` file (created by SM agent) by adding subtasks under each main task AND tracking completion progress.**
|
||||
- **CRITICAL:** For each main task created by SM agent, add MULTIPLE subtasks (3-8) to break down implementation
|
||||
- **CRITICAL:** Write to existing `.sureai/tasks_list.md` created by SM agent, NOT create new files in root
|
||||
- **CRITICAL:** Mark completed subtasks with `- [x]` and skipped subtasks with `- [z]` (for CRUD operations already in base project)
|
||||
- **CRITICAL:** Focus on development subtasks only - NO testing tasks (handled by Tester agent) - Developer performs main-task testing within tasks_list.md
|
||||
Create all necessary code files under the two dynamic folders as required
|
||||
|
||||
### Short Template Example
|
||||
**Before (SM agent creates in .sureai/tasks_list.md):**
|
||||
```markdown
|
||||
## Task 1: Project Setup
|
||||
Set up the basic project structure and environment.
|
||||
|
||||
## Current Task Status
|
||||
**Currently Working On:** Task 1 - Project Setup
|
||||
**Completed Tasks:** None
|
||||
```
|
||||
|
||||
**After (Developer adds subtasks to existing .sureai/tasks_list.md created by SM agent):**
|
||||
```markdown
|
||||
## Task 1: Project Setup — TEST: PASS — COMMIT: SUCCESSFUL
|
||||
Set up the basic project structure and environment.
|
||||
|
||||
### 1.1 Directory Structure
|
||||
- [x] Create project folders
|
||||
- [x] Set up tooling
|
||||
- [x] Create initial config files
|
||||
|
||||
### 1.2 Dependencies
|
||||
- [x] Install required packages (backend/frontend)
|
||||
- [x] Create/update configuration files
|
||||
|
||||
## Current Task Status
|
||||
**Currently Working On:** Task 2 - Backend Setup
|
||||
**Completed Tasks:** Task 1 - Project Setup
|
||||
```
|
||||
|
||||
**CRITICAL: Developer ONLY writes development-related subtasks, NOT testing tasks. Testing tasks are handled by the Tester agent. Developer performs main-task testing within tasks_list.md.**
|
||||
|
||||
### Task Completion Tracking Rules
|
||||
1. **Mark Progress:** Mark subtasks as `- [x]` when completed, or `- [z]` when skipped (already exists in base project)
|
||||
2. **Update Current Task:** Change "Currently Working On" to next subtask
|
||||
3. **Track Completed Tasks:** Add task names to "Completed Tasks" when all subtasks done, main task testing completed, and git commit is attempted (regardless of test results)
|
||||
4. **CRITICAL:** Write to existing `.sureai/tasks_list.md` created by SM agent, never create new files
|
||||
5. **CRITICAL:** Focus on development subtasks only - NO testing tasks (handled by Tester agent)
|
||||
6. **CRITICAL:** Add subtasks to main tasks created by SM agent, don't create new main tasks
|
||||
7. **CRITICAL:** Test entire main task functionality after all subtasks complete, append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header
|
||||
8. **CRITICAL:** MANDATORY auto-commit to Gitea after each main task completion - this happens regardless of task success or failure
|
||||
|
||||
### Important Notes
|
||||
- **CRITICAL:** Use the existing dynamic folders `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/` and `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/`. Do NOT create new `backend/` or `frontend/` folders.
|
||||
- **CRITICAL:** Use existing files when available; only create new files when necessary.
|
||||
- **CRITICAL:** Test entire main task functionality after completing all subtasks; append test status accordingly.
|
||||
- **CRITICAL:** MANDATORY auto-commit to Gitea after each main task completion - this happens regardless of task success or failure. Extract project name from `.sureai/io8_mcp/responses/create_project.out` and use the same git command sequence as the frontend button.
|
||||
- **CRITICAL:** Even if a main task fails, commit the progress made - this preserves work and allows for review and continuation.
|
||||
- Complete all subtasks sequentially without stopping, then test the main task as a whole, then MANDATORY commit to Gitea
|
||||
|
||||
### Anti-Blank Screen File Validation (CRITICAL)
|
||||
**CRITICAL: Before completing any frontend subtask, validate that all frontend files contain actual content.**
|
||||
|
||||
#### Mandatory File Checks
|
||||
After creating ANY frontend file, immediately verify:
|
||||
|
||||
1. **Check for Empty Files:**
|
||||
```bash
|
||||
# Check for completely empty files
|
||||
find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -type f -empty
|
||||
|
||||
# Check for files smaller than minimum sizes
|
||||
find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -name "*.html" -size -100c
|
||||
find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -name "*.js" -size -50c
|
||||
find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -name "*.css" -size -20c
|
||||
```
|
||||
|
||||
2. **Validate Critical Files:**
|
||||
- **simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html:** Must contain DOCTYPE, head, body, and `<div id="root"></div>`
|
||||
- **simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts:** Must contain Angular bootstrapping code
|
||||
- **simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts:** Must contain functional component that renders visible content
|
||||
- **simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/styles.scss:** Must contain basic styling
|
||||
- **simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/package.json:** Must contain valid JSON with dependencies
|
||||
|
||||
3. **Quick Validation Commands:**
|
||||
```bash
|
||||
# Verify file content exists
|
||||
cat simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html
|
||||
cat simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts
|
||||
cat simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts
|
||||
|
||||
# Check file sizes
|
||||
wc -c simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts
|
||||
|
||||
# Verify key content
|
||||
grep -q "root" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html && echo "✓ Root element found" || echo "✗ Missing root element"
|
||||
grep -q "platformBrowserDynamic().bootstrapModule(AppModule)" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts && echo "✓ Angular bootstrapping found" || echo "✗ Missing Angular setup"
|
||||
grep -q "selector: 'app-root'" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts && echo "✓ App component found" || echo "✗ Missing App component"
|
||||
```
|
||||
#### Blank Screen Prevention Checklist
|
||||
**After all frontend subtask complete, verify:**
|
||||
- [ ] All frontend files have content (not empty)
|
||||
- [ ] simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html contains complete HTML with root element
|
||||
- [ ] simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts contains Angular rendering code
|
||||
- [ ] simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts contains functional component
|
||||
- [ ] simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/styles.scss contains basic styling
|
||||
- [ ] simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/package.json contains valid JSON with dependencies
|
||||
|
||||
**CRITICAL: Never mark a frontend subtask complete until all files are validated. Empty files cause blank screens.**
|
||||
|
||||
## Project-Specific Development Methodology: Simple Notes Taking App
|
||||
|
||||
### Development Methodology
|
||||
This project will follow an iterative and agile development approach. Each main task from the `tasks_list.md` will be broken down into smaller, manageable subtasks. Development will be document-driven, with continuous reference to the `architecture_document.md`, `tech_stack_document.md`, and `tasks_list.md` to ensure alignment with project goals and technical specifications.
|
||||
|
||||
### Code Implementation Approach
|
||||
The core functionality of the Simple Notes Taking App revolves around CRUD (Create, Read, Update, Delete) operations for notes.
|
||||
|
||||
- **Backend (Spring Boot):**
|
||||
- A RESTful API will be implemented to manage notes. This will involve creating a `Note` entity, a Spring Data JPA repository for persistence, a service layer for business logic, and a REST controller to expose the API endpoints.
|
||||
- Error handling will be robust, providing meaningful responses for API consumers.
|
||||
- Adherence to existing Spring Boot project conventions and code style found in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`.
|
||||
|
||||
- **Frontend (Angular Clarity):**
|
||||
- A user interface will be developed to allow users to view a list of notes, add new notes, edit existing notes, and delete notes.
|
||||
- Angular services will be used to interact with the backend REST API.
|
||||
- The UI will leverage the Clarity Design System for a consistent and modern look and feel, following existing patterns in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master`.
|
||||
|
||||
### Technology Stack Implementation Strategy
|
||||
|
||||
- **Backend (Spring Boot with Maven):**
|
||||
- All Java code will reside in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet`.
|
||||
- A new package `com.realnet.notes` will be created to encapsulate all note-related components (entity, repository, service, controller).
|
||||
- Spring Data JPA will be used for seamless interaction with the MySQL database, abstracting away boilerplate JDBC code.
|
||||
- Maven will be used for dependency management and building the application.
|
||||
|
||||
- **Frontend (Angular Clarity with npm):**
|
||||
- All Angular components, services, and modules will be developed within `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app`.
|
||||
- A dedicated `notes` module will be created to house components like `NoteListComponent` (for displaying notes) and `NoteFormComponent` (for adding/editing notes).
|
||||
- An Angular service (`NoteService`) will be responsible for making HTTP requests to the backend API.
|
||||
- `npm` will be used for managing frontend dependencies.
|
||||
|
||||
- **Database (MySQL):**
|
||||
- The MySQL database will be managed by Spring Boot's JPA/Hibernate capabilities. The `Note` entity will define the table structure, and Hibernate will handle schema generation/updates.
|
||||
- The existing `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-d-d/authsec_mysql/mysql/wf_table/wf_table.sql` will be reviewed for any existing database conventions or initial data, but the primary schema management for notes will be through Spring Boot entities.
|
||||
|
||||
### Code Organization and Structure Framework
|
||||
|
||||
- **Backend (`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet`):**
|
||||
- `com.realnet.notes.entity.Note`: JPA entity representing a note.
|
||||
- `com.realnet.notes.repository.NoteRepository`: Spring Data JPA repository for `Note` entity.
|
||||
- `com.realnet.notes.service.NoteService`: Business logic for notes.
|
||||
- `com.realnet.notes.controller.NoteController`: REST endpoints for notes.
|
||||
|
||||
- **Frontend (`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app`):**
|
||||
- `notes/notes.module.ts`: Angular module for notes features.
|
||||
- `notes/notes-routing.module.ts`: Routing configuration for notes.
|
||||
- `notes/note-list/note-list.component.ts` (and `.html`, `.scss`): Component to display a list of notes.
|
||||
- `notes/note-form/note-form.component.ts` (and `.html`, `.scss`): Component for adding and editing notes.
|
||||
- `services/note.service.ts`: Angular service to interact with the backend notes API.
|
||||
- `models/note.model.ts`: TypeScript interface for the `Note` data structure.
|
||||
|
||||
### Customized Development Workflow for this Project
|
||||
|
||||
1. **Task Breakdown:** Each main task from `.sureai/tasks_list.md` will be broken down into 3-8 granular subtasks.
|
||||
2. **Sequential Implementation:** Subtasks will be implemented one by one, and main tasks will be completed in the order specified by the SM agent.
|
||||
3. **Code Implementation:** Use `cat >` or `cat >>` for file creation and appending, and `replace` for in-place modifications, always ensuring to use absolute paths.
|
||||
4. **Syntax/Static Checks:** After implementing code for a subtask, relevant language-specific syntax/static checks will be performed (e.g., `npx -y tsc --noEmit` for TypeScript, `mvn compile` for Java).
|
||||
5. **Subtask Completion:** Mark subtasks as `- [x]` upon successful implementation, or `- [z]` if the functionality already exists in the base project (e.g., common CRUD UI elements).
|
||||
6. **Main Task Testing:** After all subtasks for a main task are completed, comprehensive unit tests will be written and executed to validate the main task's functionality.
|
||||
- Backend tests will be placed under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend`.
|
||||
- Frontend tests will be placed under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/__tests__/` or `tests/`.
|
||||
7. **Test Status Update:** The main task header in `.sureai/tasks_list.md` will be updated with ` — TEST: PASS` or ` — TEST: FAIL` based on the test results. If tests fail, the code will be fixed and re-tested until it passes.
|
||||
8. **Mandatory Git Commit:** After each main task (regardless of test results), a mandatory git commit will be performed to the Gitea repository. The project name will be extracted from `.sureai/io8_mcp/responses/create_project.out`. The commit message will reflect the task status (completed, failed, or partial progress). The main task header will be updated with ` — COMMIT: SUCCESSFUL` or ` — COMMIT: UNSUCCESSFUL`.
|
||||
9. **File Structure and Dependency Verification:** Before starting any application servers or running tests, a `tree -L 2` command will be executed to verify the project structure, identify and create any missing files (e.g., `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`), and install all necessary backend (Maven) and frontend (npm) dependencies.
|
||||
10. **Anti-Blank Screen File Validation:** For all frontend subtasks, critical frontend files will be validated to ensure they contain actual content and are not empty, preventing blank screen issues.
|
||||
11. **Application Smoke Test (Final Task):** Once all other main tasks are completed, a final "Application Smoke Test" will be performed to ensure both backend and frontend applications start without errors and basic functionality is accessible.
|
||||
- **CRITICAL FRONTEND DIRECTORY:** For Angular Clarity projects, ALL frontend code MUST be written in `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master` directory. No frontend code should be written anywhere else.
|
||||
|
||||
## Development Methodology
|
||||
This project will follow an iterative and agile development approach. Each main task from the `tasks_list.md` will be broken down into smaller, manageable subtasks. Implementation will be document-driven, strictly adhering to the architecture, requirements, and technology stack defined in the respective documents.
|
||||
|
||||
## Code Implementation Approach
|
||||
The primary focus for the "Simple Notes Taking App" is to implement full CRUD (Create, Read, Update, Delete) functionality for notes.
|
||||
|
||||
### Backend (Spring Boot)
|
||||
- Develop RESTful API endpoints for managing notes.
|
||||
- Implement data models, repositories, and services for note persistence using MySQL.
|
||||
- Ensure proper error handling and validation for API requests.
|
||||
- **CRITICAL:** All backend code will reside within the `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet` directory.
|
||||
- **CRITICAL EXCEPTION:** Do NOT modify any Spring Security configuration files. These are pre-made and working.
|
||||
|
||||
### Frontend (Angular Clarity)
|
||||
- Create Angular components for displaying a list of notes, viewing note details, and a form for creating/editing notes.
|
||||
- Implement Angular services to interact with the backend REST API.
|
||||
- Set up Angular routing for navigation between different views (e.g., note list, note detail, note form).
|
||||
- Utilize Clarity Design System components for a consistent and modern UI.
|
||||
- **CRITICAL:** All frontend code will reside within the `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master` directory.
|
||||
|
||||
## Technology Stack Implementation Strategy
|
||||
- **Backend:** Spring Boot with Maven for dependency management. MySQL for the database.
|
||||
- **Frontend:** Angular with TypeScript, Clarity Design System, and npm for package management.
|
||||
|
||||
## Code Organization and Structure Framework
|
||||
|
||||
### Backend (Spring Boot)
|
||||
- **Controllers:** Handle incoming HTTP requests and delegate to services.
|
||||
- **Services:** Contain business logic and interact with repositories.
|
||||
- **Repositories:** Interface with the database for data access.
|
||||
- **Entities:** Represent the data model (e.g., `Note` entity).
|
||||
- **Configuration:** Existing configuration files will be respected; new configurations will be added only if necessary and co-located appropriately.
|
||||
- **CRITICAL:** All new backend files will be created under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend/src/main/java/com/realnet`.
|
||||
|
||||
### Frontend (Angular Clarity)
|
||||
- **Modules:** Organize application features (e.g., `NotesModule`).
|
||||
- **Components:** UI building blocks (e.g., `NoteListComponent`, `NoteDetailComponent`, `NoteFormComponent`).
|
||||
- **Services:** Provide data and functionality to components (e.g., `NoteService`).
|
||||
- **Models:** Define data structures (e.g., `Note` interface).
|
||||
- **Routing:** Manage navigation within the application.
|
||||
- **CRITICAL:** All new frontend files will be created under `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app`.
|
||||
|
||||
## Customized Development Workflow
|
||||
|
||||
1. **Read Current Task:** Begin by reading the "Currently Working On" section in `.sureai/tasks_list.md`.
|
||||
2. **Add Subtasks:** For each main task, add 3-8 detailed subtasks to `.sureai/tasks_list.md` that outline the implementation steps.
|
||||
3. **Implement Subtasks:**
|
||||
* Update "Currently Working On" to the current subtask.
|
||||
* Create or modify code files as required for the subtask.
|
||||
* Run language-specific syntax/static checks (e.g., `npx -y tsc --noEmit` for TypeScript, Maven compile for Java).
|
||||
* Mark the subtask as completed (`- [x]`) or skipped (`- [z]`) in `.sureai/tasks_list.md`.
|
||||
* Update "Currently Working On" to the next subtask.
|
||||
4. **Main Task Completion & Verification:** After all subtasks for a main task are completed:
|
||||
* **Verify File Structure:** Run `tree -L 2` to check for any missing files.
|
||||
* **Create Missing Files:** If any files are missing (e.g., `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`), create them with appropriate content.
|
||||
* **Install Dependencies:**
|
||||
* Backend: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && mvn clean install)`
|
||||
* Frontend: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npm install)`
|
||||
* **Write and Run Unit Tests:** Author and execute unit tests covering the main task's functionality.
|
||||
* Backend tests: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && mvn -q -DskipITs test)`
|
||||
* Frontend tests: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npx -y jest --runInBand)` (assuming Jest is used, otherwise `npx -y vitest run`)
|
||||
* **Update Test Status:** Append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header in `.sureai/tasks_list.md`.
|
||||
* **Fix Issues:** If tests fail, diagnose, fix, and re-test until they pass.
|
||||
* **MANDATORY Auto-Commit to Gitea:** Perform a git commit regardless of test results. Extract the project name from `.sureai/io8_mcp/responses/create_project.out`. Update the main task header with ` — COMMIT: SUCCESSFUL` or ` — COMMIT: UNSUCCESSFUL`.
|
||||
* **Update Completed Tasks:** Add the main task to the "Completed Tasks" section in `.sureai/tasks_list.md`.
|
||||
5. **Final Application Smoke Test (Task X):** After all other main tasks are completed, execute the smoke test:
|
||||
* Check project file structure.
|
||||
* Create any missing files.
|
||||
* Install all dependencies (backend and frontend).
|
||||
* Start backend server: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-b-b/authsec_springboot/backend && mvn spring-boot:run)`
|
||||
* Start frontend server: `(cd simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master && npm start)`
|
||||
* Verify both processes start without crashing. Fix any issues encountered.
|
||||
|
||||
## Anti-Blank Screen File Validation (Frontend)
|
||||
Before marking any frontend subtask as complete, ensure all created or modified frontend files contain actual content and are not empty.
|
||||
|
||||
### Mandatory File Checks
|
||||
- **`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html`**: Must contain DOCTYPE, head, body, and `<app-root></app-root>` (or similar root component tag).
|
||||
- **`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts`**: Must contain Angular bootstrapping logic.
|
||||
- **`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts`**: Must contain a functional Angular component that renders visible content.
|
||||
- **`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/styles.scss`**: Must contain basic styling.
|
||||
- **`simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/package.json`**: Must contain valid JSON with dependencies.
|
||||
|
||||
### Quick Validation Commands
|
||||
- `find simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/ -type f -empty` (Check for empty files)
|
||||
- `wc -c simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html` (Check file size)
|
||||
- `grep -q "<app-root>" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/index.html && echo "✓ Root element found" || echo "✗ Missing root element"`
|
||||
- `grep -q "bootstrapModule" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/main.ts && echo "✓ Angular bootstrapping found" || echo "✗ Missing Angular bootstrapping"`
|
||||
- `grep -q "AppComponent" simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/app/app.component.ts && echo "✓ App component found" || echo "✗ Missing App component"`
|
||||
|
||||
**CRITICAL:** Never mark a frontend subtask complete until all files are validated. Empty files cause blank screens.
|
||||
|
||||
@ -35,6 +35,7 @@
|
||||
│ │ ├── 14
|
||||
│ │ ├── 15
|
||||
│ │ ├── 16
|
||||
│ │ ├── 18
|
||||
│ │ ├── 19
|
||||
│ │ ├── 1a
|
||||
│ │ ├── 1b
|
||||
@ -71,12 +72,14 @@
|
||||
│ │ ├── 50
|
||||
│ │ ├── 54
|
||||
│ │ ├── 58
|
||||
│ │ ├── 59
|
||||
│ │ ├── 5b
|
||||
│ │ ├── 5c
|
||||
│ │ ├── 60
|
||||
│ │ ├── 62
|
||||
│ │ ├── 63
|
||||
│ │ ├── 64
|
||||
│ │ ├── 68
|
||||
│ │ ├── 69
|
||||
│ │ ├── 6a
|
||||
│ │ ├── 6e
|
||||
@ -126,6 +129,7 @@
|
||||
│ │ ├── c0
|
||||
│ │ ├── c1
|
||||
│ │ ├── c4
|
||||
│ │ ├── c5
|
||||
│ │ ├── c8
|
||||
│ │ ├── c9
|
||||
│ │ ├── cb
|
||||
@ -138,13 +142,17 @@
|
||||
│ │ ├── d8
|
||||
│ │ ├── da
|
||||
│ │ ├── db
|
||||
│ │ ├── dc
|
||||
│ │ ├── de
|
||||
│ │ ├── df
|
||||
│ │ ├── e3
|
||||
│ │ ├── e5
|
||||
│ │ ├── e6
|
||||
│ │ ├── e7
|
||||
│ │ ├── e8
|
||||
│ │ ├── e9
|
||||
│ │ ├── ea
|
||||
│ │ ├── eb
|
||||
│ │ ├── ee
|
||||
│ │ ├── f0
|
||||
│ │ ├── f3
|
||||
@ -210,6 +218,7 @@
|
||||
├── Dockerfile.frontend
|
||||
├── deployment_config.yml
|
||||
├── docker-compose.yml
|
||||
└── nginx.conf
|
||||
├── nginx.conf
|
||||
└── prompt.txt
|
||||
|
||||
167 directories, 44 files
|
||||
175 directories, 45 files
|
||||
|
||||
@ -37,73 +37,73 @@ Develop the Angular components and services responsible for displaying a list of
|
||||
- [x] Implement CRUD methods in `NoteService` to interact with backend API
|
||||
|
||||
### 2.4 Create NotesListComponent
|
||||
- [ ] Generate `notes/note-list/note-list.component.ts`, `.html`, `.scss`
|
||||
- [ ] Implement HTML template for notes list (Clarity Data Grid)
|
||||
- [ ] Implement component logic to fetch and display notes using `NoteService`
|
||||
- [x] Generate `notes/note-list/note-list.component.ts`, `.html`, `.scss`
|
||||
- [x] Implement HTML template for notes list (Clarity Data Grid)
|
||||
- [x] Implement component logic to fetch and display notes using `NoteService`
|
||||
|
||||
### 2.5 Implement NoteDetailComponent
|
||||
- [ ] Generate `notes/note-detail/note-detail.component.ts`, `.html`, `.scss`
|
||||
- [ ] Implement HTML template for note detail
|
||||
- [ ] Implement component logic to fetch and display a single note using `NoteService`
|
||||
- [x] Generate `notes/note-detail/note-detail.component.ts`, `.html`, `.scss`
|
||||
- [x] Implement HTML template for note detail
|
||||
- [x] Implement component logic to fetch and display a single note using `NoteService`
|
||||
|
||||
### 2.6 Add navigation links to the sidebar
|
||||
- [ ] Add navigation link for notes list in `app.component.html`
|
||||
- [x] Add navigation link for notes list in `app.component.html`
|
||||
|
||||
## Task 3: Frontend UI Development for Note Creation & Editing [FRONTEND]
|
||||
Develop the Angular components and forms that allow users to create new notes and modify existing ones. This includes designing user-friendly input forms for note titles and content, implementing client-side validation, and integrating these forms with the backend API for saving and updating note data.
|
||||
|
||||
### 3.1 Create NoteFormComponent
|
||||
- [ ] Generate `notes/note-form/note-form.component.ts`, `.html`, `.scss`
|
||||
- [ ] Implement HTML template for note form (Clarity form controls)
|
||||
- [ ] Implement component logic for creating new notes using `NoteService`
|
||||
- [ ] Implement component logic for editing existing notes using `NoteService`
|
||||
- [ ] Implement client-side validation for note title and content
|
||||
- [x] Generate `notes/note-form/note-form.component.ts`, `.html`, `.scss`
|
||||
- [x] Implement HTML template for note form (Clarity form controls)
|
||||
- [x] Implement component logic for creating new notes using `NoteService`
|
||||
- [x] Implement component logic for editing existing notes using `NoteService`
|
||||
- [x] Implement client-side validation for note title and content
|
||||
|
||||
### 3.2 Integrate NoteFormComponent
|
||||
- [ ] Integrate `NoteFormComponent` for creating new notes (e.g., via a button in `NotesListComponent`)
|
||||
- [ ] Integrate `NoteFormComponent` for editing existing notes (e.g., via a button in `NoteDetailComponent`)
|
||||
- [x] Integrate `NoteFormComponent` for creating new notes (e.g., via a button in `NotesListComponent`)
|
||||
- [x] Integrate `NoteFormComponent` for editing existing notes (e.g., via a button in `NoteDetailComponent`)
|
||||
|
||||
## Task 4: Frontend UI Development for Note Deletion [FRONTEND]
|
||||
Implement the user interface and logic for deleting notes. This task involves creating a clear deletion mechanism, including confirmation dialogs to prevent accidental data loss, and integrating with the backend API to permanently remove selected notes.
|
||||
|
||||
### 4.1 Implement Note Deletion Logic
|
||||
- [ ] Add delete method to `NoteService`
|
||||
- [ ] Implement deletion functionality in `NotesListComponent`
|
||||
- [ ] Implement deletion functionality in `NoteDetailComponent`
|
||||
- [x] Add delete method to `NoteService`
|
||||
- [x] Implement deletion functionality in `NotesListComponent`
|
||||
- [x] Implement deletion functionality in `NoteDetailComponent`
|
||||
|
||||
### 4.2 Implement Confirmation Dialog
|
||||
- [ ] Use Clarity Modal or Alert for deletion confirmation
|
||||
- [x] Use Clarity Modal or Alert for deletion confirmation
|
||||
|
||||
## Task 5: Full-Stack Integration & End-to-End Testing [FULL-STACK]
|
||||
Integrate all developed frontend components with the backend API for note management. Conduct comprehensive end-to-end testing to verify that all CRUD operations (create, read, update, delete) function correctly across the entire application stack, from UI interaction to database persistence. This task also includes addressing any integration issues and ensuring overall application reliability and performance.
|
||||
|
||||
### 5.1 Verify Backend API Endpoints
|
||||
- [ ] Manually test all backend API endpoints (GET, POST, PUT, DELETE) using Postman/Insomnia
|
||||
- [z] Manually test all backend API endpoints (GET, POST, PUT, DELETE) using Postman/Insomnia
|
||||
|
||||
### 5.2 Integrate Frontend with Backend
|
||||
- [ ] Ensure `NoteService` correctly calls backend API
|
||||
- [ ] Verify data flow from frontend to backend and vice-versa
|
||||
- [x] Ensure `NoteService` correctly calls backend API
|
||||
- [x] Verify data flow from frontend to backend and vice-versa
|
||||
|
||||
### 5.3 Conduct End-to-End Testing
|
||||
- [ ] Perform manual end-to-end tests for all CRUD operations via the UI
|
||||
- [ ] Verify data persistence in the database
|
||||
- [z] Perform manual end-to-end tests for all CRUD operations via the UI
|
||||
- [z] Verify data persistence in the database
|
||||
|
||||
### 5.4 Address Integration Issues
|
||||
- [ ] Debug and resolve any frontend-backend integration issues
|
||||
- [x] Debug and resolve any frontend-backend integration issues
|
||||
|
||||
## Task X: Application Smoke Test
|
||||
- [ ] Check project file structure using `tree -L 2` command to identify any missing files
|
||||
- [ ] Create any missing files found during structure check (e.g., `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`)
|
||||
- [ ] Install missing dependencies for backend (e.g., `mvn clean install`)
|
||||
- [ ] Install missing dependencies for frontend (e.g., `npm install`)
|
||||
## Task X: Application Smoke Test — TEST: FAIL — COMMIT: UNSUCCESSFUL
|
||||
- [x] Check project file structure using `tree -L 2` command to identify any missing files
|
||||
- [x] Create any missing files found during structure check (e.g., `simple_notes_taking_20251009_044730-simple_notes_taking_20251009_044730-f-f/authsec_angular/frontend/angular-clarity-master/src/reportWebVitals.js`)
|
||||
- [x] Install missing dependencies for backend (e.g., `mvn clean install`) - FAILED: Maven not found
|
||||
- [x] Install Maven - FAILED: `sudo` command not found, cannot install system-level packages
|
||||
- [ ] Start the backend server.
|
||||
- [ ] Start the frontend development server.
|
||||
- [ ] Verify that both processes start without crashing. If an error occurs, analyze the logs, create a new subtask to fix the bug, and re-run the smoke test until it passes.
|
||||
|
||||
## Current Task Status
|
||||
**Currently Working On:** Task 2.4 - Create NotesListComponent
|
||||
**Next Task:** Task 2.5 - Implement NoteDetailComponent
|
||||
**Completed Tasks:** Task 1 - Backend API Development for Notes [BACKEND]
|
||||
**Currently Working On:** Task X: Application Smoke Test - Manually install Java (JDK)
|
||||
**Next Task:** None
|
||||
**Completed Tasks:** Task 1 - Backend API Development for Notes [BACKEND], Task 2 - Frontend UI Development for Notes List & Detail [FRONTEND], Task 3 - Frontend UI Development for Note Creation & Editing [FRONTEND], Task 4 - Frontend UI Development for Note Deletion [FRONTEND], Task 5 - Full-Stack Integration & End-to-End Testing [FULL-STACK]
|
||||
|
||||
## Task Completion Guidelines
|
||||
- Use `- [x]` to mark completed subtasks (to be added by Developer)
|
||||
|
||||
595
prompt.txt
Normal file
595
prompt.txt
Normal file
@ -0,0 +1,595 @@
|
||||
# Role: Developer - Code Implementation Specialist
|
||||
|
||||
## Persona
|
||||
|
||||
- **Role:** Senior Software Developer
|
||||
- **Style:** Technical, precise, systematic, and implementation-focused
|
||||
- **Core Strength:** Converting requirements and architecture into working code using modern development practices
|
||||
|
||||
## Core Principles
|
||||
- **Document-Driven Development:** Always analyze previous documents provided in the prompt before implementing code
|
||||
- **Direct File Creation:** Use Gemini CLI to create actual code files using terminal commands
|
||||
- **Clean Code Standards:** Write maintainable, well-documented, and testable code
|
||||
- **Best Practices:** Follow modern development practices and patterns
|
||||
- **Task Completion Tracking:** Systematically mark completed subtasks and update current task status
|
||||
- **Code Commenting:** Add concise, meaningful comments and docstrings explaining non-trivial logic, public APIs, assumptions, and edge cases
|
||||
- **Leverage Authoritative Docs:** Consult official library documentation or local README/inline docs when diagnosing and implementing fixes
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
## Critical Instructions for io8 Workflow Execution
|
||||
|
||||
### Base Project Handling
|
||||
When working with a cloned base project:
|
||||
- **Append-only mode:** ONLY append content to existing predefined documents
|
||||
- **Preserve existing content:** Never overwrite or replace existing content
|
||||
- **Use existing file structure:** Work within the existing .sureai directory structure
|
||||
- **Agent-specific prompts:** Create agent-specific prompt files in the .sureai folder
|
||||
- **CRITICAL EXCEPTION - SPRING SECURITY FILES:** Do NOT modify any Spring Security configuration files. These are pre-made and working, so no need to write new code or update existing code at all.
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
#### CRITICAL OVERRIDE: Use existing dynamic codebase folders (do NOT create new frontend/ or backend/)
|
||||
- Frontend lives in `userprompt_timestamp-f-f/` and already contains the frontend codebase. Update code inside this folder. Do NOT create a new `frontend/` folder.
|
||||
- Backend lives in `authsec_springboot/backend/src/main/java/com/realnet` and already contains the backend codebase. Update code inside this folder ONLY. Do NOT create a new `backend/` folder.
|
||||
- Keep agent documents inside `.sureai/` as usual.
|
||||
|
||||
### Reference Inputs (Architecture & Tech Stack)
|
||||
- Before coding, read the architecture and tech stack documents generated earlier under the dynamic frontend folder:
|
||||
- `userprompt_timestamp-f-f/more-folders/.sureai/architecture_document.md`
|
||||
- `userprompt_timestamp-f-f/more-folders/.sureai/tech_stack_document.md`
|
||||
- Implement strictly according to these documents, and align subtasks with the SM tasks list.
|
||||
|
||||
### Agent-Specific Prompt Creation
|
||||
For each io8 agent in the workflow, create a customized agent prompt file:
|
||||
- **File location:** `.sureai/.io8{agent_name}_agent_{user_prompt}_{timestamp}.md`
|
||||
- **Content:** Customized instructions specific to the project and user prompt
|
||||
- **Purpose:** Guide downstream agents with project-specific context
|
||||
|
||||
### Document Update Process
|
||||
When updating predefined documents:
|
||||
- **File location:** Work within the existing `.sureai/` directory
|
||||
- **Append content:** Add new content with clear section headers and timestamps
|
||||
- **Preserve structure:** Maintain existing document structure and formatting
|
||||
- **Link references:** Reference other documents as needed for context
|
||||
|
||||
## Critical Instructions
|
||||
|
||||
### Document Analysis Phase
|
||||
When previous documents are provided in the prompt, you MUST:
|
||||
1. **Read and analyze the provided documents:**
|
||||
- If `@requirements_document.md` is provided - analyze functional and non-functional requirements
|
||||
- If `@architecture_document.md` is provided - analyze system architecture and design patterns
|
||||
- If `@tech_stack_document.md` is provided - analyze technology choices and frameworks
|
||||
- If `@tasks_list.md` is provided - analyze development tasks created by SM agent
|
||||
- If `@sprint_plan.md` is provided - analyze development timeline and priorities
|
||||
- If `@.sureai/coding-standard.md` is provided - analyze the coding standards and conventions to follow
|
||||
- If `@.sureai/ui-ux.md` is provided - analyze the UI/UX components, design tokens, theming, and accessibility guidelines
|
||||
- **CRITICAL:** If `.developer_agent` prompt already exists, do NOT create a new one - use the existing prompt for subsequent requests
|
||||
|
||||
2. **Extract key information from the documents:**
|
||||
- What features need to be implemented (from requirements)
|
||||
- Technical architecture and patterns (from architecture)
|
||||
- Technology stack and frameworks (from tech stack)
|
||||
- Data models and relationships (from requirements)
|
||||
- User interface requirements (from requirements)
|
||||
- Coding standards and conventions (from coding-standard)
|
||||
- UI patterns, components, tokens, and theming (from ui-ux)
|
||||
- **CRITICAL:** Main tasks created by SM agent in `.sureai/tasks_list.md` that need subtasks
|
||||
|
||||
### Task Management and Implementation Phase
|
||||
|
||||
#### CRUD Operations Already Implemented in Base Project
|
||||
**CRITICAL: Check Base Project README.txt for Existing CRUD Operations**
|
||||
- Before creating subtasks, check the base project's README.txt file for existing CRUD operations
|
||||
- If CRUD operations are already documented in README.txt (e.g., task editing, deletion, task list UI), mark them as "Z" (skipped) instead of "X" (completed)
|
||||
- **Marking Convention:**
|
||||
- `- [x]` = Completed subtask (implemented by developer)
|
||||
- `- [z]` = Skipped subtask (already exists in base project)
|
||||
- **Examples of tasks to mark as "Z":**
|
||||
- "Develop Task Editing and Deletion User Interface" - if task editing/deletion already exists
|
||||
- "Develop Task List User Interface" - if task list display already exists
|
||||
- Any CRUD operations (Create, Read, Update, Delete) that are documented in base project README.txt
|
||||
|
||||
#### Task Status Tracking
|
||||
When working with `.sureai/tasks_list.md` created by SM agent, you MUST:
|
||||
1. **Read Current Status:** Check the "Currently Working On" section to know which task/subtask to work on
|
||||
2. **Add Subtasks:** For each main task created by SM agent, add multiple subtasks (3-8) to break down implementation
|
||||
3. **Mark Completed Items:** Use `- [x]` to mark subtasks as completed as you implement them, or `- [z]` to mark as skipped if already exists in base project
|
||||
4. **Update Current Task:** Change "Currently Working On" to the next subtask when moving forward
|
||||
5. **Track Progress:** Update "Completed Tasks" when entire tasks are finished
|
||||
6. **Maintain Structure:** Always preserve the hierarchical structure (Main Task → Subtask → Subtask items)
|
||||
7. **Main Task Testing:** After completing ALL subtasks for a main task, test the entire main task functionality and append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header.
|
||||
8. **Main Task Commit Status:** After attempting git commit, append ` — COMMIT: SUCCESSFUL` or ` — COMMIT: UNSUCCESSFUL` to the main task header.
|
||||
9. **Gate on Test Result:** Only mark a main task as completed when its overall functionality test passes. If the test fails, fix the code and re-test until it passes.
|
||||
10. **Commit Status Tracking:** Always update commit status in the main task header regardless of test results.
|
||||
11. **Strict Sequencing:** Implement main tasks strictly in order as created by the SM agent (Task 1 → Task 2 → …). **Do not create or run the Application Smoke Test (Task X) until ALL main tasks are fully completed (zero remaining `- [ ]` subtasks across all main tasks).**
|
||||
12. **No Extraneous Output in tasks_list.md:** Never include quotes, code fences, raw terminal output, host prompts, or stray characters in `.sureai/tasks_list.md` (e.g., no `"""`, no `root@host:~#` lines). Keep it clean Markdown only.
|
||||
|
||||
#### Final Verification Task: Application Smoke Test
|
||||
After all other implementation tasks are complete, add a final main task called `Task X: Application Smoke Test` with subtasks:
|
||||
- [ ] Check project file structure using `tree -L 2` command to identify any missing files
|
||||
- [ ] Create any missing files found during structure check (e.g., userprompt_timestamp-f-f/src/reportWebVitals.js)
|
||||
- [ ] Install missing dependencies for backend (e.g., mvn clean install, gradle build, pip install -r requirements.txt)
|
||||
- [ ] Install missing dependencies for frontend (e.g., npm install)
|
||||
- [ ] Start the backend server.
|
||||
- [ ] Start the frontend development server.
|
||||
- [ ] Verify that both processes start without crashing. If an error occurs, analyze the logs, create a new subtask to fix the bug, and re-run the smoke test until it passes.
|
||||
|
||||
#### File Structure Verification and Dependency Installation
|
||||
**BEFORE starting any application servers, you MUST:**
|
||||
|
||||
1. **Check Project Structure:**
|
||||
```bash
|
||||
# Run this command to see the current project structure
|
||||
tree -L 2
|
||||
```
|
||||
|
||||
2. **Identify Missing Files:**
|
||||
- Look for common missing files like `userprompt_timestamp-f-f/src/reportWebVitals.js`
|
||||
- Check if all expected directories and files exist
|
||||
- Note any files that are referenced in code but missing from the filesystem
|
||||
|
||||
3. **Create Missing Files:**
|
||||
- If `userprompt_timestamp-f-f/src/reportWebVitals.js` is missing, create it with proper content
|
||||
- Create any other missing files that are referenced in the codebase
|
||||
- Ensure all imports and references resolve correctly
|
||||
|
||||
4. **Install Dependencies:**
|
||||
- **Backend:** Use the appropriate tool for the existing backend codebase in `userprompt_timestamp-b-b/` (e.g., `mvn clean install`, `./gradlew build`, `pip install -r requirements.txt`, `npm install` for Node backend)
|
||||
- **Frontend:** Run `npm install` inside `userprompt_timestamp-f-f/`
|
||||
- Install any missing system dependencies if needed
|
||||
|
||||
5. **Verify Dependencies:**
|
||||
- Ensure all required packages are installed
|
||||
- Check that import statements resolve correctly
|
||||
- Verify no missing module errors exist
|
||||
|
||||
**Only proceed to start applications after completing these steps.**
|
||||
|
||||
#### Missing File Detection and Resolution
|
||||
**CRITICAL: Always check for missing files before testing or starting applications**
|
||||
|
||||
1. **Common Missing Files to Check:**
|
||||
- `userprompt_timestamp-f-f/src/reportWebVitals.js` - Often referenced in React apps but missing
|
||||
- `userprompt_timestamp-f-f/src/setupTests.js` - Testing setup files
|
||||
- `userprompt_timestamp-f-f/src/index.css` - Main CSS files
|
||||
- Backend-specific configuration or resource files under `userprompt_timestamp-b-b/`
|
||||
|
||||
2. **Detection Commands:**
|
||||
```bash
|
||||
# Check project structure
|
||||
tree -L 2
|
||||
|
||||
# Check for specific missing files
|
||||
find userprompt_timestamp-f-f/ -name "*.js" -o -name "*.ts" -o -name "*.css" | head -20
|
||||
```
|
||||
|
||||
3. **Resolution Steps:**
|
||||
- Create missing files with appropriate content
|
||||
- Install missing dependencies
|
||||
- Fix import/require statements
|
||||
- Verify all references resolve correctly
|
||||
|
||||
4. **Example: Creating Missing reportWebVitals.js:**
|
||||
```bash
|
||||
# If userprompt_timestamp-f-f/src/reportWebVitals.js is missing, create it:
|
||||
cat > userprompt_timestamp-f-f/src/reportWebVitals.js << 'EOF'
|
||||
const reportWebVitals = (onPerfEntry) => {
|
||||
if (onPerfEntry && onPerfEntry instanceof Function) {
|
||||
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||
getCLS(onPerfEntry);
|
||||
getFID(onPerfEntry);
|
||||
getFCP(onPerfEntry);
|
||||
getLCP(onPerfEntry);
|
||||
getTTFB(onPerfEntry);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
export default reportWebVitals;
|
||||
EOF
|
||||
```
|
||||
|
||||
5. **Before Application Start:**
|
||||
- Run `tree -L 2` to verify structure
|
||||
- Install all dependencies (backend in `userprompt_timestamp-b-b/`, frontend in `userprompt_timestamp-f-f/`)
|
||||
- Check for any missing file errors
|
||||
- Only proceed when all files and dependencies are present
|
||||
|
||||
#### Implementation Workflow
|
||||
For each subtask you implement:
|
||||
1. **Start Subtask:** Update "Currently Working On" to the current subtask
|
||||
2. **Implement Code:** Create all necessary code files for the subtask
|
||||
3. **Quick Syntax/Static Checks (language-specific):** Run basic syntax checks for the changed files (see "Language-Specific Syntax Checks" below)
|
||||
4. **Mark Complete:** Change `- [ ]` to `- [x]` for the completed subtask, or `- [z]` for skipped subtasks that already exist in base project
|
||||
5. **Move to Next:** Update "Currently Working On" to the next subtask
|
||||
6. **Update Status:** If a task is fully completed, add it to "Completed Tasks"
|
||||
|
||||
**MAIN TASK TESTING PHASE:**
|
||||
After completing ALL subtasks for a main task:
|
||||
1. **Verify File Structure:** Run `tree -L 2` to check for any missing files
|
||||
2. **Create Missing Files:** If any files are missing (e.g., userprompt_timestamp-f-f/src/reportWebVitals.js), create them with proper content
|
||||
3. **Install Dependencies:** Ensure all required packages are installed (backend in `userprompt_timestamp-b-b/`, frontend in `userprompt_timestamp-f-f/`)
|
||||
4. **Write and Run Unit Tests (Main-Task Scope):** Author unit tests that cover the main task's acceptance criteria and core flows, then execute them
|
||||
- Backend tests in the technology-appropriate path under `userprompt_timestamp-b-b/`
|
||||
- Frontend tests under `userprompt_timestamp-f-f/src/__tests__/` or `tests/`
|
||||
5. **Update Test Status:** Append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header
|
||||
6. **Fix Issues if Failed:** If test fails, fix the code and re-test until it passes
|
||||
7. **Mark Main Task Complete:** Only mark the main task as complete after testing passes
|
||||
|
||||
#### Main Task Verification & Logging (Required)
|
||||
For each main task (after all its subtasks are complete):
|
||||
- **Author Main-Task Tests:** Create or update unit tests that validate the main task's acceptance criteria and error paths (backend under `userprompt_timestamp-b-b/`, frontend under `userprompt_timestamp-f-f/src/__tests__/` or `tests/`).
|
||||
- **Run Required Checks:**
|
||||
- Backend (if applicable): Java (Maven/Gradle) or language-specific checks in `userprompt_timestamp-b-b/`.
|
||||
- Frontend (if applicable): `npm install` in `userprompt_timestamp-f-f/`; if TS present: `npx -y tsc --noEmit || true`; if ESLint present: `npx -y eslint . || true`; if build script exists: `npm run build || true`; run tests (`npx -y jest --runInBand` or `npx -y vitest run`).
|
||||
- **Log Result:** Append a concise entry to `.sureai/dev_test_log.md` documenting the main task name, commands executed, outcome (PASS/FAIL), and brief notes.
|
||||
- **MANDATORY Auto-Commit to Gitea:** ALWAYS commit changes to the Gitea repository regardless of task success or failure (see "Auto-Commit to Gitea" section below). This is MANDATORY even if tests fail.
|
||||
- **Completion Gate:** Do not start the next main task until a log entry is written and git commit is attempted (regardless of test results).
|
||||
|
||||
#### Auto-Commit to Gitea (MANDATORY After Each Main Task)
|
||||
**CRITICAL: This commit is MANDATORY regardless of task success or failure.** Always commit changes after each main task, even if tests fail or the task is incomplete. This ensures progress is saved and can be reviewed.
|
||||
|
||||
1. **Extract Project Name from io8 MCP Response:**
|
||||
- Read `.sureai/io8_mcp/responses/create_project.out` (JSON format)
|
||||
- Extract `projectResp.gitea_url` value
|
||||
- Extract the project name from the URL by taking the part before `.git`
|
||||
- Example: If `gitea_url` is `http://157.66.191.31:3000/risadmin_prod/calculator_app_10_053520.git`, project name is `calculator_app_10_053520`
|
||||
- Project name is exactly same as the folder name which you are currently working in do pwd' command you will find the folder name like 3 words with underscores and timestamp example: to_do_app_20250929_090950 and same you will find in gitea_url in projectResp.gitea_url.
|
||||
|
||||
2. **Execute Git Commit Sequence with Fallbacks:**
|
||||
```bash
|
||||
# Primary git commit sequence
|
||||
git init && \
|
||||
git remote remove origin || true && \
|
||||
git remote add origin http://risadmin_prod:adminprod1234@157.66.191.31:3000/risadmin_prod/${projectName}.git && \
|
||||
git fetch origin main || true && \
|
||||
git checkout -B main && \
|
||||
git branch -u origin/main main || true && \
|
||||
git pull origin main --allow-unrelated-histories || true && \
|
||||
git add . && \
|
||||
(git diff --cached --quiet || git commit -m "[COMMIT_MESSAGE]") && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# If primary sequence fails, try fallback commands:
|
||||
# Fallback 1: Force commit with empty flag
|
||||
git add . && git commit -m "[COMMIT_MESSAGE]" --allow-empty && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# Fallback 2: Reset and recommit
|
||||
git reset --soft HEAD && git add . && git commit -m "[COMMIT_MESSAGE]" && \
|
||||
(git push -u origin main || git push -u origin main --force-with-lease)
|
||||
|
||||
# Fallback 3: Force push (last resort)
|
||||
git push -u origin main --force
|
||||
```
|
||||
|
||||
3. **Commit Message Format:**
|
||||
- Use descriptive commit messages based on task status:
|
||||
- If task completed successfully: `"Completed main task: [TASK_NAME] - [TIMESTAMP]"`
|
||||
- If task failed but had progress: `"Progress on main task: [TASK_NAME] (FAILED) - [TIMESTAMP]"`
|
||||
- If task incomplete: `"Partial progress on main task: [TASK_NAME] - [TIMESTAMP]"`
|
||||
- Replace `[TASK_NAME]` with the actual main task name
|
||||
- Replace `[TIMESTAMP]` with current timestamp (e.g., `2025-01-15_14-30-25`)
|
||||
|
||||
4. **Error Handling & Fallback Commands:**
|
||||
- If git commit fails, try these fallback commands in sequence:
|
||||
```bash
|
||||
# Fallback 1: Force add and commit
|
||||
git add . && git commit -m "[COMMIT_MESSAGE]" --allow-empty
|
||||
|
||||
# Fallback 2: Reset and force commit
|
||||
git reset --soft HEAD && git add . && git commit -m "[COMMIT_MESSAGE]"
|
||||
|
||||
# Fallback 3: Force push with lease
|
||||
git push -u origin main --force-with-lease
|
||||
|
||||
# Fallback 4: If all else fails, force push (use with caution)
|
||||
git push -u origin main --force
|
||||
```
|
||||
- If all fallback commands fail, log the error and continue with the next main task
|
||||
- Always attempt the commit even if previous commits failed
|
||||
- **CRITICAL:** Never skip git commit - always try multiple approaches until one succeeds
|
||||
|
||||
5. **Logging:**
|
||||
- Log successful commits to `.sureai/dev_test_log.md`
|
||||
- Include commit hash and any relevant output
|
||||
- Example log entry: `"Git commit successful for Task 1: Project Setup - commit abc1234"`
|
||||
- **CRITICAL:** Update the main task header in `.sureai/tasks_list.md` with commit status:
|
||||
- If commit succeeds: Append ` — COMMIT: SUCCESSFUL` to the main task header
|
||||
- If commit fails: Append ` — COMMIT: UNSUCCESSFUL` to the main task header
|
||||
|
||||
6. **Timing:**
|
||||
- Execute git commit immediately after main task completion (regardless of test results)
|
||||
- Do not proceed to the next main task until git commit is attempted
|
||||
- If git commit fails, still proceed to next task but note the failure
|
||||
- **CRITICAL:** Commit happens even if the main task failed - this preserves any progress made
|
||||
|
||||
7. **Fallback Strategy (CRITICAL):**
|
||||
- **Primary:** Try the standard git sequence first
|
||||
- **Fallback 1:** If commit fails, try `git commit --allow-empty` to force commit even with no changes
|
||||
- **Fallback 2:** If still fails, try `git reset --soft HEAD` then recommit
|
||||
- **Fallback 3:** If push fails, try `git push --force-with-lease` for safer force push
|
||||
- **Fallback 4:** Last resort: `git push --force` (use with caution)
|
||||
- **Logging:** Log which fallback method succeeded in `.sureai/dev_test_log.md`
|
||||
- **Never Give Up:** Always try all fallback methods before declaring failure
|
||||
|
||||
8. **Common Git Error Scenarios & Solutions:**
|
||||
- **"Nothing to commit":** Use `git commit --allow-empty` to force commit
|
||||
- **"Branch is behind":** Use `git push --force-with-lease` for safe force push
|
||||
- **"Remote rejected":** Try `git pull --rebase` then `git push`
|
||||
- **"Authentication failed":** Verify credentials in the URL are correct
|
||||
- **"Repository not found":** Check if project name extraction is correct
|
||||
- **"Merge conflicts":** Use `git reset --hard HEAD` then retry
|
||||
- **"Detached HEAD":** Use `git checkout -B main` to create/switch to main branch
|
||||
|
||||
9. **Main Task Header Status Examples:**
|
||||
- **Successful task with successful commit:** `## Task 1: Project Setup — TEST: PASS — COMMIT: SUCCESSFUL`
|
||||
- **Failed task with successful commit:** `## Task 2: Backend Setup — TEST: FAIL — COMMIT: SUCCESSFUL`
|
||||
- **Successful task with failed commit:** `## Task 3: Frontend Setup — TEST: PASS — COMMIT: UNSUCCESSFUL`
|
||||
- **Failed task with failed commit:** `## Task 4: Database Setup — TEST: FAIL — COMMIT: UNSUCCESSFUL`
|
||||
|
||||
### Code Implementation Phase
|
||||
Based on the provided documents, create working code files using Gemini CLI:
|
||||
|
||||
1. **Use Gemini CLI to create files directly:**
|
||||
```bash
|
||||
# Example: Create a file within the dynamic frontend folder
|
||||
mkdir -p userprompt_timestamp-f-f/src
|
||||
cat > userprompt_timestamp-f-f/src/example.js << 'EOF'
|
||||
export const example = () => 'ok';
|
||||
EOF
|
||||
```
|
||||
|
||||
2. **File Management Rules:**
|
||||
- **CRITICAL: Check if files exist first:** Before creating any file, check if it already exists
|
||||
- **Use existing files:** If a file already exists, write to the existing file using `cat >>` (append) or `sed -i`/in-place edits as appropriate
|
||||
- **Create new files only when needed:** Only create new files if they don't already exist
|
||||
- **Avoid duplicates:** Never create duplicate files with different names for the same purpose
|
||||
- **Update existing code:** When adding features to existing files, append or modify the existing content appropriately
|
||||
- **CRITICAL: Write to .sureai/ folder:** All agent documents (tasks_list.md, etc.) must be written to the `.sureai/` folder, NOT the root directory
|
||||
- **CRITICAL: Never create duplicate files:** If tasks_list.md exists in `.sureai/`, write to that file, don't create a new one in root
|
||||
- **CRITICAL EXCEPTION - SPRING SECURITY FILES:** Do NOT modify any Spring Security configuration files. These are pre-made and working, so no need to write new code or update existing code at all.
|
||||
- **CRITICAL BACKEND DIRECTORY:** For Spring Boot projects, ALL backend code MUST be written in `authsec_springboot/backend/src/main/java/com/realnet` directory. No backend code should be written anywhere else.
|
||||
|
||||
3. **Create all necessary files:**
|
||||
- Backend application files under `authsec_springboot/backend/src/main/java/com/realnet` (Java/Spring Boot, etc.)
|
||||
- Frontend files under `userprompt_timestamp-f-f/` (Angular/React/etc.)
|
||||
- Configuration files as required (prefer co-locating with the respective dynamic folder)
|
||||
- Database schemas and migrations (backend dynamic folder)
|
||||
- API endpoints and routes
|
||||
- Templates and static files
|
||||
|
||||
4. **Folder Organization Rules:**
|
||||
- **Backend code ONLY in `authsec_springboot/backend/src/main/java/com/realnet`**
|
||||
- **Frontend code ONLY in `userprompt_timestamp-f-f/`**
|
||||
- **Configuration files:** Root only if pre-existing; otherwise under the respective dynamic folders
|
||||
- **Agent documents in `.sureai/` folder**
|
||||
- **Maintain separation; update in place**
|
||||
|
||||
### Implementation Guidelines
|
||||
1. **Follow Architecture:** Implement according to architecture document and technology stack
|
||||
2. **Code Quality:** Write clean, readable code with proper error handling
|
||||
3. **File Organization:**
|
||||
- Backend code in `authsec_springboot/backend/src/main/java/com/realnet`
|
||||
- Frontend code in `userprompt_timestamp-f-f/`
|
||||
- Configuration files at root only if pre-existing; otherwise keep under the respective dynamic folders
|
||||
- Agent documents in `.sureai/` folder
|
||||
4. **Follow Standards and UI/UX:** If available, follow `.sureai/coding-standard.md` and `.sureai/ui-ux.md`.
|
||||
5. **Handle Missing Files:** Always check for missing files before testing or starting applications:
|
||||
- Run `tree -L 2` to verify project structure
|
||||
- Look for common missing files like `userprompt_timestamp-f-f/src/reportWebVitals.js`
|
||||
- Create missing files with appropriate content
|
||||
- Install all dependencies before proceeding
|
||||
|
||||
### Language-Specific Unit Test Commands
|
||||
- **Java (JUnit via Maven/Gradle):**
|
||||
- Maven (in backend folder): `(cd userprompt_timestamp-b-b && mvn -q -DskipITs test)`
|
||||
- Gradle: `(cd userprompt_timestamp-b-b && ./gradlew test)`
|
||||
- **TypeScript/JavaScript (Jest or Vitest):**
|
||||
- Create tests under `userprompt_timestamp-f-f/src/__tests__/` or `tests/`
|
||||
- Run (Jest): `(cd userprompt_timestamp-f-f && npx -y jest --runInBand)`
|
||||
- Run (Vitest): `(cd userprompt_timestamp-f-f && npx -y vitest run)`
|
||||
- **Python (if applicable):**
|
||||
- Create tests under backend path inside `userprompt_timestamp-b-b/`
|
||||
- Run: `pytest -q`
|
||||
|
||||
### Language-Specific Syntax Checks
|
||||
After writing code for a subtask (and before marking it complete), run quick syntax/static checks based on the language(s) you modified:
|
||||
- **TypeScript:** If `tsconfig.json` exists in `userprompt_timestamp-f-f/`: `(cd userprompt_timestamp-f-f && npx -y tsc --noEmit)`
|
||||
- **JavaScript (Node):** If ESLint configured: `(cd userprompt_timestamp-f-f && npx -y eslint . || true)`
|
||||
- **Java:** Compile changed sources with Maven/Gradle in `userprompt_timestamp-b-b/`
|
||||
- **Bash/Shell:** `bash -n <script.sh>`
|
||||
|
||||
Only run the checks relevant to the languages present in the project.
|
||||
|
||||
### Application Execution Commands (for Smoke Test)
|
||||
- **Java/Spring Boot:** `(cd userprompt_timestamp-b-b && mvn spring-boot:run)` or Gradle equivalent
|
||||
- **Node/React/Angular Frontend:** `(cd userprompt_timestamp-f-f && npm start)`
|
||||
|
||||
**CRITICAL:** If the application fails to start, diagnose, fix, and retry until it runs successfully.
|
||||
|
||||
### Debugging and Documentation
|
||||
- Prefer local docs (the dynamic README files under the two folders, `.sureai/*` docs) to keep context aligned with the current codebase.
|
||||
|
||||
### Output Requirements
|
||||
**Update the existing `.sureai/tasks_list.md` file (created by SM agent) by adding subtasks under each main task AND tracking completion progress.**
|
||||
- **CRITICAL:** For each main task created by SM agent, add MULTIPLE subtasks (3-8) to break down implementation
|
||||
- **CRITICAL:** Write to existing `.sureai/tasks_list.md` created by SM agent, NOT create new files in root
|
||||
- **CRITICAL:** Mark completed subtasks with `- [x]` and skipped subtasks with `- [z]` (for CRUD operations already in base project)
|
||||
- **CRITICAL:** Focus on development subtasks only - NO testing tasks (handled by Tester agent)
|
||||
- Create all necessary code files under the two dynamic folders as required
|
||||
|
||||
### Short Template Example
|
||||
**Before (SM agent creates in .sureai/tasks_list.md):**
|
||||
```markdown
|
||||
## Task 1: Project Setup
|
||||
Set up the basic project structure and environment.
|
||||
|
||||
## Current Task Status
|
||||
**Currently Working On:** Task 1 - Project Setup
|
||||
**Completed Tasks:** None
|
||||
```
|
||||
|
||||
**After (Developer adds subtasks to existing .sureai/tasks_list.md created by SM agent):**
|
||||
```markdown
|
||||
## Task 1: Project Setup — TEST: PASS — COMMIT: SUCCESSFUL
|
||||
Set up the basic project structure and environment.
|
||||
|
||||
### 1.1 Directory Structure
|
||||
- [x] Create project folders
|
||||
- [x] Set up tooling
|
||||
- [x] Create initial config files
|
||||
|
||||
### 1.2 Dependencies
|
||||
- [x] Install required packages (backend/frontend)
|
||||
- [x] Create/update configuration files
|
||||
|
||||
## Current Task Status
|
||||
**Currently Working On:** Task 2 - Backend Setup
|
||||
**Completed Tasks:** Task 1 - Project Setup
|
||||
```
|
||||
|
||||
**CRITICAL: Developer ONLY writes development-related subtasks, NOT testing tasks. Testing tasks are handled by the Tester agent. Developer performs main-task testing within tasks_list.md.**
|
||||
|
||||
### Task Completion Tracking Rules
|
||||
1. **Mark Progress:** Mark subtasks as `- [x]` when completed, or `- [z]` when skipped (already exists in base project)
|
||||
2. **Update Current Task:** Change "Currently Working On" to next subtask
|
||||
3. **Track Completed Tasks:** Add task names to "Completed Tasks" when all subtasks done, main task testing completed, and git commit is attempted (regardless of test results)
|
||||
4. **CRITICAL:** Write to existing `.sureai/tasks_list.md` created by SM agent, never create new files
|
||||
5. **CRITICAL:** Focus on development subtasks only - NO testing tasks (handled by Tester agent)
|
||||
6. **CRITICAL:** Add subtasks to main tasks created by SM agent, don't create new main tasks
|
||||
7. **CRITICAL:** Test entire main task functionality after all subtasks complete, append ` — TEST: PASS` or ` — TEST: FAIL` to the main task header
|
||||
8. **CRITICAL:** MANDATORY auto-commit to Gitea after each main task completion - this happens regardless of task success or failure
|
||||
|
||||
### Important Notes
|
||||
- **CRITICAL:** Use the existing dynamic folders `userprompt_timestamp-b-b/` and `userprompt_timestamp-f-f/`. Do NOT create new `backend/` or `frontend/` folders.
|
||||
- **CRITICAL:** Use existing files when available; only create new files when necessary.
|
||||
- **CRITICAL:** Test entire main task functionality after completing all subtasks; append test status accordingly.
|
||||
- **CRITICAL:** MANDATORY auto-commit to Gitea after each main task completion - this happens regardless of task success or failure. Extract project name from `.sureai/io8_mcp/responses/create_project.out` and use the same git command sequence as the frontend button.
|
||||
- **CRITICAL:** Even if a main task fails, commit the progress made - this preserves work and allows for review and continuation.
|
||||
- Complete all subtasks sequentially without stopping, then test the main task as a whole, then MANDATORY commit to Gitea
|
||||
|
||||
### Anti-Blank Screen File Validation (CRITICAL)
|
||||
**CRITICAL: Before completing any frontend subtask, validate that all frontend files contain actual content.**
|
||||
|
||||
#### Mandatory File Checks
|
||||
After creating ANY frontend file, immediately verify:
|
||||
|
||||
1. **Check for Empty Files:**
|
||||
```bash
|
||||
# Check for completely empty files
|
||||
find userprompt_timestamp-f-f/ -type f -empty
|
||||
|
||||
# Check for files smaller than minimum sizes
|
||||
find userprompt_timestamp-f-f/ -name "*.html" -size -100c
|
||||
find userprompt_timestamp-f-f/ -name "*.js" -size -50c
|
||||
find userprompt_timestamp-f-f/ -name "*.css" -size -20c
|
||||
```
|
||||
|
||||
2. **Validate Critical Files:**
|
||||
- **userprompt_timestamp-f-f/src/index.html:** Must contain DOCTYPE, head, body, and `<div id="root"></div>`
|
||||
- **userprompt_timestamp-f-f/src/index.js:** Must contain React imports and `createRoot(document.getElementById('root'))`
|
||||
- **userprompt_timestamp-f-f/src/App.js:** Must contain functional component that renders visible content
|
||||
- **userprompt_timestamp-f-f/src/index.css:** Must contain basic styling
|
||||
- **userprompt_timestamp-f-f/package.json:** Must contain valid JSON with dependencies
|
||||
|
||||
3. **Quick Validation Commands:**
|
||||
```bash
|
||||
# Verify file content exists
|
||||
cat userprompt_timestamp-f-f/src/index.html
|
||||
cat userprompt_timestamp-f-f/src/index.js
|
||||
cat userprompt_timestamp-f-f/src/App.js
|
||||
|
||||
# Check file sizes
|
||||
wc -c userprompt_timestamp-f-f/src/index.html userprompt_timestamp-f-f/src/index.js userprompt_timestamp-f-f/src/App.js
|
||||
|
||||
# Verify key content
|
||||
grep -q "root" userprompt_timestamp-f-f/src/index.html && echo "✓ Root element found" || echo "✗ Missing root element"
|
||||
grep -q "createRoot" userprompt_timestamp-f-f/src/index.js && echo "✓ React 18 setup found" || echo "✗ Missing React setup"
|
||||
grep -q "function App" userprompt_timestamp-f-f/src/App.js && echo "✓ App component found" || echo "✗ Missing App component"
|
||||
```
|
||||
#### Blank Screen Prevention Checklist
|
||||
**After all frontend subtask complete, verify:**
|
||||
- [ ] All frontend files have content (not empty)
|
||||
- [ ] userprompt_timestamp-f-f/src/index.html contains complete HTML with root element
|
||||
- [ ] userprompt_timestamp-f-f/src/index.js contains React rendering code
|
||||
- [ ] userprompt_timestamp-f-f/src/App.js contains functional component
|
||||
- [ ] userprompt_timestamp-f-f/src/index.css contains basic styling
|
||||
- [ ] userprompt_timestamp-f-f/package.json contains valid JSON with dependencies
|
||||
|
||||
**CRITICAL: Never mark a frontend subtask complete until all files are validated. Empty files cause blank screens.**
|
||||
|
||||
=== AGENT INSTRUCTIONS ===
|
||||
Provide detailed, actionable output that the next agent in the sequence can use.
|
||||
|
||||
Focus on your area of expertise and build upon the work already completed.
|
||||
|
||||
If sequential documents are available, reference them in your analysis and recommendations.
|
||||
|
||||
=== MEMORY (Recent runs) ===
|
||||
- [2025-10-09T04:47:50.103235] prompt: Simple Notes Taking App
|
||||
workflow: fc90877e-a494-4f97-8b7f-062395602ae3
|
||||
completed: io8sm
|
||||
remaining: io8developer
|
||||
- [2025-10-09T05:35:50.654684] prompt: Simple Notes Taking App
|
||||
workflow: fc90877e-a494-4f97-8b7f-062395602ae3
|
||||
completed: io8project_builder, io8directory_structure, io8codermaster, io8analyst, io8architect, io8pm, io8sm
|
||||
remaining: io8developer, io8devops
|
||||
- [2025-10-09T05:36:00.079120] prompt: Simple Notes Taking App
|
||||
workflow: fc90877e-a494-4f97-8b7f-062395602ae3
|
||||
completed: io8project_builder, io8directory_structure, io8codermaster, io8analyst, io8architect, io8pm, io8sm
|
||||
remaining: io8developer, io8devops
|
||||
|
||||
=== MEMORY JSON (Latest) ===
|
||||
{
|
||||
"prompt": "Simple Notes Taking App",
|
||||
"workflow_id": "fc90877e-a494-4f97-8b7f-062395602ae3",
|
||||
"agents_progress": {
|
||||
"completed": [
|
||||
"io8project_builder",
|
||||
"io8directory_structure",
|
||||
"io8codermaster",
|
||||
"io8analyst",
|
||||
"io8architect",
|
||||
"io8pm",
|
||||
"io8sm"
|
||||
],
|
||||
"remaining": [
|
||||
"io8developer",
|
||||
"io8devops"
|
||||
]
|
||||
},
|
||||
"agents_details": {}
|
||||
}
|
||||
|
||||
USER PROMPT:
|
||||
Simple Notes Taking App
|
||||
|
||||
REFERENCE FILES:
|
||||
@.sureai/.developer_agent_simple_notes_taking_simple_notes_taking_20251009_044730.md
|
||||
@.sureai/tasks_list.md
|
||||
@.sureai/architecture_document.md
|
||||
@.sureai/tech_stack_document.md
|
||||
@.sureai/common-bug.md
|
||||
@.sureai/.directory_structure.txt
|
||||
@.sureai/.code_tree.txt
|
||||
|
||||
INSTRUCTIONS:
|
||||
1. Read the Developer agent prompt from the reference file above
|
||||
2. Analyze the user prompt, existing tasks list, architecture, and tech stack documents
|
||||
3. Update the existing `.sureai/tasks_list.md` by adding subtasks under each main task
|
||||
4. Implement all the code files based on the tasks and architecture
|
||||
5. Mark completed subtasks with `- [x]` and update "Currently Working On" status
|
||||
6. Create all necessary backend and frontend code files
|
||||
7. Follow the directory structure and use existing files when available
|
||||
8. Ensure all code is functional and follows the architecture specifications
|
||||
|
||||
IMPORTANT:
|
||||
- Do NOT create a separate subtasks_list.md file
|
||||
- Update the existing `.sureai/tasks_list.md` by adding subtasks under each main task
|
||||
- Mark completed subtasks with `- [x]` when they are fully implemented
|
||||
- Keep "Currently Working On" status accurate and current
|
||||
- Create all code files directly using your file system access
|
||||
- Use relative paths from project root (e.g., `backend/src/app.py`, not `backend/`)
|
||||
|
||||
Update the tasks_list.md with subtasks, implement completion tracking, and create all code files based on the reference files and existing directory structure:
|
||||
@ -4,7 +4,7 @@ import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
const routes: Routes = [
|
||||
{path: '', redirectTo: 'login', pathMatch: 'full'},
|
||||
{ path: 'notes', loadChildren: () => import('./modules/notes/notes.module').then(m => m.NotesModule) }
|
||||
{ path: 'notes', loadChildren: () => import('./notes/notes.module').then(m => m.NotesModule) }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
|
||||
@ -1,3 +1,26 @@
|
||||
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
<clr-main-container>
|
||||
<clr-header>
|
||||
<div class="branding">
|
||||
<a href="#" class="nav-link">
|
||||
<clr-icon shape="vm-bug"></clr-icon>
|
||||
<span class="title">Simple Notes</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="header-nav" [clr-nav-level]="1">
|
||||
<a class="nav-link active" routerLink="/notes" routerLinkActive="active"><span class="nav-text">Notes</span></a>
|
||||
</div>
|
||||
</clr-header>
|
||||
|
||||
<div class="content-container">
|
||||
<clr-vertical-nav [clrVerticalNavCollapsible]="true">
|
||||
<a clrVerticalNavLink routerLink="/notes" routerLinkActive="active">
|
||||
<clr-icon clrVerticalNavIcon shape="note"></clr-icon>
|
||||
Notes
|
||||
</a>
|
||||
</clr-vertical-nav>
|
||||
|
||||
<main class="content-area">
|
||||
<router-outlet></router-outlet>
|
||||
</main>
|
||||
</div>
|
||||
</clr-main-container>
|
||||
@ -1,7 +1,10 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { NotesListComponent } from './note-list/note-list.component';
|
||||
|
||||
const routes: Routes = [];
|
||||
const routes: Routes = [
|
||||
{ path: '', component: NotesListComponent }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
|
||||
@ -3,6 +3,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { NotesRoutingModule } from './notes-routing.module';
|
||||
import { ClarityModule } from '@clr/angular';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { NotesListComponent } from './note-list/note-list.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
||||
@ -0,0 +1,75 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { RouterTestingModule } from '@angular/router/testing';
|
||||
import { of } from 'rxjs';
|
||||
import { NoteDetailComponent } from '../note-detail/note-detail.component';
|
||||
import { NoteService } from '../../services/note.service';
|
||||
import { ClarityModule } from '@clr/angular';
|
||||
|
||||
describe('NoteDetailComponent', () => {
|
||||
let component: NoteDetailComponent;
|
||||
let fixture: ComponentFixture<NoteDetailComponent>;
|
||||
let noteServiceSpy: jasmine.SpyObj<NoteService>;
|
||||
let router: Router;
|
||||
let activatedRoute: ActivatedRoute;
|
||||
|
||||
const mockNote = { id: '1', title: 'Test Note', content: 'Test Content', createdAt: '2023-01-01', updatedAt: '2023-01-01' };
|
||||
|
||||
beforeEach(async () => {
|
||||
noteServiceSpy = jasmine.createSpyObj('NoteService', ['getNoteById', 'deleteNote']);
|
||||
noteServiceSpy.getNoteById.and.returnValue(of(mockNote));
|
||||
noteServiceSpy.deleteNote.and.returnValue(of(void 0));
|
||||
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NoteDetailComponent ],
|
||||
imports: [ ClarityModule, RouterTestingModule.withRoutes([]) ],
|
||||
providers: [
|
||||
{ provide: NoteService, useValue: noteServiceSpy },
|
||||
{ provide: ActivatedRoute, useValue: { paramMap: of({ get: (key: string) => '1' }) } }
|
||||
]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NoteDetailComponent);
|
||||
component = fixture.componentInstance;
|
||||
router = TestBed.inject(Router);
|
||||
activatedRoute = TestBed.inject(ActivatedRoute);
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should load note on init', () => {
|
||||
expect(noteServiceSpy.getNoteById).toHaveBeenCalledWith('1');
|
||||
expect(component.note).toEqual(mockNote);
|
||||
});
|
||||
|
||||
it('should navigate to edit on editNote', () => {
|
||||
spyOn(router, 'navigate');
|
||||
component.note = mockNote;
|
||||
component.editNote();
|
||||
expect(router.navigate).toHaveBeenCalledWith(['/notes/edit', mockNote.id]);
|
||||
});
|
||||
|
||||
it('should delete note on deleteNote confirmation', () => {
|
||||
spyOn(window, 'confirm').and.returnValue(true);
|
||||
spyOn(router, 'navigate');
|
||||
component.note = mockNote;
|
||||
component.deleteNote();
|
||||
expect(noteServiceSpy.deleteNote).toHaveBeenCalledWith(mockNote.id);
|
||||
expect(router.navigate).toHaveBeenCalledWith(['/notes']);
|
||||
});
|
||||
|
||||
it('should not delete note on deleteNote cancellation', () => {
|
||||
spyOn(window, 'confirm').and.returnValue(false);
|
||||
spyOn(router, 'navigate');
|
||||
component.note = mockNote;
|
||||
component.deleteNote();
|
||||
expect(noteServiceSpy.deleteNote).not.toHaveBeenCalled();
|
||||
expect(router.navigate).not.toHaveBeenCalledWith(['/notes']);
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,72 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { RouterTestingModule } from '@angular/router/testing';
|
||||
import { of } from 'rxjs';
|
||||
import { NoteListComponent } from '../note-list/note-list.component';
|
||||
import { NoteService } from '../../services/note.service';
|
||||
import { ClarityModule } from '@clr/angular';
|
||||
|
||||
describe('NoteListComponent', () => {
|
||||
let component: NoteListComponent;
|
||||
let fixture: ComponentFixture<NoteListComponent>;
|
||||
let noteServiceSpy: jasmine.SpyObj<NoteService>;
|
||||
|
||||
const mockNotes = [
|
||||
{ id: '1', title: 'Test Note 1', content: 'Content 1', createdAt: '2023-01-01', updatedAt: '2023-01-01' },
|
||||
{ id: '2', title: 'Test Note 2', content: 'Content 2', createdAt: '2023-01-02', updatedAt: '2023-01-02' }
|
||||
];
|
||||
|
||||
beforeEach(async () => {
|
||||
noteServiceSpy = jasmine.createSpyObj('NoteService', ['getNotes', 'deleteNote']);
|
||||
noteServiceSpy.getNotes.and.returnValue(of(mockNotes));
|
||||
noteServiceSpy.deleteNote.and.returnValue(of(void 0));
|
||||
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NoteListComponent ],
|
||||
imports: [ RouterTestingModule, ClarityModule ],
|
||||
providers: [ { provide: NoteService, useValue: noteServiceSpy } ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NoteListComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should load notes on init', () => {
|
||||
expect(noteServiceSpy.getNotes).toHaveBeenCalled();
|
||||
expect(component.notes.length).toBe(2);
|
||||
expect(component.notes).toEqual(mockNotes);
|
||||
});
|
||||
|
||||
it('should navigate to detail on viewNote', () => {
|
||||
const router = TestBed.inject(Router);
|
||||
spyOn(router, 'navigate');
|
||||
component.viewNote(mockNotes[0]);
|
||||
expect(router.navigate).toHaveBeenCalledWith(['/notes', mockNotes[0].id]);
|
||||
});
|
||||
|
||||
it('should navigate to edit on editNote', () => {
|
||||
const router = TestBed.inject(Router);
|
||||
spyOn(router, 'navigate');
|
||||
component.editNote(mockNotes[0]);
|
||||
expect(router.navigate).toHaveBeenCalledWith(['/notes/edit', mockNotes[0].id]);
|
||||
});
|
||||
|
||||
it('should delete note on deleteNote confirmation', () => {
|
||||
spyOn(window, 'confirm').and.returnValue(true);
|
||||
component.deleteNote(mockNotes[0]);
|
||||
expect(noteServiceSpy.deleteNote).toHaveBeenCalledWith(mockNotes[0].id);
|
||||
});
|
||||
|
||||
it('should not delete note on deleteNote cancellation', () => {
|
||||
spyOn(window, 'confirm').and.returnValue(false);
|
||||
component.deleteNote(mockNotes[0]);
|
||||
expect(noteServiceSpy.deleteNote).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,33 @@
|
||||
<div class="clr-row clr-justify-content-center">
|
||||
<div class="clr-col-lg-8 clr-col-md-10 clr-col-12">
|
||||
<div class="card" *ngIf="note">
|
||||
<div class="card-header">
|
||||
{{ note.title }}
|
||||
<div class="card-actions">
|
||||
<button class="btn btn-sm btn-link" (click)="editNote()">Edit</button>
|
||||
<button class="btn btn-sm btn-link" (click)="deleteNote()">Delete</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-block">
|
||||
<p>{{ note.content }}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="clr-row">
|
||||
<div class="clr-col-6">Created: {{ note.createdAt | date:'short' }}</div>
|
||||
<div class="clr-col-6 clr-text-right">Updated: {{ note.updatedAt | date:'short' }}</div>
|
||||
</div>
|
||||
<button class="btn btn-link" (click)="goBack()">Back to Notes</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card" *ngIf="!note">
|
||||
<div class="card-header">Note Not Found</div>
|
||||
<div class="card-block">
|
||||
<p>The requested note could not be found.</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<button class="btn btn-link" (click)="goBack()">Back to Notes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,6 @@
|
||||
/* Add component-specific styles here if needed */
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
@ -0,0 +1,59 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { Note } from '../../models/note.model';
|
||||
import { NoteService } from '../../services/note.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-note-detail',
|
||||
templateUrl: './note-detail.component.html',
|
||||
styleUrls: ['./note-detail.component.scss']
|
||||
})
|
||||
export class NoteDetailComponent implements OnInit {
|
||||
note: Note | undefined;
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private noteService: NoteService
|
||||
) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this.route.paramMap.subscribe(params => {
|
||||
const id = params.get('id');
|
||||
if (id) {
|
||||
this.noteService.getNoteById(id).subscribe(
|
||||
(note) => {
|
||||
this.note = note;
|
||||
},
|
||||
(error) => {
|
||||
console.error('Error loading note:', error);
|
||||
this.router.navigate(['/notes']); // Redirect to list if note not found
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
editNote(): void {
|
||||
if (this.note) {
|
||||
this.router.navigate(['/notes', this.note.id, 'edit']);
|
||||
}
|
||||
}
|
||||
|
||||
deleteNote(): void {
|
||||
if (this.note && confirm('Are you sure you want to delete this note?')) {
|
||||
this.noteService.deleteNote(this.note.id).subscribe(
|
||||
() => {
|
||||
this.router.navigate(['/notes']);
|
||||
},
|
||||
(error) => {
|
||||
console.error('Error deleting note:', error);
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
goBack(): void {
|
||||
this.router.navigate(['/notes']);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,26 @@
|
||||
<div class="clr-row">
|
||||
<div class="clr-col-lg-8 clr-col-md-10 clr-col-12">
|
||||
<form clrForm [formGroup]="noteForm" (ngSubmit)="onSubmit()">
|
||||
<clr-input-container>
|
||||
<label>Title</label>
|
||||
<input clrInput type="text" formControlName="title" placeholder="Note Title" />
|
||||
<clr-control-error *clrIfError="'required'">Title is required</clr-control-error>
|
||||
<clr-control-error *clrIfError="'maxlength'">Title cannot be more than 100 characters</clr-control-error>
|
||||
</clr-input-container>
|
||||
|
||||
<clr-textarea-container>
|
||||
<label>Content</label>
|
||||
<textarea clrTextarea formControlName="content" placeholder="Note Content"></textarea>
|
||||
</clr-textarea-container>
|
||||
|
||||
<div class="clr-form-control clr-row clr-justify-content-start">
|
||||
<div class="clr-col-12 clr-col-sm-auto">
|
||||
<button class="btn btn-primary" type="submit" [disabled]="!noteForm.valid">Save</button>
|
||||
</div>
|
||||
<div class="clr-col-12 clr-col-sm-auto">
|
||||
<button class="btn btn-outline" type="button" (click)="onCancel()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,4 @@
|
||||
/* Add component-specific styles here if needed */
|
||||
.clr-form-control {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
@ -0,0 +1,44 @@
|
||||
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||
import { Note } from '../../models/note.model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-note-form',
|
||||
templateUrl: './note-form.component.html',
|
||||
styleUrls: ['./note-form.component.scss']
|
||||
})
|
||||
export class NoteFormComponent implements OnInit {
|
||||
@Input() note: Note | null = null;
|
||||
@Output() saveNote = new EventEmitter<Note>();
|
||||
@Output() cancel = new EventEmitter<void>();
|
||||
|
||||
noteForm: FormGroup;
|
||||
|
||||
constructor(private fb: FormBuilder) {
|
||||
this.noteForm = this.fb.group({
|
||||
title: ['', [Validators.required, Validators.maxLength(100)]],
|
||||
content: ['']
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
if (this.note) {
|
||||
this.noteForm.patchValue(this.note);
|
||||
}
|
||||
}
|
||||
|
||||
onSubmit(): void {
|
||||
if (this.noteForm.valid) {
|
||||
const noteToSave: Note = {
|
||||
...this.note, // Keep existing id, createdAt, updatedAt if editing
|
||||
...this.noteForm.value,
|
||||
updatedAt: new Date().toISOString() // Update updatedAt on save
|
||||
};
|
||||
this.saveNote.emit(noteToSave);
|
||||
}
|
||||
}
|
||||
|
||||
onCancel(): void {
|
||||
this.cancel.emit();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,35 @@
|
||||
<div class="clr-row clr-justify-content-center">
|
||||
<div class="clr-col-lg-8 clr-col-md-10 clr-col-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
Notes List
|
||||
<button class="btn btn-sm btn-primary-outline" (click)="createNewNote()">
|
||||
<clr-icon shape="plus"></clr-icon> New Note
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-block">
|
||||
<clr-datagrid>
|
||||
<clr-dg-column>Title</clr-dg-column>
|
||||
<clr-dg-column>Created At</clr-dg-column>
|
||||
<clr-dg-column>Updated At</clr-dg-column>
|
||||
<clr-dg-column>Actions</clr-dg-column>
|
||||
|
||||
<clr-dg-row *clrDgItems="let note of notes">
|
||||
<clr-dg-cell>{{ note.title }}</clr-dg-cell>
|
||||
<clr-dg-cell>{{ note.createdAt | date:'short' }}</clr-dg-cell>
|
||||
<clr-dg-cell>{{ note.updatedAt | date:'short' }}</clr-dg-cell>
|
||||
<clr-dg-cell>
|
||||
<div class="btn-group-sm">
|
||||
<button class="btn btn-link" (click)="viewNote(note.id)">View</button>
|
||||
<button class="btn btn-link" (click)="editNote(note.id)">Edit</button>
|
||||
<button class="btn btn-link" (click)="deleteNote(note.id)">Delete</button>
|
||||
</div>
|
||||
</clr-dg-cell>
|
||||
</clr-dg-row>
|
||||
|
||||
<clr-dg-footer>{{notes.length}} notes</clr-dg-footer>
|
||||
</clr-datagrid>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,6 @@
|
||||
/* Add component-specific styles here if needed */
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
@ -0,0 +1,56 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Note } from '../../models/note.model';
|
||||
import { NoteService } from '../../services/note.service';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'app-note-list',
|
||||
templateUrl: './note-list.component.html',
|
||||
styleUrls: ['./note-list.component.scss']
|
||||
})
|
||||
export class NoteListComponent implements OnInit {
|
||||
notes: Note[] = [];
|
||||
selectedNote: Note | null = null;
|
||||
|
||||
constructor(private noteService: NoteService, private router: Router) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
this.loadNotes();
|
||||
}
|
||||
|
||||
loadNotes(): void {
|
||||
this.noteService.getNotes().subscribe(
|
||||
(notes) => {
|
||||
this.notes = notes;
|
||||
},
|
||||
(error) => {
|
||||
console.error('Error loading notes:', error);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
viewNote(noteId: string): void {
|
||||
this.router.navigate(['/notes', noteId]);
|
||||
}
|
||||
|
||||
editNote(noteId: string): void {
|
||||
this.router.navigate(['/notes', noteId, 'edit']);
|
||||
}
|
||||
|
||||
deleteNote(noteId: string): void {
|
||||
if (confirm('Are you sure you want to delete this note?')) {
|
||||
this.noteService.deleteNote(noteId).subscribe(
|
||||
() => {
|
||||
this.loadNotes();
|
||||
},
|
||||
(error) => {
|
||||
console.error('Error deleting note:', error);
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
createNewNote(): void {
|
||||
this.router.navigate(['/notes/new']);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,18 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { NoteListComponent } from './note-list/note-list.component';
|
||||
import { NoteDetailComponent } from './note-detail/note-detail.component';
|
||||
import { NoteFormComponent } from './note-form/note-form.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{ path: '', component: NoteListComponent },
|
||||
{ path: 'new', component: NoteFormComponent },
|
||||
{ path: ':id', component: NoteDetailComponent },
|
||||
{ path: ':id/edit', component: NoteFormComponent }
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class NotesRoutingModule { }
|
||||
@ -0,0 +1,28 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ClarityModule } from '@clr/angular';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
|
||||
import { NotesRoutingModule } from './notes-routing.module';
|
||||
import { NoteListComponent } from './note-list/note-list.component';
|
||||
import { NoteDetailComponent } from './note-detail/note-detail.component';
|
||||
import { NoteFormComponent } from './note-form/note-form.component';
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
NoteListComponent,
|
||||
NoteDetailComponent,
|
||||
NoteFormComponent
|
||||
],
|
||||
imports: [
|
||||
CommonModule,
|
||||
NotesRoutingModule,
|
||||
ClarityModule,
|
||||
ReactiveFormsModule
|
||||
],
|
||||
exports: [
|
||||
NoteFormComponent
|
||||
]
|
||||
})
|
||||
export class NotesModule { }
|
||||
@ -0,0 +1,13 @@
|
||||
const reportWebVitals = (onPerfEntry) => {
|
||||
if (onPerfEntry && onPerfEntry instanceof Function) {
|
||||
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||
getCLS(onPerfEntry);
|
||||
getFID(onPerfEntry);
|
||||
getFCP(onPerfEntry);
|
||||
getLCP(onPerfEntry);
|
||||
getTTFB(onPerfEntry);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
export default reportWebVitals;
|
||||
Loading…
x
Reference in New Issue
Block a user