Compare commits
203 Commits
f46654f574
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ea326a10b4 | ||
|
|
f97c5e8ec4 | ||
|
|
4d029d3ebe | ||
|
|
5eba211061 | ||
|
|
f44a0f9c68 | ||
|
|
a99d1dafb2 | ||
|
|
5aa7202abe | ||
|
|
02b835fb13 | ||
|
|
d1336b1fea | ||
|
|
6e13b6d207 | ||
|
|
4d95234e32 | ||
|
|
eb6cda9d24 | ||
|
|
f7da22d409 | ||
|
|
3d783ac9e2 | ||
|
|
fbeea7027c | ||
|
|
1f5dc6af09 | ||
|
|
a84c7e80d6 | ||
|
|
a9e43d7594 | ||
|
|
df2b9c2c7b | ||
|
|
d586048b52 | ||
|
|
5821e2c96f | ||
|
|
261eee2953 | ||
|
|
45fc178589 | ||
|
|
6536180e91 | ||
|
|
ee9d6650a2 | ||
|
|
c8bed7f138 | ||
|
|
a2d8d90e3d | ||
|
|
8b454b9cf4 | ||
|
|
36b5724b72 | ||
|
|
ce1a13801f | ||
|
|
c271754cfa | ||
|
|
03a3fb7411 | ||
|
|
e72ca26f97 | ||
|
|
cf5d6a202b | ||
|
|
06c771ee9d | ||
|
|
a7e3646ae6 | ||
|
|
6b44d35c40 | ||
|
|
72f9798e97 | ||
|
|
e48152e294 | ||
|
|
d48312dfc2 | ||
|
|
f9d79365f3 | ||
|
|
58fe5eb54f | ||
|
|
73a3d206b0 | ||
|
|
03dcde44ca | ||
|
|
10101e5918 | ||
|
|
56ce662d38 | ||
|
|
1d17fe2f9a | ||
|
|
030baac309 | ||
|
|
b8c85be40f | ||
|
|
19d446f78e | ||
|
|
ac66d672d6 | ||
|
|
1d4f935683 | ||
|
|
7a9da7f97b | ||
|
|
89d2ffad46 | ||
|
|
a1b39959de | ||
|
|
334fce5fc1 | ||
|
|
a1399a3d7b | ||
|
|
1fc790f0c7 | ||
|
|
1fc6728259 | ||
|
|
056b0260cf | ||
|
|
40292f4c00 | ||
|
|
be500189c3 | ||
|
|
1b61c2c54e | ||
|
|
b3fb46fc52 | ||
|
|
96e7902f01 | ||
|
|
902fe95a69 | ||
|
|
31e882856c | ||
|
|
eab4b3e27b | ||
|
|
52c4cb1dee | ||
|
|
e9e829e579 | ||
|
|
4d96605144 | ||
|
|
40f30155c2 | ||
|
|
128aa842f1 | ||
|
|
35c79ffd1c | ||
|
|
87efb807f3 | ||
|
|
ce596fa947 | ||
|
|
af277f418a | ||
|
|
e07af2084b | ||
|
|
018db001b4 | ||
|
|
af3f130549 | ||
|
|
ee70e74bf5 | ||
|
|
5b13a88b72 | ||
|
|
cb4c1cc9ad | ||
|
|
de83d34a15 | ||
|
|
acbfba85b1 | ||
|
|
3a1e4254df | ||
|
|
17594124b0 | ||
|
|
1774544385 | ||
|
|
3f3d37ebeb | ||
|
|
722cb905e4 | ||
|
|
a2d1926e6e | ||
|
|
e02a9d9a53 | ||
|
|
a6cdcba76f | ||
|
|
1d614dd9c0 | ||
|
|
299836bd74 | ||
|
|
723f7ef432 | ||
|
|
dd28b4f0bd | ||
|
|
52d213da67 | ||
|
|
c9b98065b6 | ||
|
|
85b7e6e396 | ||
|
|
6084077b54 | ||
|
|
2ec31a3de5 | ||
|
|
2ec2654282 | ||
|
|
c21cbf84a1 | ||
|
|
5b9930b02e | ||
|
|
a4238dc204 | ||
|
|
4750686b9f | ||
|
|
82f87b65cb | ||
|
|
b9a80f9e64 | ||
|
|
eff906d187 | ||
|
|
08d190eb03 | ||
|
|
104af3149f | ||
|
|
940c3daf62 | ||
|
|
f7b62009cf | ||
|
|
7fedfa8f50 | ||
|
|
d5b409c1ac | ||
|
|
83110200d5 | ||
|
|
ba3ab3422a | ||
|
|
5246ed41e9 | ||
|
|
2723e06b80 | ||
|
|
fccad72d47 | ||
|
|
a623454347 | ||
|
|
a8785ed4f1 | ||
|
|
cecd8ff27d | ||
|
|
76a8135567 | ||
|
|
8d8e8a20f4 | ||
|
|
7e88eb64f8 | ||
|
|
ff0fae9ae7 | ||
|
|
c266359f63 | ||
|
|
2272fa498a | ||
|
|
b77783ed95 | ||
|
|
87d2b72313 | ||
|
|
5b36b3cf1c | ||
|
|
d0dda2ddc2 | ||
|
|
42aa374be6 | ||
|
|
c21c2d113a | ||
|
|
e711a3501d | ||
|
|
b012869119 | ||
|
|
a1c1729904 | ||
|
|
3edbc2daf3 | ||
|
|
1b56af9743 | ||
|
|
0fa8978395 | ||
|
|
1121b8c345 | ||
|
|
e7290d6f9c | ||
|
|
12d1e3dfdd | ||
|
|
d06ea93f11 | ||
|
|
725bf2c445 | ||
|
|
d2145f761d | ||
|
|
45877db706 | ||
|
|
0ef12f7399 | ||
|
|
7c8695cacf | ||
|
|
9ba30b8644 | ||
|
|
7d939e4998 | ||
|
|
aeedb2846f | ||
|
|
c7d2e35ea6 | ||
|
|
cd1be630d2 | ||
|
|
c415d93945 | ||
|
|
79fd6553b7 | ||
|
|
8571080037 | ||
|
|
5703d5bd49 | ||
|
|
cd54a983c3 | ||
|
|
aff8e688a5 | ||
|
|
435de0a30c | ||
|
|
b825bdb8b2 | ||
|
|
1e00b01bc3 | ||
|
|
4218470830 | ||
|
|
6f8121e937 | ||
|
|
212420ec62 | ||
|
|
3ee07c5f55 | ||
|
|
51d6334f8a | ||
|
|
6005a2122d | ||
|
|
c741bd1972 | ||
|
|
40cfdc9357 | ||
|
|
c53f292603 | ||
|
|
3fee8d8bbf | ||
|
|
f4208780fd | ||
|
|
9e23c078e9 | ||
|
|
45fd501953 | ||
|
|
8eb8f551fc | ||
|
|
6b4ed8514f | ||
|
|
dae56187fc | ||
|
|
7cc2a9ea3b | ||
|
|
6703e75bf3 | ||
|
|
11a07adee7 | ||
|
|
3b2570d981 | ||
|
|
4bfa7c6b69 | ||
|
|
e3369e03b5 | ||
|
|
a5342eba4b | ||
|
|
3a08350568 | ||
|
|
67e9a6e3dd | ||
|
|
6309b652e8 | ||
|
|
457c6fa626 | ||
|
|
f5608372dc | ||
|
|
66bac83a9a | ||
|
|
529fb7a935 | ||
|
|
da4b5d18be | ||
|
|
ad8b8b815e | ||
|
|
e3cb1307d3 | ||
|
|
07ace46dd3 | ||
|
|
493108f957 | ||
|
|
9da92b8edd | ||
|
|
473cdb549a | ||
|
|
3cae8a2e99 |
142
.agents/skills/find-skills/SKILL.md
Normal file
142
.agents/skills/find-skills/SKILL.md
Normal file
@@ -0,0 +1,142 @@
|
||||
---
|
||||
name: find-skills
|
||||
description: Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
|
||||
---
|
||||
|
||||
# Find Skills
|
||||
|
||||
This skill helps you discover and install skills from the open agent skills ecosystem.
|
||||
|
||||
## When to Use This Skill
|
||||
|
||||
Use this skill when the user:
|
||||
|
||||
- Asks "how do I do X" where X might be a common task with an existing skill
|
||||
- Says "find a skill for X" or "is there a skill for X"
|
||||
- Asks "can you do X" where X is a specialized capability
|
||||
- Expresses interest in extending agent capabilities
|
||||
- Wants to search for tools, templates, or workflows
|
||||
- Mentions they wish they had help with a specific domain (design, testing, deployment, etc.)
|
||||
|
||||
## What is the Skills CLI?
|
||||
|
||||
The Skills CLI (`npx skills`) is the package manager for the open agent skills ecosystem. Skills are modular packages that extend agent capabilities with specialized knowledge, workflows, and tools.
|
||||
|
||||
**Key commands:**
|
||||
|
||||
- `npx skills find [query] [--owner <owner>]` - Search for skills interactively or by keyword, optionally scoped to a GitHub owner
|
||||
- `npx skills add <package>` - Install a skill from GitHub or other sources
|
||||
- `npx skills check` - Check for skill updates
|
||||
- `npx skills update` - Update all installed skills
|
||||
|
||||
**Browse skills at:** https://skills.sh/
|
||||
|
||||
## How to Help Users Find Skills
|
||||
|
||||
### Step 1: Understand What They Need
|
||||
|
||||
When a user asks for help with something, identify:
|
||||
|
||||
1. The domain (e.g., React, testing, design, deployment)
|
||||
2. The specific task (e.g., writing tests, creating animations, reviewing PRs)
|
||||
3. Whether this is a common enough task that a skill likely exists
|
||||
|
||||
### Step 2: Check the Leaderboard First
|
||||
|
||||
Before running a CLI search, check the [skills.sh leaderboard](https://skills.sh/) to see if a well-known skill already exists for the domain. The leaderboard ranks skills by total installs, surfacing the most popular and battle-tested options.
|
||||
|
||||
For example, top skills for web development include:
|
||||
- `vercel-labs/agent-skills` — React, Next.js, web design (100K+ installs each)
|
||||
- `anthropics/skills` — Frontend design, document processing (100K+ installs)
|
||||
|
||||
### Step 3: Search for Skills
|
||||
|
||||
If the leaderboard doesn't cover the user's need, run the find command:
|
||||
|
||||
```bash
|
||||
npx skills find [query] [--owner <owner>]
|
||||
```
|
||||
|
||||
For example:
|
||||
|
||||
- User asks "how do I make my React app faster?" → `npx skills find react performance`
|
||||
- User asks "can you help me with PR reviews?" → `npx skills find pr review`
|
||||
- User asks "I need to create a changelog" → `npx skills find changelog`
|
||||
|
||||
### Step 4: Verify Quality Before Recommending
|
||||
|
||||
**Do not recommend a skill based solely on search results.** Always verify:
|
||||
|
||||
1. **Install count** — Prefer skills with 1K+ installs. Be cautious with anything under 100.
|
||||
2. **Source reputation** — Official sources (`vercel-labs`, `anthropics`, `microsoft`) are more trustworthy than unknown authors.
|
||||
3. **GitHub stars** — Check the source repository. A skill from a repo with <100 stars should be treated with skepticism.
|
||||
|
||||
### Step 5: Present Options to the User
|
||||
|
||||
When you find relevant skills, present them to the user with:
|
||||
|
||||
1. The skill name and what it does
|
||||
2. The install count and source
|
||||
3. The install command they can run
|
||||
4. A link to learn more at skills.sh
|
||||
|
||||
Example response:
|
||||
|
||||
```
|
||||
I found a skill that might help! The "react-best-practices" skill provides
|
||||
React and Next.js performance optimization guidelines from Vercel Engineering.
|
||||
(185K installs)
|
||||
|
||||
To install it:
|
||||
npx skills add vercel-labs/agent-skills@react-best-practices
|
||||
|
||||
Learn more: https://skills.sh/vercel-labs/agent-skills/react-best-practices
|
||||
```
|
||||
|
||||
### Step 6: Offer to Install
|
||||
|
||||
If the user wants to proceed, you can install the skill for them:
|
||||
|
||||
```bash
|
||||
npx skills add <owner/repo@skill> -g -y
|
||||
```
|
||||
|
||||
The `-g` flag installs globally (user-level) and `-y` skips confirmation prompts.
|
||||
|
||||
## Common Skill Categories
|
||||
|
||||
When searching, consider these common categories:
|
||||
|
||||
| Category | Example Queries |
|
||||
| --------------- | ---------------------------------------- |
|
||||
| Web Development | react, nextjs, typescript, css, tailwind |
|
||||
| Testing | testing, jest, playwright, e2e |
|
||||
| DevOps | deploy, docker, kubernetes, ci-cd |
|
||||
| Documentation | docs, readme, changelog, api-docs |
|
||||
| Code Quality | review, lint, refactor, best-practices |
|
||||
| Design | ui, ux, design-system, accessibility |
|
||||
| Productivity | workflow, automation, git |
|
||||
|
||||
## Tips for Effective Searches
|
||||
|
||||
1. **Use specific keywords**: "react testing" is better than just "testing"
|
||||
2. **Try alternative terms**: If "deploy" doesn't work, try "deployment" or "ci-cd"
|
||||
3. **Check popular sources**: Many skills come from `vercel-labs/agent-skills` or `ComposioHQ/awesome-claude-skills`
|
||||
|
||||
## When No Skills Are Found
|
||||
|
||||
If no relevant skills exist:
|
||||
|
||||
1. Acknowledge that no existing skill was found
|
||||
2. Offer to help with the task directly using your general capabilities
|
||||
3. Suggest the user could create their own skill with `npx skills init`
|
||||
|
||||
Example:
|
||||
|
||||
```
|
||||
I searched for skills related to "xyz" but didn't find any matches.
|
||||
I can still help you with this task directly! Would you like me to proceed?
|
||||
|
||||
If this is something you do often, you could create your own skill:
|
||||
npx skills init my-xyz-skill
|
||||
```
|
||||
@@ -31,7 +31,9 @@
|
||||
"mcp__zai-mcp-server__analyze_image",
|
||||
"Bash(npx prisma *)",
|
||||
"Bash(xargs -I{} ls {})",
|
||||
"Bash(node_modules/.bin/tsc --noEmit)"
|
||||
"Bash(node_modules/.bin/tsc --noEmit)",
|
||||
"Bash(python3 /home/devparsa/dev/Momento/_bmad/scripts/resolve_customization.py --skill /home/devparsa/dev/Momento/.claude/skills/bmad-agent-analyst --key agent)",
|
||||
"Bash(unzip -l /home/devparsa/dev/Momento/memento-note/extension/memento-web-clipper-chrome-store.zip)"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,24 +1,72 @@
|
||||
{
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/0c6fb2d9-1b82-4ca3-b0f4-f8373a62faca/0c6fb2d9-1b82-4ca3-b0f4-f8373a62faca.jsonl": 1778182618469,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/137b1f4b-59d9-4ce6-8d74-01f7cbae2ba7/137b1f4b-59d9-4ce6-8d74-01f7cbae2ba7.jsonl": 1778966645519,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/16214191-7091-4aef-a309-f922d351d79f.jsonl": 1779909977869,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/16214191-7091-4aef-a309-f922d351d79f.jsonl": 1779911218415,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/106b4ed1-1305-459a-bc51-a868f74ae8ed.jsonl": 1779663104529,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/2c9092f9-a673-46f8-83e3-f581c163efad.jsonl": 1779603239708,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/2f857168-9a7e-4b49-bd58-9c03c7323e3a.jsonl": 1779698370371,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/35f87c99-cea4-4cc2-8061-7327b65be5c8.jsonl": 1779629959373,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/43896b0f-286f-40ef-afcc-8ab38ac791a1.jsonl": 1779632608794,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/456c9498-caf4-4fb8-974f-84fd08825112.jsonl": 1779639839217,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/4a15f5aa-adba-4448-a04c-5116d3963ae0.jsonl": 1779665958349,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/5a3ecd13-c94d-4f95-8603-2196fc3dc2ff.jsonl": 1779910037067,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/5de1ff5f-8122-44dd-abec-ec92171082ff.jsonl": 1779612012789,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/6145ac4f-4bd4-4873-9fa5-8567e6dbeeab.jsonl": 1779692411702,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/8f3177e4-49d3-4178-a58f-cceb8cca7fc1.jsonl": 1779737949557,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/921b4981-f949-4855-ba62-84e9c0db5ee8.jsonl": 1779647030219,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/98014b6d-83e5-44c8-b808-f98eb29fb4a1.jsonl": 1779619178702,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/a7a904f4-86df-4829-b77e-4beabd9b059e.jsonl": 1779649674956,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/a84a4496-811b-4012-aca4-2244045cbbff.jsonl": 1779660980933,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/b0e765c1-5ee7-4beb-bd77-0f9b9a151923.jsonl": 1779660980513,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/c03896af-576a-43ab-a799-4f16bab35269.jsonl": 1779644786488,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/c37d717d-f2e2-4dd0-9ed9-839ceeb1cc4d.jsonl": 1779660981864,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/16214191-7091-4aef-a309-f922d351d79f/subagents/c86141a3-3209-4b9a-9766-07aea5dc9a69.jsonl": 1779658292250,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/2e0ce74c-a31e-49d8-a0d0-a8b224813533/2e0ce74c-a31e-49d8-a0d0-a8b224813533.jsonl": 1778188935902,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/38000361-5c66-4032-8e1e-ef405e843de0/38000361-5c66-4032-8e1e-ef405e843de0.jsonl": 1778968570815,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/394af47d-c5cd-4cef-bef2-2192717439f8.jsonl": 1778951280378,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/subagents/0927d889-66b3-4007-87b4-15f8ad9e01f0.jsonl": 1778951401282,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/subagents/0ddd911c-403c-4d90-a189-069679758338.jsonl": 1778951533153,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/subagents/59f0c95a-415f-440a-bae2-96020aca9033.jsonl": 1778951400523,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/subagents/dc63a53e-55bc-4175-b49e-637b408138ac.jsonl": 1778951399831,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/394af47d-c5cd-4cef-bef2-2192717439f8/subagents/f0ad176d-04d7-4d9a-82b8-65273acd313a.jsonl": 1778946728971,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/401dfc2b-5e6d-4479-8702-7b544e6de7de/401dfc2b-5e6d-4479-8702-7b544e6de7de.jsonl": 1781970053022,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/5039e847-3035-4f43-b184-46aeceb06764/5039e847-3035-4f43-b184-46aeceb06764.jsonl": 1778838518325,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/5039e847-3035-4f43-b184-46aeceb06764/subagents/e13034a9-05cf-47e3-afa0-f6b142866ab1.jsonl": 1778837589740,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/5923e37e-370d-4867-95d0-751622982859/5923e37e-370d-4867-95d0-751622982859.jsonl": 1778968000388,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/5ac57758-0a3c-4502-9473-b63413a39013/5ac57758-0a3c-4502-9473-b63413a39013.jsonl": 1778921288478,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/5ac57758-0a3c-4502-9473-b63413a39013/subagents/b2833767-42d4-4d3f-952e-b961ea5538d3.jsonl": 1778917054076,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/65570f8a-5cd2-4573-b2d9-0983f2922d1f/65570f8a-5cd2-4573-b2d9-0983f2922d1f.jsonl": 1778231172346,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/65570f8a-5cd2-4573-b2d9-0983f2922d1f/subagents/b9a447c6-5a63-4882-b878-5aee9756ce25.jsonl": 1778227602626,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/65570f8a-5cd2-4573-b2d9-0983f2922d1f/subagents/e2881041-49a0-4dca-8df1-614a7a070038.jsonl": 1778226771429,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/7b6c0ed0-caad-4157-b048-535452685b73/7b6c0ed0-caad-4157-b048-535452685b73.jsonl": 1778852401511,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/8c2fc9f5-c359-4c67-a0f5-325ee44cebc9/8c2fc9f5-c359-4c67-a0f5-325ee44cebc9.jsonl": 1778751052502,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/90c791ad-a274-4673-b5f6-ec1bccaccc98/90c791ad-a274-4673-b5f6-ec1bccaccc98.jsonl": 1779566465299,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/90c791ad-a274-4673-b5f6-ec1bccaccc98/subagents/1f1b2143-916d-4398-a8e0-4bfb993df3d7.jsonl": 1779547337406,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/92d73875-5939-48fb-9f68-86c88b0f2ff7/92d73875-5939-48fb-9f68-86c88b0f2ff7.jsonl": 1778966017038,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/92d73875-5939-48fb-9f68-86c88b0f2ff7/subagents/401ab052-4346-4e0d-8ca9-108c0a5b1a61.jsonl": 1778964224375,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/9902a438-467f-4d57-8f43-28e7d579a95f/9902a438-467f-4d57-8f43-28e7d579a95f.jsonl": 1778839341001,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/a64d78ce-86d3-4ec8-8f79-7589ad05a62c/a64d78ce-86d3-4ec8-8f79-7589ad05a62c.jsonl": 1778846298067,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/a7a904f4-86df-4829-b77e-4beabd9b059e/a7a904f4-86df-4829-b77e-4beabd9b059e.jsonl": 1779649690323,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/af84066e-c0c2-435e-8caf-73037ebf4320/af84066e-c0c2-435e-8caf-73037ebf4320.jsonl": 1779569075175,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/b85430f3-4520-47fd-9b4b-5200ca340a36/b85430f3-4520-47fd-9b4b-5200ca340a36.jsonl": 1779039005865,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/b85430f3-4520-47fd-9b4b-5200ca340a36/subagents/f973ca95-be8f-4c00-a00d-4f026e5bd4dc.jsonl": 1779026546575,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ca85061e-6af9-4250-8dc7-9c3bb4839c48/ca85061e-6af9-4250-8dc7-9c3bb4839c48.jsonl": 1778849848444,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ca85061e-6af9-4250-8dc7-9c3bb4839c48/subagents/3bbaec3b-7dce-4eee-916e-7673710c1e13.jsonl": 1778848753214,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/d92dfb04-c148-4a14-a48a-39d4c634caee/d92dfb04-c148-4a14-a48a-39d4c634caee.jsonl": 1778861502433,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/e3745f62-c3b9-4a21-8942-71bc6f603f77/e3745f62-c3b9-4a21-8942-71bc6f603f77.jsonl": 1778018654221
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/e3745f62-c3b9-4a21-8942-71bc6f603f77/e3745f62-c3b9-4a21-8942-71bc6f603f77.jsonl": 1778018654221,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/e3745f62-c3b9-4a21-8942-71bc6f603f77/subagents/f028b51a-8a84-4a45-8866-95cb05ca9727.jsonl": 1778014992372,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ea18d177-228d-4e44-8e79-8957e6f2da39/ea18d177-228d-4e44-8e79-8957e6f2da39.jsonl": 1781975528735,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ea18d177-228d-4e44-8e79-8957e6f2da39/subagents/375b2e07-202f-4e8e-9e80-718bbdf88005.jsonl": 1781973640324,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ea18d177-228d-4e44-8e79-8957e6f2da39/subagents/6cba0291-51b3-42d9-939c-2e95d01128f8.jsonl": 1781975383642,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ea18d177-228d-4e44-8e79-8957e6f2da39/subagents/d6546245-4e3f-47dd-bc3e-39e1af726138.jsonl": 1781973598054,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/ec2b194c-c67e-4089-a434-6daff69ca69d.jsonl": 1783196585431,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/2bb8ea12-29cb-4456-a5ee-af86d7a427a3.jsonl": 1783196591937,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/372b1e4e-cc60-4117-b3c1-48af0dbc38d9.jsonl": 1782059598659,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/8ad24313-529f-41f7-96b3-dc6314e94c72.jsonl": 1782633223580,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/993325c9-a748-4183-9b2d-866cc0d73338.jsonl": 1782056882673,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/99e20a50-1e7b-4ed8-931a-5c4c7a65ea4d.jsonl": 1782037965469,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/ec2b194c-c67e-4089-a434-6daff69ca69d/subagents/e483aeb3-3b38-4f7f-9ad8-d79f362c102d.jsonl": 1782058095940,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/f0ad176d-04d7-4d9a-82b8-65273acd313a/subagents/96507ccc-6150-4260-a55c-94abd2b57441.jsonl": 1778946698447,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/fb7fd15f-b9ef-490b-a1de-8238ea026e53/fb7fd15f-b9ef-490b-a1de-8238ea026e53.jsonl": 1780001507987,
|
||||
"/home/devparsa/.cursor/projects/home-devparsa-dev-Momento/agent-transcripts/fb7fd15f-b9ef-490b-a1de-8238ea026e53/subagents/a5601ff1-7934-4872-acd8-266e416c3680.jsonl": 1779998536313
|
||||
}
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
{
|
||||
"version": 1,
|
||||
"lastRunAtMs": 1779909959153,
|
||||
"turnsSinceLastRun": 4,
|
||||
"lastTranscriptMtimeMs": 1779909958790.594,
|
||||
"lastProcessedGenerationId": "5bd39ea3-9f17-44d1-8aed-3cc8f3673e97",
|
||||
"lastRunAtMs": 1783196565768,
|
||||
"turnsSinceLastRun": 7,
|
||||
"lastTranscriptMtimeMs": 1783196565691.0437,
|
||||
"lastProcessedGenerationId": "71df05a3-2a54-46fa-aa10-c8b8357c33fd",
|
||||
"trialStartedAtMs": null
|
||||
}
|
||||
|
||||
@@ -1,121 +1,80 @@
|
||||
# =============================================================================
|
||||
# Memento - Docker Environment Configuration
|
||||
# =============================================================================
|
||||
# Copy this file to .env.docker and update with your values.
|
||||
# This file is read by docker-compose.yml via env_file directive.
|
||||
# cp .env.docker.example .env.docker
|
||||
## AUTO-MANAGED BY CI — do not edit manually ##
|
||||
## This is a reference template. Real values come from Gitea vars/secrets. ##
|
||||
|
||||
# =============================================================================
|
||||
# APPLICATION URL (REQUIRED)
|
||||
# =============================================================================
|
||||
# Change to your server IP or domain
|
||||
# Examples:
|
||||
# IP: http://192.168.1.190:3000
|
||||
# Domain: http://notes.yourdomain.com
|
||||
# HTTPS: https://notes.yourdomain.com
|
||||
NEXTAUTH_URL="http://localhost:3000"
|
||||
# Core
|
||||
NEXTAUTH_URL=https://memento-note.com
|
||||
NEXTAUTH_SECRET=<secret>
|
||||
ADMIN_EMAIL=admin@example.com
|
||||
ALLOW_REGISTRATION=true
|
||||
|
||||
# =============================================================================
|
||||
# AUTHENTICATION SECRET (REQUIRED)
|
||||
# =============================================================================
|
||||
# Generate with: openssl rand -base64 32
|
||||
NEXTAUTH_SECRET="changethisinproduction"
|
||||
|
||||
# =============================================================================
|
||||
# REGISTRATION & ADMIN
|
||||
# =============================================================================
|
||||
# Set to "false" to disable public registration (default: true)
|
||||
# ALLOW_REGISTRATION=true
|
||||
|
||||
# Admin email - The first user registering with this email gets ADMIN role (REQUIRED)
|
||||
# ADMIN_EMAIL="admin@yourdomain.com"
|
||||
|
||||
# Google OAuth — both required to show "Continue with Google" on /login
|
||||
# Redirect URI in Google Console: {NEXTAUTH_URL}/api/auth/callback/google
|
||||
# AUTH_GOOGLE_ID="....apps.googleusercontent.com"
|
||||
# AUTH_GOOGLE_SECRET="GOCSPX-..."
|
||||
|
||||
# =============================================================================
|
||||
# POSTGRESQL CONFIGURATION
|
||||
# =============================================================================
|
||||
POSTGRES_PORT=5432
|
||||
POSTGRES_DB=memento
|
||||
# PostgreSQL (used by docker-compose to construct DATABASE_URL)
|
||||
POSTGRES_USER=memento
|
||||
POSTGRES_PASSWORD=memento
|
||||
POSTGRES_PASSWORD=<secret>
|
||||
POSTGRES_DB=memento
|
||||
POSTGRES_PORT=5433
|
||||
|
||||
# =============================================================================
|
||||
# MCP SERVER CONFIGURATION
|
||||
# =============================================================================
|
||||
# Mode: 'stdio' (Claude Desktop, Cline) or 'sse' (N8N, HTTP)
|
||||
MCP_MODE="stdio"
|
||||
MCP_PORT="3001"
|
||||
# Frontend MCP settings (for the MCP settings panel in the web UI)
|
||||
# MCP_SERVER_MODE="sse"
|
||||
# MCP_SERVER_URL="http://YOUR_IP:3001"
|
||||
|
||||
# =============================================================================
|
||||
# AI PROVIDER - TAGS GENERATION
|
||||
# =============================================================================
|
||||
# Options: ollama, openai, custom
|
||||
# AI - Tags
|
||||
AI_PROVIDER_TAGS=ollama
|
||||
AI_MODEL_TAGS="granite4:latest"
|
||||
AI_MODEL_TAGS=granite4:latest
|
||||
|
||||
# =============================================================================
|
||||
# AI PROVIDER - EMBEDDINGS
|
||||
# =============================================================================
|
||||
# Options: ollama, openai, custom
|
||||
# AI - Embeddings
|
||||
AI_PROVIDER_EMBEDDING=ollama
|
||||
AI_MODEL_EMBEDDING="embeddinggemma:latest"
|
||||
AI_MODEL_EMBEDDING=embeddinggemma:latest
|
||||
|
||||
# =============================================================================
|
||||
# AI PROVIDER - CHAT (optional, falls back to AI_PROVIDER_TAGS)
|
||||
# =============================================================================
|
||||
# AI_PROVIDER_CHAT=ollama
|
||||
# AI_MODEL_CHAT="granite4:latest"
|
||||
# AI - Chat
|
||||
AI_PROVIDER_CHAT=ollama
|
||||
AI_MODEL_CHAT=granite4:latest
|
||||
|
||||
# =============================================================================
|
||||
# OLLAMA CONFIGURATION (if provider = ollama)
|
||||
# =============================================================================
|
||||
# Docker service: http://ollama:11434
|
||||
# Host machine: http://host.docker.internal:11434
|
||||
# Remote server: http://YOUR_SERVER_IP:11434
|
||||
OLLAMA_BASE_URL="http://ollama:11434"
|
||||
# AI - Custom OpenAI (OpenRouter etc.)
|
||||
CUSTOM_OPENAI_BASE_URL=https://openrouter.ai/api/v1
|
||||
CUSTOM_OPENAI_API_KEY=<secret>
|
||||
OPENAI_API_KEY=<secret>
|
||||
|
||||
# =============================================================================
|
||||
# OPENAI CONFIGURATION (if provider = openai)
|
||||
# =============================================================================
|
||||
# OPENAI_API_KEY="sk-..."
|
||||
# AI - Ollama
|
||||
OLLAMA_BASE_URL=http://ollama:11434
|
||||
|
||||
# =============================================================================
|
||||
# CUSTOM OPENAI-COMPATIBLE PROVIDER (if provider = custom)
|
||||
# =============================================================================
|
||||
# Compatible with: OpenRouter, Groq, Together AI, Mistral, etc.
|
||||
# OpenRouter: https://openrouter.ai/api/v1
|
||||
# Groq: https://api.groq.com/openai/v1
|
||||
# Together: https://api.together.xyz/v1
|
||||
# Mistral: https://api.mistral.ai/v1
|
||||
# CUSTOM_OPENAI_API_KEY="your-api-key"
|
||||
# CUSTOM_OPENAI_BASE_URL="https://openrouter.ai/api/v1"
|
||||
# Redis (set by CI, do not override)
|
||||
REDIS_HOST=redis
|
||||
|
||||
# =============================================================================
|
||||
# EMAIL / SMTP (optional, required for password reset)
|
||||
# =============================================================================
|
||||
# SMTP_HOST="smtp.gmail.com"
|
||||
# SMTP_PORT="587"
|
||||
# SMTP_USER="your-email@gmail.com"
|
||||
# SMTP_PASS="your-app-password"
|
||||
# SMTP_FROM="noreply@memento.app"
|
||||
# Email
|
||||
EMAIL_PROVIDER=resend
|
||||
SMTP_FROM=noreply@memento-note.com
|
||||
RESEND_API_KEY=<secret>
|
||||
SMTP_HOST=
|
||||
SMTP_PORT=
|
||||
SMTP_USER=
|
||||
SMTP_PASS=<secret>
|
||||
SMTP_SECURE=
|
||||
SMTP_IGNORE_CERT=
|
||||
|
||||
# =============================================================================
|
||||
# RESEND EMAIL (alternative to SMTP, optional)
|
||||
# =============================================================================
|
||||
# RESEND_API_KEY="re_..."
|
||||
# Google OAuth
|
||||
AUTH_GOOGLE_ID=<var>
|
||||
AUTH_GOOGLE_SECRET=<secret>
|
||||
|
||||
# ─────────────────────────────────────────────────────────────────────────────
|
||||
# Brainstorm / Socket.io
|
||||
# ─────────────────────────────────────────────────────────────────────────────
|
||||
SOCKET_PORT=3005
|
||||
# MCP Server
|
||||
MCP_MODE=sse
|
||||
MCP_PORT=3001
|
||||
MCP_SERVER_MODE=sse
|
||||
MCP_SERVER_URL=https://memento-note.com/mcp
|
||||
MCP_API_KEY=<secret>
|
||||
|
||||
# Web Search
|
||||
WEB_SEARCH_PROVIDER=searxng
|
||||
SEARXNG_URL=http://192.168.1.190:8888
|
||||
BRAVE_SEARCH_API_KEY=<secret>
|
||||
JINA_API_KEY=<secret>
|
||||
|
||||
# Socket (realtime)
|
||||
SOCKET_INTERNAL_KEY=<secret>
|
||||
SOCKET_PORT=3002
|
||||
SOCKET_HTTP_PORT=3003
|
||||
SOCKET_INTERNAL_KEY=change-this-to-a-random-secret
|
||||
SOCKET_INTERNAL_URL=http://memento-socket:3003
|
||||
NEXT_PUBLIC_SOCKET_URL=https://note.parsanet.org
|
||||
SOCKET_INTERNAL_URL=http://memento-socket:3002
|
||||
NEXT_PUBLIC_SOCKET_URL=wss://memento-note.com/ws
|
||||
|
||||
# Telegram notifications
|
||||
TELEGRAM_BOT_TOKEN=<secret>
|
||||
TELEGRAM_CHAT_ID=<var>
|
||||
|
||||
# Monitoring
|
||||
METRICS_TOKEN=<secret>
|
||||
GRAFANA_ADMIN_PASSWORD=<secret>
|
||||
|
||||
@@ -8,28 +8,15 @@ on:
|
||||
pull_request:
|
||||
branches:
|
||||
- main
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
ci:
|
||||
name: Lint, Test & Build
|
||||
name: Lint, Unit Tests & Build
|
||||
runs-on: ubuntu-24.04
|
||||
services:
|
||||
postgres:
|
||||
image: pgvector/pgvector:pg16
|
||||
env:
|
||||
POSTGRES_USER: memento_test
|
||||
POSTGRES_PASSWORD: memento_test
|
||||
POSTGRES_DB: memento_test
|
||||
options: >-
|
||||
--health-cmd pg_isready
|
||||
--health-interval 5s
|
||||
--health-timeout 5s
|
||||
--health-retries 5
|
||||
defaults:
|
||||
run:
|
||||
working-directory: memento-note
|
||||
env:
|
||||
DATABASE_URL: "postgresql://memento_test:memento_test@postgres:5432/memento_test"
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
@@ -39,24 +26,20 @@ jobs:
|
||||
with:
|
||||
node-version: "22"
|
||||
|
||||
- name: Cache node_modules
|
||||
uses: actions/cache@v3
|
||||
with:
|
||||
path: memento-note/node_modules
|
||||
key: ${{ runner.os }}-node-${{ hashFiles('memento-note/package-lock.json') }}
|
||||
restore-keys: |
|
||||
${{ runner.os }}-node-
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
run: npm ci --legacy-peer-deps
|
||||
|
||||
- name: Generate Prisma client
|
||||
run: npx prisma generate
|
||||
|
||||
- name: Setup test database
|
||||
run: |
|
||||
if command -v sudo >/dev/null 2>&1; then SUDO="sudo"; else SUDO=""; fi
|
||||
$SUDO apt-get update -qq && $SUDO apt-get install -y -qq postgresql-client
|
||||
for i in $(seq 1 30); do
|
||||
PGPASSWORD=memento_test pg_isready -h postgres -U memento_test -d memento_test && break
|
||||
[ "$i" -eq 30 ] && exit 1
|
||||
sleep 2
|
||||
done
|
||||
PGPASSWORD=memento_test psql -h postgres -U memento_test -d memento_test -c "CREATE EXTENSION IF NOT EXISTS vector;"
|
||||
npx prisma migrate deploy
|
||||
|
||||
- name: Lint
|
||||
run: npm run lint
|
||||
|
||||
@@ -67,16 +50,14 @@ jobs:
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Lint\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
-d "text=❌ Momento CI Failed
|
||||
Step: Lint
|
||||
Commit: ${{ github.sha }}
|
||||
Branch: ${{ github.ref_name }}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
- name: Unit tests
|
||||
- name: Unit tests (Vitest - fast logic tests)
|
||||
run: npm run test:unit
|
||||
|
||||
- name: Notify test failure
|
||||
@@ -86,12 +67,10 @@ Branch: ${{ github.ref_name }}" \
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Unit Tests\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
-d "text=❌ Momento CI Failed
|
||||
Step: Unit Tests
|
||||
Commit: ${{ github.sha }}
|
||||
Branch: ${{ github.ref_name }}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
@@ -105,34 +84,13 @@ Branch: ${{ github.ref_name }}" \
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Build\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
-d "text=❌ Momento CI Failed
|
||||
Step: Build
|
||||
Commit: ${{ github.sha }}
|
||||
Branch: ${{ github.ref_name }}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
- name: Pack web artifact for deploy
|
||||
if: github.ref == 'refs/heads/main' && github.event_name == 'push'
|
||||
working-directory: memento-note
|
||||
run: |
|
||||
tar czf ../web-artifact.tgz \
|
||||
.next/standalone .next/static public prisma \
|
||||
node_modules/.prisma node_modules/@prisma node_modules/prisma \
|
||||
docker-entrypoint.sh socket-server.ts tsconfig.json
|
||||
ls -lh ../web-artifact.tgz
|
||||
|
||||
- name: Upload web artifact
|
||||
if: github.ref == 'refs/heads/main' && github.event_name == 'push'
|
||||
uses: actions/upload-artifact@v3
|
||||
continue-on-error: true
|
||||
with:
|
||||
name: web-artifact
|
||||
path: web-artifact.tgz
|
||||
retention-days: 2
|
||||
|
||||
deploy:
|
||||
name: Deploy production (on server)
|
||||
needs: ci
|
||||
@@ -140,15 +98,6 @@ Branch: ${{ github.ref_name }}" \
|
||||
runs-on: docker-host
|
||||
steps:
|
||||
|
||||
- name: Install Node.js for Gitea Actions
|
||||
run: |
|
||||
if command -v apk >/dev/null 2>&1; then
|
||||
apk add --no-cache nodejs || true
|
||||
elif command -v apt-get >/dev/null 2>&1; then
|
||||
if command -v sudo >/dev/null 2>&1; then SUDO="sudo"; else SUDO=""; fi
|
||||
$SUDO apt-get update -qq && $SUDO apt-get install -y -qq nodejs || true
|
||||
fi
|
||||
|
||||
- name: Sync deploy scripts on server
|
||||
run: |
|
||||
git config --global --add safe.directory /opt/memento || true
|
||||
@@ -156,12 +105,32 @@ Branch: ${{ github.ref_name }}" \
|
||||
git fetch origin main
|
||||
git reset --hard origin/main
|
||||
|
||||
- name: Download web artifact
|
||||
uses: actions/download-artifact@v3
|
||||
continue-on-error: true
|
||||
# Build sur docker-host : évite upload-artifact Gitea (souvent cassé en prod).
|
||||
- name: Setup Node 22
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
name: web-artifact
|
||||
node-version: "22"
|
||||
|
||||
- name: Build web artifact on server
|
||||
working-directory: /opt/memento/memento-note
|
||||
run: |
|
||||
set -euo pipefail
|
||||
npm ci --legacy-peer-deps
|
||||
npx prisma generate
|
||||
npm run build
|
||||
for p in .next/standalone .next/static public prisma; do
|
||||
[ -e "$p" ] || { echo "Missing build output: $p"; exit 1; }
|
||||
done
|
||||
tar czf /tmp/web-artifact.tgz \
|
||||
.next/standalone .next/static public prisma \
|
||||
node_modules/.prisma node_modules/@prisma node_modules/prisma \
|
||||
docker-entrypoint.sh socket-server.ts tsconfig.json
|
||||
SIZE=$(stat -c%s /tmp/web-artifact.tgz)
|
||||
if [ "$SIZE" -lt 1048576 ]; then
|
||||
echo "ERROR: artifact too small ($SIZE bytes)"
|
||||
exit 1
|
||||
fi
|
||||
ls -lh /tmp/web-artifact.tgz
|
||||
|
||||
- name: Update .env.docker
|
||||
env:
|
||||
@@ -207,14 +176,18 @@ Branch: ${{ github.ref_name }}" \
|
||||
NEXT_PUBLIC_SOCKET_URL: ${{ vars.NEXT_PUBLIC_SOCKET_URL }}
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
METRICS_TOKEN: ${{ secrets.METRICS_TOKEN }}
|
||||
GRAFANA_ADMIN_PASSWORD: ${{ secrets.GRAFANA_ADMIN_PASSWORD }}
|
||||
MCP_API_KEY: ${{ secrets.MCP_API_KEY }}
|
||||
run: |
|
||||
ENV_FILE="/opt/memento/.env.docker"
|
||||
touch "$ENV_FILE"
|
||||
sed -i 's/\r$//' "$ENV_FILE"
|
||||
upsert() {
|
||||
local key="$1" val="$2"
|
||||
[ -z "$val" ] && return
|
||||
sed -i "/^[[:space:]]*${key}=/d" "$ENV_FILE"
|
||||
echo "${key}=\"${val}\"" >> "$ENV_FILE"
|
||||
echo "${key}=${val}" >> "$ENV_FILE"
|
||||
}
|
||||
upsert NEXTAUTH_URL "$APP_URL"
|
||||
upsert NEXTAUTH_SECRET "$NEXTAUTH_SECRET"
|
||||
@@ -246,6 +219,8 @@ Branch: ${{ github.ref_name }}" \
|
||||
upsert SMTP_IGNORE_CERT "$SMTP_IGNORE_CERT"
|
||||
upsert MCP_MODE "$MCP_MODE"
|
||||
upsert MCP_PORT "$MCP_PORT"
|
||||
upsert MCP_SERVER_MODE "$MCP_MODE"
|
||||
upsert MCP_SERVER_URL "${APP_URL}/mcp"
|
||||
upsert WEB_SEARCH_PROVIDER "$WEB_SEARCH_PROVIDER"
|
||||
upsert SEARXNG_URL "$SEARXNG_URL"
|
||||
upsert BRAVE_SEARCH_API_KEY "$BRAVE_SEARCH_API_KEY"
|
||||
@@ -259,15 +234,14 @@ Branch: ${{ github.ref_name }}" \
|
||||
upsert NEXT_PUBLIC_SOCKET_URL "$NEXT_PUBLIC_SOCKET_URL"
|
||||
upsert TELEGRAM_BOT_TOKEN "$TELEGRAM_BOT_TOKEN"
|
||||
upsert TELEGRAM_CHAT_ID "$TELEGRAM_CHAT_ID"
|
||||
|
||||
- name: Install docker and compose inside runner
|
||||
run: |
|
||||
if command -v apk >/dev/null 2>&1; then
|
||||
apk add --no-cache docker-cli docker-cli-compose jq curl git || true
|
||||
fi
|
||||
upsert METRICS_TOKEN "$METRICS_TOKEN"
|
||||
upsert GRAFANA_ADMIN_PASSWORD "$GRAFANA_ADMIN_PASSWORD"
|
||||
upsert MCP_API_KEY "$MCP_API_KEY"
|
||||
# Write metrics token file for Prometheus (same secret)
|
||||
[ -n "$METRICS_TOKEN" ] && echo "$METRICS_TOKEN" > /opt/memento/monitoring/metrics-token && chmod 600 /opt/memento/monitoring/metrics-token || true
|
||||
|
||||
- name: Deploy on 192.168.1.190
|
||||
env:
|
||||
ARTIFACT_TGZ: ${{ github.workspace }}/web-artifact.tgz
|
||||
ARTIFACT_TGZ: /tmp/web-artifact.tgz
|
||||
EXPECTED_COMMIT: ${{ github.sha }}
|
||||
run: bash /opt/memento/scripts/deploy-prod.sh
|
||||
|
||||
@@ -59,14 +59,20 @@ jobs:
|
||||
SOCKET_HTTP_PORT: ${{ vars.SOCKET_HTTP_PORT }}
|
||||
SOCKET_INTERNAL_URL: ${{ vars.SOCKET_INTERNAL_URL }}
|
||||
NEXT_PUBLIC_SOCKET_URL: ${{ vars.NEXT_PUBLIC_SOCKET_URL }}
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
METRICS_TOKEN: ${{ secrets.METRICS_TOKEN }}
|
||||
GRAFANA_ADMIN_PASSWORD: ${{ secrets.GRAFANA_ADMIN_PASSWORD }}
|
||||
MCP_API_KEY: ${{ secrets.MCP_API_KEY }}
|
||||
run: |
|
||||
ENV_FILE="/opt/memento/.env.docker"
|
||||
touch "$ENV_FILE"
|
||||
sed -i 's/\r$//' "$ENV_FILE"
|
||||
upsert() {
|
||||
local key="$1" val="$2"
|
||||
[ -z "$val" ] && return
|
||||
sed -i "/^[[:space:]]*${key}=/d" "$ENV_FILE"
|
||||
echo "${key}=\"${val}\"" >> "$ENV_FILE"
|
||||
echo "${key}=${val}" >> "$ENV_FILE"
|
||||
}
|
||||
upsert NEXTAUTH_URL "$APP_URL"
|
||||
upsert NEXTAUTH_SECRET "$NEXTAUTH_SECRET"
|
||||
@@ -97,6 +103,8 @@ jobs:
|
||||
upsert SMTP_IGNORE_CERT "$SMTP_IGNORE_CERT"
|
||||
upsert MCP_MODE "$MCP_MODE"
|
||||
upsert MCP_PORT "$MCP_PORT"
|
||||
upsert MCP_SERVER_MODE "$MCP_MODE"
|
||||
upsert MCP_SERVER_URL "${APP_URL}/mcp"
|
||||
upsert WEB_SEARCH_PROVIDER "$WEB_SEARCH_PROVIDER"
|
||||
upsert SEARXNG_URL "$SEARXNG_URL"
|
||||
upsert BRAVE_SEARCH_API_KEY "$BRAVE_SEARCH_API_KEY"
|
||||
@@ -108,6 +116,14 @@ jobs:
|
||||
upsert SOCKET_HTTP_PORT "$SOCKET_HTTP_PORT"
|
||||
upsert SOCKET_INTERNAL_URL "$SOCKET_INTERNAL_URL"
|
||||
upsert NEXT_PUBLIC_SOCKET_URL "$NEXT_PUBLIC_SOCKET_URL"
|
||||
upsert REDIS_HOST "redis"
|
||||
upsert TELEGRAM_BOT_TOKEN "$TELEGRAM_BOT_TOKEN"
|
||||
upsert TELEGRAM_CHAT_ID "$TELEGRAM_CHAT_ID"
|
||||
upsert METRICS_TOKEN "$METRICS_TOKEN"
|
||||
upsert GRAFANA_ADMIN_PASSWORD "$GRAFANA_ADMIN_PASSWORD"
|
||||
upsert MCP_API_KEY "$MCP_API_KEY"
|
||||
[ -n "$METRICS_TOKEN" ] && echo "$METRICS_TOKEN" > /opt/memento/monitoring/metrics-token && chmod 600 /opt/memento/monitoring/metrics-token || true
|
||||
echo "env.docker sanity-check passed ($(wc -l < "$ENV_FILE") lines)"
|
||||
|
||||
- name: Deploy (full build, no CI artifact)
|
||||
env:
|
||||
|
||||
235
.github/workflows/ci.yaml
vendored
Normal file
235
.github/workflows/ci.yaml
vendored
Normal file
@@ -0,0 +1,235 @@
|
||||
name: CI
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- main
|
||||
- "*"
|
||||
pull_request:
|
||||
branches:
|
||||
- main
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
ci:
|
||||
name: Lint, Unit Tests & Build
|
||||
runs-on: docker-host
|
||||
defaults:
|
||||
run:
|
||||
working-directory: memento-note
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
|
||||
- name: Setup Node 22
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "22"
|
||||
|
||||
- name: Cache node_modules
|
||||
uses: actions/cache@v3
|
||||
with:
|
||||
path: memento-note/node_modules
|
||||
key: ${{ runner.os }}-node-${{ hashFiles('memento-note/package-lock.json') }}
|
||||
restore-keys: |
|
||||
${{ runner.os }}-node-
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci --legacy-peer-deps
|
||||
|
||||
- name: Generate Prisma client
|
||||
run: npx prisma generate
|
||||
|
||||
- name: Lint
|
||||
run: npm run lint
|
||||
|
||||
- name: Notify lint failure
|
||||
if: failure()
|
||||
env:
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Lint\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
- name: Unit tests (Vitest - fast logic tests)
|
||||
run: npm run test:unit
|
||||
|
||||
- name: Notify test failure
|
||||
if: failure()
|
||||
env:
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Unit Tests\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
- name: Build
|
||||
run: npm run build
|
||||
|
||||
- name: Notify build failure
|
||||
if: failure()
|
||||
env:
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
if [ -n "$TELEGRAM_BOT_TOKEN" ] && [ -n "$TELEGRAM_CHAT_ID" ]; then
|
||||
MSG=$(printf "❌ Momento CI Failed\nStep: Build\nCommit: %s\nBranch: %s" "${{ github.sha }}" "${{ github.ref_name }}")
|
||||
curl -s -X POST "https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage" \
|
||||
-d "chat_id=${TELEGRAM_CHAT_ID}" \
|
||||
--data-urlencode "text=${MSG}" \
|
||||
-d "parse_mode=Markdown" || true
|
||||
fi
|
||||
|
||||
deploy:
|
||||
name: Deploy production (on server)
|
||||
needs: ci
|
||||
if: github.ref == 'refs/heads/main' && github.event_name == 'push'
|
||||
runs-on: docker-host
|
||||
steps:
|
||||
|
||||
- name: Sync deploy scripts on server
|
||||
run: |
|
||||
git config --global --add safe.directory /opt/memento || true
|
||||
cd /opt/memento
|
||||
git fetch origin main
|
||||
git reset --hard origin/main
|
||||
|
||||
- name: Setup Node 22
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "22"
|
||||
|
||||
- name: Build web artifact on server
|
||||
working-directory: /opt/memento/memento-note
|
||||
run: |
|
||||
set -euo pipefail
|
||||
npm ci --legacy-peer-deps
|
||||
npx prisma generate
|
||||
npm run build
|
||||
for p in .next/standalone .next/static public prisma; do
|
||||
[ -e "$p" ] || { echo "Missing build output: $p"; exit 1; }
|
||||
done
|
||||
tar czf /tmp/web-artifact.tgz \
|
||||
.next/standalone .next/static public prisma \
|
||||
node_modules/.prisma node_modules/@prisma node_modules/prisma \
|
||||
docker-entrypoint.sh socket-server.ts tsconfig.json
|
||||
SIZE=$(stat -c%s /tmp/web-artifact.tgz)
|
||||
if [ "$SIZE" -lt 1048576 ]; then
|
||||
echo "ERROR: artifact too small ($SIZE bytes)"
|
||||
exit 1
|
||||
fi
|
||||
ls -lh /tmp/web-artifact.tgz
|
||||
|
||||
- name: Update .env.docker
|
||||
env:
|
||||
APP_URL: ${{ vars.APP_URL }}
|
||||
NEXTAUTH_SECRET: ${{ secrets.NEXTAUTH_SECRET }}
|
||||
ADMIN_EMAIL: ${{ vars.ADMIN_EMAIL }}
|
||||
ALLOW_REGISTRATION: ${{ vars.ALLOW_REGISTRATION }}
|
||||
POSTGRES_USER: ${{ vars.POSTGRES_USER }}
|
||||
POSTGRES_PASSWORD: ${{ secrets.POSTGRES_PASSWORD }}
|
||||
POSTGRES_DB: ${{ vars.POSTGRES_DB }}
|
||||
POSTGRES_PORT: ${{ vars.POSTGRES_PORT }}
|
||||
AI_PROVIDER_TAGS: ${{ vars.AI_PROVIDER_TAGS }}
|
||||
AI_MODEL_TAGS: ${{ vars.AI_MODEL_TAGS }}
|
||||
AI_PROVIDER_EMBEDDING: ${{ vars.AI_PROVIDER_EMBEDDING }}
|
||||
AI_MODEL_EMBEDDING: ${{ vars.AI_MODEL_EMBEDDING }}
|
||||
AI_PROVIDER_CHAT: ${{ vars.AI_PROVIDER_CHAT }}
|
||||
AI_MODEL_CHAT: ${{ vars.AI_MODEL_CHAT }}
|
||||
CUSTOM_OPENAI_BASE_URL: ${{ vars.CUSTOM_OPENAI_BASE_URL }}
|
||||
CUSTOM_OPENAI_API_KEY: ${{ secrets.CUSTOM_OPENAI_API_KEY }}
|
||||
OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
|
||||
OLLAMA_BASE_URL: ${{ vars.OLLAMA_BASE_URL }}
|
||||
EMAIL_PROVIDER: ${{ vars.EMAIL_PROVIDER }}
|
||||
SMTP_FROM: ${{ vars.SMTP_FROM }}
|
||||
RESEND_API_KEY: ${{ secrets.RESEND_API_KEY }}
|
||||
SMTP_HOST: ${{ vars.SMTP_HOST }}
|
||||
SMTP_PORT: ${{ vars.SMTP_PORT }}
|
||||
SMTP_USER: ${{ vars.SMTP_USER }}
|
||||
SMTP_PASS: ${{ secrets.SMTP_PASS }}
|
||||
SMTP_SECURE: ${{ vars.SMTP_SECURE }}
|
||||
SMTP_IGNORE_CERT: ${{ vars.SMTP_IGNORE_CERT }}
|
||||
MCP_MODE: ${{ vars.MCP_MODE }}
|
||||
MCP_PORT: ${{ vars.MCP_PORT }}
|
||||
WEB_SEARCH_PROVIDER: ${{ vars.WEB_SEARCH_PROVIDER }}
|
||||
SEARXNG_URL: ${{ vars.SEARXNG_URL }}
|
||||
BRAVE_SEARCH_API_KEY: ${{ secrets.BRAVE_SEARCH_API_KEY }}
|
||||
JINA_API_KEY: ${{ secrets.JINA_API_KEY }}
|
||||
AUTH_GOOGLE_ID: ${{ vars.AUTH_GOOGLE_ID }}
|
||||
AUTH_GOOGLE_SECRET: ${{ vars.AUTH_GOOGLE_SECRET }}
|
||||
SOCKET_INTERNAL_KEY: ${{ secrets.SOCKET_INTERNAL_KEY }}
|
||||
SOCKET_PORT: ${{ vars.SOCKET_PORT }}
|
||||
SOCKET_HTTP_PORT: ${{ vars.SOCKET_HTTP_PORT }}
|
||||
SOCKET_INTERNAL_URL: ${{ vars.SOCKET_INTERNAL_URL }}
|
||||
NEXT_PUBLIC_SOCKET_URL: ${{ vars.NEXT_PUBLIC_SOCKET_URL }}
|
||||
TELEGRAM_BOT_TOKEN: ${{ secrets.TELEGRAM_BOT_TOKEN }}
|
||||
TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
|
||||
run: |
|
||||
ENV_FILE="/opt/memento/.env.docker"
|
||||
touch "$ENV_FILE"
|
||||
upsert() {
|
||||
local key="$1" val="$2"
|
||||
[ -z "$val" ] && return
|
||||
sed -i "/^[[:space:]]*${key}=/d" "$ENV_FILE"
|
||||
echo "${key}=\"${val}\"" >> "$ENV_FILE"
|
||||
}
|
||||
upsert NEXTAUTH_URL "$APP_URL"
|
||||
upsert NEXTAUTH_SECRET "$NEXTAUTH_SECRET"
|
||||
upsert ADMIN_EMAIL "$ADMIN_EMAIL"
|
||||
upsert ALLOW_REGISTRATION "$ALLOW_REGISTRATION"
|
||||
upsert POSTGRES_USER "$POSTGRES_USER"
|
||||
upsert POSTGRES_PASSWORD "$POSTGRES_PASSWORD"
|
||||
upsert POSTGRES_DB "$POSTGRES_DB"
|
||||
upsert POSTGRES_PORT "$POSTGRES_PORT"
|
||||
upsert AI_PROVIDER_TAGS "$AI_PROVIDER_TAGS"
|
||||
upsert AI_MODEL_TAGS "$AI_MODEL_TAGS"
|
||||
upsert AI_PROVIDER_EMBEDDING "$AI_PROVIDER_EMBEDDING"
|
||||
upsert AI_MODEL_EMBEDDING "$AI_MODEL_EMBEDDING"
|
||||
upsert AI_PROVIDER_CHAT "$AI_PROVIDER_CHAT"
|
||||
upsert AI_MODEL_CHAT "$AI_MODEL_CHAT"
|
||||
upsert CUSTOM_OPENAI_BASE_URL "$CUSTOM_OPENAI_BASE_URL"
|
||||
upsert CUSTOM_OPENAI_API_KEY "$CUSTOM_OPENAI_API_KEY"
|
||||
upsert OPENAI_API_KEY "$OPENAI_API_KEY"
|
||||
upsert OLLAMA_BASE_URL "$OLLAMA_BASE_URL"
|
||||
upsert REDIS_HOST "redis"
|
||||
upsert EMAIL_PROVIDER "$EMAIL_PROVIDER"
|
||||
upsert SMTP_FROM "$SMTP_FROM"
|
||||
upsert RESEND_API_KEY "$RESEND_API_KEY"
|
||||
upsert SMTP_HOST "$SMTP_HOST"
|
||||
upsert SMTP_PORT "$SMTP_PORT"
|
||||
upsert SMTP_USER "$SMTP_USER"
|
||||
upsert SMTP_PASS "$SMTP_PASS"
|
||||
upsert SMTP_SECURE "$SMTP_SECURE"
|
||||
upsert SMTP_IGNORE_CERT "$SMTP_IGNORE_CERT"
|
||||
upsert MCP_MODE "$MCP_MODE"
|
||||
upsert MCP_PORT "$MCP_PORT"
|
||||
upsert WEB_SEARCH_PROVIDER "$WEB_SEARCH_PROVIDER"
|
||||
upsert SEARXNG_URL "$SEARXNG_URL"
|
||||
upsert BRAVE_SEARCH_API_KEY "$BRAVE_SEARCH_API_KEY"
|
||||
upsert JINA_API_KEY "$JINA_API_KEY"
|
||||
upsert AUTH_GOOGLE_ID "$AUTH_GOOGLE_ID"
|
||||
upsert AUTH_GOOGLE_SECRET "$AUTH_GOOGLE_SECRET"
|
||||
upsert SOCKET_INTERNAL_KEY "$SOCKET_INTERNAL_KEY"
|
||||
upsert SOCKET_PORT "$SOCKET_PORT"
|
||||
upsert SOCKET_HTTP_PORT "$SOCKET_HTTP_PORT"
|
||||
upsert SOCKET_INTERNAL_URL "$SOCKET_INTERNAL_URL"
|
||||
upsert NEXT_PUBLIC_SOCKET_URL "$NEXT_PUBLIC_SOCKET_URL"
|
||||
upsert TELEGRAM_BOT_TOKEN "$TELEGRAM_BOT_TOKEN"
|
||||
upsert TELEGRAM_CHAT_ID "$TELEGRAM_CHAT_ID"
|
||||
|
||||
- name: Deploy on 192.168.1.190
|
||||
env:
|
||||
ARTIFACT_TGZ: /tmp/web-artifact.tgz
|
||||
EXPECTED_COMMIT: ${{ github.sha }}
|
||||
run: bash /opt/memento/scripts/deploy-prod.sh
|
||||
3
.gitignore
vendored
3
.gitignore
vendored
@@ -50,3 +50,6 @@ docker-data/
|
||||
# Misc
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
|
||||
# Monitoring secrets (generate at deploy)
|
||||
monitoring/metrics-token
|
||||
|
||||
26
AGENTS.md
26
AGENTS.md
@@ -1,31 +1,31 @@
|
||||
# Agent memory (Momento)
|
||||
# Agent memory (Memento)
|
||||
|
||||
## Learned User Preferences
|
||||
|
||||
- Préfère les échanges en français, avec des explications détaillées et claires (éviter le jargon flou).
|
||||
- Interface : tout libellé via i18n dans les 15 fichiers `memento-note/locales/*.json` (FR et EN comme références de contenu) ; éviter le texte en dur ; traductions **contextuelles** (sens produit, pas mot à mot — ex. « connecter votre propre fournisseur ») ; libellés FR **lisibles** (éviter jargon non expliqué : « wiki », « embed », etc.) et **aide contextuelle** où l'UX l'exige ; lors d'une traduction complète, mettre à jour toutes les locales concernées ; si l'utilisateur demande seulement les **clés i18n**, ajouter les clés (souvent EN/FR) sans remplir les 15 locales — il traduit souvent avec un autre modèle.
|
||||
- Base de données : **INTERDIT TOTALEMENT** de lancer `prisma db push --force-reset`, `prisma migrate reset`, `DROP TABLE`, `TRUNCATE`, `pg_restore` avec clean, ou TOUTE commande qui vide/supprime des données — MÊME SI l'utilisateur est d'accord — sans avoir d'abord : (1) dumpé la base avec `bash /home/devparsa/dev/Momento/dump-db.sh`, (2) vérifié le dump fait au moins 1Mo, (3) obtenu un "OUI" explicite de l'utilisateur. **4 incidents de perte de données documentés (14/05, 15/05 x2, 16/05). NE JAMAIS REFAIRE ÇA.**
|
||||
- Design produit : migration depuis `architectural-grid1` (base) et `architectural-grid` (prototype UI courant) ; **consulter le prototype avant toute implémentation UI** ; logique liste/carte puis contenu au clic ; parité actions liste/carte (menus « … », déplacer, génération SVG, etc.) ; contraste éditeur clair / sidebar sombre ; retirer thèmes obsolètes ; **pas de refresh/revalidation complets inutiles** (aligné prototype — mutations optimistes, pas de `revalidatePath` systématique ni resync depuis `initialNotes`) ; **Memory Echo en section inline dans l'éditeur** (pas l'ancienne modale) — similarité sur contenu **représentatif** (pas de troncature arbitraire type 200/800 car.) ; **recherche (sidebar / résultats, ex. flux « ouvrir la note ») et navigation liste des notes** (modes affichage, icônes vs initiales…) : suivre **`SearchModal` et les patterns actuels** dans `architectural-grid`, pas une approximation ou un ancien flux ; **sidebar rail** (`sidebar.tsx`) : une seule icône active ; `activeView` synchronisé avec pathname et query (`/insights`, `/revision`, `/home?reminders=1`) ; panneau latéral contextuel par route (pas la liste carnets sur `/insights` ou Rappels) ; **`/insights` (insights sémantiques)** : suivre **`InsightsView.tsx` + graphe réseau associé dans le prototype** (ex. composition type `NetworkGraph.tsx`) ; **distincte de `/graph`** ; ne pas substituer par une UX « géométrique » décorative ou un regroupement par carnet hors spec prototype ; lorsque données clusters en retard ou partiellement périmées, **montrer l’état dégradé exploitable plutôt qu’une page vide** ; si l'utilisateur hésite entre variantes UX, **trancher pour le design prototype** plutôt que multiplier les toggles.
|
||||
- Base de données : **INTERDIT TOTALEMENT** de lancer `prisma db push --force-reset`, `prisma migrate reset`, `DROP TABLE`, `TRUNCATE`, `pg_restore` avec clean, ou TOUTE commande qui vide/supprime des données — MÊME SI l'utilisateur est d'accord — sans avoir d'abord : (1) dumpé la base avec `bash /home/devparsa/dev/Memento/dump-db.sh`, (2) vérifié le dump fait au moins 1Mo, (3) obtenu un "OUI" explicite de l'utilisateur. **4 incidents de perte de données documentés (14/05, 15/05 x2, 16/05). NE JAMAIS REFAIRE ÇA.**
|
||||
- Design produit : migration depuis `architectural-grid1` (base) et `architectural-grid` (prototype UI courant) ; **consulter le prototype avant toute implémentation UI** ; logique liste/carte puis contenu au clic ; parité actions liste/carte (menus « … », déplacer, génération SVG, etc.) ; contraste éditeur clair / sidebar sombre ; retirer thèmes obsolètes ; **pas de refresh/revalidation complets inutiles** (aligné prototype — mutations optimistes, pas de `revalidatePath` systématique ni resync depuis `initialNotes`) ; **Memory Echo en section inline dans l'éditeur** (pas l'ancienne modale) — similarité sur contenu **représentatif** (pas de troncature arbitraire type 200/800 car.) ; **recherche (sidebar / résultats, ex. flux « ouvrir la note ») et navigation liste des notes** (modes affichage, icônes vs initiales…) : suivre **`SearchModal` et les patterns actuels** dans `architectural-grid`, pas une approximation ou un ancien flux ; **sidebar rail** (`sidebar.tsx`) : une seule icône active ; **largeur sidebar responsive** (`components/sidebar.tsx`) — `w-80` (320px) de base, plus large en `xl`/`2xl` (grands écrans) ; garder le fallback `Suspense` de `app/(main)/layout.tsx` **aligné** sur ces largeurs (rail fixe 54px) ; `activeView` synchronisé avec pathname et query (`/insights`, `/revision`, `/home?reminders=1`) ; panneau latéral contextuel par route (pas la liste carnets sur `/insights` ou Rappels) ; **`/insights` (insights sémantiques)** : suivre **`InsightsView.tsx` + graphe réseau associé dans le prototype** (ex. composition type `NetworkGraph.tsx`) ; **distincte de `/graph`** ; ne pas substituer par une UX « géométrique » décorative ou un regroupement par carnet hors spec prototype ; lorsque données clusters en retard ou partiellement périmées, **montrer l’état dégradé exploitable plutôt qu’une page vide** ; si l'utilisateur hésite entre variantes UX, **trancher pour le design prototype** plutôt que multiplier les toggles.
|
||||
- Locale persane : dates en calendrier iranien (conversion), chiffres persans, et vérification RTL/positionnement global (app **et** extension Web Clipper) ; **Memory Echo** et recherche sémantique doivent fonctionner en persan (RTL, embeddings — pas de contournement « EN only ») ; attention à ne pas confondre un nom de carnet (ex. « Persan ») avec le libellé de langue.
|
||||
- Flux Excalidraw / diagrammes générés : accès via notification en plus d'une simple redirection ; priorité à la mise en page et au texte contenu dans les formes ; proposer des modes visuels (ex. coloré vs plus austère) tout en visant un rendu proche du style Excalidraw (polices, look).
|
||||
- **Interdiction d'écrire des tests** sauf demande explicite ; en CI, seul `npm run test:unit` (`tests/unit/**`) — pas `tests/migration/` ; ne jamais générer de code superflu.
|
||||
- Déploiement : privilégier le chemin rapide (artifact Next.js en CI + `Dockerfile.prebuilt`) ; CI/CD très robuste (pas d'image Docker obsolète en prod, pas de migrations/schéma DB via le workflow deploy) ; éviter les rebuild Docker complets inutiles (~15 min par itération) ; **ne pas pousser un déploiement quand des features clés sont inachevées** ; ne pas insister sur le déploiement tant que le produit n'est pas fini ou meilleur.
|
||||
- Déploiement : privilégier le chemin rapide (artifact Next.js en CI + `Dockerfile.prebuilt`) ; CI/CD très robuste (pas d'image Docker obsolète en prod, pas de migrations/schéma DB via le workflow deploy) ; éviter les rebuild Docker complets inutiles (~15 min par itération) ; **ne pas pousser un déploiement quand des features clés sont inachevées** ; ne pas insister sur le déploiement tant que le produit n'est pas fini ou meilleur. **CI/CD Gitea spécifique** : (1) `actions/upload-artifact` et `download-artifact` doivent utiliser **@v3** (pas @v4 — non supporté par Gitea, erreur `GHESNotSupportedError`) ; (2) `Dockerfile.socket.prebuilt` doit utiliser `--legacy-peer-deps` dans `npm install` (conflit TipTap 3.22.5 vs 3.23.6) ; (3) le serveur de prod (192.168.1.190) **ne peut pas pull Docker Hub** (DNS cassé) — le build Docker complet échoue, seul le chemin prebuilt artifact fonctionne ; (4) `docker-entrypoint.sh` applique les migrations Prisma **avant** de démarrer le serveur Next.js (ordre correct) ; (5) rollback d'urgence : `docker tag memento-memento-note:rollback memento-memento-note:latest && docker compose up -d --force-recreate memento-note` ; (6) `scripts/deploy-prod.sh` charge `/opt/memento/.env.docker` via un **parseur robuste ligne-par-ligne** (jamais `source` — crash `unexpected EOF` sur guillemet non fermé) et teste Postgres avec `pg_isready` + credentials **du conteneur** (`$POSTGRES_USER` interne) ; (7) lint CI = `eslint --max-warnings 9999` : les **warnings ne bloquent pas**, seules les **erreurs** bloquent (ex. `no-html-link-for-pages` → `<Link>` obligatoire pour la navigation interne, pas `<a href="/">`) ; **TRAVAILLER SUR UNE BRANCHE** pendant le dev, ne push sur `main` que quand le code est testé et fonctionnel — chaque push sur `main` déclenche un déploiement automatique en production.
|
||||
- Authentification : priorité à l'inscription/connexion via **Google OAuth** (plutôt qu'un compte email/mot de passe) ; exiger une vraie déconnexion (invalidation session/cookies — pas de reconnexion implicite, y compris en navigation privée).
|
||||
- Priorité absolue à la qualité UX, même si l'implémentation est complexe (« je m'en fous si c'est complexe ») ; **ne jamais affirmer qu'un correctif ou une feature est fait sans vérification réelle** (app, prototype `architectural-grid`, ou test), **notamment navigation recherche/liste notes et vue `/insights` vs fichiers prototype** — l'utilisateur sanctionne fermement les fausses déclarations ; **ouverture note liée depuis l'éditeur** (ex. bloc live « Ouvrir ») : **split peek inline** animé (`lib/note-peek-sync.ts`, `note-editor-split-peek.tsx` — panneau gauche lecture seule, note courante à droite), **pas nouvel onglet** ; **ne jamais annuler du code non commité** (`git checkout`, reset fichier) **sans demande explicite** (perte de travail documentée, ex. drag handle éditeur) ; en frustration ou pour déléguer, **prévoir des prompts / briefs d'implémentation détaillés** (autre modèle ou dev), en plus des briefs outil de design.
|
||||
- Livraison : **une user story à la fois**, tester et valider avec l'utilisateur avant la suivante (pas d'auto-validation ni d'enchaînement de code non demandé) ; suivi dans `docs/user-stories.md`.
|
||||
- Quand demandé, **fournir des briefs pour un outil de design externe** plutôt que produire les maquettes UX soi-même.
|
||||
- Priorité absolue à la qualité UX, même si l'implémentation est complexe (« je m'en fous si c'est complexe ») ; **ne jamais affirmer qu'un correctif ou une feature est fait sans vérification réelle** (app, prototype `architectural-grid`, ou test), **notamment navigation recherche/liste notes et vue `/insights` vs fichiers prototype** — l'utilisateur sanctionne fermement les fausses déclarations ; **ouverture note liée depuis l'éditeur** (ex. bloc live « Ouvrir ») : **split peek inline** animé (`lib/note-peek-sync.ts`, `note-editor-split-peek.tsx` — éditeur courant à **gauche**, note liée en lecture seule à **droite** en LTR ; **inversé en RTL** `fa`/`ar`), **pas nouvel onglet** ; **ne jamais annuler du code non commité** (`git checkout`, reset fichier) **sans demande explicite** (perte de travail documentée, ex. drag handle éditeur) ; **ne jamais remettre du code que l'utilisateur a explicitement retiré sans demander d'abord** (ex. `reserveUsageOrThrow` retiré intentionnellement de `organize-notebook.ts` — agent l'a remis sans demander → user mécontent) ; **correction i18n ou spec doc** : **ne pas refondre logique/UI** hors scope (ex. US-4 `structuredViewBlock` — garder le dual-mode base locale + lien carnet, pas de suppression du mode local) ; en frustration ou pour déléguer, **prévoir des prompts / briefs d'implémentation détaillés** (autre modèle ou dev), en plus des briefs outil de design.
|
||||
- Livraison : **une user story à la fois**, tester et valider avec l'utilisateur avant la suivante (pas d'auto-validation ni d'enchaînement de code non demandé) ; suivi dans `docs/user-stories.md` ; briefs pour outil de design externe sur demande ; **avant de développer une story, vérifier d'abord dans le code si la feature existe déjà** — les docs de stories (`docs/story-nextgen-editor.md`, `docs/user-stories.md`) sont **souvent périmés** (features livrées mais marquées « à faire »).
|
||||
- **Facturation & quotas IA** : limites mensuelles, tiers (BASIC/PRO/BUSINESS/ENTERPRISE) et Price IDs Stripe via **Admin > Facturation & quotas** (`/admin/billing`) — pas via `.env` pour le métier ; secrets Stripe (`STRIPE_SECRET_KEY`, webhook) restent en env serveur ; doc `memento-note/docs/admin-billing-quotas-guide.md`.
|
||||
|
||||
## Learned Workspace Facts
|
||||
|
||||
- Application Next.js principalement sous `memento-note/`.
|
||||
- Référentiels design du workspace : `architectural-grid1/` et `architectural-grid/` à la racine du repo Momento.
|
||||
- Référentiels design du workspace : `architectural-grid1/` et `architectural-grid/` à la racine du repo Memento.
|
||||
- i18n : 15 fichiers sous `memento-note/locales/` (de, en, es, fr, it, pt, nl, pl, ru, zh, ja, ko, ar, fa, hi) ; logique sous `memento-note/lib/i18n/` ; référence `en.json` (~2218 clés) ; auditer les « non traduits » par flatten EN vs locale (souvent valeurs identiques à l'EN).
|
||||
- Workflow BMad : stories sous `docs/` (ex. `3-4-host-pays-session-logic.md`), suivi sprint dans `docs/sprint-status.yaml` et stories courantes dans `docs/user-stories.md` ; skills sous `.claude/skills/bmad-*` ; `_bmad-output/planning-artifacts` souvent vide — planification de référence dans `docs/` ; préférer **une user story par feature** (pas de stories groupées).
|
||||
- PostgreSQL Docker (`memento-postgres`) sur le port 5433 ; Redis Docker (`memento-redis`) sur le port 6379 (voir règles projet).
|
||||
- Règles opérationnelles Prisma et sécurité base de données décrites dans `CLAUDE.md` à la racine du repo.
|
||||
- PostgreSQL Docker (`memento-postgres`) port 5433 ; Redis (`memento-redis`) port 6379 ; règles Prisma/DB dans `CLAUDE.md`.
|
||||
- **Admin facturation** : page `/admin/billing` (`billing-admin-client.tsx`, actions `admin-billing.ts`) — quotas par feature IA et config Stripe métier en base, effet ~60 s ; guide `memento-note/docs/admin-billing-quotas-guide.md`.
|
||||
- Production : dépôt `/opt/memento` sur `192.168.1.190`, conteneur `memento-note` sur le port **3000**, URL publique **https://memento-note.com** (nginx + Cloudflare ; ancien domaine note.parsanet.org) ; `NEXTAUTH_URL` aligné sur ce domaine ; email sortant via **Resend** (`SMTP_FROM` ex. `noreply@memento-note.com`, domaine vérifié sur resend.com) ; deploy (`deploy.yaml` / `deploy-prod.sh`) **sans toucher Postgres** (pas de `postgresql-client`, pas de migrations auto en prod).
|
||||
- CI/CD Gitea : `.gitea/workflows/ci.yaml` — CI sur `ubuntu-24.04`, deploy sur runner **`docker-host`** (sur le serveur) ; deploy manuel via `.gitea/workflows/deploy.yaml` ou `bash scripts/deploy-prod.sh`.
|
||||
- Migrations prebuilt + vérif deploy : `docker compose exec memento-note node ./node_modules/prisma/build/index.js migrate deploy` (pas `npx prisma`) ; helper `scripts/migrate-docker.sh` ; `GET /api/build-info` (SHA Git) ; comparer `127.0.0.1:3000` et domaine Cloudflare — purger cache si versions divergent ; 403 `/api/manifest` côté domaine = souvent Cloudflare.
|
||||
- Éditeur riche : `rich-text-editor.tsx` — `immediatelyRender: false` ; activer **`shouldRerenderOnTransaction: false`** (quick win perf TipTap 2.5) ; **drag handle / menu bloc** via **`@tiptap/extension-drag-handle-react`** (spec officielle — pas de double plugin `DragHandleExtension` + composant React, pas de repositionnement maison) ; poignée dans **colonne gutter fixe** du wrapper (padding + `getReferencedVirtualElement`), pas sur le bord des listes/numéros ; CSS : **pas `opacity:0` sur `.drag-handle`** (visibilité gérée par le plugin) ; config/callbacks **stables hors composant** ; fondation blocs : `tiptap-unique-id-extension.ts` / **`data-id` persisté à la sauvegarde** (références « Copier la référence ») ; **Smart Paste** : `lib/editor/smart-paste-extension.ts` ; **peek split** note source : `lib/note-peek-sync.ts` + `note-editor-split-peek.tsx` ; epic active `docs/story-nextgen-editor.md` — priorité **PERF > NEXTGEN > UX > MOBILE > MARKDOWN**.
|
||||
- Sync mutations notes entre composants : `memento-note/lib/note-change-sync.ts` (`emitNoteChange`, événement `NOTE_CHANGE_EVENT`).
|
||||
- Roadmap / écart prototype vs prod : Web Clipper — **`ClipperSimulator.tsx` = référence design uniquement** (pas de simulateur en prod) ; extension **`memento-note/extension/`** v0.3 **Side Panel** (clip page/sélection/lien ; popup Chrome se ferme au clic page — Side Panel pour la sélection) ; i18n extension **15 langues** (`_locales/`, détection locale navigateur ; script `extension/i18n/generate-translations.cjs`) ; **`host_permissions`** incl. LAN ; **URL serveur configurable en dev**, adresse prod figée en release ; cookies/session alignés avec l'instance cible ; **Flashcards IA SM-2 livrées** : `/revision`, `/api/flashcards/*`, génération depuis l'éditeur (GraduationCap) — réf. prototype `RevisionView.tsx` ; **Structured Views partiellement livrées** : schéma par carnet, Table/Kanban, champs partagés et valeurs par note (`/home` + toolbar carnet) — **suivi de tâches par carnet via Kanban structuré** (pas de vue agrégée Notes/Tâches sur la home ; cases à cocher inline dans les notes) ; **Living Blocks partiellement livrées** : `data-id`, Smart Paste, nœud `liveBlock`, détacher/supprimer, peek split — **US-NEXTGEN-EDITOR** en cours (`docs/story-nextgen-editor.md`, **US-TEMPORAL reporté**) ; encore en gap : transclusion bidirectionnelle complète, graphe knowledge enrichi (`GraphKnowledgeMap.tsx`), **insights sémantiques** (`InsightsView.tsx`, **`/insights` ≠ `/graph`**) ; publication **Chrome Web Store** : icônes 16/48/128, privacy policy, `host_permissions` prod restreints vs build dev.
|
||||
- Éditeur riche : `rich-text-editor.tsx` — `immediatelyRender: false` ; activer **`shouldRerenderOnTransaction: false`** (quick win perf TipTap 2.5) ; **drag handle / menu bloc** via **`@tiptap/extension-drag-handle-react`** (spec officielle — pas de double plugin `DragHandleExtension` + composant React, pas de repositionnement maison) ; poignée dans **colonne gutter fixe** du wrapper (padding + `getReferencedVirtualElement`), pas sur le bord des listes/numéros ; CSS : **pas `opacity:0` sur `.drag-handle`** (visibilité gérée par le plugin) ; config/callbacks **stables hors composant** ; fondation blocs : `tiptap-unique-id-extension.ts` / **`data-id` persisté à la sauvegarde** (références « Copier la référence ») ; **Smart Paste** : `lib/editor/smart-paste-extension.ts` ; **peek split** note source : `lib/note-peek-sync.ts` + `note-editor-split-peek.tsx` ; **conversion markdown → texte enrichi** : un **seul** convertisseur `lib/markdown-to-html.ts` (`markdownToHtml`, gfm+breaks) + une **action atomique** `convertToRichText(html)` dans `note-editor-context.tsx` (applique le HTML **immédiatement** via `setContentImmediate` — pas le `setContent` débouncé 800ms — et bascule `isMarkdown=false`) ; toolbar (`handleConvertToRichtext`) **et** chat IA contextuel (`contextual-ai-chat.tsx`, action `toRichText` → `/api/ai/convert-markdown`) passent par cette action unique (ne pas dupliquer la conversion ni oublier de basculer `isMarkdown`) ; **US-4 `structuredViewBlock`** (`tiptap-structured-view-block-extension.tsx`, `structured-view-block-embed.tsx`) : **dual-mode** — base locale autonome par défaut (`/database`, `/vue`, `isLocal: true`) + option « Lier à un carnet » (Structured Views) ; i18n `structuredViewBlock.*` ; **rejeté** : ancien `databaseBlock` « Auteurs & Œuvres » et spec embed-only `docs/story-nextgen-editor-us4-redesign.md` ; epic active `docs/story-nextgen-editor.md` — priorité **PERF > NEXTGEN > UX > MOBILE > MARKDOWN**.
|
||||
- Sync mutations notes entre composants : `memento-note/lib/note-change-sync.ts` (`emitNoteChange`, événement `NOTE_CHANGE_EVENT`) ; tracking quotas IA : événement `ai-usage-changed` (window) — doit être dispatché depuis **tous** les points d'appel IA (recherche sémantique, auto-tag, auto-title, chat, reformulation, analyse carnet, etc.) ; UI quotas : `usage-meter.tsx` (polling 5s + écoute événement).
|
||||
- Roadmap / écart prototype vs prod : Web Clipper — **`ClipperSimulator.tsx` = référence design uniquement** (pas de simulateur en prod) ; extension **`memento-note/extension/`** v0.3 **Side Panel** (clip page/sélection/lien ; popup Chrome se ferme au clic page — Side Panel pour la sélection) ; i18n extension **15 langues** (`_locales/`, détection locale navigateur ; script `extension/i18n/generate-translations.cjs`) ; **`host_permissions`** incl. LAN ; **URL serveur configurable en dev**, adresse prod figée en release ; cookies/session alignés avec l'instance cible ; **Flashcards IA SM-2 livrées** : `/revision`, `/api/flashcards/*`, génération depuis l'éditeur (GraduationCap) — réf. prototype `RevisionView.tsx` ; **Structured Views partiellement livrées** : schéma par carnet, Table/Kanban, champs partagés et valeurs par note (`/home` + toolbar carnet) — **suivi de tâches par carnet via Kanban structuré** (pas de vue agrégée Notes/Tâches sur la home ; cases à cocher inline dans les notes) ; **Éditeur Next-Gen livré** (doc `docs/story-nextgen-editor.md` **périmé** — vérifier le code) : US-1 poignée gutter unique (`editor-block-drag-handle.tsx` + `lib/editor/global-drag-handle-extension.ts`, extension Novel `tiptap-extension-global-drag-handle`), US-2 menu action bloc (`block-action-menu.tsx`), US-3 Smart Paste transclusion (`smart-paste-extension.ts` + `smart-paste-menu.tsx`), US-4 database inline (`structuredViewBlock`), plus `data-id` / `liveBlock` / peek split ; **`/insights` livré** : `app/(main)/insights/page.tsx` + `network-graph.tsx` (clusters sémantiques, bridge notes ; **≠ `/graph`**) ; **US-TEMPORAL reporté** ; encore en gap : transclusion bidirectionnelle complète, graphe knowledge enrichi (`GraphKnowledgeMap.tsx`) ; publication **Chrome Web Store** : icônes 16/48/128, privacy policy, `host_permissions` prod restreints vs build dev ; **Wizards** : `NotebookOrganizerDialog` (tags/doublons) branché via bouton "Tags IA" dans `home-client.tsx` — `StructuredViewsWizard` encore **orphelin** (pas de point d'entrée UI) ; **Publication web** (`note-editor-toolbar.tsx`) : deux modes — simple (copie directe) + IA (2-3 templates, reformulation adaptée au contenu, KaTeX pour équations, images incluses) — quota IA consommé uniquement sur publication IA ; **champs DB publication** sur modèle `Note` : `publicSlug` (pas `publishedSlug`), `publishedContent` (pas `publishedHtml`) — `publishMode` est paramètre API uniquement (`mode: 'simple' | 'ai'`), **pas** un champ en base.
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
# Momento Project Rules
|
||||
# Memento Project Rules
|
||||
|
||||
## CRITICAL — DATABASE SAFETY
|
||||
|
||||
|
||||
18
DEPLOY.md
18
DEPLOY.md
@@ -15,7 +15,7 @@
|
||||
```
|
||||
Internet/LAN
|
||||
|
|
||||
[Nginx] ── port 80/443 ── notes.parsanet.org
|
||||
[Nginx] ── port 80/443 ── memento-note.com
|
||||
|
|
||||
├── / ──► [memento-web] ── port 3000 ── Next.js App
|
||||
|
|
||||
@@ -54,7 +54,7 @@ chown memento-deploy:memento-deploy /opt/memento
|
||||
```bash
|
||||
su - memento-deploy
|
||||
cd /opt/memento
|
||||
git clone https://gitea.parsanet.org/sepehr/Momento.git .
|
||||
git clone https://gitea.parsanet.org/sepehr/Memento.git .
|
||||
git config credential.helper store
|
||||
# Le premier pull demandera les identifiants Gitea
|
||||
```
|
||||
@@ -68,7 +68,7 @@ bash scripts/deploy-docker.sh --full
|
||||
|
||||
Le script demande interactivement :
|
||||
- **ADMIN_EMAIL** (obligatoire) - le premier utilisateur inscrit avec cet email obtient le role ADMIN
|
||||
- URL (mettre `http://192.168.1.190` ou `http://notes.parsanet.org`)
|
||||
- URL (mettre `http://192.168.1.190` ou `https://memento-note.com`)
|
||||
- Provider AI + cle API
|
||||
- MCP server, email, recherche web (optionnels)
|
||||
|
||||
@@ -110,7 +110,7 @@ Redemarrer Gitea.
|
||||
|
||||
### 2. Recuperer le token d'enregistrement
|
||||
|
||||
Aller sur : **gitea.parsanet.org > Momento > Settings > Actions > Runners > "New Runner"**
|
||||
Aller sur : **gitea.parsanet.org > Memento > Settings > Actions > Runners > "New Runner"**
|
||||
Copier le token affiche.
|
||||
|
||||
### 3. Installer act_runner sur 192.168.1.190
|
||||
@@ -179,7 +179,7 @@ systemctl status gitea-runner
|
||||
systemctl status gitea-runner
|
||||
# Doit etre "active (running)"
|
||||
|
||||
# Sur gitea.parsanet.org > Momento > Settings > Actions > Runners
|
||||
# Sur gitea.parsanet.org > Memento > Settings > Actions > Runners
|
||||
# Le runner "memento-deploy" doit apparaitre avec le label "docker-host"
|
||||
```
|
||||
|
||||
@@ -213,7 +213,7 @@ git add README.md
|
||||
git commit -m "test: CI/CD deploy"
|
||||
git push origin main
|
||||
|
||||
# Verifier sur gitea.parsanet.org > Momento > Actions
|
||||
# Verifier sur gitea.parsanet.org > Memento > Actions
|
||||
# Le job doit apparaitre et se terminer en succes
|
||||
```
|
||||
|
||||
@@ -233,7 +233,7 @@ apt install -y nginx
|
||||
cat > /etc/nginx/sites-available/memento << 'EOF'
|
||||
server {
|
||||
listen 80;
|
||||
server_name notes.parsanet.org 192.168.1.190;
|
||||
server_name memento-note.com 192.168.1.190;
|
||||
|
||||
# Next.js app
|
||||
location / {
|
||||
@@ -274,12 +274,12 @@ nginx -t && systemctl reload nginx
|
||||
|
||||
```bash
|
||||
apt install -y certbot python3-certbot-nginx
|
||||
certbot --nginx -d notes.parsanet.org
|
||||
certbot --nginx -d memento-note.com
|
||||
|
||||
# Puis mettre a jour NEXTAUTH_URL :
|
||||
cd /opt/memento
|
||||
nano .env.docker
|
||||
# Changer : NEXTAUTH_URL="https://notes.parsanet.org"
|
||||
# Changer : NEXTAUTH_URL="https://memento-note.com"
|
||||
docker compose restart memento-note
|
||||
```
|
||||
|
||||
|
||||
@@ -25,7 +25,7 @@ Serveur Docker (192.168.1.190)
|
||||
|
||||
## Variables (non-sensibles)
|
||||
|
||||
Aller sur : **`Momento → Settings → Actions → Variables`**
|
||||
Aller sur : **`Memento → Settings → Actions → Variables`**
|
||||
|
||||
| Nom | Exemple | Description |
|
||||
|-----|---------|-------------|
|
||||
@@ -59,7 +59,7 @@ Aller sur : **`Momento → Settings → Actions → Variables`**
|
||||
|
||||
## Secrets (sensibles)
|
||||
|
||||
Aller sur : **`Momento → Settings → Actions → Secrets`**
|
||||
Aller sur : **`Memento → Settings → Actions → Secrets`**
|
||||
|
||||
| Nom | Description |
|
||||
|-----|-------------|
|
||||
@@ -138,11 +138,11 @@ Ou dans l'interface admin : **Admin → Settings → Configuration Email → Res
|
||||
Chaque `git push` sur la branche `main` déclenche automatiquement le déploiement.
|
||||
|
||||
### Manuel (depuis Gitea)
|
||||
`Momento → Actions → "Deploy to Production" → Run workflow → Run workflow`
|
||||
`Memento → Actions → "Deploy to Production" → Run workflow → Run workflow`
|
||||
|
||||
### Manuel (depuis le terminal)
|
||||
```bash
|
||||
cd D:/dev1405/Momento
|
||||
cd D:/dev1405/Memento
|
||||
git commit --allow-empty -m "ci: trigger deploy"
|
||||
git push origin main
|
||||
```
|
||||
@@ -167,7 +167,7 @@ git push origin main
|
||||
# Sur 192.168.1.190 :
|
||||
mkdir -p /opt/memento
|
||||
cd /opt/memento
|
||||
git clone https://gitea.parsanet.org/sepehr/Momento.git .
|
||||
git clone https://gitea.parsanet.org/sepehr/Memento.git .
|
||||
|
||||
# Générer les secrets si pas encore configurés dans Gitea :
|
||||
# openssl rand -base64 32 → NEXTAUTH_SECRET
|
||||
|
||||
18
GUIDE.en.md
18
GUIDE.en.md
@@ -79,7 +79,7 @@
|
||||
## Architecture
|
||||
|
||||
```
|
||||
Momento/
|
||||
Memento/
|
||||
├── docker-compose.yml # Multi-container orchestration
|
||||
├── .env.docker.example # Docker config template
|
||||
├── GUIDE.md # This guide (FR)
|
||||
@@ -147,8 +147,8 @@ Browser -> Next.js App Router
|
||||
### Quick Setup (interactive script)
|
||||
|
||||
```bash
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-local.sh
|
||||
@@ -167,8 +167,8 @@ The script will:
|
||||
|
||||
```bash
|
||||
# 1. Clone the repository
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento/memento-note
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento/memento-note
|
||||
|
||||
# 2. Install dependencies
|
||||
npm install --legacy-peer-deps
|
||||
@@ -200,8 +200,8 @@ npm run dev
|
||||
### Quick Setup (interactive script)
|
||||
|
||||
```bash
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-docker.sh
|
||||
@@ -231,8 +231,8 @@ The script will:
|
||||
|
||||
```bash
|
||||
# 1. Clone the repository
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# 2. Configure the environment
|
||||
cp .env.docker.example .env.docker
|
||||
|
||||
18
GUIDE.md
18
GUIDE.md
@@ -80,7 +80,7 @@
|
||||
## Architecture
|
||||
|
||||
```
|
||||
Momento/
|
||||
Memento/
|
||||
├── docker-compose.yml # Orchestration multi-conteneurs
|
||||
├── .env.docker.example # Template config Docker
|
||||
├── GUIDE.md # Ce guide (FR)
|
||||
@@ -148,8 +148,8 @@ Navigateur -> Next.js App Router
|
||||
### Installation rapide (script interactif)
|
||||
|
||||
```bash
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-local.sh
|
||||
@@ -168,8 +168,8 @@ Le script va :
|
||||
|
||||
```bash
|
||||
# 1. Cloner le depot
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento/memento-note
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento/memento-note
|
||||
|
||||
# 2. Installer les dependances
|
||||
npm install --legacy-peer-deps
|
||||
@@ -201,8 +201,8 @@ npm run dev
|
||||
### Installation rapide (script interactif)
|
||||
|
||||
```bash
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-docker.sh
|
||||
@@ -232,8 +232,8 @@ Le script va :
|
||||
|
||||
```bash
|
||||
# 1. Cloner le depot
|
||||
git clone https://github.com/votre-user/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/votre-user/Memento.git
|
||||
cd Memento
|
||||
|
||||
# 2. Configurer l'environnement
|
||||
cp .env.docker.example .env.docker
|
||||
|
||||
16
README.fr.md
16
README.fr.md
@@ -50,8 +50,8 @@ Une application de prise de notes intelligente et powered by IA. Comme Google Ke
|
||||
Le script de deploiement interactif s'occupe de tout - configuration, build et demarrage :
|
||||
|
||||
```bash
|
||||
git clone https://github.com/yourusername/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/yourusername/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-docker.sh
|
||||
@@ -73,8 +73,8 @@ docker compose up -d
|
||||
### Developpement local
|
||||
|
||||
```bash
|
||||
git clone https://github.com/yourusername/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/yourusername/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-local.sh
|
||||
@@ -86,7 +86,7 @@ cd Momento
|
||||
Ou manuellement :
|
||||
|
||||
```bash
|
||||
cd Momento/memento-note
|
||||
cd Memento/memento-note
|
||||
cp .env.example .env
|
||||
# Editer .env avec DATABASE_URL, NEXTAUTH_SECRET, ADMIN_EMAIL, etc.
|
||||
npm install --legacy-peer-deps
|
||||
@@ -170,7 +170,7 @@ Pour le guide complet d'installation, deploiement et configuration, voir **[GUID
|
||||
## Structure du projet
|
||||
|
||||
```
|
||||
Momento/
|
||||
Memento/
|
||||
├── docker-compose.yml # Orchestration multi-conteneurs
|
||||
├── .env.docker.example # Template environnement Docker
|
||||
├── scripts/ # Scripts de deploiement
|
||||
@@ -215,8 +215,8 @@ Voir [.env.docker.example](.env.docker.example) pour la liste complete. Variable
|
||||
|
||||
Les contributions sont bienvenues !
|
||||
|
||||
- **Rapports de bugs** : [Ouvrir une issue](https://github.com/yourusername/Momento/issues)
|
||||
- **Idees de fonctionnalites** : [Lancer une discussion](https://github.com/yourusername/Momento/discussions)
|
||||
- **Rapports de bugs** : [Ouvrir une issue](https://github.com/yourusername/Memento/issues)
|
||||
- **Idees de fonctionnalites** : [Lancer une discussion](https://github.com/yourusername/Memento/discussions)
|
||||
- **Pull requests** : Fork, creer une branche, et soumettre une PR
|
||||
|
||||
---
|
||||
|
||||
16
README.md
16
README.md
@@ -50,8 +50,8 @@ A smart, AI-powered note-taking app. Like Google Keep, but with notebooks, seman
|
||||
The interactive deploy script handles everything - environment config, container build, and startup:
|
||||
|
||||
```bash
|
||||
git clone https://github.com/yourusername/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/yourusername/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-docker.sh
|
||||
@@ -73,8 +73,8 @@ docker compose up -d
|
||||
### Local Development
|
||||
|
||||
```bash
|
||||
git clone https://github.com/yourusername/Momento.git
|
||||
cd Momento
|
||||
git clone https://github.com/yourusername/Memento.git
|
||||
cd Memento
|
||||
|
||||
# macOS / Linux
|
||||
./scripts/deploy-local.sh
|
||||
@@ -86,7 +86,7 @@ cd Momento
|
||||
Or manually:
|
||||
|
||||
```bash
|
||||
cd Momento/memento-note
|
||||
cd Memento/memento-note
|
||||
cp .env.example .env
|
||||
# Edit .env with your DATABASE_URL, NEXTAUTH_SECRET, ADMIN_EMAIL, etc.
|
||||
npm install --legacy-peer-deps
|
||||
@@ -170,7 +170,7 @@ For the complete installation, deployment, and configuration guide, see **[GUIDE
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
Momento/
|
||||
Memento/
|
||||
├── docker-compose.yml # Multi-container orchestration
|
||||
├── .env.docker.example # Docker environment template
|
||||
├── scripts/ # Deployment scripts
|
||||
@@ -215,8 +215,8 @@ See [.env.docker.example](.env.docker.example) for the complete list. Key variab
|
||||
|
||||
Contributions are welcome!
|
||||
|
||||
- **Bug reports**: [Open an issue](https://github.com/yourusername/Momento/issues)
|
||||
- **Feature ideas**: [Start a discussion](https://github.com/yourusername/Momento/discussions)
|
||||
- **Bug reports**: [Open an issue](https://github.com/yourusername/Memento/issues)
|
||||
- **Feature ideas**: [Start a discussion](https://github.com/yourusername/Memento/discussions)
|
||||
- **Pull requests**: Fork, create a branch, and submit a PR
|
||||
|
||||
---
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
# Deferred Work
|
||||
|
||||
## Deferred from: code review of 3-5-secure-byok-management (2026-05-16)
|
||||
## ~~Deferred from: code review of 3-5-secure-byok-management (2026-05-16)~~ ✅ COMPLETED
|
||||
|
||||
- **Test host BYOK + quota invité vide (Task 7.4)** — Scénario AC10 (hôte BYOK, quota invité vide) non couvert par test dédié dans `brainstorm-billing.test.ts`.
|
||||
- **`lastUsedAt` / `lastUsedFor` jamais mis à jour** — Champs Prisma présents mais non alimentés à l’usage des clés BYOK.
|
||||
- **`keyHash` non utilisé pour dédup** — Hash SHA-256 stocké sans logique de déduplication à l’upsert.
|
||||
- **Downgrade tier → désactivation clés hors liste** — Pas de `isActive=false` automatique au downgrade PRO/Business ; seul le rejet des nouveaux saves est en place.
|
||||
- **Rate limit POST `/api/user/api-keys`** — Pas de limite Redis documentée en spec optionnelle.
|
||||
All BYOK items implemented on 2026-05-30:
|
||||
- ✅ **Test host BYOK + quota invité vide (Task 7.4)** — Test AC10 ajouté dans `brainstorm-billing.test.ts`
|
||||
- ✅ **`lastUsedAt` / `lastUsedFor` tracking** — Implémenté dans `resolveByokApiKey()` avec update async non-bloquant
|
||||
- ✅ **`keyHash` dédup cross-provider** — `findDuplicateApiKeyHash()` ajouté, vérification dans route POST (409 Conflict)
|
||||
- ✅ **Downgrade tier → désactivation clés** — `deactivateUnauthorizedKeys()` + safety check dans `getActiveByokKey()`
|
||||
- ✅ **Rate limit POST `/api/user/api-keys`** — `checkApiKeyCreationRateLimit()` (5/h) dans route POST (429)
|
||||
|
||||
## Deferred from: code review of 4-1-gdpr-cookie-consent (2026-05-16)
|
||||
|
||||
@@ -14,7 +15,7 @@
|
||||
|
||||
## Deferred from: unified tasks view study (2026-05-24)
|
||||
|
||||
- **Vue agrégée Notes/Tâches (Markdown scrape)** — Retirée volontairement (option A produit) : surcharge UX, chevauchement avec vues structurées Kanban. Spec `spec-unified-tasks-view.md` abandonnée ; pas d’unification TipTap/Checklist pour cette vue.
|
||||
- **Vue agrégée Notes/Tâches (Markdown scrape)** — Retirée volontairement (option A produit) : surcharge UX, chevauchement avec vues structurées Kanban. Spec `spec-unified-tasks-view.md` abandonnée ; pas d'unification TipTap/Checklist pour cette vue.
|
||||
|
||||
## Deferred from: US-TEMPORAL product decision (2026-05-24)
|
||||
|
||||
|
||||
@@ -0,0 +1,144 @@
|
||||
---
|
||||
title: 'Cross-Project Health Audit'
|
||||
type: 'chore'
|
||||
created: '2026-06-20'
|
||||
status: 'done'
|
||||
baseline_commit: '40f30155c2a0f118ca41c8226992035bcab55a46'
|
||||
context:
|
||||
- '{project-root}/AGENTS.md'
|
||||
- '{project-root}/CLAUDE.md'
|
||||
- '{project-root}/memento-note/docs/admin-billing-quotas-guide.md'
|
||||
---
|
||||
|
||||
<frozen-after-approval reason="human-owned intent — do not modify unless human renegotiates">
|
||||
|
||||
## Intent
|
||||
|
||||
**Problem:** The Memento workspace spans multiple deployable and reference projects (memento-note, mcp-server, extension, mobile, monitoring, CI/CD, prototypes) without a consolidated security and quality audit; several P0 issues were found (open uploads, MCP auth bypass, fail-open quotas).
|
||||
|
||||
**Approach:** Deliver a prioritized cross-project audit report (bugs + improvements) and, upon approval, remediate Phase 1 P0 security items first — app uploads/auth, MCP tenant isolation, extension Store readiness — before UX/i18n/prototype parity work.
|
||||
|
||||
## Boundaries & Constraints
|
||||
|
||||
**Always:** No destructive DB commands; backup via `dump-db.sh` before any schema change; i18n via 15 locales when touching UI; follow prototype `architectural-grid` for UX gaps; fail-closed for billing quotas in production.
|
||||
|
||||
**Ask First:** Whether to fail-open vs fail-closed quotas during Redis outage; whether MCP `x-user-id` should be removed entirely or restricted to internal network; Chrome Web Store host_permissions scope; archiving `architectural-grid1` vs keeping both prototypes.
|
||||
|
||||
**Never:** `prisma migrate reset`, `db push --force-reset`, `pg_dump --clean` in deploy scripts; exposing API keys in client bundles; shipping extension with dev `host_permissions`; implementing all audit items in one PR.
|
||||
|
||||
</frozen-after-approval>
|
||||
|
||||
## Code Map
|
||||
|
||||
- `memento-note/app/api/uploads/[...path]/route.ts` -- uploads served without session check
|
||||
- `memento-note/app/api/image-proxy/route.ts` -- open SSRF proxy
|
||||
- `memento-note/lib/entitlements.ts` -- Redis fail-open on AI quotas
|
||||
- `memento-note/auth.config.ts` -- `/insights`, `/graph`, `/revision`, `/support` not gated
|
||||
- `memento-note/context/notebooks-context.tsx` -- broken AI toast note move (no home refresh)
|
||||
- `mcp-server/index-sse.js` -- `x-user-id` header auth bypass
|
||||
- `mcp-server/tools.js` -- missing userId filter + `ensureUserId()` first-user fallback
|
||||
- `memento-note/extension/dist-chrome-store/` -- missing PNG icons, wide host_permissions
|
||||
- `memento-mobile/app.json` -- references missing `assets/`
|
||||
- `monitoring/metrics-token` -- placeholder secret committed
|
||||
- `scripts/deploy-prod.sh` -- `pg_dump --clean`, full Docker build fallback
|
||||
- `docker-compose.yml` -- MCP/Ollama ports bound 0.0.0.0
|
||||
|
||||
## Tasks & Acceptance
|
||||
|
||||
**Execution (Phase 1 — P0 security only, if approved):**
|
||||
- [x] `memento-note/app/api/uploads/[...path]/route.ts` -- require auth + verify note ownership for file path -- prevent private attachment leak
|
||||
- [x] `memento-note/app/api/image-proxy/route.ts` -- require auth + domain allowlist -- close SSRF/abuse
|
||||
- [x] `memento-note/lib/entitlements.ts` -- fail-closed when Redis unavailable in production -- align with billing policy
|
||||
- [x] `memento-note/auth.config.ts` -- add `/insights`, `/graph`, `/revision`, `/support` to protected routes -- match API 401 behavior
|
||||
- [x] `mcp-server/index-sse.js` -- remove or restrict `x-user-id`; require API key on all tool paths -- close identity spoofing
|
||||
- [x] `mcp-server/tools.js` -- always scope queries to authenticated userId; remove `ensureUserId()` fallback -- multi-tenant isolation
|
||||
- [x] `docker-compose.yml` -- bind MCP `127.0.0.1:3001:3001` -- reduce network exposure
|
||||
|
||||
**Acceptance Criteria:**
|
||||
- Given an unauthenticated request, when GET `/api/uploads/notes/{uuid}.png`, then response is 401/403
|
||||
- Given Redis down in production, when AI quota check runs, then request is denied (not unlimited)
|
||||
- Given unauthenticated browser, when navigating to `/insights`, then redirect to login
|
||||
- Given MCP request with only `x-user-id` header and no API key, when tool invoked, then 401
|
||||
- Given authenticated user A, when MCP lists notes, then only user A notes returned
|
||||
|
||||
## Spec Change Log
|
||||
|
||||
## Design Notes
|
||||
|
||||
Full audit by project (2026-06-20):
|
||||
|
||||
**memento-note CRITICAL:** open uploads; image-proxy SSRF; fail-open quotas; middleware gaps; XSS via `dangerouslySetInnerHTML` (published pages, peek, SVG gallery); weak mobile HMAC; broken AI toast note move.
|
||||
|
||||
**mcp-server CRITICAL:** `x-user-id` spoofing; null userId returns all users' data; port 3001 public; Prisma schema drift vs main app.
|
||||
|
||||
**extension CRITICAL:** Store build missing PNG icons; `host_permissions` too broad for CWS.
|
||||
|
||||
**mobile CRITICAL:** missing assets folder; NativeWind configured but not installed.
|
||||
|
||||
**monitoring CRITICAL:** placeholder metrics token in git; Grafana on 0.0.0.0:3002.
|
||||
|
||||
**CI/CD CRITICAL:** manual deploy triggers full Docker build (fails on prod); `pg_dump --clean` in deploy script.
|
||||
|
||||
**prototypes MEDIUM:** Gemini API key in Vite client bundle; port 3000 conflict; grid vs grid1 divergence.
|
||||
|
||||
**Deferred phases:** P1 insights i18n + GraphKnowledgeMap; P2 editor drag-handle migration; P3 mobile EAS/CI; P4 monitoring alert cleanup.
|
||||
|
||||
## Verification
|
||||
|
||||
**Commands:**
|
||||
- `cd memento-note && npm run test:unit` -- expected: pass (no regressions on touched modules)
|
||||
- Manual curl unauthenticated upload URL -- expected: 401/403 after Phase 1
|
||||
|
||||
**Manual checks:**
|
||||
- Logged-out visit to `/insights` redirects to login
|
||||
- MCP tool call without API key returns 401
|
||||
|
||||
## Suggested Review Order
|
||||
|
||||
**Upload access control**
|
||||
|
||||
- Ownership check before serving note attachments; published notes stay public
|
||||
[`route.ts:30`](../../memento-note/app/api/uploads/[...path]/route.ts#L30)
|
||||
|
||||
- Prisma lookup tying filename to note content/images
|
||||
[`upload-access.ts:4`](../../memento-note/lib/upload-access.ts#L4)
|
||||
|
||||
**SSRF / image proxy**
|
||||
|
||||
- Session gate + blocked private hosts on server-side fetch
|
||||
[`route.ts:6`](../../memento-note/app/api/image-proxy/route.ts#L6)
|
||||
|
||||
- Shared SSRF hostname denylist
|
||||
[`ssrf-guard.ts:2`](../../memento-note/lib/ssrf-guard.ts#L2)
|
||||
|
||||
**Billing quotas fail-closed**
|
||||
|
||||
- Production denies when Redis is unavailable
|
||||
[`entitlements.ts:88`](../../memento-note/lib/entitlements.ts#L88)
|
||||
|
||||
- Routes return 503 instead of silent fail-open
|
||||
[`route.ts:81`](../../memento-note/app/api/chat/route.ts#L81)
|
||||
|
||||
**Auth middleware**
|
||||
|
||||
- Protect insights, graph, revision, support routes
|
||||
[`auth.config.ts:30`](../../memento-note/auth.config.ts#L30)
|
||||
|
||||
**MCP multi-tenant isolation**
|
||||
|
||||
- API key only; x-user-id removed
|
||||
[`index-sse.js:291`](../../mcp-server/index-sse.js#L291)
|
||||
|
||||
- Mandatory userId on all tool handlers
|
||||
[`tools.js:490`](../../mcp-server/tools.js#L490)
|
||||
|
||||
**Infrastructure**
|
||||
|
||||
- MCP port bound to localhost only
|
||||
[`docker-compose.yml:130`](../../docker-compose.yml#L130)
|
||||
|
||||
**Tests**
|
||||
|
||||
- Fail-open dev vs fail-closed prod entitlements
|
||||
[`entitlements.test.ts:145`](../../memento-note/tests/unit/entitlements.test.ts#L145)
|
||||
|
||||
@@ -0,0 +1,74 @@
|
||||
---
|
||||
status: in-progress
|
||||
title: "GDPR Analytics Sync + Error Reporting Hardening"
|
||||
story: 4.1-gdpr-analytics-sync
|
||||
epic: 4
|
||||
priority: high
|
||||
blast_radius: medium
|
||||
---
|
||||
|
||||
# Spec: GDPR Analytics Sync + Error Reporting Hardening
|
||||
|
||||
## Context
|
||||
|
||||
Deferred work from Story 4.1 (GDPR Cookie Consent):
|
||||
- AC5 anonymousAnalytics DB sync was not implemented
|
||||
- Original constraint: "zero DB writes in 4.1, 100% client consent"
|
||||
- Now removing constraint to implement proper sync
|
||||
|
||||
## Goals
|
||||
|
||||
1. **Primary**: Sync cookie consent `anonymousAnalytics` to database for authenticated users
|
||||
2. **Secondary**: Verify error reporting is properly wired (legitimate interest, no consent needed)
|
||||
|
||||
## Acceptance Criteria
|
||||
|
||||
### AC1: Authenticated user consent syncs to DB
|
||||
- When a logged-in user accepts/rejects analytics via banner or preferences, `UserAISettings.anonymousAnalytics` is updated in DB
|
||||
- Guest users (no session) continue using localStorage only
|
||||
|
||||
### AC2: Cross-device consistency
|
||||
- User's analytics consent persists across devices when logged in
|
||||
- Initial consent load prefers DB value when local storage is empty
|
||||
|
||||
### AC3: Error reporting verification
|
||||
- Existing error reporting continues to work without consent (legitimate interest)
|
||||
- Verify `/api/debug/client-error` route exists and is wired
|
||||
|
||||
## Tasks
|
||||
|
||||
- [ ] Task 1: Create server action for consent sync
|
||||
- [ ] Task 2: Update cookie consent utilities
|
||||
- [ ] Task 3: Update banner and dialog components
|
||||
- [ ] Task 4: Verify error reporting route
|
||||
|
||||
## Code Map
|
||||
|
||||
### New/Modified Files
|
||||
|
||||
| File | Change |
|
||||
|------|--------|
|
||||
| `lib/consent/cookie-consent.ts` | Add `saveConsentWithSync()` client wrapper |
|
||||
| `app/actions/cookie-consent.ts` | NEW - Server action for DB sync |
|
||||
| `components/legal/cookie-consent-banner.tsx` | Use new sync action |
|
||||
| `components/legal/cookie-preferences-dialog.tsx` | Use new sync action |
|
||||
| `app/api/debug/client-error/route.ts` | Verify exists |
|
||||
|
||||
### Design Notes
|
||||
|
||||
- Server action calls `updateAISettings({ anonymousAnalytics: boolean })`
|
||||
- Client-side: combine `setConsent()` + server action in parallel
|
||||
- Server action silently succeeds for guests (no session) — component ignores result
|
||||
- Error reporting uses `/api/debug/client-error` — already exists, no consent gate needed
|
||||
|
||||
## Spec Change Log
|
||||
|
||||
- 2026-05-30: Created spec for deferred AC5 implementation
|
||||
- 2026-05-30: Added error reporting verification as secondary goal
|
||||
|
||||
## Dev Agent Record
|
||||
|
||||
### Agent Model Used
|
||||
Claude Opus 4.8
|
||||
|
||||
### Completion Notes List
|
||||
@@ -9,7 +9,7 @@ completedDate: 2026-05-24
|
||||
|
||||
## Context
|
||||
|
||||
Momento currently uses MCP SDK v1.0.4 with a working but potentially fragile implementation. With MCP SDK v2 coming in Q1 2026, we need to:
|
||||
Memento currently uses MCP SDK v1.0.4 with a working but potentially fragile implementation. With MCP SDK v2 coming in Q1 2026, we need to:
|
||||
1. Make the current implementation more robust
|
||||
2. Prepare for v2 migration
|
||||
3. Add production-ready features
|
||||
|
||||
@@ -0,0 +1,163 @@
|
||||
---
|
||||
title: 'Subscription & Quota Admin Management'
|
||||
type: 'feature'
|
||||
created: '2026-06-20'
|
||||
status: 'done'
|
||||
baseline_commit: '5b13a88b726c03ca6ff5603d901147448a72adbc'
|
||||
context:
|
||||
- 'memento-note/lib/entitlements.ts'
|
||||
- 'memento-note/lib/config.ts'
|
||||
- 'memento-note/lib/billing/stripe-prices.ts'
|
||||
---
|
||||
|
||||
<frozen-after-approval reason="human-owned intent — do not modify unless human renegotiates">
|
||||
|
||||
## Intent
|
||||
|
||||
**Problem:** Subscription tiers, AI quotas, and Stripe business config are split between hardcoded code (`TIER_LIMITS`), server `.env` (price IDs, billing flag), and a minimal admin override (tier dropdown only). Operators cannot adjust limits or billing settings without redeploy; quota enforcement has a TOCTOU race (`check` then `increment`); token analytics are partially broken.
|
||||
|
||||
**Approach:** Add a secure admin **Billing & Quotas** console backed by DB (`PlanEntitlement` + `SystemConfig`), keep Stripe secrets in infra env only, unify quota enforcement on atomic `reserveUsageOrThrow`, and expose usage dashboards with audit logging for manual tier overrides.
|
||||
|
||||
## Boundaries & Constraints
|
||||
|
||||
**Always:**
|
||||
- `STRIPE_SECRET_KEY` and `STRIPE_WEBHOOK_SECRET` stay in server env / secrets vault — never in `SystemConfig`, never editable from browser.
|
||||
- Stripe remains authoritative for paid subscriptions; webhooks drive state; manual admin tier changes are support overrides only.
|
||||
- Quota gating unit stays **requests per feature per calendar month** (not token-based blocking).
|
||||
- Redis quota checks fail-open with structured error logging (industry standard for AI rate limits).
|
||||
- All admin mutations require `role === ADMIN`; i18n for new UI strings in `locales/en.json` and `locales/fr.json` minimum.
|
||||
- Non-destructive DB migration only; seed `PlanEntitlement` from current `TIER_LIMITS` defaults.
|
||||
|
||||
**Ask First:**
|
||||
- Adding new Prisma models beyond `PlanEntitlement` (e.g. full `FeatureFlag` wiring).
|
||||
- Changing Stripe products/prices in live Stripe Dashboard (ops action, not code).
|
||||
- Switching to usage-based Stripe Meter / Metronome billing.
|
||||
|
||||
**Never:**
|
||||
- Store `sk_*` or `whsec_*` in plaintext DB or admin forms.
|
||||
- Run `prisma migrate reset`, `db push --accept-data-loss`, or any destructive DB command.
|
||||
- Replace Redis real-time counters with synchronous PostgreSQL writes on every AI request.
|
||||
- Add automated tests unless explicitly requested later.
|
||||
|
||||
## I/O & Edge-Case Matrix
|
||||
|
||||
| Scenario | Input / State | Expected Output / Behavior | Error Handling |
|
||||
|----------|--------------|---------------------------|----------------|
|
||||
| Admin saves tier limit | ADMIN edits PRO `chat` limit 50→75 | `PlanEntitlement` upserted; next `getLimit()` returns 75; existing Redis counters unchanged until period rollover | 403 if non-admin; 400 if invalid feature or negative limit |
|
||||
| Admin saves Stripe price ID | ADMIN sets `STRIPE_PRICE_PRO_MONTHLY` in SystemConfig | `resolvePriceId('PRO','month')` reads DB value; env used only as fallback | 400 if empty when billing enabled |
|
||||
| User at quota | User on BASIC, 30/30 `semantic_search` used | `reserveUsageOrThrow` returns 402 `QUOTA_EXCEEDED` | Fail-open if Redis down (allow + log alert) |
|
||||
| Concurrent AI requests | Two requests at limit−1 | Only one succeeds; second gets 402 (atomic Lua) | N/A |
|
||||
| Admin manual tier override | ADMIN sets user to BUSINESS | `Subscription` upserted; `AuditLog` entry with actor, target, old/new tier | Cannot override own tier (existing rule) |
|
||||
| Billing disabled | `BILLING_ENABLED=false` in SystemConfig | `/settings/billing` shows disabled state; checkout buttons hidden | N/A |
|
||||
| suggest-charts usage | Successful chart suggestion | `incrementUsageAsync` called once (not broken 4-arg call) | N/A |
|
||||
|
||||
</frozen-after-approval>
|
||||
|
||||
## Code Map
|
||||
|
||||
- `memento-note/prisma/schema.prisma` — add `PlanEntitlement` model (`tier`, `feature`, `limitValue`; unique on `[tier, feature]`; `null` limitValue = unlimited; omit row or sentinel = feature unavailable per tier)
|
||||
- `memento-note/prisma/migrations/*` — additive migration + seed from current `TIER_LIMITS`
|
||||
- `memento-note/lib/entitlements.ts` — load limits from DB with in-memory cache (TTL ~60s) and hardcoded fallback; export `getLimit()` async; keep fail-open on Redis errors
|
||||
- `memento-note/lib/billing/stripe-prices.ts` — read price IDs via `getConfigValue()` with env fallback; remove sole dependence on `process.env`
|
||||
- `memento-note/lib/config.ts` — add billing keys to `ENV_FALLBACKS` (`BILLING_ENABLED`, four `STRIPE_PRICE_*`)
|
||||
- `memento-note/app/actions/admin-billing.ts` — server actions: `getPlanEntitlements`, `updatePlanEntitlement`, `updateBillingConfig`, `getUsageOverview`
|
||||
- `memento-note/app/(admin)/admin/billing/page.tsx` — admin UI: tier limits matrix, billing config, usage summary table
|
||||
- `memento-note/app/(admin)/admin/billing/billing-admin-form.tsx` — client form component
|
||||
- `memento-note/components/admin-sidebar.tsx` — nav link `/admin/billing`
|
||||
- `memento-note/app/actions/admin.ts` — log `SUBSCRIPTION_OVERRIDE` audit on `updateUserSubscription`
|
||||
- `memento-note/lib/audit-log.ts` — extend `AuditAction` with `SUBSCRIPTION_OVERRIDE`, `BILLING_CONFIG_UPDATED`, `PLAN_ENTITLEMENT_UPDATED`
|
||||
- `memento-note/components/settings/billing-plans.tsx` — read `billingEnabled` from `/api/billing/status` instead of build-time env only
|
||||
- `memento-note/app/api/billing/status/route.ts` — include `billingEnabled` from SystemConfig
|
||||
- `memento-note/app/api/ai/suggest-charts/route.ts` — fix usage tracking (use `incrementUsageAsync`, not broken `trackFeatureUsage` call)
|
||||
- AI routes using `checkEntitlementOrThrow` + `incrementUsageAsync` — migrate to `reserveUsageOrThrow` only (remove duplicate increment on success); include chat route
|
||||
|
||||
## Tasks & Acceptance
|
||||
|
||||
**Execution:**
|
||||
- [x] `prisma/schema.prisma` + migration — add `PlanEntitlement`, seed defaults from `TIER_LIMITS` — DB-backed limits without breaking existing users
|
||||
- [x] `lib/entitlements.ts` — async limit loader with cache + fallback; update `canUseFeature`, `reserveUsageOrThrow`, `getUserQuotas` — single source of truth
|
||||
- [x] `lib/billing/stripe-prices.ts` + `lib/config.ts` — SystemConfig-backed price IDs and `BILLING_ENABLED` — admin-editable business config
|
||||
- [x] `app/actions/admin-billing.ts` — CRUD entitlements + billing config + usage overview query (join `UsageLog` + Redis snapshot) — secure admin API surface
|
||||
- [x] `app/(admin)/admin/billing/*` + `components/admin-sidebar.tsx` — admin UI section — operator-facing management
|
||||
- [x] `app/actions/admin.ts` + `lib/audit-log.ts` — audit trail for tier overrides and config changes — support accountability
|
||||
- [x] AI routes (grep `checkEntitlementOrThrow`) + `app/api/chat/route.ts` — switch to `reserveUsageOrThrow`; drop redundant `incrementUsageAsync` on success — fix TOCTOU race
|
||||
- [x] `app/api/ai/suggest-charts/route.ts` — fix broken usage call — restore quota accounting
|
||||
- [x] `app/api/billing/status/route.ts` + `components/settings/billing-plans.tsx` — runtime billing flag — no redeploy to toggle billing UI
|
||||
- [x] `locales/en.json` + `locales/fr.json` — i18n keys under `admin.billing.*` — FR/EN reference labels
|
||||
|
||||
**Acceptance Criteria:**
|
||||
- Given an ADMIN on `/admin/billing`, when they change PRO `chat` limit and save, then a new entitlement check within 60s reflects the new limit without app restart.
|
||||
- Given a BASIC user at quota, when two parallel AI requests arrive, then at most one succeeds and the other returns HTTP 402.
|
||||
- Given `BILLING_ENABLED` is false in SystemConfig, when a user opens `/settings/billing`, then checkout/upgrade actions are hidden and a clear disabled message is shown.
|
||||
- Given an ADMIN changes a user's tier from `/admin/users`, when the change succeeds, then an `AuditLog` row records actor, target user, old tier, and new tier.
|
||||
- Given Stripe price IDs are set in SystemConfig (env unset), when checkout is initiated, then the correct Stripe price is used.
|
||||
- Given Redis is unreachable, when an AI request is made, then the request is allowed (fail-open) and an error is logged server-side.
|
||||
- Given `STRIPE_SECRET_KEY` remains env-only, when inspecting `SystemConfig` table, then no `sk_` or `whsec_` values exist.
|
||||
|
||||
## Design Notes
|
||||
|
||||
**PlanEntitlement limit encoding:** `limitValue: null` → unlimited; positive integer → monthly request cap; omit row (or explicit `-1` sentinel if needed) → feature not available on tier (maps to current `undefined` in `TIER_LIMITS`).
|
||||
|
||||
**Cache invalidation:** After admin saves entitlements, call a small `invalidateEntitlementCache()` so changes apply immediately without waiting for TTL.
|
||||
|
||||
**Quota migration pattern:** Replace `await checkEntitlementOrThrow(userId, feature)` + `incrementUsageAsync(...)` with `await reserveUsageOrThrow(userId, feature)` at request start. Do not increment again on success. For streaming chat, reserve before `streamText`; no post-finish increment.
|
||||
|
||||
**Usage dashboard:** Show per-tier aggregate from `UsageLog` (last synced month) plus optional live Redis read for current month top features — degraded state if sync cron stale is acceptable (show `syncedAt`).
|
||||
|
||||
## Verification
|
||||
|
||||
**Commands:**
|
||||
- `cd memento-note && npm run test:unit -- tests/unit/entitlements.test.ts` — expected: pass after async limit loader changes
|
||||
- `cd memento-note && npx tsc --noEmit` — expected: no type errors
|
||||
|
||||
**Manual checks:**
|
||||
- ADMIN `/admin/billing`: edit a limit, save, verify `/api/usage/current` reflects new cap for a test user on that tier.
|
||||
- Non-admin GET to admin-billing server actions returns unauthorized.
|
||||
- Two rapid AI calls at quota−1: only one succeeds.
|
||||
|
||||
## Spec Change Log
|
||||
|
||||
## Suggested Review Order
|
||||
|
||||
**Entitlements & DB limits**
|
||||
|
||||
- Central loader: DB `PlanEntitlement` with 60s cache and hardcoded fallback
|
||||
[`plan-entitlements.ts:1`](../../memento-note/lib/plan-entitlements.ts#L1)
|
||||
|
||||
- Prisma model + seeded migration from former `TIER_LIMITS`
|
||||
[`schema.prisma:814`](../../memento-note/prisma/schema.prisma#L814)
|
||||
|
||||
- Entitlements API now reads limits asynchronously from cache
|
||||
[`entitlements.ts:1`](../../memento-note/lib/entitlements.ts#L1)
|
||||
|
||||
**Admin console**
|
||||
|
||||
- Server actions: entitlements CRUD, billing config, usage overview
|
||||
[`admin-billing.ts:1`](../../memento-note/app/actions/admin-billing.ts#L1)
|
||||
|
||||
- Admin UI at `/admin/billing` with tier matrix + Stripe price IDs
|
||||
[`billing-admin-client.tsx:1`](../../memento-note/app/(admin)/admin/billing/billing-admin-client.tsx#L1)
|
||||
|
||||
- Audit trail on manual tier override
|
||||
[`admin.ts:142`](../../memento-note/app/actions/admin.ts#L142)
|
||||
|
||||
**Stripe & billing UX**
|
||||
|
||||
- Price IDs and `BILLING_ENABLED` via SystemConfig (env fallback)
|
||||
[`stripe-prices.ts:79`](../../memento-note/lib/billing/stripe-prices.ts#L79)
|
||||
|
||||
- Runtime billing flag exposed to settings page
|
||||
[`billing-plans.tsx:80`](../../memento-note/components/settings/billing-plans.tsx#L80)
|
||||
|
||||
**Quota hardening**
|
||||
|
||||
- Atomic `reserveUsageOrThrow` on billable AI routes (replaces check+increment)
|
||||
[`chat/route.ts:69`](../../memento-note/app/api/chat/route.ts#L69)
|
||||
|
||||
- Fixed broken suggest-charts usage tracking
|
||||
[`suggest-charts/route.ts:58`](../../memento-note/app/api/ai/suggest-charts/route.ts#L58)
|
||||
|
||||
**Tests**
|
||||
|
||||
- Entitlements + billing price map unit tests updated
|
||||
[`entitlements.test.ts:1`](../../memento-note/tests/unit/entitlements.test.ts#L1)
|
||||
@@ -0,0 +1,117 @@
|
||||
---
|
||||
title: 'US-4 Redesign — Embedded Structured View Block (replaces authors/works demo)'
|
||||
type: 'refactor'
|
||||
created: '2026-05-27'
|
||||
status: 'done'
|
||||
baseline_commit: 'CURRENT'
|
||||
completedDate: '2026-05-30'
|
||||
context:
|
||||
- 'docs/story-nextgen-editor-us4-redesign.md'
|
||||
- 'memento-note/lib/structured-views/types.ts'
|
||||
note: >
|
||||
Implementation complete with TWO modes:
|
||||
1. Local Database (isLocal: true) — Notion-like inline table with editable columns/rows
|
||||
2. Notebook Linked View (isLocal: false) — Live Structured Views integration
|
||||
Plus: Analytics panel, Memory Echo semantic search, Convert-to-notebook feature.
|
||||
Implementation exceeds original spec scope.
|
||||
---
|
||||
|
||||
<frozen-after-approval reason="human-owned intent — do not modify unless human renegotiates">
|
||||
|
||||
## Intent
|
||||
|
||||
**Problem:** The current `/database` slash command inserts a self-contained "Authors & Works" relational block with hardcoded Jules Verne / Liu Cixin demo data stored as JSON blobs in TipTap node attributes — completely disconnected from Structured Views (NotebookSchema / NoteProperty), duplicating a data model and confusing users who expect a real notebook-linked view.
|
||||
|
||||
**Approach:** Replace the current `databaseBlock` TipTap node and its three files (extension, editor component, types) with a new `structuredViewBlock` node that stores only a reference (`notebookId`, `displayMode`, `filter`), then reads live data from the existing Structured Views API — or falls back gracefully when the notebook has no schema.
|
||||
|
||||
## Boundaries & Constraints
|
||||
|
||||
**Always:**
|
||||
- The block stores only a reference (`notebookId` + metadata attrs) — never serialises note rows/property values into TipTap HTML.
|
||||
- The editor must receive `notebookId` from its parent (`note-content-area.tsx`) for the block to resolve its schema.
|
||||
- i18n: all labels go through `useLanguage()` with keys in EN/FR minimum; no hardcoded strings.
|
||||
- Mutations (add note, edit property value) use optimistic updates via `NOTE_REQUEST_SAVE_EVENT` — no full revalidatePath.
|
||||
- If the current notebook has no `NotebookSchema`, show a contextual callout ("This notebook has no structured view — set one up from the notebook header") instead of a blank block; never auto-insert demo data.
|
||||
- Migration: silently drop legacy `databaseBlock` nodes on load (treat as unknown node, ProseMirror drops them or show an "outdated block" placeholder).
|
||||
- On delete of the block: only the TipTap reference node is removed; no Prisma records are affected.
|
||||
- RTL (fa, ar): the block wrapper must respect `dir="auto"`.
|
||||
|
||||
**Ask First:**
|
||||
- Whether the block should support inline editing of property values (clicking a cell to edit) or be read-only with a "Open in notebook" CTA only — founder decides before coding begins.
|
||||
- Whether Kanban view is in scope for v1 inline (complex drag-and-drop inside a TipTap NodeView) or deferred to v2.
|
||||
|
||||
**Never:**
|
||||
- Insert any demo data (no Jules Verne, no placeholders rows, no fake schema).
|
||||
- Create a second data storage system parallel to NotebookSchema/NoteProperty.
|
||||
- Store note rows or property values in TipTap node attributes.
|
||||
- Copy the `DatabaseBlockEditor` or `database-block-types.ts` pattern.
|
||||
- Use `revalidatePath` for mutations from inside the block.
|
||||
|
||||
## I/O & Edge-Case Matrix
|
||||
|
||||
| Scenario | Input / State | Expected Output / Behavior | Error Handling |
|
||||
|----------|--------------|---------------------------|----------------|
|
||||
| Happy path — structured notebook | Note in structured notebook, user types `/vue` → insert block | Block renders table of notes with their schema properties | — |
|
||||
| No schema on notebook | Note is in a plain notebook (no NotebookSchema) | Block shows callout "Set up a structured view from the notebook header" with link | CTA links to notebook toolbar wizard |
|
||||
| Note not in any notebook | Note has no `notebookId` | Block shows "This block requires a notebook. Move this note to a notebook to use it." | Graceful inline message |
|
||||
| Legacy `databaseBlock` node found on load | HTML contains `data-database-block="true"` | ProseMirror skips the node (unknown type after extension removal); optionally show 1-line deprecation placeholder | No crash, no data loss on other content |
|
||||
| API error fetching schema | `GET /api/notebooks/:id/schema` 500 | Block shows error state with retry button | Console.error, no spinner freeze |
|
||||
| Inline edit (if in scope) — optimistic patch | User edits a cell → PATCH `/api/notes/:id/properties` | Optimistic update on cell, save triggered via NOTE_REQUEST_SAVE_EVENT | Rollback cell on API error |
|
||||
|
||||
</frozen-after-approval>
|
||||
|
||||
## Code Map
|
||||
|
||||
- `memento-note/components/tiptap-database-block-extension.tsx` -- **DELETE** — legacy authors/works TipTap node
|
||||
- `memento-note/components/database-block-editor.tsx` -- **DELETE** — legacy authors/works editor
|
||||
- `memento-note/lib/editor/database-block-types.ts` -- **DELETE** — legacy types with Verne/Cixin data
|
||||
- `memento-note/components/tiptap-structured-view-block-extension.tsx` -- **NEW** — TipTap Node extension (`structuredViewBlock`, attrs: `notebookId`, `displayMode: 'table'|'gallery'`, `filterJson`)
|
||||
- `memento-note/components/structured-view-block-embed.tsx` -- **NEW** — React NodeView component; fetches schema via SWR(`/api/notebooks/${notebookId}/schema`) and renders `NotesStructuredTable` or `NotesGalleryView` in read-only mode (or editable if founder approves inline edit)
|
||||
- `memento-note/components/note-editor/note-content-area.tsx` -- **MODIFY** — pass `notebookId={note.notebookId}` to `<RichTextEditor>`
|
||||
- `memento-note/components/rich-text-editor.tsx` -- **MODIFY** — accept `notebookId?: string` prop; pass it to editor storage; register `StructuredViewBlockExtension` in place of `DatabaseBlockExtension`; update slash command entry (label, keywords, handler); update block action menu's "Transform into" option
|
||||
- `memento-note/components/block-action-menu.tsx` -- **MODIFY** — replace `database` option with `structuredView`; import from new extension
|
||||
- `memento-note/locales/en.json` + `fr.json` -- **MODIFY** — add keys: `structuredViewBlock.insertLabel`, `structuredViewBlock.insertDesc`, `structuredViewBlock.noSchema`, `structuredViewBlock.noNotebook`, `structuredViewBlock.openInNotebook`, `structuredViewBlock.displayModeTable`, `structuredViewBlock.displayModeGallery`; remove all `databaseBlock.*` keys (after verifying no other consumer)
|
||||
|
||||
## Tasks & Acceptance
|
||||
|
||||
**Execution:**
|
||||
- [ ] `memento-note/lib/editor/database-block-types.ts` -- DELETE file -- eliminates Verne/Cixin hardcoded data and legacy type definitions
|
||||
- [ ] `memento-note/components/database-block-editor.tsx` -- DELETE file -- removes authors/works editor UI
|
||||
- [ ] `memento-note/components/tiptap-database-block-extension.tsx` -- DELETE file -- removes legacy TipTap node extension
|
||||
- [ ] `memento-note/components/tiptap-structured-view-block-extension.tsx` -- CREATE — TipTap Node `structuredViewBlock` with attrs `{ notebookId: string, displayMode: 'table'|'gallery', filterJson: string }`, `ReactNodeViewRenderer(StructuredViewBlockEmbed)`
|
||||
- [ ] `memento-note/components/structured-view-block-embed.tsx` -- CREATE — NodeView wrapper: SWR fetch schema, conditional rendering (no-schema callout / no-notebook callout / table or gallery view), RTL-safe wrapper, `dir="auto"`
|
||||
- [ ] `memento-note/components/note-editor/note-content-area.tsx` -- MODIFY — add `notebookId={note.notebookId ?? undefined}` prop to both `<RichTextEditor>` instances
|
||||
- [ ] `memento-note/components/rich-text-editor.tsx` -- MODIFY — (a) add `notebookId?: string` to props, store in `editor.storage.structuredViewBlock = { notebookId }`; (b) swap `DatabaseBlockExtension` for `StructuredViewBlockExtension`; (c) update slash entry: title key `structuredViewBlock.insertLabel`, description key `structuredViewBlock.insertDesc`, keywords `['vue', 'tableau', 'structuré', 'structured', 'view', 'database', 'db']`; (d) update slash handler to call `insertStructuredViewBlockAtSelection(editor, notebookId)`
|
||||
- [ ] `memento-note/components/block-action-menu.tsx` -- MODIFY — replace `database` transform option with `structuredView`; update import
|
||||
- [ ] `memento-note/locales/en.json` + `fr.json` -- MODIFY — add new i18n keys (see Code Map); remove `databaseBlock.*` keys
|
||||
|
||||
**Acceptance Criteria:**
|
||||
- Given a note in a structured notebook, when user types `/vue` or `/structured`, then a `structuredViewBlock` node is inserted showing the notebook's notes and their properties — no demo data appears.
|
||||
- Given the block is inserted, when the notebook has no schema, then the block shows a callout with a link to the notebook header wizard — no crash, no empty white box.
|
||||
- Given the note has no notebookId, when `/vue` is triggered, then the block shows an inline "requires a notebook" message.
|
||||
- Given a note with a legacy `data-database-block` node, when the note is opened, then the legacy block is silently dropped (or shown as deprecated placeholder) and the rest of the note content is intact.
|
||||
- Given the block is visible, when user resizes or the app language is Persian (fa, RTL), then the block layout is mirrored correctly.
|
||||
- Given the slash command menu opens, when user searches "database" or "db", then the new `structuredViewBlock` entry appears (backward-compatible keywords).
|
||||
- Given "Transform into" is opened in the block action menu, the "Database" option is replaced by "Vue structurée" / "Structured View".
|
||||
|
||||
## Spec Change Log
|
||||
|
||||
## Design Notes
|
||||
|
||||
**Why reference-only attrs?** Storing note rows in TipTap HTML scales to O(notes × properties) per keystroke — unacceptable for perf. The reference pattern (`notebookId` only) is how Notion "linked database" blocks work and aligns with Memento's already-existing API layer.
|
||||
|
||||
**notebookId propagation:** The editor currently receives only `noteId`. The smallest change is to add `notebookId` as a prop to `RichTextEditor` (already used by `note-content-area.tsx`). No context change needed.
|
||||
|
||||
**Legacy migration:** ProseMirror silently drops unknown node types when the corresponding extension is not registered. Removing `DatabaseBlockExtension` from the extensions array is sufficient for new sessions. For existing notes with the old HTML, the `data-database-block` div will parse as an unrecognised block and ProseMirror will omit it. If this is too silent, add a `parseHTML` rule in the new extension that matches `div[data-database-block]` and converts it to a deprecated-placeholder paragraph.
|
||||
|
||||
## Verification
|
||||
|
||||
**Commands:**
|
||||
- `npm run lint --prefix memento-note` -- expected: 0 errors (no imports from deleted files)
|
||||
- `npm run build --prefix memento-note` -- expected: build succeeds, no missing module errors
|
||||
|
||||
**Manual checks (if no CLI):**
|
||||
- Open a note in a structured notebook → type `/vue` → confirm block appears with real notes (not Jules Verne).
|
||||
- Open a note in a plain notebook → type `/vue` → confirm "no schema" callout appears.
|
||||
- Open a note with a saved legacy `databaseBlock` → confirm note loads cleanly, no crash.
|
||||
- Switch app language to `fa` → confirm block layout is RTL-mirrored.
|
||||
@@ -7,7 +7,7 @@ visual_tools: intermediate
|
||||
|
||||
# Core Configuration Values
|
||||
user_name: Devparsa
|
||||
project_name: Momento
|
||||
project_name: Memento
|
||||
communication_language: French
|
||||
document_output_language: English
|
||||
output_folder: "{project-root}/_bmad-output"
|
||||
|
||||
@@ -14,7 +14,7 @@ design_experience: intermediate
|
||||
|
||||
# Core Configuration Values
|
||||
user_name: Devparsa
|
||||
project_name: Momento
|
||||
project_name: Memento
|
||||
communication_language: French
|
||||
document_output_language: English
|
||||
output_folder: "{project-root}/_bmad-output"
|
||||
|
||||
@@ -36,7 +36,7 @@ async function startServer() {
|
||||
const app = express();
|
||||
const server = createServer(app);
|
||||
const wss = new WebSocketServer({ server });
|
||||
const PORT = 3000;
|
||||
const PORT = 4000;
|
||||
|
||||
app.use(express.json());
|
||||
|
||||
@@ -170,6 +170,38 @@ async function startServer() {
|
||||
res.json(ideas[index]);
|
||||
});
|
||||
|
||||
app.post('/api/gemini/embed', async (req, res) => {
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) {
|
||||
return res.status(503).json({ error: 'GEMINI_API_KEY not configured on server' });
|
||||
}
|
||||
try {
|
||||
const { GoogleGenAI } = await import('@google/genai');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
const response = await ai.models.embedContent(req.body);
|
||||
res.json(response);
|
||||
} catch (error) {
|
||||
console.error('Gemini embed error:', error);
|
||||
res.status(500).json({ error: 'Gemini embed failed' });
|
||||
}
|
||||
});
|
||||
|
||||
app.post('/api/gemini/generate', async (req, res) => {
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) {
|
||||
return res.status(503).json({ error: 'GEMINI_API_KEY not configured on server' });
|
||||
}
|
||||
try {
|
||||
const { GoogleGenAI } = await import('@google/genai');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
const response = await ai.models.generateContent(req.body);
|
||||
res.json({ text: response.text ?? '' });
|
||||
} catch (error) {
|
||||
console.error('Gemini proxy error:', error);
|
||||
res.status(500).json({ error: 'Gemini request failed' });
|
||||
}
|
||||
});
|
||||
|
||||
// Vite middleware for development
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
const vite = await createViteServer({
|
||||
|
||||
@@ -327,7 +327,7 @@ export const AgentsView: React.FC<AgentsViewProps> = ({
|
||||
'Connexion SSH sans mot de passe à devSandbox',
|
||||
'Gateway token (blank to generate)',
|
||||
'Procédure d\'accès à openclaw',
|
||||
'Derniers commits du repo Momento'
|
||||
'Derniers commits du repo Memento'
|
||||
].map((note, i) => (
|
||||
<label key={i} className="flex items-center gap-4 px-6 py-4 cursor-pointer hover:bg-white/50 transition-colors group">
|
||||
<div className={`w-5 h-5 rounded border transition-all flex items-center justify-center
|
||||
|
||||
@@ -44,7 +44,7 @@ export const AuthPage: React.FC<AuthPageProps> = ({ onAuthComplete, onBack, init
|
||||
<div className="w-8 h-8 bg-ink text-white rounded-xl flex items-center justify-center shadow-lg">
|
||||
<span className="font-serif font-bold text-xl">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-xl font-medium tracking-tight text-ink">Momento</span>
|
||||
<span className="font-serif text-xl font-medium tracking-tight text-ink">Memento</span>
|
||||
</div>
|
||||
|
||||
<div className="w-24" /> {/* Spacer */}
|
||||
@@ -191,7 +191,7 @@ export const AuthPage: React.FC<AuthPageProps> = ({ onAuthComplete, onBack, init
|
||||
</AnimatePresence>
|
||||
|
||||
<p className="text-center mt-8 text-[9px] text-concrete font-bold uppercase tracking-[0.3em] opacity-40">
|
||||
© 2024 Momento Labs — Privacy • Terms
|
||||
© 2024 Memento Labs — Privacy • Terms
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -124,7 +124,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
try {
|
||||
// Occasional simulated error for retry demonstration
|
||||
if (Math.random() < 0.15) {
|
||||
throw new Error("Connexion réseau interrompue. L'extension n'a pas pu joindre les serveurs Momento.");
|
||||
throw new Error("Connexion réseau interrompue. L'extension n'a pas pu joindre les serveurs Memento.");
|
||||
}
|
||||
|
||||
const dateStr = new Date().toLocaleDateString('fr-FR', {
|
||||
@@ -175,10 +175,10 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
setLastCreatedNoteId(newNoteId);
|
||||
setClipperState('success');
|
||||
|
||||
// Add note to Momento Database
|
||||
// Add note to Memento Database
|
||||
onAddNote(newNote);
|
||||
|
||||
// Fire real-time notification toast in Momento!
|
||||
// Fire real-time notification toast in Memento!
|
||||
onTriggerToast(clipTitle, newNoteId);
|
||||
|
||||
} catch (err: any) {
|
||||
@@ -260,7 +260,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
{/* Web Extension active badge */}
|
||||
<button
|
||||
className="p-1.5 bg-accent/10 border border-accent/20 rounded-lg text-accent animate-pulse relative group"
|
||||
title="Momento Web Clipper is active"
|
||||
title="Memento Web Clipper is active"
|
||||
>
|
||||
<Scissors size={14} className="-rotate-90" />
|
||||
<span className="absolute bottom-full right-0 mb-2 whitespace-nowrap hidden group-hover:block bg-ink text-paper text-[10px] py-1 px-2 rounded-md shadow-lg">
|
||||
@@ -356,12 +356,12 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
{/* Extension Hub Header */}
|
||||
<header className="px-5 py-4 border-b border-neutral-100 dark:border-neutral-800 bg-neutral-50 dark:bg-neutral-900/40 flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
{/* Momento Logo with Clipper Branding */}
|
||||
{/* Memento Logo with Clipper Branding */}
|
||||
<div className="w-7 h-7 bg-ink text-paper rounded-lg flex items-center justify-center font-serif font-black text-sm">
|
||||
M
|
||||
</div>
|
||||
<div className="leading-tight">
|
||||
<span className="text-xs font-bold font-serif text-ink dark:text-dark-ink tracking-tight">Momento</span>
|
||||
<span className="text-xs font-bold font-serif text-ink dark:text-dark-ink tracking-tight">Memento</span>
|
||||
<span className="text-[10px] text-accent block font-mono font-medium tracking-widest uppercase">Web Clipper</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -561,7 +561,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
}}
|
||||
className="w-full py-3.5 bg-ink text-paper rounded-xl text-xs font-bold uppercase tracking-widest flex items-center justify-center gap-2 hover:opacity-95 transition-opacity"
|
||||
>
|
||||
Voir dans Momento
|
||||
Voir dans Memento
|
||||
<ArrowUpRight size={14} />
|
||||
</button>
|
||||
|
||||
@@ -608,7 +608,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
|
||||
{/* Simulated context details */}
|
||||
<footer className="px-5 py-3 border-t border-neutral-100 dark:border-neutral-800 bg-neutral-50/50 dark:bg-neutral-900/40 text-[9px] text-concrete text-center">
|
||||
Momento Companion v2.1.2 • Sécurisé HTTPS TLS 1.3
|
||||
Memento Companion v2.1.2 • Sécurisé HTTPS TLS 1.3
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -37,7 +37,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<div className="w-10 h-10 bg-ink flex items-center justify-center rounded-xl shadow-lg rotate-3 group hover:rotate-0 transition-transform cursor-pointer">
|
||||
<span className="text-paper font-serif text-2xl font-bold">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Memento</span>
|
||||
</div>
|
||||
|
||||
<div className="hidden md:flex items-center gap-10">
|
||||
@@ -86,7 +86,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<span className="italic">enfin amplifié.</span>
|
||||
</h1>
|
||||
<p className="max-w-2xl mx-auto text-lg md:text-xl text-concrete font-light leading-relaxed mb-12">
|
||||
Momento n'est pas qu'une simple application de notes. C'est un écosystème intelligent qui connecte, analyse et développe vos idées en temps réel grâce à 6 types d'agents IA et une recherche sémantique de pointe.
|
||||
Memento n'est pas qu'une simple application de notes. C'est un écosystème intelligent qui connecte, analyse et développe vos idées en temps réel grâce à 6 types d'agents IA et une recherche sémantique de pointe.
|
||||
</p>
|
||||
|
||||
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
|
||||
@@ -155,7 +155,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<h2 className="text-4xl md:text-5xl font-serif tracking-tight text-ink">Une intelligence fluide, <br />intégrée à chaque mot.</h2>
|
||||
</div>
|
||||
<div className="text-concrete font-light">
|
||||
Momento orchestres vos idées grâce à une architecture multi-fournisseurs.
|
||||
Memento orchestres vos idées grâce à une architecture multi-fournisseurs.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -352,7 +352,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
{
|
||||
name: "Basic",
|
||||
price: "Gratuit",
|
||||
desc: "Pour découvrir la magie de Momento.",
|
||||
desc: "Pour découvrir la magie de Memento.",
|
||||
features: ["100 Notes max", "3 Carnets", "50 crédits IA (Lifetime)", "Recherche sémantique", "Historique 7 jours"],
|
||||
cta: "Commencer",
|
||||
popular: false
|
||||
@@ -433,7 +433,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
</div>
|
||||
<h3 className="text-3xl font-serif font-medium mb-4">La stratégie BYOK</h3>
|
||||
<p className="text-concrete font-light leading-relaxed mb-6">
|
||||
Vous possédez déjà des clés API OpenAI, Anthropic ou Google ? Connectez-les directement à Momento.
|
||||
Vous possédez déjà des clés API OpenAI, Anthropic ou Google ? Connectez-les directement à Memento.
|
||||
Utilisez l'IA sans limites de crédits imposées, en payant uniquement ce que vous consommez chez votre fournisseur favori.
|
||||
</p>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
@@ -472,12 +472,12 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<section className="py-40 px-8 text-center bg-paper relative overflow-hidden">
|
||||
<div className="max-w-3xl mx-auto relative z-10">
|
||||
<h2 className="text-5xl md:text-7xl font-serif tracking-tight mb-8 leading-tight">Prêt à libérer votre <br /><span className="italic">plein potentiel ?</span></h2>
|
||||
<p className="text-lg text-concrete font-light mb-12">Rejoignez des milliers de chercheurs, designers et penseurs qui utilisent déjà Momento pour construire leur futur.</p>
|
||||
<p className="text-lg text-concrete font-light mb-12">Rejoignez des milliers de chercheurs, designers et penseurs qui utilisent déjà Memento pour construire leur futur.</p>
|
||||
<button
|
||||
onClick={onEnter}
|
||||
className="px-16 py-6 bg-ink text-paper rounded-[32px] text-lg font-bold uppercase tracking-[0.2em] hover:scale-105 transition-all shadow-[0_30px_60px_-15px_rgba(0,0,0,0.3)]"
|
||||
>
|
||||
Lancer Momento
|
||||
Lancer Memento
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
@@ -489,7 +489,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<div className="flex-1 space-y-8">
|
||||
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-accent/10 text-accent text-[9px] font-bold uppercase tracking-widest">
|
||||
<Globe size={12} />
|
||||
Écosystème Momento
|
||||
Écosystème Memento
|
||||
</div>
|
||||
<h3 className="text-4xl font-serif font-medium leading-tight text-ink">
|
||||
Traduisez vos documents.<br />
|
||||
@@ -558,7 +558,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<div className="w-8 h-8 bg-ink flex items-center justify-center rounded-lg">
|
||||
<span className="text-paper font-serif text-lg font-bold">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-xl medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-xl medium tracking-tight">Memento</span>
|
||||
</div>
|
||||
<p className="text-sm text-concrete font-light max-w-xs">Le second cerveau amplifié par l'IA. Pensé pour les esprits créatifs.</p>
|
||||
</div>
|
||||
|
||||
@@ -602,7 +602,7 @@ export const SearchModal: React.FC<SearchModalProps> = ({
|
||||
|
||||
<div className="flex items-center gap-1.5 text-[9px] font-bold uppercase tracking-wider text-concrete/60">
|
||||
<Command size={10} />
|
||||
<span>Momento Search OS v2.3</span>
|
||||
<span>Memento Search OS v2.3</span>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
@@ -9,7 +9,7 @@ export const BillingTab: React.FC = () => {
|
||||
name: 'Plan Basic',
|
||||
price: 'Gratuit',
|
||||
period: '',
|
||||
description: 'Pour découvrir la magie de Momento.',
|
||||
description: 'Pour découvrir la magie de Memento.',
|
||||
features: [
|
||||
'100 Notes max',
|
||||
'3 Carnets',
|
||||
@@ -119,7 +119,7 @@ export const BillingTab: React.FC = () => {
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<p className="text-xs text-concrete font-light">Votre plan gratuit n'expire jamais. Passez à la vitesse supérieure pour débloquer toute la puissance de Momento.</p>
|
||||
<p className="text-xs text-concrete font-light">Votre plan gratuit n'expire jamais. Passez à la vitesse supérieure pour débloquer toute la puissance de Memento.</p>
|
||||
<div className="pt-4 flex items-center justify-between border-t border-border/40 mt-4">
|
||||
<span className="text-[11px] font-bold text-ink uppercase tracking-widest">Plan Actuel</span>
|
||||
<span className="text-[11px] font-bold text-accent uppercase tracking-widest">GRATUIT</span>
|
||||
|
||||
@@ -2,7 +2,24 @@
|
||||
import { GoogleGenAI, Type } from "@google/genai";
|
||||
import { BrainstormIdea } from "../types";
|
||||
|
||||
const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });
|
||||
async function generateContent(
|
||||
request: Parameters<InstanceType<typeof GoogleGenAI>['models']['generateContent']>[0],
|
||||
) {
|
||||
if (typeof window !== 'undefined') {
|
||||
const res = await fetch('/api/gemini/generate', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!res.ok) throw new Error('Gemini request failed');
|
||||
const data = await res.json();
|
||||
return { text: data.text ?? '' };
|
||||
}
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) throw new Error('GEMINI_API_KEY required on server');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
return ai.models.generateContent(request);
|
||||
}
|
||||
|
||||
const BRAINSTORM_SCHEMA = {
|
||||
type: Type.OBJECT,
|
||||
@@ -63,7 +80,7 @@ export async function generateBrainstormWave(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -101,7 +118,7 @@ export async function generateExpansion(parentIdeaTitle: string, parentIdeaDescr
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -130,9 +147,27 @@ export async function generateExpansion(parentIdeaTitle: string, parentIdeaDescr
|
||||
}
|
||||
}
|
||||
|
||||
async function embedContent(
|
||||
request: Parameters<InstanceType<typeof GoogleGenAI>['models']['embedContent']>[0],
|
||||
) {
|
||||
if (typeof window !== 'undefined') {
|
||||
const res = await fetch('/api/gemini/embed', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!res.ok) throw new Error('Gemini embed failed');
|
||||
return res.json();
|
||||
}
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) throw new Error('GEMINI_API_KEY required on server');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
return ai.models.embedContent(request);
|
||||
}
|
||||
|
||||
export async function getEmbedding(text: string): Promise<number[]> {
|
||||
try {
|
||||
const result = await ai.models.embedContent({
|
||||
const result = await embedContent({
|
||||
model: 'gemini-embedding-2-preview',
|
||||
contents: [text],
|
||||
});
|
||||
@@ -155,7 +190,7 @@ export function cosineSimilarity(a: number[], b: number[]): number {
|
||||
export async function nameCluster(noteSummaries: string[]): Promise<string> {
|
||||
const prompt = `Quel thème commun relie ces notes ? Donne un nom court (2-4 mots).\nNotes :\n${noteSummaries.join('\n- ')}`;
|
||||
try {
|
||||
const result = await ai.models.generateContent({
|
||||
const result = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt
|
||||
});
|
||||
@@ -184,7 +219,7 @@ export async function suggestBridgeIdeas(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt,
|
||||
config: {
|
||||
@@ -207,7 +242,7 @@ export async function parseDocument(fileUrl: string, fileName: string): Promise<
|
||||
try {
|
||||
// In a real scenario, we would use media upload.
|
||||
// Here we simulate the extraction.
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -236,7 +271,7 @@ export async function extractActionItems(notes: { title: string; content: string
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt,
|
||||
config: {
|
||||
@@ -289,7 +324,7 @@ export async function generateFlashcardsForNote(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3.5-flash",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
|
||||
@@ -1,15 +1,11 @@
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import path from 'path';
|
||||
import {defineConfig, loadEnv} from 'vite';
|
||||
import {defineConfig} from 'vite';
|
||||
|
||||
export default defineConfig(({mode}) => {
|
||||
const env = loadEnv(mode, '.', '');
|
||||
return {
|
||||
plugins: [react(), tailwindcss()],
|
||||
define: {
|
||||
'process.env.GEMINI_API_KEY': JSON.stringify(env.GEMINI_API_KEY),
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, '.'),
|
||||
|
||||
@@ -36,7 +36,7 @@ async function startServer() {
|
||||
const app = express();
|
||||
const server = createServer(app);
|
||||
const wss = new WebSocketServer({ server });
|
||||
const PORT = 3000;
|
||||
const PORT = 4000;
|
||||
|
||||
app.use(express.json());
|
||||
|
||||
@@ -170,6 +170,38 @@ async function startServer() {
|
||||
res.json(ideas[index]);
|
||||
});
|
||||
|
||||
app.post('/api/gemini/embed', async (req, res) => {
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) {
|
||||
return res.status(503).json({ error: 'GEMINI_API_KEY not configured on server' });
|
||||
}
|
||||
try {
|
||||
const { GoogleGenAI } = await import('@google/genai');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
const response = await ai.models.embedContent(req.body);
|
||||
res.json(response);
|
||||
} catch (error) {
|
||||
console.error('Gemini embed error:', error);
|
||||
res.status(500).json({ error: 'Gemini embed failed' });
|
||||
}
|
||||
});
|
||||
|
||||
app.post('/api/gemini/generate', async (req, res) => {
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) {
|
||||
return res.status(503).json({ error: 'GEMINI_API_KEY not configured on server' });
|
||||
}
|
||||
try {
|
||||
const { GoogleGenAI } = await import('@google/genai');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
const response = await ai.models.generateContent(req.body);
|
||||
res.json({ text: response.text ?? '' });
|
||||
} catch (error) {
|
||||
console.error('Gemini proxy error:', error);
|
||||
res.status(500).json({ error: 'Gemini request failed' });
|
||||
}
|
||||
});
|
||||
|
||||
// Vite middleware for development
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
const vite = await createViteServer({
|
||||
|
||||
@@ -327,7 +327,7 @@ export const AgentsView: React.FC<AgentsViewProps> = ({
|
||||
'Connexion SSH sans mot de passe à devSandbox',
|
||||
'Gateway token (blank to generate)',
|
||||
'Procédure d\'accès à openclaw',
|
||||
'Derniers commits du repo Momento'
|
||||
'Derniers commits du repo Memento'
|
||||
].map((note, i) => (
|
||||
<label key={i} className="flex items-center gap-4 px-6 py-4 cursor-pointer hover:bg-white/50 transition-colors group">
|
||||
<div className={`w-5 h-5 rounded border transition-all flex items-center justify-center
|
||||
|
||||
@@ -44,7 +44,7 @@ export const AuthPage: React.FC<AuthPageProps> = ({ onAuthComplete, onBack, init
|
||||
<div className="w-8 h-8 bg-ink text-white rounded-xl flex items-center justify-center shadow-lg">
|
||||
<span className="font-serif font-bold text-xl">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-xl font-medium tracking-tight text-ink">Momento</span>
|
||||
<span className="font-serif text-xl font-medium tracking-tight text-ink">Memento</span>
|
||||
</div>
|
||||
|
||||
<div className="w-24" /> {/* Spacer */}
|
||||
@@ -191,7 +191,7 @@ export const AuthPage: React.FC<AuthPageProps> = ({ onAuthComplete, onBack, init
|
||||
</AnimatePresence>
|
||||
|
||||
<p className="text-center mt-8 text-[9px] text-concrete font-bold uppercase tracking-[0.3em] opacity-40">
|
||||
© 2024 Momento Labs — Privacy • Terms
|
||||
© 2024 Memento Labs — Privacy • Terms
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -124,7 +124,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
try {
|
||||
// Occasional simulated error for retry demonstration
|
||||
if (Math.random() < 0.15) {
|
||||
throw new Error("Connexion réseau interrompue. L'extension n'a pas pu joindre les serveurs Momento.");
|
||||
throw new Error("Connexion réseau interrompue. L'extension n'a pas pu joindre les serveurs Memento.");
|
||||
}
|
||||
|
||||
const dateStr = new Date().toLocaleDateString('fr-FR', {
|
||||
@@ -175,10 +175,10 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
setLastCreatedNoteId(newNoteId);
|
||||
setClipperState('success');
|
||||
|
||||
// Add note to Momento Database
|
||||
// Add note to Memento Database
|
||||
onAddNote(newNote);
|
||||
|
||||
// Fire real-time notification toast in Momento!
|
||||
// Fire real-time notification toast in Memento!
|
||||
onTriggerToast(clipTitle, newNoteId);
|
||||
|
||||
} catch (err: any) {
|
||||
@@ -260,7 +260,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
{/* Web Extension active badge */}
|
||||
<button
|
||||
className="p-1.5 bg-accent/10 border border-accent/20 rounded-lg text-accent animate-pulse relative group"
|
||||
title="Momento Web Clipper is active"
|
||||
title="Memento Web Clipper is active"
|
||||
>
|
||||
<Scissors size={14} className="-rotate-90" />
|
||||
<span className="absolute bottom-full right-0 mb-2 whitespace-nowrap hidden group-hover:block bg-ink text-paper text-[10px] py-1 px-2 rounded-md shadow-lg">
|
||||
@@ -356,12 +356,12 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
{/* Extension Hub Header */}
|
||||
<header className="px-5 py-4 border-b border-neutral-100 dark:border-neutral-800 bg-neutral-50 dark:bg-neutral-900/40 flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
{/* Momento Logo with Clipper Branding */}
|
||||
{/* Memento Logo with Clipper Branding */}
|
||||
<div className="w-7 h-7 bg-ink text-paper rounded-lg flex items-center justify-center font-serif font-black text-sm">
|
||||
M
|
||||
</div>
|
||||
<div className="leading-tight">
|
||||
<span className="text-xs font-bold font-serif text-ink dark:text-dark-ink tracking-tight">Momento</span>
|
||||
<span className="text-xs font-bold font-serif text-ink dark:text-dark-ink tracking-tight">Memento</span>
|
||||
<span className="text-[10px] text-accent block font-mono font-medium tracking-widest uppercase">Web Clipper</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -561,7 +561,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
}}
|
||||
className="w-full py-3.5 bg-ink text-paper rounded-xl text-xs font-bold uppercase tracking-widest flex items-center justify-center gap-2 hover:opacity-95 transition-opacity"
|
||||
>
|
||||
Voir dans Momento
|
||||
Voir dans Memento
|
||||
<ArrowUpRight size={14} />
|
||||
</button>
|
||||
|
||||
@@ -608,7 +608,7 @@ export const ClipperSimulator: React.FC<ClipperSimulatorProps> = ({
|
||||
|
||||
{/* Simulated context details */}
|
||||
<footer className="px-5 py-3 border-t border-neutral-100 dark:border-neutral-800 bg-neutral-50/50 dark:bg-neutral-900/40 text-[9px] text-concrete text-center">
|
||||
Momento Companion v2.1.2 • Sécurisé HTTPS TLS 1.3
|
||||
Memento Companion v2.1.2 • Sécurisé HTTPS TLS 1.3
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -197,7 +197,7 @@ const FR: LangDict = {
|
||||
hero_badge: "Augmenté par l'Intelligence Artificielle",
|
||||
hero_title_1: "Votre second cerveau,",
|
||||
hero_title_italic: "enfin amplifié.",
|
||||
hero_desc: "Momento n'est pas qu'une simple application de notes. C'est un écosystème intelligent qui connecte, analyse et développe vos idées en temps réel grâce à 6 types d'agents IA et une recherche sémantique de pointe.",
|
||||
hero_desc: "Memento n'est pas qu'une simple application de notes. C'est un écosystème intelligent qui connecte, analyse et développe vos idées en temps réel grâce à 6 types d'agents IA et une recherche sémantique de pointe.",
|
||||
hero_cta_start: "S'inscrire maintenant",
|
||||
hero_cta_features: "Voir les fonctionnalités",
|
||||
|
||||
@@ -210,7 +210,7 @@ const FR: LangDict = {
|
||||
features_badge: "Capacités IA",
|
||||
features_title_1: "Une intelligence fluide,",
|
||||
features_title_2: "intégrée à chaque mot.",
|
||||
features_subtitle: "Momento orchestre vos idées grâce à une architecture multi-fournisseurs.",
|
||||
features_subtitle: "Memento orchestre vos idées grâce à une architecture multi-fournisseurs.",
|
||||
|
||||
f1_title: "Recherche Sémantique",
|
||||
f1_desc: "Ne cherchez plus par mots-clés. Trouvez par concept. Notre moteur hybride Vector + FTS comprend l'intention derrière vos notes.",
|
||||
@@ -261,7 +261,7 @@ const FR: LangDict = {
|
||||
price_popular: "Le plus populaire",
|
||||
price_free_name: "Basic",
|
||||
price_free_price: "Gratuit",
|
||||
price_free_desc: "Pour découvrir la magie de Momento.",
|
||||
price_free_desc: "Pour découvrir la magie de Memento.",
|
||||
price_pro_name: "Pro",
|
||||
price_pro_price: "9,90€",
|
||||
price_pro_desc: "Pour les consultants et créateurs exigeants.",
|
||||
@@ -285,7 +285,7 @@ const FR: LangDict = {
|
||||
|
||||
byok_badge: "Technologie Cloud Ouverte",
|
||||
byok_title: "La stratégie BYOK",
|
||||
byok_desc: "Vous possédez déjà des clés API OpenAI, Anthropic ou Google ? Connectez-les directement à Momento. Utilisez l'IA sans limites de crédits imposées, en payant uniquement ce que vous consommez chez votre fournisseur favori.",
|
||||
byok_desc: "Vous possédez déjà des clés API OpenAI, Anthropic ou Google ? Connectez-les directement à Memento. Utilisez l'IA sans limites de crédits imposées, en payant uniquement ce que vous consommez chez votre fournisseur favori.",
|
||||
byok_col1_title: "Pas de lock-in",
|
||||
byok_col1_desc: "Changez de fournisseur en 1 clic.",
|
||||
byok_col2_title: "Coûts optimisés",
|
||||
@@ -294,10 +294,10 @@ const FR: LangDict = {
|
||||
|
||||
final_cta_title: "Prêt à libérer votre",
|
||||
final_cta_title_italic: "plein potentiel ?",
|
||||
final_cta_desc: "Rejoignez des milliers de chercheurs, designers et penseurs qui utilisent déjà Momento pour construire leur futur.",
|
||||
final_cta_button: "Lancer Momento",
|
||||
final_cta_desc: "Rejoignez des milliers de chercheurs, designers et penseurs qui utilisent déjà Memento pour construire leur futur.",
|
||||
final_cta_button: "Lancer Memento",
|
||||
|
||||
eco_badge: "Écosystème Momento",
|
||||
eco_badge: "Écosystème Memento",
|
||||
eco_title_1: "Traduisez vos documents.",
|
||||
eco_title_2: "Formatage préservé.",
|
||||
eco_desc: "Le seul traducteur qui préserve les graphiques, tables des matières, formes et en-têtes — exactement tels qu'ils étaient. Prolongez l'intelligence de vos notes à l'international.",
|
||||
@@ -352,7 +352,7 @@ const EN: LangDict = {
|
||||
hero_badge: "Amplified by Artificial Intelligence",
|
||||
hero_title_1: "Your second brain,",
|
||||
hero_title_italic: "finally amplified.",
|
||||
hero_desc: "Momento is not just a typical note-taking tool. It is an intelligent ecosystem that connects, analyzes, and scales your thoughts in real time with 6 autonomous AI agents and vector semantic search.",
|
||||
hero_desc: "Memento is not just a typical note-taking tool. It is an intelligent ecosystem that connects, analyzes, and scales your thoughts in real time with 6 autonomous AI agents and vector semantic search.",
|
||||
hero_cta_start: "Sign Up Now",
|
||||
hero_cta_features: "View Features",
|
||||
|
||||
@@ -365,7 +365,7 @@ const EN: LangDict = {
|
||||
features_badge: "AI Capabilities",
|
||||
features_title_1: "Fluid intelligence,",
|
||||
features_title_2: "integrated into every word.",
|
||||
features_subtitle: "Momento orchestrates your thoughts through a multi-provider landscape.",
|
||||
features_subtitle: "Memento orchestrates your thoughts through a multi-provider landscape.",
|
||||
|
||||
f1_title: "Semantic Search",
|
||||
f1_desc: "Stop searching by keywords. Retrieve by concept. Our hybrid Vector + FTS engine understands the core semantic context behind your logs.",
|
||||
@@ -416,7 +416,7 @@ const EN: LangDict = {
|
||||
price_popular: "Most Popular",
|
||||
price_free_name: "Basic",
|
||||
price_free_price: "Free",
|
||||
price_free_desc: "Get started with the foundational magic of Momento.",
|
||||
price_free_desc: "Get started with the foundational magic of Memento.",
|
||||
price_pro_name: "Pro",
|
||||
price_pro_price: "$9.90",
|
||||
price_pro_desc: "For consultants, writers, and advanced researchers.",
|
||||
@@ -449,10 +449,10 @@ const EN: LangDict = {
|
||||
|
||||
final_cta_title: "Ready to expand your",
|
||||
final_cta_title_italic: "second organic brain?",
|
||||
final_cta_desc: "Join thousands of academics, product architects, and minimalist designers scaling their insights with Momento.",
|
||||
final_cta_button: "Launch Momento",
|
||||
final_cta_desc: "Join thousands of academics, product architects, and minimalist designers scaling their insights with Memento.",
|
||||
final_cta_button: "Launch Memento",
|
||||
|
||||
eco_badge: "Momento Ecosystem",
|
||||
eco_badge: "Memento Ecosystem",
|
||||
eco_title_1: "Local document translation.",
|
||||
eco_title_2: "Format intact.",
|
||||
eco_desc: "The only translator preserving graphs, nested hierarchies, vectors, alignments, and titles exactly as you drew them. Take your local notes globally.",
|
||||
@@ -507,7 +507,7 @@ const JA: LangDict = {
|
||||
hero_badge: "人工知能による拡張済システム",
|
||||
hero_title_1: "あなたの第二の脳を、",
|
||||
hero_title_italic: "ついに具現化する。",
|
||||
hero_desc: "Momento(モメント)は単なるメモ帳ではありません。6体の専門AIエージェント、ハイブリッドベクトル検索を搭載し、リアルタイムで知識の接続、整理、展開を実行する知能エコシステムです。",
|
||||
hero_desc: "Memento(モメント)は単なるメモ帳ではありません。6体の専門AIエージェント、ハイブリッドベクトル検索を搭載し、リアルタイムで知識の接続、整理、展開を実行する知能エコシステムです。",
|
||||
hero_cta_start: "無料で体験する",
|
||||
hero_cta_features: "機能一覧を見る",
|
||||
|
||||
@@ -520,7 +520,7 @@ const JA: LangDict = {
|
||||
features_badge: "先進AI性能",
|
||||
features_title_1: "記述に完全に融合する、",
|
||||
features_title_2: "インテリジェンス。",
|
||||
features_subtitle: "Momentoは、複数のLLMプロバイダを容易に構成可能な適応性を備えています。",
|
||||
features_subtitle: "Mementoは、複数のLLMプロバイダを容易に構成可能な適応性を備えています。",
|
||||
|
||||
f1_title: "セマンティック意味検索",
|
||||
f1_desc: "単なるキーワード検索はもう不要。記述された文脈、概念そのものを捉えて、過去の関連メモを一瞬で検索します。",
|
||||
@@ -571,7 +571,7 @@ const JA: LangDict = {
|
||||
price_popular: "人気プラン",
|
||||
price_free_name: "ベーシック",
|
||||
price_free_price: "無料",
|
||||
price_free_desc: "Momentoの見事な基礎機能をすぐにお試しいただけます。",
|
||||
price_free_desc: "Mementoの見事な基礎機能をすぐにお試しいただけます。",
|
||||
price_pro_name: "プロ",
|
||||
price_pro_price: "¥1,480",
|
||||
price_pro_desc: "ライター、学習者、研究者、コンサルタントの方へ最適。",
|
||||
@@ -595,7 +595,7 @@ const JA: LangDict = {
|
||||
|
||||
byok_badge: "オープン構想",
|
||||
byok_title: "APIキー持ち込み(BYOK)",
|
||||
byok_desc: "OpenAI、Anthropic、Googleなどの既存APIキーをお持ちですか?Momentoに直接バインドすれば、従量課金のみで任意の極限モデルを完全に制限なしで無制限にご利用いただけます。",
|
||||
byok_desc: "OpenAI、Anthropic、Googleなどの既存APIキーをお持ちですか?Mementoに直接バインドすれば、従量課金のみで任意の極限モデルを完全に制限なしで無制限にご利用いただけます。",
|
||||
byok_col1_title: "ロックイン縛りゼロ",
|
||||
byok_col1_desc: "好みのプロバイダやエンジンへ一瞬でコンフィグを切り替えられます。",
|
||||
byok_col2_title: "中抜きマージン排除",
|
||||
@@ -604,10 +604,10 @@ const JA: LangDict = {
|
||||
|
||||
final_cta_title: "あなたの第二の有機的な脳を",
|
||||
final_cta_title_italic: "今すぐ起動させましょう。",
|
||||
final_cta_desc: "最先端デザインと人工知能を極限まで融合させたMomento。すでに数千人のアカデミアやデザイナーが思考のスケールを始めています。",
|
||||
final_cta_button: "Momentoを起動する",
|
||||
final_cta_desc: "最先端デザインと人工知能を極限まで融合させたMemento。すでに数千人のアカデミアやデザイナーが思考のスケールを始めています。",
|
||||
final_cta_button: "Mementoを起動する",
|
||||
|
||||
eco_badge: "Momentoエコシステム",
|
||||
eco_badge: "Mementoエコシステム",
|
||||
eco_title_1: "ドキュメントローカル翻訳。",
|
||||
eco_title_2: "完璧な構造維持。",
|
||||
eco_desc: "グラフ、入れ子、アライメント、レイアウト、タイトル座標のすべてを完璧に保持したまま、言語領域を変換します。アイデアを瞬時にグローバルへ。",
|
||||
@@ -693,7 +693,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
carnet: "Database & Books",
|
||||
date: "26 Oct 2024",
|
||||
tags: ["Relational", "Rollup", "Blocks"],
|
||||
content: `# H2 Relation and Rollup\n\nCe document démontre la puissance du modèle relationnel de Momento.\n\n## 1. Modèle Relationnel\nVous pouvez lier des auteurs à leurs œuvres pour comptabiliser dynamiquement les entrées grâce à notre système de Rollups sémantiques.`,
|
||||
content: `# H2 Relation and Rollup\n\nCe document démontre la puissance du modèle relationnel de Memento.\n\n## 1. Modèle Relationnel\nVous pouvez lier des auteurs à leurs œuvres pour comptabiliser dynamiquement les entrées grâce à notre système de Rollups sémantiques.`,
|
||||
stats: { words: 124, lines: 18, equations: 1, graphs: 4, images: 3 }
|
||||
},
|
||||
{
|
||||
@@ -702,7 +702,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
carnet: "Mathematical & Geometrical",
|
||||
date: "24 Oct 2024",
|
||||
tags: ["LaTeX", "Gantt", "Flowcharts"],
|
||||
content: `# Block-Style Math & Formulas\n\nMomento supporte les équations complexes de type LaTeX et les diagrammes sémantiques directement intégrés sous forme de blocs.\n\n$$\\Phi = \\frac{1 + \\sqrt{5}}{2}$$\n\n$$\\Delta Carbon = E_{béton} - E_{CLT} = 410 \\text{ kg } CO_2/m^3$$`,
|
||||
content: `# Block-Style Math & Formulas\n\nMemento supporte les équations complexes de type LaTeX et les diagrammes sémantiques directement intégrés sous forme de blocs.\n\n$$\\Phi = \\frac{1 + \\sqrt{5}}{2}$$\n\n$$\\Delta Carbon = E_{béton} - E_{CLT} = 410 \\text{ kg } CO_2/m^3$$`,
|
||||
stats: { words: 91, lines: 12, equations: 2, graphs: 4, images: 1 }
|
||||
},
|
||||
{
|
||||
@@ -855,7 +855,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<div className="w-10 h-10 bg-ink flex items-center justify-center rounded-xl shadow-lg rotate-3 group hover:rotate-0 transition-transform cursor-pointer">
|
||||
<span className="text-paper font-serif text-2xl font-bold">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Memento</span>
|
||||
</div>
|
||||
|
||||
<div className="hidden lg:flex items-center gap-10">
|
||||
@@ -1383,10 +1383,10 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
</button>
|
||||
<p className="text-stone-605">
|
||||
{lang === 'fr'
|
||||
? "Momento intègre des équations mathématiques pures et des diagrammes sémantiques ou Gantt de manière entièrement nativisée sous forme de blocs WYSIWYG."
|
||||
? "Memento intègre des équations mathématiques pures et des diagrammes sémantiques ou Gantt de manière entièrement nativisée sous forme de blocs WYSIWYG."
|
||||
: lang === 'ja'
|
||||
? "Momentoは本格的なLaTeX数式および概念関係フローチャートをWYSIWYGブロックとして極めて滑らかに表示・調整可能です。"
|
||||
: "Momento integrates highly stylized Mathematical LaTeX formulas and semantic/Gantt flowcharts directly as interactive WYSIWYG blocks."}
|
||||
? "Mementoは本格的なLaTeX数式および概念関係フローチャートをWYSIWYGブロックとして極めて滑らかに表示・調整可能です。"
|
||||
: "Memento integrates highly stylized Mathematical LaTeX formulas and semantic/Gantt flowcharts directly as interactive WYSIWYG blocks."}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
@@ -1475,9 +1475,9 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
</button>
|
||||
<p className="text-stone-605">
|
||||
{lang === 'fr'
|
||||
? "Le noyau de Momento est conçu pour gérer d'immenses documents textuels (plus d'un million de mots) avec une latence quasi nulle en virtualisant les sous-structures."
|
||||
? "Le noyau de Memento est conçu pour gérer d'immenses documents textuels (plus d'un million de mots) avec une latence quasi nulle en virtualisant les sous-structures."
|
||||
: lang === 'ja'
|
||||
? "Momentoの超高速仮想ドキュメントレンダリングは、合計100万語を越える膨大な書籍や論文データベースでも、表示遅延なく高速に動作・ブロック分割制御可能です。"
|
||||
? "Mementoの超高速仮想ドキュメントレンダリングは、合計100万語を越える膨大な書籍や論文データベースでも、表示遅延なく高速に動作・ブロック分割制御可能です。"
|
||||
: "Its lightweight framework allows seamlessly displaying and editing files sizing up to 1,000,000 words without single-frame drops thanks to block virtualization."}
|
||||
</p>
|
||||
</div>
|
||||
@@ -1544,10 +1544,10 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
Markdown
|
||||
</div>
|
||||
{activeDemoIdx === 0 && (
|
||||
`# H2 Relation and Rollup\n\nCe document démontre la puissance du modèle relationnel de Momento.\n\n## 1. Modèle Relationnel\nLier des auteurs à leurs œuvres pour comptabiliser dynamiquement.\n\n[DATABASE id="authors-works" view="table"]\n\n## Template\nTemplates can access values via syntax: .action { .field }`
|
||||
`# H2 Relation and Rollup\n\nCe document démontre la puissance du modèle relationnel de Memento.\n\n## 1. Modèle Relationnel\nLier des auteurs à leurs œuvres pour comptabiliser dynamiquement.\n\n[DATABASE id="authors-works" view="table"]\n\n## Template\nTemplates can access values via syntax: .action { .field }`
|
||||
)}
|
||||
{activeDemoIdx === 1 && (
|
||||
`# Block-Style Math & Formulas\n\nMomento supporte LaTeX.\n\n$$ \\Phi = \\frac{1 + \\sqrt{5}}{2} $$\n\n$$ \\Delta Carbon = E_béton - E_CLT = 410 $$`
|
||||
`# Block-Style Math & Formulas\n\nMemento supporte LaTeX.\n\n$$ \\Phi = \\frac{1 + \\sqrt{5}}{2} $$\n\n$$ \\Delta Carbon = E_béton - E_CLT = 410 $$`
|
||||
)}
|
||||
{activeDemoIdx === 2 && (
|
||||
`# Large Document Virtualization\n\nLe moteur supporte de longs documents.\n\n## Zoom-In de bloc\nIsoler un bloc spécifique pour se concentrer.`
|
||||
@@ -1566,7 +1566,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
{editorMode === 'html' && (
|
||||
<div className="space-y-2.5 font-mono text-[9px]">
|
||||
<div className="bg-slate-50 border p-3 rounded-lg text-emerald-800 space-y-2 select-all leading-snug">
|
||||
<div>{`<!-- Momento Symmetrical DOM Tree map -->`}</div>
|
||||
<div>{`<!-- Memento Symmetrical DOM Tree map -->`}</div>
|
||||
<div>{`<div class="note-container font-serif" id="momento-doc-${activeDemoIdx}">`}</div>
|
||||
<div className="pl-3">{`<h2 class="title text-lg border-b">${activeDemoIdx === -1 ? "Synthèse" : realNotes[activeDemoIdx].title}</h2>`}</div>
|
||||
<div className="pl-3">{`<div class="section-meta flex text-[8px] uppercase">`}</div>
|
||||
@@ -2385,7 +2385,7 @@ export const LandingPage: React.FC<LandingPageProps> = ({ onEnter, onLogin, onRe
|
||||
<div className="w-8 h-8 bg-ink flex items-center justify-center rounded-lg">
|
||||
<span className="text-paper font-serif text-lg font-bold">M</span>
|
||||
</div>
|
||||
<span className="font-serif text-xl font-medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-xl font-medium tracking-tight">Memento</span>
|
||||
</div>
|
||||
<p className="text-sm text-concrete font-light max-w-xs leading-relaxed">{t('footer_desc')}</p>
|
||||
</div>
|
||||
|
||||
@@ -42,7 +42,7 @@ export const LandingPageV2: React.FC<LandingPageV2Props> = ({
|
||||
onSwitchVersion
|
||||
}) => {
|
||||
|
||||
// Real world Momento note seeds to match constants.ts exactly
|
||||
// Real world Memento note seeds to match constants.ts exactly
|
||||
const realNotes = [
|
||||
{
|
||||
id: 'n1',
|
||||
@@ -194,7 +194,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
<span className="text-paper font-serif text-2xl font-bold">M</span>
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Memento</span>
|
||||
<span className="text-[9px] font-black text-accent uppercase tracking-widest block font-mono -mt-1.5 pl-0.5">Second Cerveau</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -242,7 +242,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
<section className="relative pt-32 pb-24 px-6 md:px-12 max-w-7xl mx-auto">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-12 gap-10 items-stretch">
|
||||
|
||||
{/* Left Hero Sidebar: Information on Momento's Core Features */}
|
||||
{/* Left Hero Sidebar: Information on Memento's Core Features */}
|
||||
<div className="lg:col-span-5 flex flex-col justify-between space-y-6 text-left">
|
||||
<div className="space-y-5">
|
||||
<div className="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-accent/10 border border-accent/20 text-accent text-[9px] font-bold font-mono tracking-widest uppercase">
|
||||
@@ -256,7 +256,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
</h1>
|
||||
|
||||
<p className="text-stone-600 text-sm leading-relaxed font-light">
|
||||
Momento rassemble vos notes, vos formules mathématiques et votre logique dans une structure d'apprentissage offline d'une flexibilité absolue. Évitez les abonnements ruineux en apportant votre clé personnelle (BYOK) ou utilisez l'environnement de manière 100% autonome et sécurisée.
|
||||
Memento rassemble vos notes, vos formules mathématiques et votre logique dans une structure d'apprentissage offline d'une flexibilité absolue. Évitez les abonnements ruineux en apportant votre clé personnelle (BYOK) ou utilisez l'environnement de manière 100% autonome et sécurisée.
|
||||
</p>
|
||||
|
||||
{/* Guided Feature Tabs Selector: Directly gives info on what the user can do */}
|
||||
@@ -320,7 +320,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Hero Column: True 1-to-1 Interactive Representation of Momento Workspace */}
|
||||
{/* Right Hero Column: True 1-to-1 Interactive Representation of Memento Workspace */}
|
||||
<div className="lg:col-span-7 w-full flex flex-col justify-between">
|
||||
<div className="w-full bg-[#1c1c1c] rounded-[24px] border border-ink/40 p-3 shadow-2xl relative overflow-hidden flex flex-col justify-between">
|
||||
|
||||
@@ -863,7 +863,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
<span className="text-[10px] font-bold uppercase tracking-[0.3em] text-[#A47148] font-mono block">Respect Souverain des Écrits</span>
|
||||
<h2 className="text-3xl font-serif text-[#1C1C1C] tracking-tight leading-tight">Aucun abonnement IA obligatoire grâce au modèle "BYOK".</h2>
|
||||
<p className="text-sm font-light text-stone-600 leading-relaxed">
|
||||
La plupart des applications cloud d'intelligence artificielle re-facturent de lourdes marges commerciales sur vos écrits. Momento change les règles du jeu :
|
||||
La plupart des applications cloud d'intelligence artificielle re-facturent de lourdes marges commerciales sur vos écrits. Memento change les règles du jeu :
|
||||
</p>
|
||||
<div className="space-y-4">
|
||||
<div className="flex gap-4">
|
||||
@@ -916,7 +916,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
<div className="max-w-6xl mx-auto space-y-16">
|
||||
<div className="max-w-xl mx-auto text-center space-y-3">
|
||||
<span className="text-[11px] font-bold uppercase tracking-[0.3em] text-[#A47148] font-mono block">Les Atouts Pratiques</span>
|
||||
<h2 className="text-3xl font-serif text-[#1C1C1C] tracking-tight leading-tight">Pourquoi utiliser Momento ?</h2>
|
||||
<h2 className="text-3xl font-serif text-[#1C1C1C] tracking-tight leading-tight">Pourquoi utiliser Memento ?</h2>
|
||||
<p className="text-xs font-light text-stone-500">Un écosystème conçu de bout en bout pour l'autonomie et la productivité.</p>
|
||||
</div>
|
||||
|
||||
@@ -961,7 +961,7 @@ $$\\Omega(x) = \\int_{0}^{\\Lambda} e^{-k \\cdot x} \\cdot dx$$
|
||||
<section className="py-20 text-center bg-[#FAF9F5]/70 select-none">
|
||||
<div className="max-w-xl mx-auto space-y-5 px-6">
|
||||
<h3 className="text-2xl font-serif text-[#1C1C1C] tracking-tight">Structurer vos notes et vos pensées.</h3>
|
||||
<p className="text-xs text-stone-500 font-light">Accédez directement à l'espace de travail fluide de Momento, sans processus contraignant.</p>
|
||||
<p className="text-xs text-stone-500 font-light">Accédez directement à l'espace de travail fluide de Memento, sans processus contraignant.</p>
|
||||
<div className="flex gap-4 justify-center">
|
||||
<button
|
||||
onClick={onEnter}
|
||||
|
||||
@@ -103,14 +103,14 @@ const FR: LangDict = {
|
||||
hero_badge: "Amplifié par l'intelligence collective locale & cloud",
|
||||
hero_title_1: "Votre second cerveau,",
|
||||
hero_title_italic: "enfin amplifié.",
|
||||
hero_desc: "Momento est un écosystème d'écriture intelligent en temps réel. Naviguez dans vos pensées via un graphe de connaissances 3D, étudiez avec répétition espacée, et déléguez vos recherches à 6 agents spécialisés autonomes.",
|
||||
hero_desc: "Memento est un écosystème d'écriture intelligent en temps réel. Naviguez dans vos pensées via un graphe de connaissances 3D, étudiez avec répétition espacée, et déléguez vos recherches à 6 agents spécialisés autonomes.",
|
||||
hero_cta_start: "S'inscrire gratuitement",
|
||||
hero_cta_features: "Explorer l'espace",
|
||||
|
||||
features_badge: "CAPACITÉS DU SYSTÈME",
|
||||
features_title: "Une sémantique naturelle,",
|
||||
features_subtitle: "fondée sur vos apprentissages.",
|
||||
features_desc: "Momento orchestre vos idées grâce à une architecture locale cryptée.",
|
||||
features_desc: "Memento orchestre vos idées grâce à une architecture locale cryptée.",
|
||||
|
||||
feature_1_title: "Recherche Sémantique Hybride",
|
||||
feature_1_desc: "Trouvez vos concepts au-delà des synonymes. Notre moteur hybride vectoriel comprend intrinsèquement l'intention de vos rédactions.",
|
||||
@@ -166,14 +166,14 @@ const EN: LangDict = {
|
||||
hero_badge: "Amplified by local & cloud collective intelligence",
|
||||
hero_title_1: "Your second brain,",
|
||||
hero_title_italic: "finally amplified.",
|
||||
hero_desc: "Momento is a real-time intelligent writing ecosystem. Navigate your thoughts via an interactive knowledge graph, study with spaced-repetition active recall, and delegate tasks to 6 autonomous specialist agents.",
|
||||
hero_desc: "Memento is a real-time intelligent writing ecosystem. Navigate your thoughts via an interactive knowledge graph, study with spaced-repetition active recall, and delegate tasks to 6 autonomous specialist agents.",
|
||||
hero_cta_start: "Start for free",
|
||||
hero_cta_features: "Explore workspace",
|
||||
|
||||
features_badge: "SYSTEM CAPABILITIES",
|
||||
features_title: "Natural semantics,",
|
||||
features_subtitle: "grounded in your knowledge.",
|
||||
features_desc: "Momento orchestrates your thoughts through an encrypted local architecture.",
|
||||
features_desc: "Memento orchestrates your thoughts through an encrypted local architecture.",
|
||||
|
||||
feature_1_title: "Hybrid Semantic Search",
|
||||
feature_1_desc: "Search concepts, not just keywords. Our hybrid vector engine understands the core semantic intention of your notes.",
|
||||
@@ -229,14 +229,14 @@ const JA: LangDict = {
|
||||
hero_badge: "ローカル&クラウド融合人工知能により拡張",
|
||||
hero_title_1: "あなたの第二の脳は、",
|
||||
hero_title_italic: "ついに具現化する。",
|
||||
hero_desc: "Momento(モメント)は、リアルタイムでアイデア同士が結合する最先端ナレッジベース。3D知識グラフ、間隔反復フラッシュカード、そして6体の自律型AIエージェントが、あなたの思考を強力に加速します。",
|
||||
hero_desc: "Memento(モメント)は、リアルタイムでアイデア同士が結合する最先端ナレッジベース。3D知識グラフ、間隔反復フラッシュカード、そして6体の自律型AIエージェントが、あなたの思考を強力に加速します。",
|
||||
hero_cta_start: "無料で体験する",
|
||||
hero_cta_features: "機能を体験する",
|
||||
|
||||
features_badge: "システム性能",
|
||||
features_title: "自然言語に根ざした、",
|
||||
features_subtitle: "あなただけのコンテキスト。",
|
||||
features_desc: "Momentoは、ローカル暗号化アーキテクチャを通じて、あなたの機密思考システムを管理します。",
|
||||
features_desc: "Mementoは、ローカル暗号化アーキテクチャを通じて、あなたの機密思考システムを管理します。",
|
||||
|
||||
feature_1_title: "ハイブリッド意味検索",
|
||||
feature_1_desc: "単なるキーワード一致の域を超え、意図を汲み取るベクトル意味検索。関連する記述を一瞬で発掘します。",
|
||||
@@ -415,7 +415,7 @@ export const LandingPageV3: React.FC<LandingPageV3Props> = ({
|
||||
<span className="text-paper font-serif text-2xl font-bold">M</span>
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Momento</span>
|
||||
<span className="font-serif text-2xl font-medium tracking-tight">Memento</span>
|
||||
<span className="text-[9px] font-black text-accent uppercase tracking-widest block font-mono -mt-1.5 pl-0.5">V3 Multilingue</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1109,7 +1109,7 @@ export const LandingPageV3: React.FC<LandingPageV3Props> = ({
|
||||
|
||||
{/* Footer copyright */}
|
||||
<footer className="py-12 px-8 bg-[#FAF9F5] text-center border-t border-black/[0.04] text-[10px] font-mono text-stone-400 uppercase tracking-widest select-none">
|
||||
<div>Momento Systems V3 — Chiffrement local garanti.</div>
|
||||
<div>Memento Systems V3 — Chiffrement local garanti.</div>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -602,7 +602,7 @@ export const SearchModal: React.FC<SearchModalProps> = ({
|
||||
|
||||
<div className="flex items-center gap-1.5 text-[9px] font-bold uppercase tracking-wider text-concrete/60">
|
||||
<Command size={10} />
|
||||
<span>Momento Search OS v2.3</span>
|
||||
<span>Memento Search OS v2.3</span>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
@@ -9,7 +9,7 @@ export const BillingTab: React.FC = () => {
|
||||
name: 'Plan Basic',
|
||||
price: 'Gratuit',
|
||||
period: '',
|
||||
description: 'Pour découvrir la magie de Momento.',
|
||||
description: 'Pour découvrir la magie de Memento.',
|
||||
features: [
|
||||
'100 Notes max',
|
||||
'3 Carnets',
|
||||
@@ -119,7 +119,7 @@ export const BillingTab: React.FC = () => {
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<p className="text-xs text-concrete font-light">Votre plan gratuit n'expire jamais. Passez à la vitesse supérieure pour débloquer toute la puissance de Momento.</p>
|
||||
<p className="text-xs text-concrete font-light">Votre plan gratuit n'expire jamais. Passez à la vitesse supérieure pour débloquer toute la puissance de Memento.</p>
|
||||
<div className="pt-4 flex items-center justify-between border-t border-border/40 mt-4">
|
||||
<span className="text-[11px] font-bold text-ink uppercase tracking-widest">Plan Actuel</span>
|
||||
<span className="text-[11px] font-bold text-accent uppercase tracking-widest">GRATUIT</span>
|
||||
|
||||
@@ -2,7 +2,24 @@
|
||||
import { GoogleGenAI, Type } from "@google/genai";
|
||||
import { BrainstormIdea } from "../types";
|
||||
|
||||
const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });
|
||||
async function generateContent(
|
||||
request: Parameters<InstanceType<typeof GoogleGenAI>['models']['generateContent']>[0],
|
||||
) {
|
||||
if (typeof window !== 'undefined') {
|
||||
const res = await fetch('/api/gemini/generate', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!res.ok) throw new Error('Gemini request failed');
|
||||
const data = await res.json();
|
||||
return { text: data.text ?? '' };
|
||||
}
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) throw new Error('GEMINI_API_KEY required on server');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
return ai.models.generateContent(request);
|
||||
}
|
||||
|
||||
const BRAINSTORM_SCHEMA = {
|
||||
type: Type.OBJECT,
|
||||
@@ -63,7 +80,7 @@ export async function generateBrainstormWave(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -101,7 +118,7 @@ export async function generateExpansion(parentIdeaTitle: string, parentIdeaDescr
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -130,9 +147,27 @@ export async function generateExpansion(parentIdeaTitle: string, parentIdeaDescr
|
||||
}
|
||||
}
|
||||
|
||||
async function embedContent(
|
||||
request: Parameters<InstanceType<typeof GoogleGenAI>['models']['embedContent']>[0],
|
||||
) {
|
||||
if (typeof window !== 'undefined') {
|
||||
const res = await fetch('/api/gemini/embed', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!res.ok) throw new Error('Gemini embed failed');
|
||||
return res.json();
|
||||
}
|
||||
const key = process.env.GEMINI_API_KEY;
|
||||
if (!key) throw new Error('GEMINI_API_KEY required on server');
|
||||
const ai = new GoogleGenAI({ apiKey: key });
|
||||
return ai.models.embedContent(request);
|
||||
}
|
||||
|
||||
export async function getEmbedding(text: string): Promise<number[]> {
|
||||
try {
|
||||
const result = await ai.models.embedContent({
|
||||
const result = await embedContent({
|
||||
model: 'gemini-embedding-2-preview',
|
||||
contents: [text],
|
||||
});
|
||||
@@ -155,7 +190,7 @@ export function cosineSimilarity(a: number[], b: number[]): number {
|
||||
export async function nameCluster(noteSummaries: string[]): Promise<string> {
|
||||
const prompt = `Quel thème commun relie ces notes ? Donne un nom court (2-4 mots).\nNotes :\n${noteSummaries.join('\n- ')}`;
|
||||
try {
|
||||
const result = await ai.models.generateContent({
|
||||
const result = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt
|
||||
});
|
||||
@@ -184,7 +219,7 @@ export async function suggestBridgeIdeas(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt,
|
||||
config: {
|
||||
@@ -207,7 +242,7 @@ export async function parseDocument(fileUrl: string, fileName: string): Promise<
|
||||
try {
|
||||
// In a real scenario, we would use media upload.
|
||||
// Here we simulate the extraction.
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
@@ -236,7 +271,7 @@ export async function extractActionItems(notes: { title: string; content: string
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3-flash-preview",
|
||||
contents: prompt,
|
||||
config: {
|
||||
@@ -289,7 +324,7 @@ export async function generateFlashcardsForNote(
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await ai.models.generateContent({
|
||||
const response = await generateContent({
|
||||
model: "gemini-3.5-flash",
|
||||
contents: [{ role: "user", parts: [{ text: prompt }] }],
|
||||
config: {
|
||||
|
||||
@@ -1,15 +1,11 @@
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import path from 'path';
|
||||
import {defineConfig, loadEnv} from 'vite';
|
||||
import {defineConfig} from 'vite';
|
||||
|
||||
export default defineConfig(({mode}) => {
|
||||
const env = loadEnv(mode, '.', '');
|
||||
export default defineConfig(() => {
|
||||
return {
|
||||
plugins: [react(), tailwindcss()],
|
||||
define: {
|
||||
'process.env.GEMINI_API_KEY': JSON.stringify(env.GEMINI_API_KEY),
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, '.'),
|
||||
|
||||
@@ -30,7 +30,7 @@ services:
|
||||
image: redis:7-alpine
|
||||
container_name: memento-redis
|
||||
restart: unless-stopped
|
||||
command: redis-server --maxmemory 128mb --maxmemory-policy allkeys-lru
|
||||
command: redis-server --maxmemory 256mb --maxmemory-policy allkeys-lru --appendonly yes --appendfsync everysec
|
||||
volumes:
|
||||
- redis-data:/data
|
||||
ports:
|
||||
@@ -73,7 +73,7 @@ services:
|
||||
condition: service_healthy
|
||||
restart: unless-stopped
|
||||
healthcheck:
|
||||
test: ["CMD", "node", "-e", "require('http').get('http://localhost:3000/',r=>process.exit(r.statusCode<500?0:1)).on('error',()=>process.exit(1))"]
|
||||
test: ["CMD", "node", "-e", "require('http').get('http://localhost:3000/api/build-info',r=>process.exit(r.statusCode<500?0:1)).on('error',()=>process.exit(1))"]
|
||||
interval: 15s
|
||||
timeout: 10s
|
||||
retries: 5
|
||||
@@ -127,7 +127,7 @@ services:
|
||||
- .env.docker
|
||||
ports:
|
||||
# SSE mode exposes port 3001, stdio mode doesn't need ports
|
||||
- "3001:3001"
|
||||
- "127.0.0.1:3001:3001"
|
||||
environment:
|
||||
# DATABASE_URL is auto-constructed from PostgreSQL credentials (not in .env.docker)
|
||||
- DATABASE_URL=postgresql://${POSTGRES_USER:-memento}:${POSTGRES_PASSWORD:-memento}@postgres:5432/${POSTGRES_DB:-memento}
|
||||
@@ -150,7 +150,7 @@ services:
|
||||
cpus: '0.25'
|
||||
memory: 128M
|
||||
healthcheck:
|
||||
test: ["CMD-SHELL", "wget --header \"x-api-key: 1b11f42537c1442456ea413feee75bac\" -q -O /dev/null http://localhost:3001/ || exit 1"]
|
||||
test: ["CMD-SHELL", "wget --header \"x-api-key: $${MCP_API_KEY:-dev-key}\" -q -O /dev/null http://localhost:3001/ || exit 1"]
|
||||
interval: 30s
|
||||
timeout: 10s
|
||||
retries: 3
|
||||
@@ -163,7 +163,7 @@ services:
|
||||
image: ollama/ollama:latest
|
||||
container_name: memento-ollama
|
||||
ports:
|
||||
- "11434:11434"
|
||||
- "127.0.0.1:11434:11434"
|
||||
volumes:
|
||||
- ollama-data:/root/.ollama
|
||||
restart: unless-stopped
|
||||
|
||||
@@ -91,7 +91,7 @@ Epic goal: B2B legal blockers for EU buyers. Cookie consent is the **first** Epi
|
||||
|
||||
### Cookie classification (implement exactly)
|
||||
|
||||
| Category | Examples in Momento | Consent required |
|
||||
| Category | Examples in Memento | Consent required |
|
||||
|----------|---------------------|------------------|
|
||||
| **Strictly necessary** | NextAuth session, CSRF (if any), `user-language` cookie, theme/direction localStorage, consent record itself | No — always on |
|
||||
| **Analytics** | Future PostHog/Umami/Plausible events, product funnel, feature flags tied to identity | Yes — opt-in |
|
||||
|
||||
182
docs/6-3-brainstorm-canvas-finalize.md
Normal file
182
docs/6-3-brainstorm-canvas-finalize.md
Normal file
@@ -0,0 +1,182 @@
|
||||
# Story: Brainstorm Canvas — Finalisation (PPTX export + UX Canvas)
|
||||
|
||||
> **Epic:** Epic 6 — Croissance & Activation (PLG)
|
||||
> **ID:** 6-3-brainstorm-canvas-finalize
|
||||
> **Priority:** High
|
||||
> **Status:** review
|
||||
> **Depends on:** `pptxgenjs@^4.0.1` (already in `package.json` ✅), `lib/ai/tools/pptx.tool.ts` (patterns)
|
||||
|
||||
---
|
||||
|
||||
## Contexte
|
||||
|
||||
Le brainstorm canvas est quasi-complet (WaveCanvas D3, collaboration temps réel, export en note Markdown, finalize session). Il manque deux choses pour un produit fini :
|
||||
|
||||
1. **Export PPTX** (FR12) : génère une présentation branded depuis la session brainstorm — route API serveur `/api/brainstorm/[sessionId]/export-pptx` + bouton dans le modal "Export/Résumé" existant.
|
||||
2. **UX Canvas** : légende des vagues (couleurs Wave 1/2/3) + bouton "Fit to screen" (re-center).
|
||||
|
||||
`pptxgenjs@^4.0.1` est déjà installé. `lib/ai/tools/pptx.tool.ts` fournit les patterns d'utilisation (lazy import, helpers, thèmes).
|
||||
|
||||
---
|
||||
|
||||
## User Stories
|
||||
|
||||
### US-BRAINSTORM-PPTX : Export PPTX
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** télécharger ma session brainstorm en fichier `.pptx`,
|
||||
**Afin de** la présenter ou la partager en dehors de l'application.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- [x] **AC-1** : Un bouton "Télécharger en PPTX" est visible dans le modal "Résumé/Export" du brainstorm
|
||||
- [x] **AC-2** : Au clic, un fichier `brainstorm-{seedIdea-slug}.pptx` est téléchargé via le navigateur
|
||||
- [x] **AC-3** : Le PPTX contient : slide couverture (titre, seedIdea, date, stats), une slide par vague active (Wave 1/2/3 avec idées), slide "Top idées" (starred + converted), slide bilan
|
||||
- [x] **AC-4** : Les idées dismissées ne sont pas incluses
|
||||
- [x] **AC-5** : Le thème utilise les couleurs de l'app (brand-accent `#A47148`, fond clair)
|
||||
- [x] **AC-6** : La route est protégée (auth + participant check)
|
||||
|
||||
### US-BRAINSTORM-CANVAS-UX : UX Canvas
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** comprendre les codes couleurs du canvas et recentrer la vue,
|
||||
**Afin de** naviguer efficacement dans la session.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- [x] **AC-7** : Une légende compacte est visible en bas-gauche du canvas (Wave 1 🟠, Wave 2 🔵, Wave 3 🟣, ✓ Converti, ✦ IA, initiale Humain)
|
||||
- [x] **AC-8** : Un bouton "Recentrer" (⊙) est visible sur le canvas et recentre la vue sur le nœud racine
|
||||
|
||||
---
|
||||
|
||||
## Tasks / Subtasks
|
||||
|
||||
### T1 — Route API export PPTX
|
||||
|
||||
- [x] T1.1 — Créer `app/api/brainstorm/[sessionId]/export-pptx/route.ts`
|
||||
- Auth + participant check (réutiliser `verifyParticipant`)
|
||||
- Charger la session avec les idées (non-dismissed)
|
||||
- Générer le PPTX via `pptxgenjs` (lazy import pattern de `pptx.tool.ts`)
|
||||
- Retourner le buffer en `application/vnd.openxmlformats-officedocument.presentationml.presentation`
|
||||
- Headers: `Content-Disposition: attachment; filename="brainstorm-{slug}.pptx"`
|
||||
|
||||
### T2 — Lib helper `lib/brainstorm/export-pptx.ts`
|
||||
|
||||
- [x] T2.1 — Créer `lib/brainstorm/export-pptx.ts` avec `generateBrainstormPptx(session): Promise<Buffer>`
|
||||
- Thème "architectural_mono" (`bg: F2F0E9, primary: 1C1C1C, accent: A47148`) — cohérent avec l'app
|
||||
- Slide 0 : Cover — titre "Brainstorm", seedIdea en sous-titre, date, stats (N idées, M converties)
|
||||
- Slide 1-3 : Une slide par vague active — titre "Wave N — {label}", liste des idées (titre + description courte)
|
||||
- Slide finale : "Top idées" — starred ⭐ et converties ✓ — max 6 items
|
||||
- Idées dismissed : exclues
|
||||
|
||||
### T3 — Bouton PPTX dans le modal export
|
||||
|
||||
- [x] T3.1 — Dans `brainstorm-page.tsx`, ajouter un bouton "Télécharger PPTX" dans le modal de résumé (`summaryOpen`)
|
||||
- Fetch `POST /api/brainstorm/{sessionId}/export-pptx` → blob download
|
||||
- Loading state + toast succès/erreur
|
||||
- i18n key `brainstorm.downloadPptx`
|
||||
|
||||
### T4 — UX Canvas : légende + recentrer
|
||||
|
||||
- [x] T4.1 — Dans `wave-canvas.tsx`, ajouter une légende compacte (overlay bas-droit, au-dessus du hint double-click)
|
||||
- 4 entrées : Wave 1 🟠, Wave 2 🔵, Wave 3 🟣 + ✓ Converti
|
||||
- Style minimaliste, fond semi-transparent
|
||||
- [x] T4.2 — Exposer une ref/méthode `fitToScreen()` ou callback `onFitToScreen` depuis `WaveCanvas`
|
||||
- Re-applique `zoom.transform` vers `d3.zoomIdentity.translate(centerX, centerY).scale(0.8)`
|
||||
- [x] T4.3 — Dans `brainstorm-page.tsx`, ajouter un bouton ⊙ "Recentrer" dans les contrôles canvas
|
||||
- Appelle `fitToScreen()`
|
||||
- i18n key `brainstorm.fitToScreen`
|
||||
|
||||
### T5 — i18n (15 locales)
|
||||
|
||||
- [x] T5.1 — Ajouter dans `locales/en.json` et `locales/fr.json` :
|
||||
- `brainstorm.downloadPptx`, `brainstorm.downloadPptxDesc`, `brainstorm.pptxSuccess`, `brainstorm.pptxError`, `brainstorm.fitToScreen`
|
||||
- [x] T5.2 — Propager dans les 13 autres locales (valeur EN par défaut)
|
||||
|
||||
---
|
||||
|
||||
## Dev Notes
|
||||
|
||||
### Architecture
|
||||
|
||||
**Route API (`'use server'` implicite via Next.js route handler) :**
|
||||
```typescript
|
||||
// app/api/brainstorm/[sessionId]/export-pptx/route.ts
|
||||
export async function POST(req, { params }) {
|
||||
// auth + verifyParticipant
|
||||
// load session + ideas (status !== 'dismissed')
|
||||
// generateBrainstormPptx(session) → Buffer
|
||||
// return new Response(buffer, { headers: { 'Content-Type': 'application/vnd.openxmlformats...', 'Content-Disposition': 'attachment; filename=...' } })
|
||||
}
|
||||
```
|
||||
|
||||
**Lazy import pptxgenjs (pattern depuis `pptx.tool.ts`) :**
|
||||
```typescript
|
||||
let _PptxGenJS: (new () => PptxGenJSModule) | null = null
|
||||
async function getPptxGenClass() {
|
||||
if (!_PptxGenJS) {
|
||||
const mod = await import('pptxgenjs')
|
||||
_PptxGenJS = (mod.default ?? mod) as unknown as new () => PptxGenJSModule
|
||||
}
|
||||
return _PptxGenJS
|
||||
}
|
||||
```
|
||||
|
||||
**Client download depuis brainstorm-page.tsx :**
|
||||
```typescript
|
||||
const res = await fetch(`/api/brainstorm/${sessionId}/export-pptx`, { method: 'POST' })
|
||||
const blob = await res.blob()
|
||||
const url = URL.createObjectURL(blob)
|
||||
const a = document.createElement('a')
|
||||
a.href = url
|
||||
a.download = `brainstorm-${slug}.pptx`
|
||||
a.click()
|
||||
URL.revokeObjectURL(url)
|
||||
```
|
||||
|
||||
**WaveCanvas fit-to-screen :**
|
||||
- Exposer via `useImperativeHandle` + `forwardRef` un objet `{ fitToScreen: () => void }`
|
||||
- Ou plus simple : passer une prop `fitTrigger: number` (increment → re-zoom)
|
||||
|
||||
### Thème PPTX
|
||||
|
||||
Cohérent avec l'identité visuelle Memento :
|
||||
- `bg: F2F0E9` — fond papier
|
||||
- `primary: 1C1C1C` — noir ardoise
|
||||
- `accent: A47148` — brand-accent Memento
|
||||
- `secondary: D4A373` — ocre clair
|
||||
|
||||
### Fichiers clés existants
|
||||
- `memento-note/lib/ai/tools/pptx.tool.ts` — référence pour patterns pptxgenjs
|
||||
- `memento-note/components/brainstorm/wave-canvas.tsx` — canvas D3
|
||||
- `memento-note/components/brainstorm/brainstorm-page.tsx` — page principale
|
||||
- `memento-note/app/api/brainstorm/[sessionId]/export/route.ts` — export Markdown (référence)
|
||||
- `memento-note/lib/brainstorm-collab.ts` — `verifyParticipant`
|
||||
|
||||
---
|
||||
|
||||
## Dev Agent Record
|
||||
|
||||
### Implementation Plan
|
||||
|
||||
_À compléter par l'agent dev_
|
||||
|
||||
### Debug Log
|
||||
|
||||
_À compléter_
|
||||
|
||||
### Completion Notes
|
||||
|
||||
_À compléter_
|
||||
|
||||
---
|
||||
|
||||
## File List
|
||||
|
||||
_À compléter_
|
||||
|
||||
---
|
||||
|
||||
## Change Log
|
||||
|
||||
| Date | Description |
|
||||
|------|-------------|
|
||||
| 2026-05-29 | Story créée — 6-3 brainstorm canvas finalize |
|
||||
50
docs/6-5-pptx-export-watermark.md
Normal file
50
docs/6-5-pptx-export-watermark.md
Normal file
@@ -0,0 +1,50 @@
|
||||
# Story 6-5 — PPTX Export Watermark (PLG Viral Loop)
|
||||
|
||||
**Epic:** 6 — Croissance & Activation (PLG)
|
||||
**Status:** done
|
||||
|
||||
## User Story
|
||||
|
||||
**En tant qu'** utilisateur qui partage une présentation exportée depuis Memento,
|
||||
**Je veux** que chaque slide porte discrètement la mention "memento-note.com",
|
||||
**Afin que** les destinataires découvrent l'outil et s'inscrivent (boucle virale PLG).
|
||||
|
||||
## Acceptance Criteria
|
||||
|
||||
- [x] **AC-1** : Chaque slide du PPTX brainstorm contient "memento-note.com" en bas-droite
|
||||
- [x] **AC-2** : Chaque slide du PPTX IA (generate_pptx) contient "memento-note.com" en bas-droite
|
||||
- [x] **AC-3** : Le watermark est subtil (7pt, gris clair `#B8B0A8`, italique) — visible mais non intrusif
|
||||
- [x] **AC-4** : Zéro régression sur la mise en page existante des slides
|
||||
|
||||
## Tasks
|
||||
|
||||
- [x] T1 — Ajouter helper `addWatermark(slide)` + `withWatermark(pres)` dans `lib/brainstorm/export-pptx.ts`
|
||||
- [x] T2 — Appliquer `withWatermark` dans `generateBrainstormPptx` (monkey-patch `pres.addSlide`)
|
||||
- [x] T3 — Ajouter helper `addWatermark(slide)` + `withWatermark(pres)` dans `lib/ai/tools/pptx.tool.ts`
|
||||
- [x] T4 — Appliquer `withWatermark` dans `buildPresentation` (monkey-patch `pres.addSlide`)
|
||||
- [x] T5 — Vérifier TypeScript + 174 tests unitaires passent
|
||||
|
||||
## Files Modified
|
||||
|
||||
- `memento-note/lib/brainstorm/export-pptx.ts` — helpers `addWatermark` + `withWatermark`, monkey-patch dans `generateBrainstormPptx`
|
||||
- `memento-note/lib/ai/tools/pptx.tool.ts` — helpers `addWatermark` + `withWatermark`, monkey-patch dans `buildPresentation`
|
||||
|
||||
## Technical Notes
|
||||
|
||||
**Pattern monkey-patch :**
|
||||
```ts
|
||||
function withWatermark(pres: PptxGenJSModule): PptxGenJSModule {
|
||||
const original = pres.addSlide.bind(pres)
|
||||
;(pres as any).addSlide = (...args: any[]) => {
|
||||
const slide = original(...args)
|
||||
addWatermark(slide)
|
||||
return slide
|
||||
}
|
||||
return pres
|
||||
}
|
||||
```
|
||||
Ce pattern garantit que le watermark est ajouté sur **toutes** les slides sans modifier les 14+ fonctions de construction de slides.
|
||||
|
||||
**Design watermark :**
|
||||
- Position : `x: 7.0, y: 5.35, w: 2.7, h: 0.2` (bas-droite, slide 10"×5.63")
|
||||
- Style : 7pt Arial, couleur `B8B0A8`, italique, alignement droite
|
||||
223
docs/brief-markdown-roundtrip.md
Normal file
223
docs/brief-markdown-roundtrip.md
Normal file
@@ -0,0 +1,223 @@
|
||||
# Brief Technique : US-EDITOR-MARKDOWN — Round-Trip TipTap ↔ Markdown
|
||||
|
||||
> **ID:** US-EDITOR-MARKDOWN
|
||||
> **Priorité:** Beta blocker (confirmé)
|
||||
> **Dépendances:** Rich-text editor TipTap existant (`rich-text-editor.tsx`)
|
||||
> **Complexité estimée:** Moyenne (2–5 jours selon approche choisie)
|
||||
|
||||
---
|
||||
|
||||
## Contexte
|
||||
|
||||
TipTap/ProseMirror stocke le contenu en **JSON natif** (format ProseMirror Doc). Actuellement :
|
||||
- L'éditeur **lit et écrit du JSON** en base de données
|
||||
- `marked`, `react-markdown`, `remark-gfm` sont installés mais utilisés uniquement pour **l'affichage** de contenu Markdown externe (Web Clipper, import)
|
||||
- Il **n'existe aucune sérialisation TipTap → Markdown** ni **Markdown → TipTap** dans le code actuel
|
||||
|
||||
L'objectif est un **round-trip fidèle** :
|
||||
```
|
||||
Note TipTap (JSON) → Export Markdown → Re-import → JSON identique (byte-for-byte sur les éléments supportés)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Analyse des Options
|
||||
|
||||
### Option A — `@tiptap/extension-markdown` (recommandé ✅)
|
||||
|
||||
**Package :** `@tiptap/extension-markdown` (officiel TipTap, payant pour certaines extensions avancées — vérifier licence)
|
||||
|
||||
**Principe :**
|
||||
- Extension TipTap officielle qui ajoute une méthode `.storage.markdown.getMarkdown()` sur l'éditeur
|
||||
- Import Markdown via `editor.commands.setContent(markdownString, { parseOptions: { markdown: true } })`
|
||||
- Supporte GFM (GitHub Flavored Markdown) : tableaux, listes de tâches, code fences
|
||||
|
||||
**Avantages :**
|
||||
- Intégration native TipTap — zéro friction
|
||||
- Maintenu par l'équipe TipTap
|
||||
- Support des nœuds custom via `markdownSerializer` sur chaque extension
|
||||
|
||||
**Inconvénients :**
|
||||
- Certaines extensions sont sous licence TipTap Pro ($149/mois)
|
||||
- Les nœuds custom de Memento (`liveBlock`, `structuredViewBlock`) nécessitent des serializers manuels
|
||||
- Round-trip parfait impossible pour ces nœuds (dégradation gracieuse : placeholder HTML comment)
|
||||
|
||||
**Implémentation :**
|
||||
```typescript
|
||||
// Installation
|
||||
npm install @tiptap/extension-markdown
|
||||
|
||||
// Dans rich-text-editor.tsx
|
||||
import { Markdown } from '@tiptap/extension-markdown'
|
||||
|
||||
const editor = useEditor({
|
||||
extensions: [
|
||||
// ... extensions existantes ...
|
||||
Markdown.configure({
|
||||
html: false, // Désactiver HTML brut dans le MD
|
||||
tightLists: true, // Listes compactes
|
||||
tightListClass: 'tight',
|
||||
bulletListMarker: '-',
|
||||
linkify: false,
|
||||
breaks: false,
|
||||
transformPastedText: true, // Coller du Markdown → conversion auto
|
||||
transformCopiedText: false,
|
||||
}),
|
||||
],
|
||||
})
|
||||
|
||||
// Export
|
||||
const markdown = editor.storage.markdown.getMarkdown()
|
||||
|
||||
// Import
|
||||
editor.commands.setContent(markdownString)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Option B — `prosemirror-markdown` (alternative robuste ✅)
|
||||
|
||||
**Package :** `prosemirror-markdown` (officiel ProseMirror)
|
||||
|
||||
**Principe :**
|
||||
- Bibliothèque bas niveau qui fournit un `MarkdownSerializer` et un `MarkdownParser`
|
||||
- S'intègre à TipTap via le schéma ProseMirror sous-jacent
|
||||
- Utilise `remark` (déjà installé) pour le parsing
|
||||
|
||||
**Avantages :**
|
||||
- Open source, pas de licence Pro
|
||||
- Contrôle total du serializer (chaque nœud est défini explicitement)
|
||||
- Utilisé en production par de nombreux éditeurs (GitLab, Linear)
|
||||
|
||||
**Inconvénients :**
|
||||
- Plus verbeux — chaque extension TipTap nécessite son `toMarkdown` et `fromMarkdown`
|
||||
- Effort initial plus élevé (~2 jours de mapping)
|
||||
- À maintenir à chaque nouvelle extension ajoutée
|
||||
|
||||
**Implémentation :**
|
||||
```typescript
|
||||
import { MarkdownSerializer, defaultMarkdownSerializer } from 'prosemirror-markdown'
|
||||
import { MarkdownParser } from 'prosemirror-markdown'
|
||||
import markdownit from 'markdown-it'
|
||||
|
||||
// Serializer — mapper chaque nœud TipTap
|
||||
const momentoSerializer = new MarkdownSerializer(
|
||||
{
|
||||
...defaultMarkdownSerializer.nodes,
|
||||
// Nœuds Memento custom
|
||||
liveBlock: (state, node) => {
|
||||
state.write(`<!-- live-block: ${node.attrs.sourceNoteId}#${node.attrs.blockId} -->`)
|
||||
state.closeBlock(node)
|
||||
},
|
||||
structuredViewBlock: (state, node) => {
|
||||
state.write(`<!-- structured-view: ${JSON.stringify(node.attrs)} -->`)
|
||||
state.closeBlock(node)
|
||||
},
|
||||
},
|
||||
defaultMarkdownSerializer.marks
|
||||
)
|
||||
|
||||
// Export
|
||||
const markdown = momentoSerializer.serialize(editor.state.doc)
|
||||
|
||||
// Parser
|
||||
const md = markdownit('commonmark', { html: true })
|
||||
const parser = new MarkdownParser(editor.schema, md, { /* token map */ })
|
||||
const doc = parser.parse(markdownString)
|
||||
editor.commands.setContent(doc.toJSON())
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Option C — `Milkdown` (remplacement complet ❌ déconseillé)
|
||||
|
||||
**Milkdown** est un éditeur Markdown-first qui remplace TipTap/ProseMirror. Le migrer vers Milkdown signifie :
|
||||
- Réécriture complète de `rich-text-editor.tsx` (~800 lignes)
|
||||
- Perte de toutes les extensions custom (Living Blocks, Structured Views, Smart Paste, etc.)
|
||||
- Délai estimé : 2-4 semaines
|
||||
|
||||
**Verdict : ❌ Trop risqué, trop long pour la beta.**
|
||||
|
||||
---
|
||||
|
||||
## Recommandation
|
||||
|
||||
### Court terme (beta) : **Option A** (`@tiptap/extension-markdown`)
|
||||
|
||||
Raisons :
|
||||
1. Intégration en **1 journée** dans l'éditeur existant
|
||||
2. Couvre 95% des cas d'usage (texte, listes, headings, code, tables, tâches)
|
||||
3. Le `transformPastedText: true` résout aussi un bug UX courant (coller du Markdown brut)
|
||||
4. Les nœuds Memento non-supportés sont préservés via commentaires HTML (dégradation gracieuse)
|
||||
|
||||
### Long terme : **Option B** en complément
|
||||
|
||||
Pour les cas avancés (export propre des nœuds custom, CI de round-trip byte-for-byte), implémenter Option B en remplacement d'Option A une fois la beta stabilisée.
|
||||
|
||||
---
|
||||
|
||||
## Scope de l'US-EDITOR-MARKDOWN (Beta)
|
||||
|
||||
### Ce qui est inclus
|
||||
|
||||
| Feature | Priorité |
|
||||
|---------|----------|
|
||||
| Export note → fichier `.md` téléchargeable | 🔴 P0 |
|
||||
| Coller du Markdown → conversion auto en blocs TipTap | 🔴 P0 |
|
||||
| Import note depuis fichier `.md` | 🟡 P1 |
|
||||
| Copy note as Markdown (dans le presse-papier) | 🟡 P1 |
|
||||
| Round-trip fidèle pour : headings, bold, italic, lists, tasks, code, blockquote, links, tables | 🔴 P0 |
|
||||
| Dégradation gracieuse pour `liveBlock` et `structuredViewBlock` (commentaire HTML) | 🟡 P1 |
|
||||
|
||||
### Ce qui est exclu (post-beta)
|
||||
|
||||
- Round-trip byte-for-byte des nœuds Memento custom
|
||||
- Édition native en mode source Markdown (raw text editor)
|
||||
- Sync bidirectionnelle temps réel Markdown ↔ TipTap
|
||||
|
||||
---
|
||||
|
||||
## Fichiers à créer / modifier
|
||||
|
||||
| Fichier | Action |
|
||||
|---------|--------|
|
||||
| `memento-note/package.json` | Ajouter `@tiptap/extension-markdown` |
|
||||
| `components/rich-text-editor.tsx` | Ajouter extension `Markdown` à la config TipTap |
|
||||
| `lib/editor/markdown-export.ts` | Créer — helper `tiptapDocToMarkdown(doc)` et `markdownToTiptapDoc(md)` |
|
||||
| `components/note-actions.tsx` | Ajouter action "Exporter en Markdown" |
|
||||
| `app/api/notes/[id]/export/route.ts` | Créer — `GET /api/notes/:id/export?format=markdown` |
|
||||
| `locales/en.json` + `fr.json` | Ajouter clés `editor.exportMarkdown`, `editor.importMarkdown`, `editor.pasteMarkdown` |
|
||||
|
||||
---
|
||||
|
||||
## Critères d'acceptation
|
||||
|
||||
**Given** j'ai une note avec du contenu riche (headings, listes, code, tasks)
|
||||
**When** je clique "Exporter en Markdown"
|
||||
**Then** je télécharge un fichier `.md` avec le contenu fidèlement sérialisé
|
||||
|
||||
**Given** je copie du Markdown depuis un éditeur externe
|
||||
**When** je colle dans l'éditeur Memento
|
||||
**Then** le Markdown est automatiquement converti en blocs TipTap correspondants (pas du texte brut)
|
||||
|
||||
**Given** j'importe un fichier `.md`
|
||||
**When** le parsing est terminé
|
||||
**Then** les headings/listes/code/tables sont correctement représentés dans l'éditeur
|
||||
|
||||
**Given** ma note contient un `liveBlock` (bloc vivant)
|
||||
**When** j'exporte en Markdown
|
||||
**Then** le bloc vivant est exporté en commentaire HTML `<!-- live-block: ... -->` sans erreur
|
||||
|
||||
---
|
||||
|
||||
## Estimation
|
||||
|
||||
| Tâche | Durée estimée |
|
||||
|-------|--------------|
|
||||
| Installation + config `@tiptap/extension-markdown` | 2h |
|
||||
| Helper `lib/editor/markdown-export.ts` | 2h |
|
||||
| Route API export + action UI | 2h |
|
||||
| Import fichier `.md` via modal | 3h |
|
||||
| Tests manuels round-trip + fix edge cases | 4h |
|
||||
| i18n (EN + FR) | 1h |
|
||||
| **Total** | **~2 jours** |
|
||||
@@ -9,11 +9,11 @@ inputDocuments:
|
||||
- memento-note/docs/saas-deployment-prep.md
|
||||
---
|
||||
|
||||
# Momento - Epic Breakdown
|
||||
# Memento - Epic Breakdown
|
||||
|
||||
## Overview
|
||||
|
||||
This document provides the complete epic and story breakdown for Momento, focusing strictly on the **Commercial and AI Delta** required to launch the V3 product. Momento is a **Brownfield** project. The baseline functionality (Basic User Auth, Workspaces, CRUD Rich-Text Notes, pgvector database) already exists and is considered out-of-scope for these epics.
|
||||
This document provides the complete epic and story breakdown for Memento, focusing strictly on the **Commercial and AI Delta** required to launch the V3 product. Memento is a **Brownfield** project. The baseline functionality (Basic User Auth, Workspaces, CRUD Rich-Text Notes, pgvector database) already exists and is considered out-of-scope for these epics.
|
||||
|
||||
## Requirements Inventory
|
||||
|
||||
@@ -223,7 +223,7 @@ So that I retain full control over my data privacy.
|
||||
|
||||
**Given** I trigger an AI feature that processes my notes or PDFs
|
||||
**When** the request is initiated
|
||||
**Then** (NFR-GDPR4) explicit consent is logged before the data leaves the Momento infrastructure.
|
||||
**Then** (NFR-GDPR4) explicit consent is logged before the data leaves the Memento infrastructure.
|
||||
|
||||
### Story 4.5: EU Data Residency Configuration
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
# Fonctionnalités IA — Momento
|
||||
# Fonctionnalités IA — Memento
|
||||
|
||||
## Architecture
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
# Guide utilisateur Momento
|
||||
# Guide utilisateur Memento
|
||||
|
||||
Documentation produit illustrée du SaaS **Momento** — second cerveau augmenté par l’IA (notes, recherche sémantique, agents, brainstorm collaboratif, BYOK).
|
||||
Documentation produit illustrée du SaaS **Memento** — second cerveau augmenté par l’IA (notes, recherche sémantique, agents, brainstorm collaboratif, BYOK).
|
||||
|
||||
> **Sources internes** : ce guide synthétise le [PRD](../prd.md), les [fonctionnalités IA](../fonctionnalites-ia.md), la [doc brainstorm](../../memento-note/docs/brainstorm-documentation.md) et le [GUIDE technique](../../GUIDE.md) (installation / admin).
|
||||
|
||||
@@ -24,7 +24,7 @@ Documentation produit illustrée du SaaS **Momento** — second cerveau augment
|
||||
|
||||
## 1. Vue d’ensemble
|
||||
|
||||
Momento est une application de prise de notes qui combine :
|
||||
Memento est une application de prise de notes qui combine :
|
||||
|
||||
- **Organisation** : carnets, labels, grille masonry, archive, corbeille, partage.
|
||||
- **Recherche sémantique** : trouver par idée, pas seulement par mot-clé (vecteurs + plein texte).
|
||||
@@ -72,7 +72,7 @@ La landing publique présente la proposition de valeur avant inscription.
|
||||
|
||||

|
||||
|
||||
Message clé : Momento relie, analyse et développe vos idées avec **6 types d’agents IA** et une **recherche sémantique** avancée. Exemple produit : *Memory Echo* qui signale un lien avec un projet passé.
|
||||
Message clé : Memento relie, analyse et développe vos idées avec **6 types d’agents IA** et une **recherche sémantique** avancée. Exemple produit : *Memory Echo* qui signale un lien avec un projet passé.
|
||||
|
||||
### Capacités IA
|
||||
|
||||
@@ -111,7 +111,7 @@ Brainstorming radial temps réel : génération par vagues, collaboration (curse
|
||||
|
||||

|
||||
|
||||
Si vous avez déjà des clés **OpenAI**, **Anthropic** ou **Google**, vous les connectez à Momento : pas de plafond de crédits imposé par la plateforme, facturation directe chez le fournisseur, changement de provider en un clic.
|
||||
Si vous avez déjà des clés **OpenAI**, **Anthropic** ou **Google**, vous les connectez à Memento : pas de plafond de crédits imposé par la plateforme, facturation directe chez le fournisseur, changement de provider en un clic.
|
||||
|
||||
---
|
||||
|
||||
|
||||
@@ -13,7 +13,7 @@ includedFiles:
|
||||
# Implementation Readiness Assessment Report
|
||||
|
||||
**Date:** 2026-05-14
|
||||
**Project:** Momento
|
||||
**Project:** Memento
|
||||
|
||||
## PRD Analysis
|
||||
|
||||
|
||||
@@ -305,7 +305,7 @@ Résultat attendu :
|
||||
|
||||
## Étape 7 : Tester le brainstorm
|
||||
|
||||
1. Ouvrir https://note.parsanet.org/brainstorm
|
||||
1. Ouvrir https://memento-note.com/brainstorm
|
||||
2. Taper une idée et cliquer le bouton +
|
||||
3. Vérifier que les 9 idées apparaissent sur le canvas
|
||||
|
||||
|
||||
16
docs/prd.md
16
docs/prd.md
@@ -29,19 +29,19 @@ inputDocuments:
|
||||
workflowType: 'prd'
|
||||
---
|
||||
|
||||
# Product Requirements Document - Momento
|
||||
# Product Requirements Document - Memento
|
||||
|
||||
**Author:** User
|
||||
**Date:** 2026-05-14
|
||||
|
||||
## Executive Summary
|
||||
|
||||
Momento Note democratizes access to an AI-augmented digital memory for a dual audience: self-taught individuals and enterprise R&D departments. As a next-generation Personal Knowledge Management system, it transforms note-taking from passive storage into an active, intelligent partner. By integrating vector-based semantic search and an ecosystem of autonomous agents, Momento automatically surfaces hidden connections, remembers forgotten insights, and accelerates knowledge work.
|
||||
Memento Note democratizes access to an AI-augmented digital memory for a dual audience: self-taught individuals and enterprise R&D departments. As a next-generation Personal Knowledge Management system, it transforms note-taking from passive storage into an active, intelligent partner. By integrating vector-based semantic search and an ecosystem of autonomous agents, Memento automatically surfaces hidden connections, remembers forgotten insights, and accelerates knowledge work.
|
||||
|
||||
### What Makes This Special
|
||||
|
||||
Momento's true power lies in its seamless blend of advanced AI tools and innovative financial architecture:
|
||||
- **Autonomous Ecosystem:** Moving beyond a smart notepad, Momento acts as an autonomous "Second Brain." It deploys specialized agents (Scraper, Researcher, Monitor) and native productivity tools like Document Parsing (Chat-with-PDF) and Automated Task Extraction directly within the user's workspace.
|
||||
Memento's true power lies in its seamless blend of advanced AI tools and innovative financial architecture:
|
||||
- **Autonomous Ecosystem:** Moving beyond a smart notepad, Memento acts as an autonomous "Second Brain." It deploys specialized agents (Scraper, Researcher, Monitor) and native productivity tools like Document Parsing (Chat-with-PDF) and Automated Task Extraction directly within the user's workspace.
|
||||
- **Collaborative Brainstorming:** A real-time, D3-powered radial graph canvas allows users to generate, expand, and structure AI-driven ideas collaboratively.
|
||||
- **Sustainable "Host-Pays" Billing & BYOK:** Memento resolves the SaaS AI cost paradox through intelligent smart routing (defaulting to highly optimized models like DeepSeek V4 Flash) and a Bring-Your-Own-Key (BYOK) architecture that eliminates AI costs for power users. The innovative Freemium "AI Discovery Pack" provides lifetime access limits rather than restrictive monthly quotas, delivering an immediate "Aha!" moment without friction.
|
||||
|
||||
@@ -100,7 +100,7 @@ Momento's true power lies in its seamless blend of advanced AI tools and innovat
|
||||
|
||||
### 1. The Power User (BYOK & Autonomous Ecosystem)
|
||||
**Persona:** Alex, an independent data science researcher analyzing dense PDFs, frustrated by arbitrary SaaS API limits.
|
||||
**Opening Scene:** Alex discovers Momento through a watermark on a shared presentation. They sign up and are granted the Freemium "AI Discovery Pack."
|
||||
**Opening Scene:** Alex discovers Memento through a watermark on a shared presentation. They sign up and are granted the Freemium "AI Discovery Pack."
|
||||
**Rising Action:** Alex uploads a complex 50-page PDF and uses the Chat-with-PDF feature to extract methodologies. The AI's responses are rapid and accurate. Because Alex is doing heavy research, they quickly exhaust their Discovery Pack token limits.
|
||||
**Climax (The "Aha!" Moment):** Instead of hitting a hard paywall that locks them out, Memento elegantly prompts them to input their own LLM API key (BYOK). Alex pastes their DeepSeek key, and instantly, they are back to querying at near-zero marginal cost, entirely avoiding a rigid $20/mo subscription.
|
||||
**Resolution:** Alex fully adopts Memento as their "Second Brain", deploying autonomous Scraper agents to monitor new Arxiv papers directly into their semantic search index.
|
||||
@@ -148,13 +148,13 @@ These journeys reveal the following critical capabilities we must build:
|
||||
|
||||
### Detected Innovation Areas
|
||||
|
||||
1. **Financial Architecture (The "Host-Pays" + BYOK Model):** Momento solves the SaaS AI unit economics paradox. By shifting all collaborative AI generation costs exclusively to the session host's quotas—while simultaneously offering a zero-margin Bring-Your-Own-Key (BYOK) escape hatch—the platform eliminates the traditional per-seat LLM paywall friction that stifles viral growth.
|
||||
1. **Financial Architecture (The "Host-Pays" + BYOK Model):** Memento solves the SaaS AI unit economics paradox. By shifting all collaborative AI generation costs exclusively to the session host's quotas—while simultaneously offering a zero-margin Bring-Your-Own-Key (BYOK) escape hatch—the platform eliminates the traditional per-seat LLM paywall friction that stifles viral growth.
|
||||
2. **Autonomous Agent Ecosystem Native to PKM:** Integrating Scraper, Researcher, and Monitor agents directly into the note environment. Instead of users manually pulling data into their notes, the "Second Brain" actively structures and retrieves knowledge via vector-based semantic search.
|
||||
3. **Radial Graph-Based AI Brainstorming:** Moving away from linear chat interfaces (like standard ChatGPT) to a multi-directional, real-time D3 radial graph, where ideas expand outwards in "Waves" (Variations, Analogies, Disruptions).
|
||||
|
||||
### Market Context & Competitive Landscape
|
||||
|
||||
Traditional PKM tools (like Notion or Obsidian) either charge heavy flat-rate AI add-ons ($10-$20/mo) or require highly technical, fragile plugin setups for local models. Conversely, standard whiteboard tools (Miro, FigJam) offer AI generation but lack the deep semantic connection to a user's personal knowledge base. Momento occupies the blue ocean between an enterprise collaboration whiteboard and an autonomous research assistant.
|
||||
Traditional PKM tools (like Notion or Obsidian) either charge heavy flat-rate AI add-ons ($10-$20/mo) or require highly technical, fragile plugin setups for local models. Conversely, standard whiteboard tools (Miro, FigJam) offer AI generation but lack the deep semantic connection to a user's personal knowledge base. Memento occupies the blue ocean between an enterprise collaboration whiteboard and an autonomous research assistant.
|
||||
|
||||
### Validation Approach
|
||||
|
||||
@@ -171,7 +171,7 @@ Traditional PKM tools (like Notion or Obsidian) either charge heavy flat-rate AI
|
||||
## SaaS Web Application Specific Requirements
|
||||
|
||||
### Project-Type Overview
|
||||
Momento is a B2B and B2C SaaS platform serving as a multi-tenant personal knowledge management system. It requires complex state synchronization, robust role-based access controls for collaborative sessions, and an advanced hybrid billing architecture.
|
||||
Memento is a B2B and B2C SaaS platform serving as a multi-tenant personal knowledge management system. It requires complex state synchronization, robust role-based access controls for collaborative sessions, and an advanced hybrid billing architecture.
|
||||
|
||||
### Technical Architecture Considerations
|
||||
- **Frontend:** React + Next.js App Router, using D3.js for the Brainstorm radial graph and React Query for state management.
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
│ │
|
||||
│ Cloudflare │ rsync chiffré
|
||||
▼ ▼
|
||||
note.parsanet.org Serveur hors-site
|
||||
memento-note.com Serveur hors-site
|
||||
```
|
||||
|
||||
---
|
||||
@@ -203,7 +203,7 @@ docker compose -f docker-compose.monitoring.yml ps
|
||||
### 2.6 Health API
|
||||
|
||||
```
|
||||
GET https://note.parsanet.org/api/admin/health
|
||||
GET https://memento-note.com/api/admin/health
|
||||
```
|
||||
|
||||
Retourne :
|
||||
@@ -256,7 +256,7 @@ Push → Gitea Actions CI → Lint + Test + Build
|
||||
- `CUSTOM_OPENAI_API_KEY`
|
||||
|
||||
**Variables :**
|
||||
- `APP_URL` — https://note.parsanet.org
|
||||
- `APP_URL` — https://memento-note.com
|
||||
- `ADMIN_EMAIL`
|
||||
- `POSTGRES_USER`, `POSTGRES_DB`, `POSTGRES_PORT`
|
||||
- Toutes les variables AI provider
|
||||
|
||||
211
docs/referral-system-design.md
Normal file
211
docs/referral-system-design.md
Normal file
@@ -0,0 +1,211 @@
|
||||
# Memento — Spécification Technique & Design du Système de Parrainage (Referral)
|
||||
|
||||
Ce document présente l'architecture complète d'un système de parrainage (referral) natif pour **Memento**, intégré à notre base de données PostgreSQL (Prisma) et à Stripe.
|
||||
|
||||
---
|
||||
|
||||
## 1. Objectifs du Système
|
||||
|
||||
1. **Viralité (PLG)** : Encourager les utilisateurs existants à partager Memento pour acquérir de nouveaux clients sans budget publicitaire (CAC proche de 0).
|
||||
2. **Double Récompense (Win-Win)** :
|
||||
- **Le Filleul (Invité)** obtient une réduction immédiate lors de son premier abonnement (ex. `-10 % sur son abonnement PRO`).
|
||||
- **Le Parrain (Hôte)** obtient une récompense lors du premier paiement de son filleul (ex. **1 mois gratuit** appliqué directement sur sa prochaine facture Stripe, ou **+100 crédits IA** récurrents).
|
||||
3. **Simplicité & Automatisation** : Le parrainage doit se faire par lien unique et être validé automatiquement via notre webhook Stripe actuel.
|
||||
|
||||
---
|
||||
|
||||
## 2. Architecture de Données (Prisma)
|
||||
|
||||
Pour suivre les relations de parrainage et distribuer les récompenses de manière sécurisée et sans doublons, nous proposons d'étendre le schéma Prisma actuel.
|
||||
|
||||
```prisma
|
||||
// memento-note/prisma/schema.prisma
|
||||
|
||||
model User {
|
||||
// ... champs existants ...
|
||||
|
||||
// Système de Parrainage
|
||||
referralCode String @unique // Code unique généré pour l'utilisateur (ex: "SEPEHR50")
|
||||
referredById String? // ID du parrain qui l'a invité
|
||||
referredBy User? @relation("UserReferrals", fields: [referredById], references: [id])
|
||||
referrals User[] @relation("UserReferrals")
|
||||
|
||||
referralRewards ReferralReward[] // Historique des récompenses distribuées
|
||||
}
|
||||
|
||||
model ReferralReward {
|
||||
id String @id @default(cuid())
|
||||
userId String // Le parrain récompensé
|
||||
refereeId String // Le filleul qui a déclenché la récompense
|
||||
rewardType String // "FREE_MONTH" (Stripe) ou "AI_CREDITS" (Redis)
|
||||
status String @default("PENDING") // "PENDING", "COMPLETED", "FAILED"
|
||||
stripeTxId String? // ID de la transaction de crédit Stripe si applicable
|
||||
createdAt DateTime @default(now())
|
||||
|
||||
user User @relation(fields: [userId], references: [id], onDelete: Cascade)
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3. Le Parcours Utilisateur pas à pas
|
||||
|
||||
### 3.1 Génération et Partage du Lien
|
||||
1. Chaque utilisateur inscrit reçoit automatiquement un code unique lors de la création de son compte (généré à partir de son nom + 4 chiffres uniques, ou un cuid court).
|
||||
2. Un nouvel onglet **"Parrainage"** est ajouté dans `/settings/billing` :
|
||||
- Affiche son code promo de parrainage : `MOMENTO-SEPEHR-1234`
|
||||
- Affiche son lien d'invitation unique : `https://memento-note.com/signup?ref=MOMENTO-SEPEHR-1234`
|
||||
- Affiche un bouton de partage rapide (LinkedIn, X, Email, Clipboard).
|
||||
|
||||
### 3.2 Inscription du Filleul (Cookie & localStorage)
|
||||
1. Le filleul clique sur le lien `https://memento-note.com/signup?ref=MOMENTO-SEPEHR-1234`.
|
||||
2. Le frontend intercepte le paramètre `ref` dans l'URL et le stocke de manière persistante dans un cookie ou dans le `localStorage` (durée : 30 jours).
|
||||
3. Lorsque le filleul valide son formulaire d'inscription :
|
||||
- Le serveur lit le code promo de parrainage dans la requête.
|
||||
- S'il est valide, il associe le `referredById` du nouveau compte `User` à l'ID du parrain.
|
||||
|
||||
### 3.3 Achat de l'Abonnement et Déclenchement de la Récompense
|
||||
1. Lors du checkout sur le plan Pro, le filleul utilise le code promo Stripe `MOMENTO-SEPEHR-1234` (qui est configuré dans votre Stripe Dashboard comme un code promotionnel avec une réduction de 10%).
|
||||
2. Une fois le paiement validé, Stripe émet l'événement `checkout.session.completed` à notre webhook `/api/billing/webhook`.
|
||||
3. Notre helper `sync-subscription-from-stripe.ts` traite l'activation de l'abonnement :
|
||||
- Il vérifie en base de données si le nouvel abonné possède un parrain (`referredById !== null`).
|
||||
- Il vérifie si une récompense pour ce couple Parrain/Filleul a déjà été créée (évite le double-déclenchement).
|
||||
- Il déclenche la distribution des récompenses.
|
||||
|
||||
---
|
||||
|
||||
## 4. Implémentation Technique des Récompenses
|
||||
|
||||
### Option A (Recommandée) : Offrir 1 mois gratuit sur Stripe au Parrain
|
||||
Pour récompenser le parrain de manière entièrement automatisée, nous utilisons le système de **Solde Client (Customer Balance)** de Stripe. On ajoute un crédit négatif (ex. `-9.90 €`) sur le compte client Stripe du parrain. Lors de son prochain renouvellement, Stripe déduira automatiquement ce crédit, ce qui lui offrira son mois gratuit.
|
||||
|
||||
```typescript
|
||||
// lib/billing/referral.ts
|
||||
|
||||
import { stripe } from '@/lib/stripe';
|
||||
import { prisma } from '@/lib/prisma';
|
||||
|
||||
export async function processReferralReward(refereeUserId: string) {
|
||||
// 1. Récupérer le filleul et son parrain
|
||||
const referee = await prisma.user.findUnique({
|
||||
where: { id: refereeUserId },
|
||||
include: { subscription: true }
|
||||
});
|
||||
|
||||
if (!referee || !referee.referredById) return;
|
||||
|
||||
const parrainId = referee.referredById;
|
||||
|
||||
// 2. Vérifier si la récompense est déjà octroyée
|
||||
const existingReward = await prisma.referralReward.findFirst({
|
||||
where: { userId: parrainId, refereeId: refereeUserId }
|
||||
});
|
||||
if (existingReward) return;
|
||||
|
||||
// 3. Récupérer l'abonnement Stripe du parrain
|
||||
const parrainSub = await prisma.subscription.findUnique({
|
||||
where: { userId: parrainId }
|
||||
});
|
||||
|
||||
if (!parrainSub || !parrainSub.stripeCustomerId) {
|
||||
// Si le parrain n'est pas encore client Stripe ou n'a pas d'abonnement actif,
|
||||
// on peut lui créditer des crédits IA en bonus à la place
|
||||
await awardAiCredits(parrainId, 200); // ex: +200 crédits IA
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
// 4. Créer une transaction de solde Stripe (Créditer son compte de 9,90 €)
|
||||
const amountInCents = 990; // Le prix du plan PRO
|
||||
const balanceTransaction = await stripe.customers.createBalanceTransaction(
|
||||
parrainSub.stripeCustomerId,
|
||||
{
|
||||
amount: -amountInCents, // Un montant NÉGATIF crédite le client Stripe
|
||||
currency: 'eur',
|
||||
description: `Récompense de parrainage pour l'invitation de ${referee.email}`,
|
||||
}
|
||||
);
|
||||
|
||||
// 5. Enregistrer la récompense dans notre base PostgreSQL
|
||||
await prisma.referralReward.create({
|
||||
data: {
|
||||
userId: parrainId,
|
||||
refereeId: refereeUserId,
|
||||
rewardType: 'FREE_MONTH',
|
||||
status: 'COMPLETED',
|
||||
stripeTxId: balanceTransaction.id
|
||||
}
|
||||
});
|
||||
|
||||
console.log(`[Referral] Parrain ${parrainId} récompensé avec succès d'un mois gratuit !`);
|
||||
} catch (err) {
|
||||
console.error('[Referral] Erreur lors de l\'octroi du crédit Stripe :', err);
|
||||
|
||||
await prisma.referralReward.create({
|
||||
data: {
|
||||
userId: parrainId,
|
||||
refereeId: refereeUserId,
|
||||
rewardType: 'FREE_MONTH',
|
||||
status: 'FAILED'
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Option B : Offrir des crédits IA (Redis) au Parrain
|
||||
Si le parrain a un compte gratuit, on peut simplement augmenter son quota de crédits IA ou lui offrir des crédits "boost" à vie.
|
||||
|
||||
```typescript
|
||||
// lib/billing/referral.ts
|
||||
import { redis } from '@/lib/redis';
|
||||
|
||||
async function awardAiCredits(userId: string, amount: number) {
|
||||
// Ajouter des crédits bonus dans Redis pour la période en cours
|
||||
const period = getCurrentPeriodKey();
|
||||
const key = `usage:${userId}:semantic_search:bonus`;
|
||||
await redis.incrby(key, amount);
|
||||
|
||||
await prisma.referralReward.create({
|
||||
data: {
|
||||
userId,
|
||||
refereeId: refereeUserId,
|
||||
rewardType: 'AI_CREDITS',
|
||||
status: 'COMPLETED'
|
||||
}
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. Intégration Webhook Stripe (Finalisation)
|
||||
|
||||
Dans le webhook `app/api/billing/webhook/route.ts`, lors du traitement de `checkout.session.completed`, il suffit d'appeler notre fonction de parrainage :
|
||||
|
||||
```typescript
|
||||
// app/api/billing/webhook/route.ts
|
||||
|
||||
if (event.type === 'checkout.session.completed') {
|
||||
const session = event.data.object as Stripe.Checkout.Session;
|
||||
const userId = session.metadata?.userId;
|
||||
|
||||
if (userId) {
|
||||
// 1. Synchroniser l'abonnement
|
||||
await syncSubscriptionFromStripe(subscription, userId);
|
||||
|
||||
// 2. Traiter le parrainage si applicable
|
||||
await processReferralReward(userId);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 6. Plan de Lancement & Coupon Stripe (No-Code)
|
||||
|
||||
Pour que ce système fonctionne immédiatement :
|
||||
1. Créez un **Coupon** général de `10%` sur Stripe nommé "Parrainage Filleul".
|
||||
2. Dans Stripe, créez un **Code de Promotion orienté client** attaché à ce coupon.
|
||||
3. Configurez ce code promo avec le motif suivant : **Autoriser les codes de promotion générés par les utilisateurs** ou créez un code parrain par défaut.
|
||||
4. Dans le code de l'application, nous générons automatiquement le code de parrainage de l'utilisateur lors de son premier partage et l'associons à son compte.
|
||||
@@ -1,6 +1,6 @@
|
||||
# generated: 2026-05-14T16:06:50Z
|
||||
# last_updated: 2026-05-23T14:25:15Z
|
||||
# project: Momento
|
||||
# project: Memento
|
||||
# project_key: NOKEY
|
||||
# tracking_system: file-system
|
||||
# story_location: docs
|
||||
@@ -35,14 +35,14 @@
|
||||
# - Dev moves story to 'review', then runs code-review (fresh context, different LLM recommended)
|
||||
|
||||
generated: 2026-05-14T16:06:50Z
|
||||
last_updated: 2026-05-23T20:03:48Z
|
||||
project: Momento
|
||||
last_updated: 2026-06-28T16:45:00Z
|
||||
project: Memento
|
||||
project_key: NOKEY
|
||||
tracking_system: file-system
|
||||
story_location: docs
|
||||
|
||||
development_status:
|
||||
epic-3: in-progress
|
||||
epic-3: done
|
||||
3-1-freemium-quota-tracking: done
|
||||
3-2-custom-llm-router: done
|
||||
3-3-smart-routing-fallback: done
|
||||
@@ -50,15 +50,25 @@ development_status:
|
||||
3-5-secure-byok-management: done
|
||||
3-6-stripe-subscription-tiers: done
|
||||
epic-3-retrospective: optional
|
||||
epic-4: in-progress
|
||||
epic-4: done
|
||||
4-1-gdpr-cookie-consent: done
|
||||
4-2-gdpr-right-to-be-forgotten: done
|
||||
4-3-data-portability: done
|
||||
4-4-explicit-ai-consent: done
|
||||
4-5-eu-data-residency: backlog
|
||||
4-6-sso-saml-audit-logging: backlog
|
||||
4-5-eu-data-residency: done
|
||||
4-6-sso-saml-audit-logging: done
|
||||
epic-4-retrospective: optional
|
||||
epic-5: in-progress
|
||||
5-1-nextgen-editor: ready-for-dev
|
||||
epic-5: done
|
||||
5-1-nextgen-editor: done
|
||||
epic-5-retrospective: optional
|
||||
|
||||
# Epic 6 — Croissance & Activation (PLG) — ajouté 2026-05-29
|
||||
epic-6: done
|
||||
6-1-onboarding-activation: done # story-onboarding-activation.md
|
||||
6-2-markdown-roundtrip: done # brief-markdown-roundtrip.md
|
||||
6-3-brainstorm-canvas-finalize: done # story: 6-3-brainstorm-canvas-finalize.md
|
||||
6-4-chat-with-pdf: done # already implemented: document-qa-overlay.tsx + document-ingestion + document-search tool
|
||||
6-5-pptx-export-watermark: done # story: 6-5-pptx-export-watermark.md
|
||||
epic-6-retrospective: optional
|
||||
|
||||
|
||||
|
||||
@@ -62,7 +62,7 @@ This story transforms the admin console into a **production-ready management das
|
||||
- **When** I scroll below the metric cards
|
||||
- **Then** I see a 7-day area chart showing daily AI requests (sourced from `UsageLog` grouped by `periodStart` day)
|
||||
- **And** I see a user growth line chart (users created per day, last 30 days)
|
||||
- **And** charts use Recharts (already a dependency — verify) with the Momento color palette:
|
||||
- **And** charts use Recharts (already a dependency — verify) with the Memento color palette:
|
||||
- Line/area: `#ACB995` (sage) or `#D4A373` (ochre)
|
||||
- Grid: `border-border/40`
|
||||
- Labels: `text-[11px] text-muted-foreground`
|
||||
@@ -251,8 +251,8 @@ This story transforms the admin console into a **production-ready management das
|
||||
| `app/(admin)/admin/usage/page.tsx` | Usage analytics page |
|
||||
| `app/(admin)/admin/usage/usage-client.tsx` | Usage analytics client component (charts) |
|
||||
| `components/admin/user-detail-drawer.tsx` | Slide-in user detail panel |
|
||||
| `components/admin/charts/area-chart.tsx` | Recharts wrapper with Momento theme |
|
||||
| `components/admin/charts/bar-chart.tsx` | Recharts wrapper with Momento theme |
|
||||
| `components/admin/charts/area-chart.tsx` | Recharts wrapper with Memento theme |
|
||||
| `components/admin/charts/bar-chart.tsx` | Recharts wrapper with Memento theme |
|
||||
| `app/actions/admin-subscriptions.ts` | Server actions: getSubscriptions, cancelSubscription, getSubscriptionSummary |
|
||||
| `app/actions/admin-usage.ts` | Server actions: getUsageAggregate, getUsageByFeature, getTopUsers, getDailyUsage |
|
||||
| `app/actions/admin-feature-flags.ts` | Server actions: getFeatureFlags, createFeatureFlag, updateFeatureFlag, deleteFeatureFlag |
|
||||
|
||||
761
docs/story-chunk-embeddings.md
Normal file
761
docs/story-chunk-embeddings.md
Normal file
@@ -0,0 +1,761 @@
|
||||
# Story: Embeddings par Fragments — Indexation Sémantique Multi-Niveaux
|
||||
|
||||
> **Epic:** Fondation IA — Recherche & Insights Sémantiques
|
||||
> **ID:** US-CHUNK-EMBEDDINGS
|
||||
> **Priority:** Critical — Fondation pour Workstreams B (AI Overview), Memory Echo précis, Insights
|
||||
> **Status:** ready-for-dev
|
||||
> **Depends on:** pgvector existant (✅), `embedding.service.ts` (✅), `NoteEmbedding` (✅)
|
||||
> **Blocks:** US-AI-OVERVIEW, US-CALENDAR (indépendant), qualité Memory Echo et Insights
|
||||
> **Inspiration:** AppFlowy `flowy-ai/src/embeddings/` — chunking + dedup par hash de contenu
|
||||
|
||||
---
|
||||
|
||||
## Contexte
|
||||
|
||||
### Problème actuel
|
||||
|
||||
Memento stocke **un seul vecteur par note** (`NoteEmbedding` dans `prisma/schema.prisma:366-374`). L'embedding est généré par `EmbeddingService.generateNoteEmbedding()` (`lib/ai/services/embedding.service.ts:43-63`) qui :
|
||||
|
||||
1. Concatène titre + corps en plain text
|
||||
2. Découpe en chunks de 6000 chars (`splitPlainTextForEmbeddingChunks`)
|
||||
3. Embed chaque chunk via l'API
|
||||
4. **Mean-pool** les vecteurs en un seul vecteur moyen
|
||||
|
||||
Cette approche a trois limites majeures :
|
||||
|
||||
| Limite | Impact |
|
||||
|--------|--------|
|
||||
| **Perte de précision** — une note de 5000 mots sur 10 sujets différents a un vecteur moyen flou | Memory Echo rate les connexions spécifiques à une section |
|
||||
| **Re-embed complet à chaque modif** — corriger une typo re-embedde toute la note | Coût API × nombre d'éditions ; latence inutile |
|
||||
| **Pas de snippets de match** — la recherche retourne un score global mais pas le passage précis | L'utilisateur ne sait pas *pourquoi* une note match |
|
||||
|
||||
### Solution proposée
|
||||
|
||||
Inspiré d'AppFlowy (`flowy-ai/src/embeddings/document_indexer.rs`, `scheduler.rs`) :
|
||||
|
||||
1. **Découper chaque note en fragments sémantiques** (~1000 chars, coupure aux limites de paragraphes)
|
||||
2. **Embedder chaque fragment indépendamment** dans une nouvelle table `NoteEmbeddingChunk`
|
||||
3. **Hasher le contenu de chaque fragment** (`sha256`) pour ne re-embed que les fragments modifiés
|
||||
4. **Rechercher au niveau fragment** avec agrégation par note → snippets précis en résultat
|
||||
5. **Garder `NoteEmbedding` existant** pour rétro-compat (recherche globale, clustering)
|
||||
|
||||
### Comparaison AppFlowy → Memento
|
||||
|
||||
| Aspect | AppFlowy (Rust) | Memento (TypeScript) |
|
||||
|--------|-----------------|---------------------|
|
||||
| Chunking | `text_splitter` crate, 1000 chars / 200 overlap | `lib/text/note-chunking.ts`, même valeurs |
|
||||
| Hash | `xxhash64` (Rust) | `crypto.createHash('sha256')` (Node natif) |
|
||||
| Vector DB | SQLite-vec (local) | pgvector (PostgreSQL, déjà en prod) |
|
||||
| Scheduler | Tokio channels (generate → write) | `p-queue` ou Bull (Redis déjà présent) |
|
||||
| Dedup | Compare `fragment_id` en DB | Identique — `@@unique([noteId, fragmentId])` |
|
||||
| Embedding model | `nomic-embed-text` (Ollama local) | `text-embedding-3-small` (OpenAI, déjà configuré) |
|
||||
|
||||
---
|
||||
|
||||
## Migration Prisma requise
|
||||
|
||||
```prisma
|
||||
model NoteEmbeddingChunk {
|
||||
id String @id @default(cuid())
|
||||
noteId String
|
||||
fragmentId String // sha256(noteId + content) — stable pour le dedup
|
||||
chunkIndex Int // ordre du fragment dans la note
|
||||
content String // texte plain du fragment (~1000 chars)
|
||||
charCount Int // longueur du fragment (audit / debug)
|
||||
embedding Unsupported("vector(1536)")?
|
||||
embeddingModel String? @default("text-embedding-3-small")
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
|
||||
note Note @relation(fields: [noteId], references: [id], onDelete: Cascade)
|
||||
|
||||
@@unique([noteId, fragmentId])
|
||||
@@index([noteId])
|
||||
@@index([fragmentId])
|
||||
}
|
||||
```
|
||||
|
||||
> ⚠️ **Migration additive uniquement** — safe, pas de perte de données. La table `NoteEmbedding` existante est conservée intacte.
|
||||
|
||||
### Étapes de migration
|
||||
|
||||
1. **Dump DB obligatoire** : `bash /home/devparsa/dev/Memento/dump-db.sh` — vérifier ≥1Mo — « OUI » explicite utilisateur
|
||||
2. `npx prisma migrate dev --name add_note_embedding_chunks`
|
||||
3. Créer l'index HNSW sur la colonne `embedding` :
|
||||
```sql
|
||||
CREATE INDEX "NoteEmbeddingChunk_embedding_hnsw_idx"
|
||||
ON "NoteEmbeddingChunk"
|
||||
USING hnsw ("embedding" vector_cosine_ops)
|
||||
WITH (m = 16, ef_construction = 64);
|
||||
```
|
||||
> L'index HNSW doit être créé manuellement (Prisma ne gère pas les index vectoriels). À mettre dans la migration SQL brute.
|
||||
|
||||
---
|
||||
|
||||
## User Stories
|
||||
|
||||
### US-CHUNK-1 : Chunking sémantique d'une note
|
||||
|
||||
**En tant que** système d'indexation,
|
||||
**Je veux** découper le contenu d'une note en fragments sémantiques cohérents,
|
||||
**Afin de** produire des embeddings précis au niveau section plutôt qu'au niveau note entière.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** une note avec un titre et un contenu HTML/plain
|
||||
- **Quand** le service de chunking est appelé
|
||||
- **Alors** le contenu est converti en plain text (via `stripHtmlToPlainText` existant)
|
||||
- **Et** découpé aux limites de paragraphes (`\n\n`) en groupes de ~1000 caractères max
|
||||
- **Et** chaque fragment chevauche le précédent de ~200 caractères (préserve le contexte aux frontières)
|
||||
- **Et** chaque fragment reçoit un `fragmentId` = `sha256(noteId + "::" + fragmentContent)` (stable, déterministe)
|
||||
- **Et** si un paragraphe dépasse 1000 chars, il est sous-découpé à la phrase la plus proche (regex sur `. ! ? ؟ !。`)
|
||||
- **Et** si le contenu total fait moins de 1000 chars, un seul fragment est produit
|
||||
- **Et** les fragments vides (< 10 chars après trim) sont filtrés
|
||||
|
||||
#### Paramètres de chunking :
|
||||
|
||||
```typescript
|
||||
const CHUNK_TARGET_CHARS = 1000 // taille cible par fragment
|
||||
const CHUNK_OVERLAP_CHARS = 200 // chevauchement entre fragments consécutifs
|
||||
const MIN_FRAGMENT_CHARS = 10 // en dessous, le fragment est ignoré
|
||||
const MAX_PARAGRAPH_SPLIT = 1500 // au-dessus, un paragraphe est sous-découpé
|
||||
```
|
||||
|
||||
> Ces valeurs sont alignées sur AppFlowy (`document_indexer.rs:31`) et la recherche RAG standard (medium chunks 256-1024 tokens).
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-2 : Indexation incrémentale avec dedup
|
||||
|
||||
**En tant que** système,
|
||||
**Je veux** ne re-embed que les fragments qui ont réellement changé,
|
||||
**Afin de** réduire le coût API et la latence lors des éditions mineures.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** une note qui a déjà des fragments indexés en DB
|
||||
- **Quand** l'utilisateur modifie un paragraphe et sauvegarde
|
||||
- **Alors** le service :
|
||||
1. Récupère les `fragmentId`s existants : `SELECT fragmentId FROM "NoteEmbeddingChunk" WHERE noteId = $1`
|
||||
2. Chunk le contenu actuel → produit de nouveaux fragments avec leurs `fragmentId`s
|
||||
3. Compare les hash :
|
||||
- **Fragments inchangés** (hash identique) → **skip**, pas d'embed
|
||||
- **Fragments nouveaux** (hash absent en DB) → **embed et insère**
|
||||
- **Fragments supprimés** (hash en DB mais absent des nouveaux) → **DELETE de la DB**
|
||||
4. Embed uniquement les fragments nouveaux (batch de max 100 fragments par appel API)
|
||||
5. Insère en DB via upsert transactionnel
|
||||
- **Et** si l'utilisateur corrige une typo dans un paragraphe, seul ce fragment est re-embeddé (pas toute la note)
|
||||
- **Et** si l'utilisateur ajoute un nouveau paragraphe à la fin, seul le nouveau fragment est embeddé
|
||||
- **Et** les fragments supprimés sont nettoyés (pas d'orphelins)
|
||||
|
||||
#### Gestion de la concurrence :
|
||||
|
||||
- Utiliser un **verrou par noteId** (mutex en mémoire ou lock Redis `lock:chunk-index:{noteId}`)
|
||||
- Si une indexation est déjà en cours pour cette note, la nouvelle requête est mise en file d'attente (ou débounce 3s puis prend le relais)
|
||||
- Pas de race condition sur les upserts (`@@unique([noteId, fragmentId])` + `ON CONFLICT DO UPDATE`)
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-3 : Pipeline d'indexation asynchrone
|
||||
|
||||
**En tant que** système,
|
||||
**Je veux** que l'indexation des fragments se fasse en arrière-plan sans bloquer la sauvegarde,
|
||||
**Afin de** préserver la fluidité de l'édition.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Quand** une note est sauvegardée (débounce existant dans le flow de save)
|
||||
- **Alors** l'indexation est déclenchée **de manière asynchrone** (fire-and-forget côté serveur)
|
||||
- **Et** l'utilisateur ne perçoit aucune latence liée à l'embedding
|
||||
- **Et** l'indexation utilise une **queue avec concurrence limitée** (max 4 embeddings simultanés) pour éviter le rate-limit API
|
||||
- **Et** en cas d'erreur API (rate limit, timeout), le fragment est **réessayé** avec backoff exponentiel (3 tentatives max)
|
||||
- **Et** en cas d'échec définitif, l'erreur est loggée mais ne bloque pas l'application
|
||||
|
||||
#### Implémentation de la queue :
|
||||
|
||||
Utiliser `p-queue` (léger, pas de dépendance Redis supplémentaire) ou Bull (Redis déjà présent à `memento-redis:6379`). Préférer **`p-queue`** pour simplicité — un singleton process-level :
|
||||
|
||||
```typescript
|
||||
import PQueue from 'p-queue'
|
||||
const chunkEmbeddingQueue = new PQueue({ concurrency: 4 })
|
||||
```
|
||||
|
||||
> Si Memento passe multi-process (PM2 cluster), migrer vers Bull. Pour l'instant, single-process Next.js → `p-queue` suffit.
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-4 : Recherche sémantique au niveau fragment
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** que la recherche sémantique trouve des passages précis dans mes notes,
|
||||
**Afin de** comprendre pourquoi une note correspond à ma recherche.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** que l'utilisateur saisit une requête dans la SearchModal
|
||||
- **Quand** la recherche sémantique s'exécute
|
||||
- **Alors** le système effectue **deux recherches en parallèle** :
|
||||
1. **Recherche fragment-level** (nouvelle) : `pgvector` sur `NoteEmbeddingChunk.embedding`
|
||||
2. **Recherche note-level** (existante) : `pgvector` sur `NoteEmbedding.embedding` + FTS `tsvector`
|
||||
- **Et** les résultats sont fusionnés via RRF (Reciprocal Rank Fusion, déjà implémenté dans `semantic-search.service.ts`)
|
||||
- **Et** chaque résultat inclut désormais un champ `matchedSnippets: string[]` (top 3 fragments par score, max 200 chars chacun, avec `...` aux coupures)
|
||||
- **Et** les snippets sont affichés dans l'UI de recherche sous le titre de la note (mise en gras du terme si présent)
|
||||
|
||||
#### Requête SQL fragment-level :
|
||||
|
||||
```sql
|
||||
-- Recherche vectorielle au niveau fragment, agrégée par note
|
||||
WITH chunk_scores AS (
|
||||
SELECT
|
||||
c."noteId",
|
||||
MAX(1 - (c."embedding"::vector <=> $1::vector)) AS best_score,
|
||||
ARRAY_AGG(c.content ORDER BY 1 - (c."embedding"::vector <=> $1::vector) DESC) AS ranked_contents
|
||||
FROM "NoteEmbeddingChunk" c
|
||||
JOIN "Note" n ON n.id = c."noteId"
|
||||
WHERE n."userId" = $2
|
||||
AND c."embedding" IS NOT NULL
|
||||
AND 1 - (c."embedding"::vector <=> $1::vector) >= $3 -- threshold
|
||||
GROUP BY c."noteId"
|
||||
LIMIT $4
|
||||
)
|
||||
SELECT
|
||||
cs."noteId",
|
||||
cs.best_score,
|
||||
cs.ranked_contents[1:3] AS top_snippets -- top 3 fragments
|
||||
FROM chunk_scores cs
|
||||
ORDER BY cs.best_score DESC
|
||||
```
|
||||
|
||||
> Le `[1:3]` est du slicing PostgreSQL natif sur les arrays. Chaque snippet est tronqué à 200 chars côté application.
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-5 : Memory Echo précis au niveau fragment
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** que Memory Echo détecte des connexions entre sections spécifiques de notes,
|
||||
**Afin de** découvrir des résonances même entre notes majoritairement différentes.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** deux notes A et B indexées en fragments
|
||||
- **Quand** Memory Echo calcule la similarité entre A et B
|
||||
- **Alors** au lieu de comparer `embedding(A)` vs `embedding(B)` (note entière)
|
||||
- **Le système compare** la **meilleure paire de fragments** : `MAX(similarity(fragmentAi, fragmentBj))` sur tous les cross-joins
|
||||
- **Et** si la meilleure paire dépasse le seuil (`SEMANTIC_SIMILARITY_FLOOR`), une connexion est créée
|
||||
- **Et** l'insight Memory Echo affiche le **snippet précis** qui a résonné (pas juste le score global)
|
||||
- **Et** le filtre temporel (`MIN_DAYS_APART`) reste identique
|
||||
|
||||
#### Requête SQL (cross-join fragment) :
|
||||
|
||||
```sql
|
||||
SELECT
|
||||
a."noteId" AS note1_id,
|
||||
b."noteId" AS note2_id,
|
||||
MAX(1 - (a."embedding"::vector <=> b."embedding"::vector)) AS best_fragment_similarity,
|
||||
-- Récupérer le contenu des fragments qui matchent le mieux
|
||||
(
|
||||
SELECT a2.content
|
||||
FROM "NoteEmbeddingChunk" a2
|
||||
WHERE a2."noteId" = a."noteId"
|
||||
AND 1 - (a2."embedding"::vector <=> b."embedding"::vector) = MAX(1 - (a."embedding"::vector <=> b."embedding"::vector))
|
||||
LIMIT 1
|
||||
) AS note1_snippet,
|
||||
(
|
||||
SELECT b2.content
|
||||
FROM "NoteEmbeddingChunk" b2
|
||||
WHERE b2."noteId" = b."noteId"
|
||||
AND 1 - (a2."embedding"::vector <=> b2."embedding"::vector) = MAX(...)
|
||||
LIMIT 1
|
||||
) AS note2_snippet
|
||||
FROM "NoteEmbeddingChunk" a
|
||||
JOIN "NoteEmbeddingChunk" b ON a."noteId" < b."noteId" -- évite les doublons et self-joins
|
||||
JOIN "Note" na ON na.id = a."noteId"
|
||||
JOIN "Note" nb ON nb.id = b."noteId"
|
||||
WHERE na."userId" = $1
|
||||
AND nb."userId" = $1
|
||||
AND a."embedding" IS NOT NULL
|
||||
AND b."embedding" IS NOT NULL
|
||||
GROUP BY a."noteId", b."noteId"
|
||||
HAVING MAX(1 - (a."embedding"::vector <=> b."embedding"::vector)) >= $2
|
||||
```
|
||||
|
||||
> ⚠️ **Performance** : ce cross-join est coûteux. L'exécuter uniquement pour la note qui vient d'être indexée (pas sur toutes les paires à chaque fois). Pour la note N nouvellement indexée : `JOIN` ses fragments contre TOUS les autres fragments, `MAX()` par noteId cible, filtrer par seuil.
|
||||
|
||||
#### Flux Memory Echo mis à jour :
|
||||
|
||||
```
|
||||
Note N sauvegardée → chunks indexés → pour chaque autre note M :
|
||||
best_similarity = MAX over (fragment_N_i, fragment_M_j)
|
||||
if best_similarity >= THRESHOLD and passesTimeDiversityFilter(N, M):
|
||||
create MemoryEchoInsight with note1_snippet + note2_snippet
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-6 : Migration rétroactive des notes existantes
|
||||
|
||||
**En tant qu'** admin/système,
|
||||
**Je veux** indexer en fragments toutes les notes qui ont déjà un embedding global,
|
||||
**Afin de** bénéficier de la précision fragment-level sur le corpus existant.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** que des notes ont un `NoteEmbedding` mais pas de `NoteEmbeddingChunk`
|
||||
- **Quand** l'admin lance le script de migration
|
||||
- **Alors** pour chaque note (batch de 50) :
|
||||
1. Récupérer le plain text (titre + corps)
|
||||
2. Chunker en fragments
|
||||
3. Embedder chaque fragment (respect du rate-limit API)
|
||||
4. Insérer en DB
|
||||
- **Et** une barre de progression affiche : `1234 / 5678 notes (21%) — ETA: ~8 min`
|
||||
- **Et** le script est **interruptible** (Ctrl+C safe — reprend là où il s'est arrêté via un checkpoint)
|
||||
- **Et** le script est **idempotent** (les notes déjà chunkées sont skip)
|
||||
- **Et** le script logge les erreurs par note mais continue
|
||||
- **Et** le coût API estimé est affiché avant confirmation
|
||||
|
||||
#### Script :
|
||||
|
||||
```bash
|
||||
# Lancement manuel (pas en CI)
|
||||
npx tsx scripts/migrate-chunk-embeddings.ts --batch-size=50 --concurrency=4
|
||||
```
|
||||
|
||||
#### Estimation de coût :
|
||||
|
||||
- ~1 note moyenne = ~3000 chars = ~4 fragments
|
||||
- `text-embedding-3-small` : $0.02 / 1M tokens ≈ $0.02 / 750K chars
|
||||
- 1000 notes × 4 fragments × 1000 chars = 4M chars ≈ $0.10
|
||||
- **Négligeable** pour la plupart des corpus
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-7 : Affichage des snippets dans la SearchModal
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** voir les passages précis qui correspondent à ma recherche,
|
||||
**Afin de** évaluer rapidement la pertinence d'un résultat.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Étant donné** des résultats de recherche avec `matchedSnippets`
|
||||
- **Quand** ils sont affichés dans la SearchModal
|
||||
- **Alors** sous chaque titre de note, les top 1-2 snippets sont affichés (max 150 chars visibles, `...` aux coupures)
|
||||
- **Et** le terme de recherche est **surligné en gras** dans les snippets
|
||||
- **Et** les snippets sont en couleur secondaire (text-muted, plus petit que le titre)
|
||||
- **Et** si aucun snippet fragment-level n'est disponible (note pas encore migrée), le comportement actuel est conservé (extrait du début de la note)
|
||||
|
||||
#### Design :
|
||||
|
||||
- Consulter le prototype `architectural-grid/` → `SearchModal` pour le design exact des snippets dans les résultats
|
||||
- Style Google-like : snippet gris sous le titre, terme de recherche en gras
|
||||
|
||||
---
|
||||
|
||||
### US-CHUNK-8 : Nettoyage à la suppression de note
|
||||
|
||||
**En tant que** système,
|
||||
**Je veux** que les fragments d'une note supprimée soient automatiquement supprimés,
|
||||
**Afin de** ne pas laisser de vecteurs orphelins.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
|
||||
- **Quand** une note est supprimée
|
||||
- **Alors** tous ses `NoteEmbeddingChunk` sont supprimés en cascade (`onDelete: Cascade` dans le schéma Prisma)
|
||||
- **Et** aucun vecteur orphelin ne subsiste
|
||||
- **Et** les Memory Echo référençant cette note sont nettoyés (comportement existant)
|
||||
|
||||
> Le `onDelete: Cascade` sur la relation `note` dans le schéma gère cela automatiquement au niveau DB.
|
||||
|
||||
---
|
||||
|
||||
## Fichiers à créer / modifier
|
||||
|
||||
| Fichier | Action | Notes |
|
||||
|---------|--------|-------|
|
||||
| `prisma/schema.prisma` | Modifier | Ajouter modèle `NoteEmbeddingChunk` + relation inverse sur `Note` |
|
||||
| `prisma/migrations/xxx_add_note_embedding_chunks/` | Créer | Migration + SQL brut pour index HNSW |
|
||||
| `lib/text/note-chunking.ts` | **Créer** | Logique de chunking sémantique + hash |
|
||||
| `lib/ai/services/chunk-indexing.service.ts` | **Créer** | Service d'indexation incrémentale (dedup, queue, retry) |
|
||||
| `lib/ai/services/semantic-search.service.ts` | Modifier | Ajouter `vectorChunkSearch()` + fusion RRF avec existant + snippets |
|
||||
| `lib/ai/services/memory-echo.service.ts` | Modifier | Similarité au niveau fragment + snippets dans insights |
|
||||
| `lib/ai/services/embedding.service.ts` | Modifier | Ajouter `generateChunkEmbeddings(texts: string[])` (batch optimisé) |
|
||||
| `app/api/notes/[id]/route.ts` (ou hook de save) | Modifier | Déclencher `chunkIndexingService.indexNote()` après save |
|
||||
| `components/search/search-result-item.tsx` (ou équivalent) | Modifier | Afficher `matchedSnippets` |
|
||||
| `scripts/migrate-chunk-embeddings.ts` | **Créer** | Script de migration rétroactive avec checkpoint |
|
||||
| `locales/en.json` + `locales/fr.json` | Modifier | Clés `search.snippets.*` (minimal) |
|
||||
|
||||
---
|
||||
|
||||
## Architecture technique
|
||||
|
||||
### Pipeline d'indexation (flow complet)
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ Éditeur (TipTap) │
|
||||
│ User tape → debounce 2s → POST /api/notes/[id] (save) │
|
||||
└──────────────────────────┬──────────────────────────────────────┘
|
||||
│
|
||||
▼
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ Note Save Handler (server-side) │
|
||||
│ 1. Sauvegarde contenu en DB (existant) │
|
||||
│ 2. Re-embed NoteEmbedding global (existant, conservé) │
|
||||
│ 3. fire-and-forget → chunkIndexingService.indexNote(noteId) │
|
||||
└──────────────────────────┬──────────────────────────────────────┘
|
||||
│ (async, non-bloquant)
|
||||
▼
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ ChunkIndexingService.indexNote(noteId) │
|
||||
│ ┌─────────────────────────────────────────────────────────┐ │
|
||||
│ │ 1. Récupérer note (title + content) depuis DB │ │
|
||||
│ │ 2. plain = prepareNoteTextForEmbedding(title, content) │ │
|
||||
│ │ 3. chunks = chunkNoteContent(noteId, plain) │ │
|
||||
│ │ → [{fragmentId, content, chunkIndex}, ...] │ │
|
||||
│ │ 4. existingIds = SELECT fragmentId WHERE noteId │ │
|
||||
│ │ 5. newChunks = chunks WHERE fragmentId NOT IN existing │ │
|
||||
│ │ 6. staleIds = existingIds NOT IN chunks.fragmentIds │ │
|
||||
│ │ 7. DELETE WHERE noteId AND fragmentId IN staleIds │ │
|
||||
│ │ 8. Queue: embed newChunks → INSERT │ │
|
||||
│ └─────────────────────────────────────────────────────────┘ │
|
||||
└──────────────────────────┬──────────────────────────────────────┘
|
||||
│
|
||||
▼
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ p-queue (concurrency: 4) │
|
||||
│ Pour chaque nouveau fragment : │
|
||||
│ embedding = await embeddingService.embedPlainText(content) │
|
||||
│ INSERT INTO NoteEmbeddingChunk (fragmentId, content, │
|
||||
│ embedding, ...) ON CONFLICT DO UPDATE │
|
||||
│ Retry: 3 tentatives, backoff exponentiel (1s, 2s, 4s) │
|
||||
└─────────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
### Chunking — algorithme détaillé
|
||||
|
||||
```typescript
|
||||
// lib/text/note-chunking.ts
|
||||
|
||||
import { createHash } from 'crypto'
|
||||
|
||||
const CHUNK_TARGET_CHARS = 1000
|
||||
const CHUNK_OVERLAP_CHARS = 200
|
||||
const MIN_FRAGMENT_CHARS = 10
|
||||
const MAX_PARAGRAPH_BEFORE_SPLIT = 1500
|
||||
|
||||
export interface NoteChunk {
|
||||
fragmentId: string
|
||||
content: string
|
||||
chunkIndex: number
|
||||
charCount: number
|
||||
}
|
||||
|
||||
/**
|
||||
* Découpe une note en fragments sémantiques.
|
||||
* Port TS de flowy-ai/src/embeddings/document_indexer.rs
|
||||
*/
|
||||
export function chunkNoteContent(
|
||||
noteId: string,
|
||||
plainText: string,
|
||||
): NoteChunk[] {
|
||||
const normalized = plainText.trim()
|
||||
if (normalized.length < MIN_FRAGMENT_CHARS) return []
|
||||
|
||||
// 1. Split par paragraphes (double newline)
|
||||
const paragraphs = normalized
|
||||
.split(/\n\s*\n/)
|
||||
.map((p) => p.trim())
|
||||
.filter((p) => p.length >= MIN_FRAGMENT_CHARS)
|
||||
|
||||
if (paragraphs.length === 0) return []
|
||||
|
||||
// 2. Sous-découper les paragraphes trop longs
|
||||
const atomicParagraphs: string[] = []
|
||||
for (const para of paragraphs) {
|
||||
if (para.length > MAX_PARAGRAPH_BEFORE_SPLIT) {
|
||||
atomicParagraphs.push(...splitLongParagraph(para, CHUNK_TARGET_CHARS))
|
||||
} else {
|
||||
atomicParagraphs.push(para)
|
||||
}
|
||||
}
|
||||
|
||||
// 3. Grouper les paragraphes en chunks de ~CHUNK_TARGET_CHARS
|
||||
const groups = groupParagraphsByMaxContentLen(
|
||||
atomicParagraphs,
|
||||
CHUNK_TARGET_CHARS,
|
||||
CHUNK_OVERLAP_CHARS,
|
||||
)
|
||||
|
||||
// 4. Hash + construire les NoteChunk
|
||||
const chunks: NoteChunk[] = []
|
||||
for (let i = 0; i < groups.length; i++) {
|
||||
const content = groups[i]
|
||||
if (content.length < MIN_FRAGMENT_CHARS) continue
|
||||
|
||||
const fragmentId = hashFragment(noteId, content)
|
||||
// Dédup : si le même fragmentId existe déjà (paragraphe répété), skip
|
||||
if (chunks.some((c) => c.fragmentId === fragmentId)) continue
|
||||
|
||||
chunks.push({
|
||||
fragmentId,
|
||||
content,
|
||||
chunkIndex: i,
|
||||
charCount: content.length,
|
||||
})
|
||||
}
|
||||
|
||||
return chunks
|
||||
}
|
||||
|
||||
function hashFragment(noteId: string, content: string): string {
|
||||
return createHash('sha256')
|
||||
.update(`${noteId}::${content}`)
|
||||
.digest('hex')
|
||||
.slice(0, 32) // 32 chars = 128 bits, largement suffisant pour le dedup
|
||||
}
|
||||
|
||||
function splitLongParagraph(para: string, maxLen: number): string[] {
|
||||
// Coupe aux fins de phrase (. ! ? ؟ !。) les plus proches de maxLen
|
||||
const sentences = para.split(/(?<=[.!?؟!。])\s+/)
|
||||
const chunks: string[] = []
|
||||
let current = ''
|
||||
|
||||
for (const sentence of sentences) {
|
||||
if ((current + ' ' + sentence).length > maxLen && current) {
|
||||
chunks.push(current.trim())
|
||||
current = sentence
|
||||
} else {
|
||||
current = current ? `${current} ${sentence}` : sentence
|
||||
}
|
||||
}
|
||||
if (current.trim()) chunks.push(current.trim())
|
||||
|
||||
// Si une phrase seule dépasse maxLen, coupe dur au mot le plus proche
|
||||
return chunks.flatMap((chunk) =>
|
||||
chunk.length > maxLen * 1.5 ? hardSplitByWords(chunk, maxLen) : [chunk],
|
||||
)
|
||||
}
|
||||
|
||||
function hardSplitByWords(text: string, maxLen: string): string[] {
|
||||
// Coupe au mot le plus proche de maxLen
|
||||
// ...
|
||||
}
|
||||
|
||||
/**
|
||||
* Groupe les paragraphes en chunks de taille ~maxContentLen
|
||||
* avec un overlap optionnel pour préserver le contexte.
|
||||
* Port de group_paragraphs_by_max_content_len (document_indexer.rs:147)
|
||||
*/
|
||||
function groupParagraphsByMaxContentLen(
|
||||
paragraphs: string[],
|
||||
maxLen: number,
|
||||
overlap: number,
|
||||
): string[] {
|
||||
if (paragraphs.length === 0) return []
|
||||
if (overlap > maxLen) overlap = maxLen / 2
|
||||
|
||||
const result: string[] = []
|
||||
let current = ''
|
||||
|
||||
for (const para of paragraphs) {
|
||||
if (current.length + para.length > maxLen && current) {
|
||||
result.push(current.trim())
|
||||
// Préserve l'overlap : reprend les derniers `overlap` chars
|
||||
const tail = current.slice(-overlap)
|
||||
current = tail + para
|
||||
} else {
|
||||
current = current ? `${current}\n\n${para}` : para
|
||||
}
|
||||
}
|
||||
if (current.trim()) result.push(current.trim())
|
||||
|
||||
return result
|
||||
}
|
||||
```
|
||||
|
||||
### Recherche fragment-level — intégration dans SemanticSearchService
|
||||
|
||||
```typescript
|
||||
// Ajout à lib/ai/services/semantic-search.service.ts
|
||||
|
||||
export interface SearchResult {
|
||||
noteId: string
|
||||
title: string | null
|
||||
content: string
|
||||
score: number
|
||||
matchType: 'exact' | 'related'
|
||||
language?: string | null
|
||||
matchedSnippets?: string[] // NOUVEAU — top fragments qui matchent
|
||||
}
|
||||
|
||||
class SemanticSearchService {
|
||||
// ... existant ...
|
||||
|
||||
/**
|
||||
* NOUVEAU — Recherche vectorielle au niveau fragment.
|
||||
* Retourne les notes triées par meilleure similarité de fragment.
|
||||
*/
|
||||
private async vectorChunkSearch(
|
||||
queryEmbedding: number[],
|
||||
userId: string,
|
||||
threshold: number,
|
||||
notebookId: string | null,
|
||||
limit: number,
|
||||
): Promise<SearchResult[]> {
|
||||
const vecStr = `[${queryEmbedding.join(',')}]`
|
||||
const params: any[] = [vecStr, userId, threshold, limit]
|
||||
|
||||
let notebookJoin = ''
|
||||
if (notebookId) {
|
||||
notebookJoin = `AND n."notebookId" = $${params.length + 1}`
|
||||
params.push(notebookId)
|
||||
}
|
||||
|
||||
const sql = `
|
||||
WITH chunk_scores AS (
|
||||
SELECT
|
||||
c."noteId",
|
||||
MAX(1 - (c."embedding"::vector <=> $1::vector)) AS best_score,
|
||||
ARRAY_AGG(
|
||||
c.content
|
||||
ORDER BY 1 - (c."embedding"::vector <=> $1::vector) DESC
|
||||
) AS ranked_contents
|
||||
FROM "NoteEmbeddingChunk" c
|
||||
JOIN "Note" n ON n.id = c."noteId"
|
||||
WHERE n."userId" = $2
|
||||
AND c."embedding" IS NOT NULL
|
||||
AND 1 - (c."embedding"::vector <=> $1::vector) >= $3
|
||||
${notebookJoin}
|
||||
GROUP BY c."noteId"
|
||||
LIMIT $4
|
||||
)
|
||||
SELECT
|
||||
cs."noteId",
|
||||
n.title,
|
||||
cs.best_score,
|
||||
cs.ranked_contents[1:3] AS top_snippets
|
||||
FROM chunk_scores cs
|
||||
JOIN "Note" n ON n.id = cs."noteId"
|
||||
ORDER BY cs.best_score DESC
|
||||
`
|
||||
|
||||
const rows = await prisma.$queryRawUnsafe(sql, ...params)
|
||||
return rows.map((row: any) => ({
|
||||
noteId: row.noteId,
|
||||
title: row.title,
|
||||
content: row.top_snippets?.[0] ?? '',
|
||||
score: row.best_score,
|
||||
matchType: 'related' as const,
|
||||
matchedSnippets: (row.top_snippets ?? []).map((s: string) =>
|
||||
s.length > 200 ? s.slice(0, 200) + '...' : s,
|
||||
),
|
||||
}))
|
||||
}
|
||||
|
||||
/**
|
||||
* Recherche hybride mise à jour :
|
||||
* FTS + vectorChunkSearch + vectorNoteSearch → RRF fusion
|
||||
*/
|
||||
async search(query: string, userId: string, opts: SearchOptions): Promise<SearchResult[]> {
|
||||
// ... existant : FTS ...
|
||||
|
||||
// NOUVEAU : recherche fragment-level en parallèle de la recherche note-level
|
||||
const [keywordResults, noteResults, chunkResults] = await Promise.all([
|
||||
this.keywordSearch(query, userId, opts),
|
||||
this.vectorSearch(queryEmbedding, userId, opts),
|
||||
this.vectorChunkSearch(queryEmbedding, userId, opts.threshold, opts.notebookId, opts.limit),
|
||||
])
|
||||
|
||||
// RRF sur les 3 sources
|
||||
const fused = this.reciprocalRankFusion([
|
||||
...keywordResults,
|
||||
...noteResults,
|
||||
...chunkResults,
|
||||
])
|
||||
|
||||
// Merge snippets : si un résultat a des snippets des chunks, les propager
|
||||
return this.mergeSnippets(fused, chunkResults)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Risques et mitigations
|
||||
|
||||
| Risque | Probabilité | Impact | Mitigation |
|
||||
|--------|-------------|--------|------------|
|
||||
| Cross-join fragment coûteux pour Memory Echo | Moyenne | Latence | N'exécuter que pour la note nouvellement indexée (pas sur tout le corpus à chaque fois) |
|
||||
| Coût API embedding x4-5 (plus de fragments) | Faible | $$ | Dedup par hash → seule une fraction est re-embeddée après la migration initiale |
|
||||
| Rate-limit API OpenAI | Moyenne | Blocage | Queue avec concurrence 4 + retry backoff exponentiel |
|
||||
| Migration longue sur gros corpus | Faible | UX admin | Script batch avec checkpoint, interruptible, reprise auto |
|
||||
| Index HNSW non créé (oubli migration) | Faible | Recherche lente | Vérifier l'existence de l'index au démarrage (`getDbDimension` déjà existe pour ça) |
|
||||
| Fragments orphelins si note déplacée entre carnets | Faible | Bruit | `onDelete: Cascade` + nettoyage au move (déjà géré pour `NoteEmbedding`) |
|
||||
|
||||
---
|
||||
|
||||
## Métriques à tracker
|
||||
|
||||
| Métrique | Objectif | Mesure |
|
||||
|----------|----------|--------|
|
||||
| Précision Memory Echo | +30% connexions pertinentes | Taux de feedback positif sur les insights |
|
||||
| Latence recherche sémantique | < 200ms (P95) | Telemetry sur `semantic-search.service.ts` |
|
||||
| Coût API embedding / mois | Stable vs actuel | Compter les appels `embedPlainText` |
|
||||
| Snippets affichés dans recherche | > 80% des résultats | Telemetry sur SearchModal |
|
||||
| Fragments par note (moyenne) | 3-5 | Requête analytique sur `NoteEmbeddingChunk` |
|
||||
|
||||
---
|
||||
|
||||
## Clés i18n (minimal — la majorité est invisible côté UI)
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"snippets": {
|
||||
"matchedSection": "Section correspondante"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
> La fonctionnalité est principalement backend — peu de libellés visibles. Les snippets sont du contenu de note (pas du texte à traduire).
|
||||
|
||||
---
|
||||
|
||||
## Ordre d'implémentation recommandé
|
||||
|
||||
1. **Migration Prisma** — modèle `NoteEmbeddingChunk` + index HNSW
|
||||
2. **`lib/text/note-chunking.ts`** — logique de chunking pure (testable isolément)
|
||||
3. **`lib/ai/services/chunk-indexing.service.ts`** — service d'indexation (dedup, queue)
|
||||
4. **Intégration au hook de save** — déclenchement async
|
||||
5. **Script de migration** — indexer le corpus existant
|
||||
6. **Recherche fragment-level** — `vectorChunkSearch` + fusion RRF + snippets
|
||||
7. **UI snippets dans SearchModal** — affichage des passages précis
|
||||
8. **Memory Echo fragment-level** — similarité par meilleure paire de fragments
|
||||
9. **Validation end-to-end** — créer une note longue, vérifier chunks en DB, rechercher, Memory Echo
|
||||
|
||||
---
|
||||
|
||||
## Définition de Done (DoD)
|
||||
|
||||
- [ ] Migration Prisma appliquée en dev, dump DB validé avant
|
||||
- [ ] `chunkNoteContent()` produit des fragments cohérents (vérifié sur 5 notes de test : courte, longue, multilingue FR/FA, HTML clippé, vide)
|
||||
- [ ] Indexation incrémentale : modifier une typo ne re-embed qu'un fragment (vérifié en DB)
|
||||
- [ ] Recherche sémantique retourne des `matchedSnippets` pertinents
|
||||
- [ ] SearchModal affiche les snippets avec le terme surligné
|
||||
- [ ] Memory Echo détecte des connexions au niveau section
|
||||
- [ ] Script de migration complète le corpus sans erreur
|
||||
- [ ] Aucune régression sur la recherche existante (note-level toujours fonctionnelle)
|
||||
- [ ] `NoteEmbedding` (global) toujours maintenu pour rétro-compat
|
||||
- [ ] Pas de `revalidatePath` systématique (mutations optimistes)
|
||||
- [ ] Pas de tests écrits sauf demande explicite (AGENTS.md)
|
||||
|
||||
---
|
||||
|
||||
## Notes
|
||||
|
||||
- **Conservation de `NoteEmbedding`** : la table existante reste le source of truth pour le clustering (`clustering.service.ts`) et la recherche globale. Les chunks sont une **couche additive** qui améliore la précision, pas un remplacement.
|
||||
- **AppFlowy utilise `nomic-embed-text` (768 dims, local via Ollama)**. Memento utilise `text-embedding-3-small` (1536 dims, OpenAI). La dimension est différente — le schéma `NoteEmbeddingChunk` doit spécifier `vector(1536)`.
|
||||
- **Performance pgvector** : l'index HNSW est crucial pour les requêtes fragment-level. Sans index, un scan séquentiel sur des milliers de fragments serait prohibitif. L'index doit être créé dans la migration SQL brute.
|
||||
- **Persan / RTL** : le chunking par paragraphes fonctionne indépendamment de la langue. Le split par fin de phrase (`؟ !。`) couvre les scripts RTL et CJK. Vérifier que les embeddings `text-embedding-3-small` gèrent bien le persan (déjà validé pour la recherche existante).
|
||||
239
docs/story-markdown-roundtrip.md
Normal file
239
docs/story-markdown-roundtrip.md
Normal file
@@ -0,0 +1,239 @@
|
||||
# Story: Markdown Round-Trip — Export & Import TipTap ↔ Markdown
|
||||
|
||||
> **Epic:** Epic 6 — Croissance & Activation (PLG)
|
||||
> **ID:** 6-2-markdown-roundtrip
|
||||
> **Priority:** Beta Blocker
|
||||
> **Status:** review
|
||||
> **Depends on:** Rich-text editor TipTap (`rich-text-editor.tsx` ✅)
|
||||
> **Ref brief:** `docs/brief-markdown-roundtrip.md`
|
||||
|
||||
---
|
||||
|
||||
## Contexte
|
||||
|
||||
TipTap/ProseMirror stocke le contenu en JSON natif. Il n'existe **aucune sérialisation TipTap → Markdown** ni **Markdown → TipTap** dans le code actuel.
|
||||
|
||||
`@tiptap/extension-markdown` n'est pas disponible sur npm public (extension TipTap Pro). L'approche choisie utilise :
|
||||
- **`turndown`** : HTML → Markdown (export)
|
||||
- **`marked`** : Markdown → HTML → TipTap parse (import + paste)
|
||||
|
||||
Ces deux librairies sont déjà dans le registre npm. `react-markdown` est déjà installé mais sert uniquement au rendu. `marked` est disponible (`18.x`).
|
||||
|
||||
---
|
||||
|
||||
## User Stories
|
||||
|
||||
### US-MARKDOWN-1 : Export Markdown
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** exporter ma note en fichier `.md`,
|
||||
**Afin de** la réutiliser dans d'autres outils (Obsidian, VS Code, GitHub, etc.).
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- [x] **AC-1** : Un item "Exporter en Markdown" est visible dans le menu `…` de la note
|
||||
- [x] **AC-2** : Au clic, un fichier `<titre-note>.md` est téléchargé dans le navigateur
|
||||
- [x] **AC-3** : Le fichier contient : titre en `# H1`, headings, bold, italic, listes, tâches (`- [x]`), code inline/fenced, blockquotes, liens, tables
|
||||
- [x] **AC-4** : Un `liveBlock` est exporté en commentaire HTML `<!-- live-block: sourceNoteId#blockId -->`
|
||||
- [x] **AC-5** : Un `structuredViewBlock` est exporté en commentaire HTML `<!-- structured-view: {...attrs} -->`
|
||||
|
||||
---
|
||||
|
||||
### US-MARKDOWN-2 : Paste Markdown → blocs TipTap
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** coller du Markdown dans l'éditeur et obtenir des blocs TipTap,
|
||||
**Afin de** ne pas avoir à reformater manuellement.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- [x] **AC-6** : Coller un texte qui commence par `#`, `##`, `- `, `* `, `1.`, `` ` ``, `>`, `**`, ou `|` déclenche la conversion Markdown → HTML → TipTap
|
||||
- [x] **AC-7** : Un texte normal (sans marqueurs Markdown) est collé tel quel (pas de conversion parasite)
|
||||
- [x] **AC-8** : Les tables Markdown sont converties en tables TipTap
|
||||
- [x] **AC-9** : Les tâches `- [x]` sont converties en `taskItem` cochés
|
||||
|
||||
---
|
||||
|
||||
### US-MARKDOWN-3 : Import fichier `.md`
|
||||
|
||||
**En tant qu'** utilisateur,
|
||||
**Je veux** importer un fichier `.md` dans une nouvelle note (ou écraser le contenu),
|
||||
**Afin de** migrer du contenu depuis d'autres outils.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- [x] **AC-10** : Un item "Importer Markdown" est visible dans le menu `…` de la note (ou via un bouton dédié)
|
||||
- [x] **AC-11** : Au clic, un file picker s'ouvre filtré sur `.md`
|
||||
- [x] **AC-12** : Après sélection, le contenu de la note est **remplacé** par le contenu du fichier parsé en TipTap
|
||||
- [x] **AC-13** : Le titre de la note est mis à jour avec le premier `# H1` du fichier importé (si présent)
|
||||
|
||||
---
|
||||
|
||||
## Tasks / Subtasks
|
||||
|
||||
### T1 — Installation des dépendances
|
||||
|
||||
- [x] T1.1 — Installer `turndown` + `@types/turndown` (HTML → Markdown)
|
||||
- [x] T1.2 — Vérifier que `marked` est déjà disponible ou installer si absent
|
||||
- [x] T1.3 — Vérifier que `@types/marked` est disponible
|
||||
|
||||
### T2 — Créer `lib/editor/markdown-export.ts`
|
||||
|
||||
- [x] T2.1 — Implémenter `tiptapHTMLToMarkdown(html: string): string` via `turndown`
|
||||
- Règle custom `liveBlock` : div avec `data-live-block` → commentaire HTML via sentinel + post-process
|
||||
- Règle custom `structuredViewBlock` : div avec `data-structured-view-block` → commentaire HTML via sentinel
|
||||
- GFM tables activé (`turndown-plugin-gfm`)
|
||||
- GFM task lists activé
|
||||
- [x] T2.2 — Implémenter `markdownToHTML(md: string): string` via `marked`
|
||||
- GFM activé, tables activées
|
||||
- Retourner HTML propre pour injection TipTap via `editor.commands.setContent(html)`
|
||||
- [x] T2.3 — Implémenter `looksLikeMarkdown(text: string): boolean`
|
||||
- Détecte si un texte collé contient des marqueurs Markdown (heuristique)
|
||||
- Regex : `#`, `- `, `* `, `1. `, `>`, ` ``` `, `**`, `_`, `|`, `[...](...)`
|
||||
|
||||
### T3 — Route API export Markdown
|
||||
|
||||
- [x] T3.1 — Implémenté côté client dans `note-editor-toolbar.tsx` (pas de route serveur — choix UX : utilise l'état live de l'éditeur)
|
||||
- [x] T3.2 — Titre en `# <note.title>` préfixé dans le fichier `.md` exporté
|
||||
|
||||
### T4 — Action UI Export dans `note-editor-toolbar.tsx`
|
||||
|
||||
- [x] T4.1 — Ajouter `DropdownMenuItem` "Exporter en Markdown" dans le menu `…` (avec icône `FileDown`)
|
||||
- [x] T4.2 — Au clic : `editor.getHTML()` → `tiptapHTMLToMarkdown()` → `Blob` → download via URL.createObjectURL
|
||||
- [x] T4.3 — Toast de succès/erreur
|
||||
|
||||
### T5 — Paste Markdown dans l'éditeur
|
||||
|
||||
- [x] T5.1 — Créer extension TipTap `MarkdownPasteExtension` dans `lib/editor/markdown-paste-extension.ts`
|
||||
- Hook sur `handlePaste` : si `looksLikeMarkdown(text)` → `markdownToHTML(text)` → `editor.commands.insertContent`
|
||||
- `setTimeout(0)` pour éviter conflits de transactions
|
||||
- [x] T5.2 — Intégrer `MarkdownPasteExtension` dans `extensions[]` de `rich-text-editor.tsx`
|
||||
|
||||
### T6 — Import fichier `.md` dans `note-editor-toolbar.tsx`
|
||||
|
||||
- [x] T6.1 — Ajouter `DropdownMenuItem` "Importer Markdown" dans le menu `…` (icône `FileUp`)
|
||||
- [x] T6.2 — Input `<input type="file" accept=".md">` caché avec `mdImportInputRef`
|
||||
- [x] T6.3 — Handler `handleImportMarkdownFile` : lire fichier → `markdownToHTML()` → `actions.setContent(html)`
|
||||
- [x] T6.4 — Titre mis à jour via `extractMarkdownTitle()` + `actions.setTitle()`
|
||||
|
||||
### T7 — i18n (15 locales)
|
||||
|
||||
- [x] T7.1 — Ajout clés dans `locales/en.json` et `locales/fr.json` (namespace `richTextEditor`)
|
||||
- `exportMarkdown`, `importMarkdown`, `markdownExportSuccess`, `markdownExportError`, `markdownImportSuccess`
|
||||
- [x] T7.2 — Clés ajoutées dans les 13 autres locales (de, es, it, pt, nl, pl, ru, zh, ja, ko, ar, fa, hi)
|
||||
|
||||
### T8 — Tests unitaires
|
||||
|
||||
- [x] T8.1 — Tests `lib/editor/markdown-export.ts` : 40 tests — heading, bold, italic, list, code, blockquote, link, table, liveBlock, svBlock
|
||||
- [x] T8.2 — Tests `looksLikeMarkdown` : 12 cas positifs + négatifs
|
||||
|
||||
---
|
||||
|
||||
## Dev Notes
|
||||
|
||||
### Approche technique
|
||||
|
||||
**Pourquoi pas `@tiptap/extension-markdown` ?**
|
||||
Non disponible sur npm public (`404 Not Found`). C'est une extension TipTap Pro.
|
||||
|
||||
**Approche choisie : `turndown` + `marked`**
|
||||
- `turndown` (7.x) : battle-tested, supporte les plugins GFM (tables, task lists via `turndown-plugin-gfm`)
|
||||
- `marked` (18.x) : fast, supporte GFM tables/tasks nativement
|
||||
|
||||
**Export côté serveur vs client :**
|
||||
L'export via route API `/api/notes/[id]/export?format=markdown` permet de ne pas dépendre de l'état de l'éditeur côté client — fonctionne même si l'éditeur est fermé.
|
||||
|
||||
**TipTap `generateHTML` côté serveur :**
|
||||
```typescript
|
||||
import { generateHTML } from '@tiptap/html'
|
||||
```
|
||||
Nécessite d'importer toutes les extensions utilisées. Une liste partagée dans `lib/editor/tiptap-extensions-server.ts` simplifie la maintenance.
|
||||
|
||||
**MarkdownPasteExtension :**
|
||||
Extension légère qui s'insère dans la chaîne de `handlePaste`. Si le texte collé contient des marqueurs Markdown, on le convertit avant insertion. Sinon, on laisse TipTap gérer normalement.
|
||||
|
||||
**Custom nodes HTML output :**
|
||||
- `liveBlock` génère `<div data-type="live-block" data-source-note-id="..." data-block-id="..."></div>` dans `getHTML()`
|
||||
- `structuredViewBlock` génère `<div data-type="structured-view-block" ...></div>`
|
||||
- `turndown` peut détecter ces divs par `data-type` et les convertir en commentaires HTML
|
||||
|
||||
**Import titre :**
|
||||
Regex sur la première ligne du fichier `.md` : `^#\s+(.+)` → titre. Passé en callback au parent.
|
||||
|
||||
### Fichiers clés existants
|
||||
- `memento-note/components/rich-text-editor.tsx` — éditeur principal
|
||||
- `memento-note/components/note-actions.tsx` — menu actions note (dropdown `…`)
|
||||
- `memento-note/lib/editor/` — extensions TipTap existantes
|
||||
- `memento-note/locales/` — 15 fichiers JSON i18n
|
||||
|
||||
### Patterns importants
|
||||
- Actions dans le menu `…` : `DropdownMenuItem` avec icône Lucide + `t('key')` i18n
|
||||
- Download client-side : `URL.createObjectURL(blob)` + clic programmatique + `URL.revokeObjectURL`
|
||||
- Tests unitaires : `tests/unit/` avec Jest, importé via alias `@/`
|
||||
|
||||
---
|
||||
|
||||
## Dev Agent Record
|
||||
|
||||
### Implementation Plan
|
||||
|
||||
**Approche finale :** `turndown` + `marked` (l'extension officielle `@tiptap/extension-markdown` est indisponible sur npm public — TipTap Pro uniquement).
|
||||
|
||||
- Export : client-side via `editor.getHTML()` → `turndown` → Blob download (pas de route serveur — utilise l'état live)
|
||||
- Import : `FileReader` + `marked` → `editor.commands.setContent(html)`
|
||||
- Paste : extension ProseMirror `handlePaste` → `looksLikeMarkdown` heuristique → `marked` → `insertContent`
|
||||
- Custom nodes (liveBlock, structuredViewBlock) : pre-processing avec sentinels alphanumériques, post-processing avec commentaires HTML
|
||||
|
||||
### Debug Log
|
||||
|
||||
- **turndown + divs vides** : `turndown` ignore les nœuds "blank" (pas de texte). Solution : pre-process HTML → remplacer divs custom par `<p>MOMENTOBLOCKSNTINELXXX</p>`, post-process le MD résultant pour remplacer par `<!-- comment -->`.
|
||||
- **turndown escape underscores** : le sentinel `__MOMENTO_BLOCK__` est échappé en `\_\_MOMENTO\_BLOCK\_\_`. Solution : utiliser uniquement des caractères alphanumériques (`MOMENTOBLOCKSENTINELLIVEBLOCK0`).
|
||||
- **TS2322 dans toolbar** : `editor.commands.setContent(html, true)` — le 2e argument est `SetContentOptions` pas `boolean` dans TipTap v3. Corrigé.
|
||||
- **Fragment JSX** : `<input type="file">` caché hors du div principal — wrappé dans `<>` fragment.
|
||||
- **handleConvertToRichtext** : le remplacement d'import avait supprimé l'ouverture `const handleConvertToRichtext = async () => {`. Restauré.
|
||||
|
||||
### Completion Notes
|
||||
|
||||
- **T1** ✅ : `turndown@7.2.4` + `turndown-plugin-gfm` + `@types/turndown` installés. `marked@18.0.3` déjà présent.
|
||||
- **T2** ✅ : `lib/editor/markdown-export.ts` — `tiptapHTMLToMarkdown`, `markdownToHTML`, `looksLikeMarkdown`, `extractMarkdownTitle`. Gestion des nœuds custom via sentinels.
|
||||
- **T3** ✅ : Export client-side (pas de route serveur). `richTextEditorRef.current?.getEditor().getHTML()` → markdown → Blob download.
|
||||
- **T4** ✅ : `DropdownMenuItem` "Exporter en Markdown" + "Importer Markdown" dans `note-editor-toolbar.tsx` (menu `…`).
|
||||
- **T5** ✅ : `lib/editor/markdown-paste-extension.ts` créé + intégré dans `rich-text-editor.tsx`.
|
||||
- **T6** ✅ : Import fichier `.md` avec `mdImportInputRef` + `handleImportMarkdownFile` dans toolbar. Titre auto-extrait.
|
||||
- **T7** ✅ : 5 clés dans namespace `richTextEditor` ajoutées à toutes les 15 locales.
|
||||
- **T8** ✅ : 40 tests unit passent (39 sur fonctions, 1 fix pour spacing turndown). Suite complète : 174/174.
|
||||
|
||||
---
|
||||
|
||||
## File List
|
||||
|
||||
- `memento-note/package.json` — ajout `turndown@7.2.4`, `turndown-plugin-gfm`, `@types/turndown`
|
||||
- `memento-note/lib/editor/markdown-export.ts` — **créé** — helpers markdown roundtrip
|
||||
- `memento-note/lib/editor/markdown-paste-extension.ts` — **créé** — extension TipTap paste Markdown
|
||||
- `memento-note/components/note-editor/note-editor-toolbar.tsx` — modifié — items Export/Import Markdown + handlers + import ref
|
||||
- `memento-note/components/rich-text-editor.tsx` — modifié — import + intégration `MarkdownPasteExtension`
|
||||
- `memento-note/types/global.d.ts` — modifié — déclaration de types pour `turndown-plugin-gfm`
|
||||
- `memento-note/locales/en.json` — modifié — 5 clés `richTextEditor.export/importMarkdown*`
|
||||
- `memento-note/locales/fr.json` — modifié — idem
|
||||
- `memento-note/locales/de.json` — modifié — idem
|
||||
- `memento-note/locales/es.json` — modifié — idem
|
||||
- `memento-note/locales/it.json` — modifié — idem
|
||||
- `memento-note/locales/pt.json` — modifié — idem
|
||||
- `memento-note/locales/nl.json` — modifié — idem
|
||||
- `memento-note/locales/pl.json` — modifié — idem
|
||||
- `memento-note/locales/ru.json` — modifié — idem
|
||||
- `memento-note/locales/zh.json` — modifié — idem
|
||||
- `memento-note/locales/ja.json` — modifié — idem
|
||||
- `memento-note/locales/ko.json` — modifié — idem
|
||||
- `memento-note/locales/ar.json` — modifié — idem
|
||||
- `memento-note/locales/fa.json` — modifié — idem
|
||||
- `memento-note/locales/hi.json` — modifié — idem
|
||||
- `memento-note/tests/unit/markdown-export.test.ts` — **créé** — 40 tests unitaires
|
||||
- `docs/story-markdown-roundtrip.md` — **créé** — story complète
|
||||
- `docs/sprint-status.yaml` — modifié — `6-2-markdown-roundtrip: in-progress → review`
|
||||
|
||||
---
|
||||
|
||||
## Change Log
|
||||
|
||||
| Date | Description |
|
||||
|------|-------------|
|
||||
| 2026-05-30 | Story créée à partir du brief `docs/brief-markdown-roundtrip.md` |
|
||||
| 2026-05-30 | Implémentation complète — T1 à T8 (voir Dev Agent Record) |
|
||||
476
docs/story-nextgen-editor-us4-redesign.md
Normal file
476
docs/story-nextgen-editor-us4-redesign.md
Normal file
@@ -0,0 +1,476 @@
|
||||
# US-4 Redesign — Vue Structurée Inline dans l'Éditeur
|
||||
|
||||
> **Status :** DRAFT — En attente de validation fondateur
|
||||
> **Remplace :** US-4 « Bloc de Base de Données Relationnelle Inline » (DEPRECATED)
|
||||
> **Epic :** US-NEXTGEN-EDITOR
|
||||
> **Dépend de :** US-STRUCTURED-VIEWS ✅ (livré), US-LIVING-BLOCKS ✅ (livré)
|
||||
|
||||
---
|
||||
|
||||
## 1. Problem Statement — Pourquoi l'ancienne US-4 est morte
|
||||
|
||||
L'implémentation actuelle (fichiers `tiptap-database-block-extension.tsx`, `database-block-editor.tsx`, `database-block-types.ts`) a été rejetée pour les raisons suivantes :
|
||||
|
||||
### 1.1 Copie de démo marketing, pas une feature produit
|
||||
|
||||
Le code source dans `createDefaultDatabaseBlockData()` insère **Jules Verne** et **Liu Cixin** avec leurs œuvres en données pré-remplies. C'est une copie directe du prototype `architectural-grid1/ModernBlockNoteEditor.tsx` qui était conçu pour une landing page, pas pour un produit de prise de notes réel.
|
||||
|
||||
### 1.2 Modèle de données parallèle et isolé
|
||||
|
||||
L'implémentation stocke `dbAuthorsJson` et `dbBooksJson` comme attributs HTML dans le nœud TipTap :
|
||||
|
||||
```html
|
||||
<div data-database-block="true" data-db-id="authors-works-abc123"
|
||||
data-db-authors='[{"id":"a1","name":"Jules Verne"}]'
|
||||
data-db-books='[{"id":"bk1","title":"Vingt Mille Lieues..."}]'>
|
||||
```
|
||||
|
||||
Problèmes critiques :
|
||||
- **Isolation totale** : ces données n'ont aucun lien avec le carnet, les notes, ni les propriétés Prisma.
|
||||
- **Scalabilité zéro** : stocker des listes entières de rows dans les attributs d'un nœud TipTap = explostion de la taille du HTML à chaque sauvegarde.
|
||||
- **Duplication du modèle** : `NotebookSchema` + `NotebookProperty` + `NoteProperty` existent déjà en BDD et fonctionnent.
|
||||
|
||||
### 1.3 Confusion utilisateur
|
||||
|
||||
Un utilisateur qui tape `/database` s'attend à voir ses propres données structurées — pas un jeu de rôle bibliothèque de SF. Cette confusion est documentée comme rejet non-négociable par le fondateur.
|
||||
|
||||
### 1.4 Audit du code à supprimer
|
||||
|
||||
| Fichier | Statut | Raison |
|
||||
|---------|--------|--------|
|
||||
| `memento-note/components/tiptap-database-block-extension.tsx` | **SUPPRIMER** | Extension TipTap avec modèle `dbAuthors`/`dbBooks` |
|
||||
| `memento-note/components/database-block-editor.tsx` | **SUPPRIMER** | UI Auteurs & Œuvres, hardcodé |
|
||||
| `memento-note/lib/editor/database-block-types.ts` | **SUPPRIMER** | Types + données Verne/Liu Cixin |
|
||||
| `rich-text-editor.tsx` L28, L193-194, L395, L412-420, L1286, L1335-1338, L1397-1401 | **MODIFIER** | Retirer imports et références `/database` anciens |
|
||||
| `block-action-menu.tsx` L15-17, L33, L39, L51, L134-135 | **MODIFIER** | Retirer option `database` du menu "Transformer en" |
|
||||
| `locales/*.json` — clés `databaseBlock.*` | **SUPPRIMER** | ~15 clés obsolètes |
|
||||
|
||||
---
|
||||
|
||||
## 2. Personas & Jobs-to-be-Done
|
||||
|
||||
### Persona 1 — Chloé, chercheuse (carnet "Thèse Linguistique")
|
||||
|
||||
Chloé a configuré son carnet avec des propriétés : `Statut` (select), `Langue` (select), `Lu` (checkbox), `Source` (text). Elle a 47 notes dans ce carnet. Elle rédige un chapitre synthétique et veut **voir le tableau de ses sources directement sous son paragraphe d'introduction**, sans quitter l'éditeur.
|
||||
|
||||
**Job-to-be-done :** *"Quand je rédige, je veux voir le tableau de mes données structurées en contexte, sans naviguer vers le carnet."*
|
||||
|
||||
### Persona 2 — Mehdi, chef de projet (carnet "Sprint Q2 2026")
|
||||
|
||||
Carnet structuré avec propriétés `Statut` (Kanban), `Priorité`, `Assigné`. Il prend ses notes de réunion et veut **insérer une vue en lecture de son Kanban** pour partager l'état du sprint dans la note de compte-rendu.
|
||||
|
||||
**Job-to-be-done :** *"Dans ma note de réunion, je veux une vue rapide de l'état des tâches du sprint."*
|
||||
|
||||
### Persona 3 — Yasmin, étudiante (carnet "Lectures Persan")
|
||||
|
||||
Carnet avec propriétés `Lu` (checkbox), `Note` (number). Elle lit en persan (RTL). Elle veut **voir sa liste de lectures sous forme de tableau** inline dans ses notes de révision.
|
||||
|
||||
**Job-to-be-done :** *"Dans mes notes, je veux voir mon tableau de lectures avec les bonnes valeurs — en persan, dans le bon sens."*
|
||||
|
||||
---
|
||||
|
||||
## 3. Options Produit pour `/database` — Analyse & Recommandation
|
||||
|
||||
### Option A — Embed Structured View (Recommandée ✅)
|
||||
|
||||
**Description :** Le bloc inline affiche une vue filtrée (Table ou Galerie) du schéma du carnet courant. Données lues depuis l'API existante. Le bloc stocke seulement `notebookId`, `displayMode`, `filterJson` dans ses attributs TipTap.
|
||||
|
||||
**Avantages :**
|
||||
- Réutilise `NotesStructuredTable` et `NotesGalleryView` existants (quasi plug-and-play).
|
||||
- Données cohérentes avec `/home` (même source de vérité).
|
||||
- Léger : 3 attributs string dans le nœud TipTap, pas de payload.
|
||||
- Facile à migrer : si le schéma du carnet change, le bloc se met à jour automatiquement.
|
||||
- Clair pour l'utilisateur : "c'est mon carnet, mes données."
|
||||
|
||||
**Risques :**
|
||||
- Éditeur doit recevoir `notebookId` (actuellement absent — patch mineur dans `note-content-area.tsx`).
|
||||
- Si le carnet n'a pas de schéma, le bloc doit le gérer gracieusement.
|
||||
|
||||
**Verdict :** Option principale retenue.
|
||||
|
||||
### Option B — Linked Database Block (style Notion)
|
||||
|
||||
**Description :** L'utilisateur choisit n'importe quel carnet structuré (pas forcément le carnet de la note courante), avec filtre et vue configurables dans le bloc.
|
||||
|
||||
**Avantages :** Plus puissant — permet de croiser des carnets.
|
||||
|
||||
**Risques :**
|
||||
- UI de sélection de carnet complexe dans le NodeView.
|
||||
- Scope plus large que ce que justifie une US-4 isolée.
|
||||
- Cross-notebook = scope Living Blocks étendu → reporter à v2.
|
||||
|
||||
**Verdict :** Déféré à v2 après que l'Option A soit stabilisée.
|
||||
|
||||
### Option C — Mini-table locale (colonnes libres dans la note)
|
||||
|
||||
**Description :** Table simple dans la note, indépendante des carnets, avec colonnes définissables par l'utilisateur.
|
||||
|
||||
**Avantages :** Pas de dépendance à Structured Views.
|
||||
|
||||
**Risques :**
|
||||
- Crée exactement le second système de données parallèle qu'on veut éviter.
|
||||
- Ne répond pas aux personas (Chloé et Mehdi veulent leurs vraies données).
|
||||
- Rejectée explicitement par le fondateur.
|
||||
|
||||
**Verdict :** Hors scope. Ne pas implémenter.
|
||||
|
||||
### Option D — Supprimer `/database`
|
||||
|
||||
**Description :** Retirer complètement la commande slash et l'option du menu.
|
||||
|
||||
**Avantages :** Simple, propre.
|
||||
|
||||
**Risques :**
|
||||
- Perd une surface UX qui a du sens (une fois bien connectée).
|
||||
- L'annonce "database inline" est une attente utilisateur légitime.
|
||||
|
||||
**Verdict :** Fallback si l'Option A prend trop de temps — mais l'Option A est faisable en taille M.
|
||||
|
||||
---
|
||||
|
||||
## 4. User Story & Critères d'Acceptation (Given/When/Then)
|
||||
|
||||
### US-4 (Nouvelle) : Vue Structurée de Carnet Inline dans l'Éditeur
|
||||
|
||||
**En tant que** rédacteur dans un carnet structuré,
|
||||
**Je veux** insérer une vue en lecture de mon tableau de notes directement dans le corps de ma note,
|
||||
**Afin de** voir mes données structurées en contexte, sans quitter l'éditeur ni naviguer vers le carnet.
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 1 — Insertion dans un carnet structuré
|
||||
|
||||
**Given** que ma note est dans un carnet qui a un schéma (`NotebookSchema` défini)
|
||||
**When** je tape `/database` dans l'éditeur
|
||||
**Then** un bloc `structuredViewBlock` est inséré, affichant la vue Table du carnet (colonnes = propriétés du schéma, lignes = notes du carnet)
|
||||
**And** aucune donnée de démo n'est insérée
|
||||
**And** l'utilisateur peut modifier les valeurs simples directement dans le bloc (checkbox, select, texte) — les changements se sauvegardent via `PATCH /api/notes/:id/properties`
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 2 — Carnet sans schéma
|
||||
|
||||
**Given** que ma note est dans un carnet sans `NotebookSchema`
|
||||
**When** j'insère un bloc `/database`
|
||||
**Then** le bloc affiche un message contextuel : *"Ce carnet n'a pas encore de vue structurée. Configurez-en une depuis l'en-tête du carnet."* avec un lien vers le wizard
|
||||
**And** aucune donnée n'est chargée, aucun crash
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 3 — Note sans carnet
|
||||
|
||||
**Given** que ma note n'appartient à aucun carnet (notebookId absent)
|
||||
**When** j'insère un bloc `/database`
|
||||
**Then** le bloc affiche : *"Ce bloc nécessite un carnet. Déplacez cette note dans un carnet pour l'utiliser."*
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 4 — Migration des blocs legacy
|
||||
|
||||
**Given** qu'une note contient un ancien nœud `data-database-block="true"` (auteurs/œuvres)
|
||||
**When** la note est ouverte
|
||||
**Then** le bloc obsolète est silencieusement retiré (ou affiché comme placeholder "bloc obsolète")
|
||||
**And** le reste du contenu de la note est intact
|
||||
**And** aucun crash ne se produit
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 5 — RTL / locale persane
|
||||
|
||||
**Given** que la langue de l'app est `fa` (persan, RTL)
|
||||
**When** le bloc est affiché
|
||||
**Then** le wrapper du bloc a `dir="auto"`, le tableau s'aligne correctement en RTL
|
||||
**And** les libellés du bloc sont traduits en persan (via `useLanguage()`)
|
||||
|
||||
---
|
||||
|
||||
#### Scénario 6 — Bascule de vue (Table → Galerie)
|
||||
|
||||
**Given** que le bloc est inséré dans un carnet avec `illustrationSvg` ou couleur
|
||||
**When** l'utilisateur clique sur le sélecteur de vue dans le bloc
|
||||
**Then** il peut basculer entre `Table` et `Galerie`
|
||||
**And** l'attribut `displayMode` du nœud TipTap est mis à jour
|
||||
**And** la vue se met à jour sans re-insertion du bloc
|
||||
|
||||
---
|
||||
|
||||
## 5. Out of Scope Explicite
|
||||
|
||||
| Fonctionnalité | Raison |
|
||||
|----------------|--------|
|
||||
| Vue Kanban inline | Drag-and-drop dans un NodeView TipTap = mauvaise UX, reporté en v2 |
|
||||
| Sélection d'un carnet différent de la note courante | Scope trop large → v2 |
|
||||
| Formules / rollups calculés | Hors scope Structured Views v1 |
|
||||
| Relations multi-carnets | Hors scope — nécessite migration Prisma dédiée |
|
||||
| Filtre personnalisé via UI dans le bloc | v2 — le bloc affiche tout le carnet en v1 |
|
||||
| Pagination dans le bloc | v2 si le carnet dépasse 50 notes |
|
||||
| Export PDF/CSV depuis le bloc | Fonctionnalité séparée |
|
||||
|
||||
---
|
||||
|
||||
## 6. Composants Prototype à Référencer
|
||||
|
||||
| Composant prototype | Usage | Note |
|
||||
|--------------------|-------|------|
|
||||
| `architectural-grid/` — `NotesStructuredTable` pattern | Colonnes et cellules — **référence design** | Utiliser le composant prod `notes-structured-table.tsx` |
|
||||
| `architectural-grid/` — `NotesGalleryView` pattern | Vue galerie — **référence design** | Utiliser le composant prod `notes-gallery-view.tsx` |
|
||||
| `architectural-grid1/ModernBlockNoteEditor.tsx` L1704+ | **NE PAS COPIER** — démo marketing Verne/Liu Cixin | Audit uniquement |
|
||||
|
||||
> ⚠️ Le prototype `architectural-grid1` est la référence de ce qu'il **ne faut pas** shipper. Le prototype `architectural-grid` (sans `1`) est la référence de design courant.
|
||||
|
||||
---
|
||||
|
||||
## 7. Modèle de Données
|
||||
|
||||
### 7.1 Nœud TipTap — Attributs (référence légère uniquement)
|
||||
|
||||
```typescript
|
||||
// Extension TipTap — tiptap-structured-view-block-extension.tsx
|
||||
Node.create({
|
||||
name: 'structuredViewBlock',
|
||||
group: 'block',
|
||||
atom: true,
|
||||
draggable: true,
|
||||
addAttributes() {
|
||||
return {
|
||||
notebookId: {
|
||||
default: null,
|
||||
parseHTML: (el) => el.getAttribute('data-sv-notebook-id'),
|
||||
renderHTML: (attrs) => attrs.notebookId
|
||||
? { 'data-sv-notebook-id': attrs.notebookId }
|
||||
: {},
|
||||
},
|
||||
displayMode: {
|
||||
default: 'table',
|
||||
parseHTML: (el) => el.getAttribute('data-sv-mode') || 'table',
|
||||
renderHTML: (attrs) => ({ 'data-sv-mode': attrs.displayMode }),
|
||||
},
|
||||
filterJson: {
|
||||
default: '{}',
|
||||
parseHTML: (el) => el.getAttribute('data-sv-filter') || '{}',
|
||||
renderHTML: (attrs) => ({ 'data-sv-filter': attrs.filterJson }),
|
||||
},
|
||||
}
|
||||
},
|
||||
parseHTML: () => [{ tag: 'div[data-structured-view-block]' }],
|
||||
renderHTML: ({ HTMLAttributes }) =>
|
||||
['div', mergeAttributes(HTMLAttributes, { 'data-structured-view-block': 'true' })],
|
||||
addNodeView: () => ReactNodeViewRenderer(StructuredViewBlockEmbed),
|
||||
})
|
||||
```
|
||||
|
||||
### 7.2 Aucune migration Prisma requise
|
||||
|
||||
Le bloc réutilise le schéma Prisma existant :
|
||||
- `NotebookSchema` / `NotebookProperty` → définition des colonnes
|
||||
- `NoteProperty` → valeurs par note
|
||||
- `Note` → lignes du tableau
|
||||
|
||||
Aucune nouvelle table. Aucun risque BDD.
|
||||
|
||||
### 7.3 Diagramme de relations
|
||||
|
||||
```mermaid
|
||||
graph TD
|
||||
A["structuredViewBlock node<br/>(TipTap attrs)"] -->|"notebookId"| B["GET /api/notebooks/:id/schema"]
|
||||
B --> C["NotebookSchema<br/>(Prisma)"]
|
||||
C --> D["NotebookProperty[]<br/>(colonnes)"]
|
||||
A -->|"notebookId"| E["GET /api/notebooks/:id/notes<br/>(avec properties)"]
|
||||
E --> F["Note[]<br/>(lignes)"]
|
||||
F --> G["NoteProperty[]<br/>(valeurs)"]
|
||||
D & G --> H["NotesStructuredTable<br/>(composant prod réutilisé)"]
|
||||
H --> I["Rendu inline dans l'éditeur"]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 8. Plan de Migration & Rollback du Code Actuel
|
||||
|
||||
### 8.1 Ordre de suppression (pour éviter les imports cassés)
|
||||
|
||||
1. **Supprimer** `memento-note/lib/editor/database-block-types.ts`
|
||||
2. **Supprimer** `memento-note/components/database-block-editor.tsx`
|
||||
3. **Supprimer** `memento-note/components/tiptap-database-block-extension.tsx`
|
||||
4. **Modifier** `block-action-menu.tsx` — retirer import + option `database`
|
||||
5. **Modifier** `rich-text-editor.tsx` — retirer import + slash entry + extension registration
|
||||
6. **Créer** `tiptap-structured-view-block-extension.tsx` + `structured-view-block-embed.tsx`
|
||||
7. **Modifier** `note-content-area.tsx` — passer `notebookId`
|
||||
8. **Modifier** `locales/en.json` + `fr.json` — swap clés i18n
|
||||
|
||||
### 8.2 Gestion des notes existantes avec l'ancien bloc
|
||||
|
||||
Le nœud `databaseBlock` sera inconnu de TipTap après suppression de l'extension. Par défaut ProseMirror le drop silencieusement. Options :
|
||||
|
||||
- **Option simple (v1) :** Laisser ProseMirror supprimer le nœud inconnu au premier rendu — aucune action développeur.
|
||||
- **Option propre (recommandée) :** Ajouter dans la nouvelle extension une règle `parseHTML` qui matche `div[data-database-block]` et le convertit en paragraphe `⚠️ Bloc base de données obsolète — ce contenu a été retiré.`
|
||||
|
||||
### 8.3 Rollback possible
|
||||
|
||||
Si le fondateur rejette l'Option A après implémentation :
|
||||
- Les 3 fichiers supprimés sont dans git history — `git checkout HEAD~1 -- <fichier>` les restaure.
|
||||
- La suppression de l'extension de `rich-text-editor.tsx` est une ligne — réversible en 2 minutes.
|
||||
|
||||
---
|
||||
|
||||
## 9. Risques Performance & Mitigations
|
||||
|
||||
| Risque | Probabilité | Impact | Mitigation |
|
||||
|--------|-------------|--------|-----------|
|
||||
| NodeView React lourd — re-render à chaque transaction TipTap | Haute | Haute | `shouldRerenderOnTransaction: false` sur l'éditeur (US-EDITOR-PERF) + `React.memo` sur le bloc embed + `trackNodeViewPosition: false` |
|
||||
| SWR fetch bloque le rendu initial de la note | Moyenne | Moyenne | Suspense avec skeleton loader ; ne pas bloquer le rendu éditeur ; lazy-mount après 500ms |
|
||||
| Note dans carnet avec 200+ notes — tableau trop long | Basse | Moyenne | Afficher les 20 premières notes avec `"Voir toutes les N notes dans le carnet"` CTA |
|
||||
| RTL — cellules du tableau cassées | Basse | Haute | `dir="auto"` sur le wrapper ; tester avec locale `fa` avant merge |
|
||||
|
||||
---
|
||||
|
||||
## 10. i18n — Clés à Ajouter / Supprimer
|
||||
|
||||
### 10.1 Clés à ajouter (EN/FR minimum)
|
||||
|
||||
| Clé | EN | FR |
|
||||
|-----|----|----|
|
||||
| `structuredViewBlock.insertLabel` | Structured View | Vue structurée du carnet |
|
||||
| `structuredViewBlock.insertDesc` | Embed your notebook's structured data | Intégrez les données structurées de votre carnet |
|
||||
| `structuredViewBlock.noSchema` | This notebook has no structured view yet. Set one up from the notebook header. | Ce carnet n'a pas encore de vue structurée. Configurez-en une depuis l'en-tête du carnet. |
|
||||
| `structuredViewBlock.noNotebook` | This block requires a notebook. Move this note to a notebook first. | Ce bloc nécessite un carnet. Déplacez cette note dans un carnet pour l'utiliser. |
|
||||
| `structuredViewBlock.openInNotebook` | Open in notebook | Ouvrir dans le carnet |
|
||||
| `structuredViewBlock.displayModeTable` | Table | Tableau |
|
||||
| `structuredViewBlock.displayModeGallery` | Gallery | Galerie |
|
||||
| `structuredViewBlock.loadError` | Failed to load structured data. | Impossible de charger les données structurées. |
|
||||
| `structuredViewBlock.retry` | Retry | Réessayer |
|
||||
| `structuredViewBlock.deprecatedBlock` | Outdated block removed. | Bloc obsolète retiré. |
|
||||
|
||||
> **Note :** Si l'utilisateur demande à compléter les 15 locales, ne remplir que les clés — laisser la traduction des 13 autres locales à l'outil de traduction externe (règle AGENTS.md).
|
||||
|
||||
### 10.2 Clés à supprimer (après vérification pas d'autre consommateur)
|
||||
|
||||
`databaseBlock.title`, `databaseBlock.viewTable`, `databaseBlock.viewCards`, `databaseBlock.hint`, `databaseBlock.colAuthor`, `databaseBlock.colWorks`, `databaseBlock.colRollup`, `databaseBlock.noLinkedWorks`, `databaseBlock.deleteShort`, `databaseBlock.addAuthor`, `databaseBlock.authorPlaceholder`, `databaseBlock.createAuthor`, `databaseBlock.worksBase`, `databaseBlock.storedCount`, `databaseBlock.addWork`, `databaseBlock.bookTitlePlaceholder`, `databaseBlock.selectAuthor`, `databaseBlock.tagPlaceholder`, `databaseBlock.coverPlaceholder`, `databaseBlock.insertWork`, `databaseBlock.deleteCard`, `databaseBlock.insertFailed`, `databaseBlock.defaultTag`
|
||||
|
||||
---
|
||||
|
||||
## 11. Checklist QA Manuelle
|
||||
|
||||
### 11.1 Français (LTR)
|
||||
|
||||
- [ ] Taper `/database` dans une note d'un carnet structuré → bloc s'insère avec les données réelles
|
||||
- [ ] Taper `/database` → même résultat (rétrocompatibilité keyword)
|
||||
- [ ] Taper `/database` dans une note sans carnet → message "nécessite un carnet"
|
||||
- [ ] Taper `/database` dans une note d'un carnet sans schéma → callout wizard avec lien
|
||||
- [ ] Ouvrir une note avec un ancien bloc `databaseBlock` → note s'ouvre, bloc absent ou placeholder, pas de crash
|
||||
- [ ] Menu "Transformer en" → option "Vue structurée" présente, option "Base de données" (ancienne) absente
|
||||
- [ ] Bascule Table ↔ Galerie dans le bloc → vue change, pas de réinsertion du bloc
|
||||
- [ ] `npm run build` → 0 erreur, aucun import vers fichiers supprimés
|
||||
|
||||
### 11.2 Persan / RTL (fa)
|
||||
|
||||
- [ ] Changer la langue en `fa` → libellés du bloc en persan
|
||||
- [ ] Le bloc wrapper est `dir="auto"` → tableau aligné à droite
|
||||
- [ ] Cellules du tableau RTL lisibles (pas de texte coupé)
|
||||
- [ ] Callout "no schema" en persan → texte lisible RTL
|
||||
|
||||
---
|
||||
|
||||
## 12. Estimation Effort
|
||||
|
||||
| Tâche | Taille |
|
||||
|-------|--------|
|
||||
| Supprimer 3 fichiers legacy | XS |
|
||||
| Patcher `rich-text-editor.tsx` + `block-action-menu.tsx` | S |
|
||||
| Patcher `note-content-area.tsx` (`notebookId` prop) | XS |
|
||||
| Créer `tiptap-structured-view-block-extension.tsx` | S |
|
||||
| Créer `structured-view-block-embed.tsx` (SWR + états + RTL) | M |
|
||||
| i18n EN + FR | XS |
|
||||
| QA manuelle FR + fa | S |
|
||||
| **Total estimé** | **M** (~1–2 jours dev) |
|
||||
|
||||
---
|
||||
|
||||
## 13. Décisions Produit Actées
|
||||
|
||||
### Édition inline — ACTIVÉE en v1
|
||||
L'utilisateur peut modifier les valeurs simples directement dans le bloc (checkbox, select, texte court). Les changements se sauvegardent via `PATCH /api/notes/:id/properties` avec mise à jour optimiste. C'est la meilleure expérience utilisateur — un bloc en lecture seule n'aurait aucun intérêt.
|
||||
|
||||
### Kanban inline — REPORTÉ en v2
|
||||
Table + Galerie uniquement en v1. Le drag-and-drop dans un NodeView TipTap crée de mauvaises interactions. Le Kanban s'utilisera depuis le carnet comme aujourd'hui.
|
||||
|
||||
---
|
||||
|
||||
## Annexe — Diff Proposé pour `docs/story-nextgen-editor.md`
|
||||
|
||||
Remplacer la section `### US-4: Bloc de Base de Données Relationnelle Inline` (lignes 71–85) par :
|
||||
|
||||
```markdown
|
||||
### US-4: Vue Structurée de Carnet Inline *(Redesign — voir `docs/story-nextgen-editor-us4-redesign.md`)*
|
||||
|
||||
> ⚠️ **DEPRECATED** — La spécification précédente (bloc "Auteurs & Œuvres") est rejetée.
|
||||
> Voir [`docs/story-nextgen-editor-us4-redesign.md`](./story-nextgen-editor-us4-redesign.md) pour la nouvelle spec.
|
||||
|
||||
**En tant que** rédacteur dans un carnet structuré,
|
||||
**Je veux** insérer une vue en lecture de mon tableau de notes directement dans le corps de ma note,
|
||||
**Afin de** voir mes données structurées en contexte, sans quitter l'éditeur.
|
||||
|
||||
*(Critères d'acceptation détaillés dans le fichier redesign ci-dessus.)*
|
||||
```
|
||||
|
||||
Et remplacer la section `### 1. Structure du Nœud de Base de Données Tiptap` + `### 2.` + `### 3.` dans les Spécifications Techniques (lignes 90–109) par :
|
||||
|
||||
```markdown
|
||||
### 1. Structure du Nœud `structuredViewBlock` (TipTap)
|
||||
Extension TipTap `StructuredViewBlockExtension` dans `tiptap-structured-view-block-extension.tsx` :
|
||||
- Attributs : `notebookId` (string), `displayMode` ('table'|'gallery'), `filterJson` (string JSON)
|
||||
- ReactNodeViewRenderer → `structured-view-block-embed.tsx`
|
||||
|
||||
### 2. Suppression du code legacy
|
||||
- Supprimer : `tiptap-database-block-extension.tsx`, `database-block-editor.tsx`, `lib/editor/database-block-types.ts`
|
||||
- Modifier : `rich-text-editor.tsx`, `block-action-menu.tsx`, `locales/*.json`
|
||||
- Voir plan complet dans `docs/story-nextgen-editor-us4-redesign.md` §8.
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Annexe — Diff Proposé pour `docs/user-stories.md`
|
||||
|
||||
### Dans le tableau de bord (ligne 23)
|
||||
|
||||
```diff
|
||||
-| **US-NEXTGEN-EDITOR** | Éditeur Next-Gen : Drag Handle + Menu Bloc + DB Inline + Smart Paste | 🚧 **PLANIFIÉ** | Voir `docs/story-nextgen-editor.md` |
|
||||
+| **US-NEXTGEN-EDITOR** | Éditeur Next-Gen : Drag Handle + Menu Bloc + Vue Structurée Inline + Smart Paste | 🚧 **PLANIFIÉ** | Voir `docs/story-nextgen-editor.md` + `docs/story-nextgen-editor-us4-redesign.md` |
|
||||
```
|
||||
|
||||
### Dans la section US-NEXTGEN-EDITOR (US-4, ligne 622–626)
|
||||
|
||||
```diff
|
||||
-### US-4 : Bloc de Base de Données Relationnelle Inline
|
||||
-- Slash `/database` → insère un React NodeView
|
||||
-- Vues Tableau / Fiches avec Rollup dynamique
|
||||
-- Modèle relationnel local (auteurs/livres par défaut, ou lié au carnet)
|
||||
+### US-4 : Vue Structurée de Carnet Inline *(Redesign)*
|
||||
+> Spec complète : [`docs/story-nextgen-editor-us4-redesign.md`](./story-nextgen-editor-us4-redesign.md)
|
||||
+- Slash `/database` (+ keywords `db`, `tableau`, `structured`) → insère un `structuredViewBlock`
|
||||
+- Affiche Table ou Galerie du carnet courant via l'API Structured Views existante
|
||||
+- Bloc stocke uniquement `notebookId` + `displayMode` (pas de données en attrs)
|
||||
+- Graceful fallback si carnet sans schéma ou note sans carnet
|
||||
+- Supprime le code legacy `tiptap-database-block-extension.tsx` (Verne/Liu Cixin)
|
||||
+- **Dépend de :** US-STRUCTURED-VIEWS ✅ (livré)
|
||||
```
|
||||
|
||||
### Dans la liste de fichiers (ligne 627–631)
|
||||
|
||||
```diff
|
||||
-### Fichiers
|
||||
-- `[NEW]` `tiptap-drag-handle-plugin.ts` — Plugin ProseMirror pur
|
||||
-- `[NEW]` `tiptap-database-block-extension.tsx` — NodeView React
|
||||
-- `[MODIFY]` `rich-text-editor.tsx` — Intégration drag handle + DB + paste intercept
|
||||
-- `[MODIFY]` `globals.css` — Gutter, poignée, glassmorphic dropdowns
|
||||
+### Fichiers
|
||||
+- `[NEW]` `tiptap-drag-handle-plugin.ts` — Plugin ProseMirror pur (US-1, inchangé)
|
||||
+- `[NEW]` `tiptap-structured-view-block-extension.tsx` — NodeView Vue Structurée (remplace DB)
|
||||
+- `[NEW]` `structured-view-block-embed.tsx` — Composant embed avec SWR + states
|
||||
+- `[DELETE]` `tiptap-database-block-extension.tsx` — Bloc legacy auteurs/œuvres rejeté
|
||||
+- `[DELETE]` `database-block-editor.tsx` — UI legacy rejetée
|
||||
+- `[DELETE]` `lib/editor/database-block-types.ts` — Types legacy rejetés
|
||||
+- `[MODIFY]` `rich-text-editor.tsx` — Intégration drag handle + Vue Structurée + paste intercept
|
||||
+- `[MODIFY]` `note-content-area.tsx` — Passer `notebookId` à l'éditeur
|
||||
+- `[MODIFY]` `block-action-menu.tsx` — Remplacer option "Database" par "Vue structurée"
|
||||
+- `[MODIFY]` `globals.css` — Gutter, poignée, glassmorphic dropdowns
|
||||
```
|
||||
@@ -10,12 +10,12 @@
|
||||
|
||||
## Context
|
||||
|
||||
L'éditeur de notes actuel de Momento est construit sur [rich-text-editor.tsx](file:///home/devparsa/dev/Momento/memento-note/components/rich-text-editor.tsx) avec Tiptap/ProseMirror. Bien qu'il supporte des fonctionnalités avancées (Blocs Vivants, Résonance Sémantique), l'interaction utilisateur de saisie reste celle d'un traitement de texte classique (document linéaire à curseur unique).
|
||||
L'éditeur de notes actuel de Memento est construit sur [rich-text-editor.tsx](file:///home/devparsa/dev/Memento/memento-note/components/rich-text-editor.tsx) avec Tiptap/ProseMirror. Bien qu'il supporte des fonctionnalités avancées (Blocs Vivants, Résonance Sémantique), l'interaction utilisateur de saisie reste celle d'un traitement de texte classique (document linéaire à curseur unique).
|
||||
|
||||
Pour offrir une expérience de saisie supérieure à celle de Notion (plus performante, plus fluide à l'écriture) tout en conservant les avantages de la manipulation de blocs, nous implémentons une approche hybride :
|
||||
1. **Gutter & Drag Handle Flottant :** Au lieu d'avoir un composant React lourd pour chaque paragraphe (comme dans Notion), un unique bouton de poignée de glissement suit le curseur de la souris dans la marge de l'éditeur en ProseMirror pur, éliminant tout décalage à la saisie.
|
||||
2. **Transclusion au Collage :** Faciliter la création de Blocs Vivants en interceptant les liens de blocs copiés et en proposant de les coller en tant que transclusion synchrone.
|
||||
3. **Bloc Database Inline :** Porter le composant de base de données relationnelle du prototype [ModernBlockNoteEditor.tsx](file:///home/devparsa/dev/Momento/architectural-grid1/src/components/ModernBlockNoteEditor.tsx#L1711) pour permettre aux utilisateurs d'insérer des tableaux/fiches interactives avec Rollups dynamiques directement au sein de leurs notes.
|
||||
3. **Bloc Database Inline :** Porter le composant de base de données relationnelle du prototype [ModernBlockNoteEditor.tsx](file:///home/devparsa/dev/Memento/architectural-grid1/src/components/ModernBlockNoteEditor.tsx#L1711) pour permettre aux utilisateurs d'insérer des tableaux/fiches interactives avec Rollups dynamiques directement au sein de leurs notes.
|
||||
|
||||
---
|
||||
|
||||
@@ -27,7 +27,7 @@ Pour offrir une expérience de saisie supérieure à celle de Notion (plus perfo
|
||||
**Afin de** pouvoir réordonner mes blocs par glisser-déposer de manière fluide.
|
||||
|
||||
#### Critères d'Acceptation :
|
||||
* **Étant donné** que j'ai une note ouverte dans l'éditeur de Momento
|
||||
* **Étant donné** que j'ai une note ouverte dans l'éditeur de Memento
|
||||
* **Quand** je survole une ligne de texte (paragraphe, titre, liste, citation, etc.) avec mon curseur de souris
|
||||
* **Alors** une poignée de glissement (`::drag-handle` flottante) apparaît dans le gutter gauche à la hauteur exacte du bloc survolé
|
||||
* **Et** le bouton suit mes déplacements de souris d'un bloc à l'autre sans latence et sans dupliquer les nœuds DOM (une seule poignée réutilisée)
|
||||
@@ -64,48 +64,62 @@ Pour offrir une expérience de saisie supérieure à celle de Notion (plus perfo
|
||||
* **Quand** je colle (Ctrl+V ou Cmd+V) ce lien dans un paragraphe vide d'une autre note
|
||||
* **Alors** un petit menu interactif en ligne s'affiche : *"Coller en tant que Bloc Connecté (Live)"* ou *"Coller en tant que texte / lien simple"*
|
||||
* **Quand** je sélectionne *"Bloc Connecté"*,
|
||||
* **Alors** le bloc ProseMirror est remplacé par un nœud de type `liveBlock` (provenant de notre [LiveBlockExtension](file:///home/devparsa/dev/Momento/memento-note/components/tiptap-live-block-extension.tsx#L159)) synchronisant le contenu en temps réel.
|
||||
* **Alors** le bloc ProseMirror est remplacé par un nœud de type `liveBlock` (provenant de notre [LiveBlockExtension](file:///home/devparsa/dev/Memento/memento-note/components/tiptap-live-block-extension.tsx#L159)) synchronisant le contenu en temps réel.
|
||||
|
||||
---
|
||||
|
||||
### US-4: Bloc de Base de Données Relationnelle Inline
|
||||
**En tant que** chef de projet ou gestionnaire de données,
|
||||
**Je veux** pouvoir insérer une base de données relationnelle interactive directement au milieu de mon texte, basculer ses vues et suivre des rollups,
|
||||
**Afin de** structurer mes informations complexes sans quitter le flux de ma note (comme simulé dans le prototype).
|
||||
### US-4: Base de Données Inline (`structuredViewBlock`)
|
||||
|
||||
> ⚠️ **Rejeté et supprimé :** l'ancien bloc marketing « Auteurs & Œuvres » (`tiptap-database-block-extension.tsx`, `database-block-editor.tsx`, `database-block-types.ts`).
|
||||
> **Spec historique embed-only carnet :** [`docs/story-nextgen-editor-us4-redesign.md`](./story-nextgen-editor-us4-redesign.md) — **non retenue** ; le produit livré est le **dual-mode** ci-dessous.
|
||||
|
||||
**En tant que** rédacteur,
|
||||
**Je veux** insérer un tableau interactif type Notion directement dans ma note, avec option de le lier au carnet structuré,
|
||||
**Afin de** gérer des données en contexte ou synchroniser avec les notes du carnet.
|
||||
|
||||
#### Deux modes (même nœud TipTap `structuredViewBlock`) :
|
||||
|
||||
| Mode | Déclencheur par défaut | Données | UI |
|
||||
|------|------------------------|---------|-----|
|
||||
| **Base locale autonome** | `/database`, `/vue`, menu « Transformer en → Base de données » | Colonnes/lignes dans `localColumnsJson` / `localRowsJson` (attrs TipTap) | Tableau éditable, analyses, Memory Echo, conversion en carnet |
|
||||
| **Vue liée au carnet** | Bouton « Lier à un carnet » ou sélecteur de carnet | API schéma + notes du carnet (`notebookId`) | Table / Galerie via `StructuredViewsContainer` |
|
||||
|
||||
#### Critères d'Acceptation :
|
||||
* **Étant donné** que j'utilise l'éditeur de Momento
|
||||
* **Quand** je saisis `/database` ou sélectionne "Base de données" dans le menu d'insertion
|
||||
* **Alors** un bloc `databaseBlock` est inséré sous forme d'un React NodeView
|
||||
* **Et** il propose par défaut un modèle relationnel "Auteurs & Œuvres" (avec des données simulées ou liées au carnet actuel)
|
||||
* **Quand** je clique sur le sélecteur de vue en haut à droite du bloc
|
||||
* **Alors** je peux basculer entre la vue **Tableau** (grille avec colonnes de propriétés) et la vue **Fiches** (cartes illustrées de couvertures, tags et auteurs)
|
||||
* **Et** la colonne **Rollup Count** de la vue Tableau recalcule dynamiquement le nombre de livres liés à chaque auteur au fur et à mesure que j'ajoute ou supprime des fiches
|
||||
* **Et** un formulaire d'insertion rapide en bas du bloc me permet d'ajouter des livres ou des auteurs à ce modèle relationnel local.
|
||||
* **Étant donné** une note ouverte, **quand** je tape `/database` ou `/vue`, **alors** un bloc **base locale autonome** s'insère (tableau vide éditable, pas de démo Auteurs/Œuvres).
|
||||
* **Étant donné** un bloc local, **quand** je clique « Lier à un carnet », **alors** je peux afficher la vue structurée d'un carnet (table/galerie, données réelles).
|
||||
* **Étant donné** un carnet lié sans schéma, **alors** callout vers le wizard — pas de crash.
|
||||
* **Étant donné** un ancien `databaseBlock` HTML, **alors** migration vers bloc local par défaut — note charge sans crash.
|
||||
* **Étant donné** n'importe quelle locale (dont `fa`), **alors** tous les libellés UI passent par i18n (`structuredViewBlock.*`) — pas de texte FR en dur dans l'embed.
|
||||
|
||||
---
|
||||
|
||||
## Spécifications Techniques d'Implémentation
|
||||
|
||||
### 1. Structure du Nœud de Base de Données Tiptap (`DatabaseBlock`)
|
||||
Créer une extension Tiptap personnalisée `DatabaseBlockExtension` dans `/components/tiptap-database-block-extension.tsx` qui :
|
||||
- Gère un groupe `block`, se comporte comme un atome (non modifiable directement en texte brut).
|
||||
- Conserve les attributs : `dbId` (string), `dbView` ('table' | 'card'), `dbAuthors` (array) et `dbBooks` (array) représentant le schéma et les valeurs.
|
||||
- Utilise un `ReactNodeViewRenderer` pour monter notre composant d'édition de base de données relationnelle en React pur.
|
||||
### 1. Structure du Nœud `structuredViewBlock` (TipTap) — *US-4*
|
||||
|
||||
### 2. Le Plugin Drag Handle & Gutter en ProseMirror
|
||||
Extension `StructuredViewBlockExtension` (`tiptap-structured-view-block-extension.tsx`) :
|
||||
- Attributs partagés : `notebookId`, `displayMode` ('table'|'gallery'), `filterJson`
|
||||
- Mode local : `isLocal: true`, `localColumnsJson`, `localRowsJson` (insertion par défaut)
|
||||
- Mode carnet : `isLocal: false`, `notebookId` renseigné
|
||||
- NodeView React → `structured-view-block-embed.tsx` (dual-mode, i18n complet)
|
||||
|
||||
### 2. Le Plugin Drag Handle & Gutter en ProseMirror *(US-1, inchangé)*
|
||||
Développer un plugin custom dans `/components/tiptap-drag-handle-plugin.ts` :
|
||||
* Attacher un écouteur d'événements `mouseover` et `mousemove` sur l'éditeur ProseMirror.
|
||||
* Utiliser `view.posAtCoords` pour localiser le nœud ProseMirror survolé.
|
||||
* Récupérer son DOM parent et calculer sa hauteur et son décalage vertical.
|
||||
* Repositionner l'élément HTML de la poignée en modifiant ses styles CSS `top` et `left` (le bouton est monté au niveau de l'éditeur parent en absolute, évitant d'être injecté dans le texte éditable).
|
||||
* Gérer le glissement avec l'API HTML5 Drag and Drop couplée aux transactions de ProseMirror (`tr.replaceWith` ou `MoverBlock`).
|
||||
* Attacher un écouteur `mouseover` et `mousemove` sur l'éditeur ProseMirror.
|
||||
* Utiliser `view.posAtCoords` pour localiser le nœud survolé.
|
||||
* Repositionner l'élément HTML de la poignée en modifiant ses styles CSS `top` et `left`.
|
||||
* Gérer le glissement avec `@tiptap/extension-drag-handle-react` (spec officielle).
|
||||
|
||||
### 3. Fichiers à modifier / créer :
|
||||
* `[NEW]` `memento-note/components/tiptap-drag-handle-plugin.ts` — Plugin de poignée Gutter
|
||||
* `[NEW]` `memento-note/components/tiptap-database-block-extension.tsx` — Nœud et composant DatabaseBlockEditor
|
||||
* `[MODIFY]` `memento-note/components/rich-text-editor.tsx` — Intégration du Drag Handle, de la DatabaseBlockExtension et de l'interception du presse-papier dans `editorProps.handlePaste`
|
||||
* `[MODIFY]` `memento-note/app/globals.css` — Ajout des classes CSS pour l'alignement précis du gutter, de la poignée, et du bloc de base de données (glassmorphic dropdowns et fiches).
|
||||
### 3. Fichiers à modifier / créer / supprimer :
|
||||
* `[NEW]` `memento-note/components/tiptap-drag-handle-plugin.ts` — Plugin Gutter (US-1)
|
||||
* `[LIVRÉ]` `memento-note/components/tiptap-structured-view-block-extension.tsx` — Nœud dual-mode
|
||||
* `[LIVRÉ]` `memento-note/components/structured-view-block-embed.tsx` — UI base locale + vue carnet
|
||||
* `[DELETE]` legacy `database-block-*` (Auteurs & Œuvres)
|
||||
* `[MODIFY]` `memento-note/locales/en.json` + `fr.json` — clés `structuredViewBlock.*` (i18n embed)
|
||||
* `[MODIFY]` `memento-note/components/note-content-area.tsx` — `notebookId` → éditeur
|
||||
* `[MODIFY]` `memento-note/components/rich-text-editor.tsx` — slash `/database` + `/vue`
|
||||
* `[MODIFY]` `memento-note/components/block-action-menu.tsx` — « Transformer en → Base de données »
|
||||
* `[MODIFY]` `memento-note/app/globals.css` — Gutter, poignée, glassmorphic dropdowns
|
||||
|
||||
---
|
||||
|
||||
@@ -115,4 +129,9 @@ Développer un plugin custom dans `/components/tiptap-drag-handle-plugin.ts` :
|
||||
1. **Vérification Gutter :** Survoler des textes longs et vérifier que la poignée se positionne correctement à gauche. Glisser un paragraphe sur un autre et valider le réordonnancement.
|
||||
2. **Vérification Menu :** Cliquer sur la poignée, dupliquer le bloc, supprimer le bloc, et le transformer en d'autres types.
|
||||
3. **Vérification Paste :** Copier une référence de bloc, la coller, et vérifier que la transclusion est proposée et s'insère sous forme de `LiveBlock`.
|
||||
4. **Vérification Base de Données Inline :** Insérer le bloc base de données, ajouter un auteur, ajouter un livre avec cet auteur, vérifier le bon calcul du rollup, et basculer en vue Fiches pour vérifier l'affichage des couvertures.
|
||||
4. **Vérification Base inline (US-4) :**
|
||||
- `/database` ou `/vue` → base locale autonome (tableau éditable, design actuel).
|
||||
- « Lier à un carnet » → vue table/galerie du carnet choisi.
|
||||
- Carnet sans schéma → callout wizard.
|
||||
- Ancien `databaseBlock` → charge sans crash.
|
||||
- Locale `fa` → libellés i18n, RTL (`dir="auto"`).
|
||||
|
||||
315
docs/story-onboarding-activation.md
Normal file
315
docs/story-onboarding-activation.md
Normal file
@@ -0,0 +1,315 @@
|
||||
# Story: Onboarding & Activation — Wizard "Aha! Moment"
|
||||
|
||||
> **Epic:** Epic 6 — Croissance & Activation (PLG)
|
||||
> **ID:** US-ONBOARDING
|
||||
> **Priority:** Critical — Beta Blocker
|
||||
> **Status:** done
|
||||
> **Depends on:** Stripe (3.6 ✅), Redis Quotas (3.1 ✅), Semantic Search (existant ✅)
|
||||
> **Blocks:** Toutes les métriques d'activation
|
||||
|
||||
---
|
||||
|
||||
## Contexte
|
||||
|
||||
Memento dispose d'un moteur IA, d'un éditeur riche, de carnets, et d'un système de quotas. Mais aucun utilisateur nouveau n'est guidé vers l'expérience "Aha!" décrite dans le GTM :
|
||||
|
||||
> *"Tapez une question. Retrouvez une note que vous aviez oubliée."*
|
||||
|
||||
Sans onboarding, le taux d'activation sera faible même avec un produit excellent. Un utilisateur qui arrive sur `/home` sans notes ne comprend pas ce que Memento fait. Le wizard doit :
|
||||
|
||||
1. Créer des **données de démo** (5 notes exemple dans sa langue) si l'utilisateur arrive avec un carnet vide
|
||||
2. Guider vers la **Recherche Sémantique** en 2 clics (l'effet "Aha!")
|
||||
3. Afficher la **progression du Starter Pack** pour créer l'urgence de conversion
|
||||
4. **Ne jamais bloquer** l'utilisateur — skip à tout moment
|
||||
|
||||
**Modèle Prisma actuel :** Le champ `onboardingCompleted` n'existe pas sur `User`. Il faut une migration.
|
||||
|
||||
---
|
||||
|
||||
## Migration Prisma requise
|
||||
|
||||
```prisma
|
||||
model User {
|
||||
// ... champs existants ...
|
||||
onboardingCompleted Boolean @default(false)
|
||||
onboardingStep Int @default(0)
|
||||
}
|
||||
```
|
||||
|
||||
> ⚠️ Migration **additive uniquement** — safe, pas de perte de données.
|
||||
|
||||
---
|
||||
|
||||
## User Stories
|
||||
|
||||
### US-ONBOARDING-1 : Détection du premier usage
|
||||
|
||||
**En tant que** nouvel utilisateur,
|
||||
**Je veux** être reconnu comme nouveau dès ma première connexion,
|
||||
**Afin de** bénéficier d'une expérience guidée adaptée.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- **Étant donné** que je viens de créer mon compte (Google OAuth ou email)
|
||||
- **Quand** je me connecte pour la première fois
|
||||
- **Alors** `user.onboardingCompleted === false` est détecté côté serveur
|
||||
- **Et** l'app me redirige vers `/home?onboarding=1` (ou affiche le wizard en overlay)
|
||||
- **Et** si je rafraîchis la page, le wizard réapparaît (tant que `onboardingCompleted === false`)
|
||||
|
||||
---
|
||||
|
||||
### US-ONBOARDING-2 : Wizard 3 étapes
|
||||
|
||||
**En tant que** nouvel utilisateur,
|
||||
**Je veux** un guide en 3 étapes courtes qui me montre la valeur de Memento,
|
||||
**Afin de** comprendre pourquoi je devrais utiliser ce produit plutôt qu'un autre.
|
||||
|
||||
#### Étape 1 — "Bienvenue" (10 secondes)
|
||||
- Titre : *"Votre mémoire augmentée par l'IA"*
|
||||
- Sous-titre : *"Memento se souvient de ce que vous oubliez."*
|
||||
- CTA : `"Commencer →"` + lien `"Passer l'intro"`
|
||||
|
||||
#### Étape 2 — "Vos notes" (30 secondes)
|
||||
- **Si** l'utilisateur a 0 notes :
|
||||
- Proposer : `"Importer mes notes"` (Markdown/CSV) **ou** `"Créer 5 notes d'exemple"`
|
||||
- Si "notes d'exemple" → insérer 5 notes dans sa langue (voir contenu ci-dessous)
|
||||
- CTA : `"Mes notes sont prêtes →"`
|
||||
- **Si** l'utilisateur a ≥ 1 note :
|
||||
- Afficher : `"Parfait, vous avez déjà X notes ! Découvrons la magie."`
|
||||
- CTA : `"Continuer →"`
|
||||
|
||||
#### Étape 3 — "L'effet Aha!" (60 secondes — le plus important)
|
||||
- Titre : *"Retrouvez ce que vous avez oublié"*
|
||||
- Afficher la barre de recherche sémantique **mise en avant** (highlight animé)
|
||||
- Placer une requête exemple pré-remplie dans la langue détectée :
|
||||
- FR : *"notes sur ma productivité"* | EN : *"notes about productivity"*
|
||||
- FA : *"یادداشتهای بهرهوری"* (RTL)
|
||||
- L'utilisateur clique sur Rechercher → les résultats apparaissent
|
||||
- Afficher badge : `"✨ 1 recherche utilisée sur 30 (Starter Pack)"`
|
||||
- CTA final : `"Je comprends — Explorer Memento"`
|
||||
|
||||
#### Critères d'acceptation généraux :
|
||||
- Wizard rendu en overlay (`position: fixed`, z-index élevé) avec fond semi-transparent
|
||||
- Barre de progression `1/3 → 2/3 → 3/3` en haut du wizard
|
||||
- Bouton `"Passer"` (skip) visible à chaque étape → marque `onboardingCompleted = true` immédiatement
|
||||
- Responsive mobile (bottom sheet sur < 768px)
|
||||
- i18n : clés sous `onboarding.*` dans les 15 locales (EN + FR comme référence)
|
||||
- RTL correct pour `fa` et `ar`
|
||||
|
||||
---
|
||||
|
||||
### US-ONBOARDING-3 : Notes d'exemple multilingues
|
||||
|
||||
**En tant que** système,
|
||||
**Je veux** insérer 5 notes d'exemple pertinentes dans la langue de l'utilisateur,
|
||||
**Afin de** permettre immédiatement la démonstration de la recherche sémantique.
|
||||
|
||||
#### Contenu des 5 notes d'exemple (FR) :
|
||||
1. **"Réunion Q3 — Stratégie produit"** — texte sur roadmap, priorités, KPIs
|
||||
2. **"Idées de projets secondaires"** — liste d'idées créatives (app, podcast, etc.)
|
||||
3. **"Livres à lire — Recommandations"** — liste de titres avec résumés courts
|
||||
4. **"Notes de formation React"** — concepts techniques, hooks, bonnes pratiques
|
||||
5. **"Objectifs personnels 2025"** — texte de réflexion sur goals, habitudes
|
||||
|
||||
> Ces notes doivent être **vectorisées automatiquement** à l'insertion (même pipeline que les vraies notes) pour que la recherche sémantique fonctionne immédiatement.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- Route API : `POST /api/onboarding/seed-demo-notes`
|
||||
- Auth requise (`session.user.id`)
|
||||
- Idempotente : si des notes de démo existent déjà, ne pas re-créer (tag interne `isDemoNote: true` ou champ `isDemo Boolean @default(false)` sur `Note`)
|
||||
- Vectorisation déclenchée immédiatement (pas en background différé)
|
||||
- Les notes d'exemple sont supprimables normalement par l'utilisateur
|
||||
|
||||
---
|
||||
|
||||
### US-ONBOARDING-4 : Indicateur Starter Pack permanent
|
||||
|
||||
**En tant qu'** utilisateur free,
|
||||
**Je veux** voir en permanence combien de crédits IA il me reste,
|
||||
**Afin de** comprendre l'urgence de conversion au bon moment.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- Composant `<StarterPackBadge />` dans la sidebar (icône ⚡ + `"X crédits restants"`)
|
||||
- Visible uniquement pour les utilisateurs `plan === 'FREE'`
|
||||
- Mis à jour en temps réel après chaque action IA (via mutation React Query + invalidation)
|
||||
- Au passage sous 5 crédits : couleur orange + animation pulse
|
||||
- À 0 crédit : couleur rouge + CTA `"Passer Pro →"` (link vers `/settings/billing`)
|
||||
- Disparaît pour les utilisateurs Pro/Business/Enterprise
|
||||
|
||||
---
|
||||
|
||||
### US-ONBOARDING-5 : Fin de l'onboarding et état persistant
|
||||
|
||||
**En tant que** utilisateur,
|
||||
**Je veux** que le wizard ne réapparaisse jamais après que je l'ai complété ou sauté,
|
||||
**Afin de** ne pas être perturbé lors de mes usages suivants.
|
||||
|
||||
#### Critères d'acceptation :
|
||||
- À la fin de l'étape 3 (ou au clic "Passer") : appel `PATCH /api/users/me` avec `{ onboardingCompleted: true }`
|
||||
- `user.onboardingCompleted` est stocké en DB et inclus dans la session NextAuth
|
||||
- Le wizard ne s'affiche plus jamais après ce flag
|
||||
- Si l'utilisateur recrée un compte avec le même email, le flag est reset
|
||||
|
||||
---
|
||||
|
||||
## Fichiers à créer / modifier
|
||||
|
||||
| Fichier | Action | Notes |
|
||||
|---------|--------|-------|
|
||||
| `prisma/schema.prisma` | Modifier | Ajouter `onboardingCompleted` + `onboardingStep` sur `User` |
|
||||
| `prisma/migrations/...` | Créer | Migration additive (safe) |
|
||||
| `components/onboarding/onboarding-wizard.tsx` | Créer | Composant wizard 3 étapes |
|
||||
| `components/onboarding/onboarding-step-welcome.tsx` | Créer | Étape 1 |
|
||||
| `components/onboarding/onboarding-step-notes.tsx` | Créer | Étape 2 |
|
||||
| `components/onboarding/onboarding-step-aha.tsx` | Créer | Étape 3 (recherche sémantique) |
|
||||
| `components/onboarding/starter-pack-badge.tsx` | Créer | Indicateur crédits sidebar |
|
||||
| `app/api/onboarding/seed-demo-notes/route.ts` | Créer | Insertion notes d'exemple |
|
||||
| `app/api/users/me/route.ts` | Modifier | Ajouter support PATCH `onboardingCompleted` |
|
||||
| `components/providers-wrapper.tsx` | Modifier | Ajouter `<OnboardingWizard />` conditionnel |
|
||||
| `components/sidebar.tsx` | Modifier | Ajouter `<StarterPackBadge />` |
|
||||
| `locales/en.json` + `locales/fr.json` | Modifier | Clés `onboarding.*` + `starterPack.*` |
|
||||
| (autres 13 locales) | Modifier | Traductions onboarding |
|
||||
|
||||
---
|
||||
|
||||
## Clés i18n à créer (EN référence)
|
||||
|
||||
```json
|
||||
{
|
||||
"onboarding": {
|
||||
"welcome_title": "Your AI-augmented memory",
|
||||
"welcome_subtitle": "Memento remembers what you forget.",
|
||||
"welcome_cta": "Get started",
|
||||
"skip": "Skip intro",
|
||||
"step_notes_title": "Your notes",
|
||||
"step_notes_empty": "You have no notes yet. Import yours or start with examples.",
|
||||
"step_notes_import": "Import my notes",
|
||||
"step_notes_demo": "Create 5 example notes",
|
||||
"step_notes_has_notes": "You already have {count} notes. Let's discover the magic.",
|
||||
"step_notes_cta": "My notes are ready",
|
||||
"step_aha_title": "Find what you forgot",
|
||||
"step_aha_subtitle": "Type a question. Find a note you forgot.",
|
||||
"step_aha_placeholder": "notes about productivity...",
|
||||
"step_aha_cta": "Explore Memento",
|
||||
"progress": "{current} of {total}"
|
||||
},
|
||||
"starterPack": {
|
||||
"credits_remaining": "{count} credits left",
|
||||
"almost_empty": "Almost out of credits",
|
||||
"empty": "No credits left",
|
||||
"upgrade_cta": "Go Pro →"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Métriques à tracker (analytics events)
|
||||
|
||||
| Événement | Déclencheur | Propriétés |
|
||||
|-----------|------------|------------|
|
||||
| `onboarding_started` | Wizard affiché | `user_id`, `has_notes` |
|
||||
| `onboarding_step_completed` | Étape validée | `step` (1/2/3), `duration_ms` |
|
||||
| `onboarding_demo_notes_created` | 5 notes insérées | `user_id` |
|
||||
| `onboarding_search_performed` | Recherche étape 3 | `result_count` |
|
||||
| `onboarding_completed` | Wizard terminé | `skipped: false`, `total_duration_ms` |
|
||||
| `onboarding_skipped` | Bouton "Passer" | `at_step` |
|
||||
| `starter_pack_warning_shown` | < 5 crédits restants | `credits_left` |
|
||||
| `starter_pack_empty_shown` | 0 crédits | `user_id` |
|
||||
|
||||
---
|
||||
|
||||
## Notes d'implémentation
|
||||
|
||||
- Les **5 notes d'exemple** doivent être vectorisées **synchroniquement** (pas en cron job) pour que la démonstration fonctionne immédiatement
|
||||
- La **recherche sémantique étape 3** doit utiliser le vrai pipeline pgvector (pas un mock) — si la vectorisation est async, afficher un spinner et attendre
|
||||
- Le wizard est un **overlay** (pas une page dédiée) pour ne pas briser la navigation back/forward
|
||||
- Sur mobile : utiliser un **bottom sheet** animé au lieu d'un modal centré
|
||||
- Le flag `onboardingCompleted` doit être présent dans le token JWT NextAuth (via `callbacks.jwt` et `callbacks.session`) pour éviter un appel DB à chaque render
|
||||
|
||||
---
|
||||
|
||||
## Dev Agent Record
|
||||
|
||||
### Implementation Notes
|
||||
|
||||
Implémentation complète réalisée en session. Toutes les US-ONBOARDING 1-5 sont satisfaites :
|
||||
|
||||
- **US-ONBOARDING-1** : `onboardingCompleted` et `onboardingStep` ajoutés au schéma Prisma (migration additive), exposés via JWT/session NextAuth.
|
||||
- **US-ONBOARDING-2** : Wizard 3 étapes (`OnboardingWizard`) — overlay fixe z-200, backdrop blur, bottom sheet mobile, AnimatePresence, progress dots.
|
||||
- **US-ONBOARDING-3** : Route `POST /api/onboarding/seed-demo-notes` — 5 notes fr/en/fa, embeddings synchrones, idempotent.
|
||||
- **US-ONBOARDING-4** : `StarterPackBadge` intégré dans la sidebar, visible uniquement pour les plans FREE, pulse orange < 5 crédits, rouge à 0.
|
||||
- **US-ONBOARDING-5** : `PATCH /api/user/me` + `useSession().update()` — flag persisté en DB et JWT, wizard disparu au refresh.
|
||||
|
||||
### Files Created/Modified
|
||||
|
||||
**Created:**
|
||||
- `memento-note/prisma/migrations/20260529060000_add_onboarding_fields/migration.sql`
|
||||
- `memento-note/app/api/user/me/route.ts`
|
||||
- `memento-note/app/api/onboarding/seed-demo-notes/route.ts`
|
||||
- `memento-note/components/onboarding/onboarding-step-welcome.tsx`
|
||||
- `memento-note/components/onboarding/onboarding-step-notes.tsx`
|
||||
- `memento-note/components/onboarding/onboarding-step-aha.tsx`
|
||||
- `memento-note/components/onboarding/onboarding-wizard.tsx`
|
||||
- `memento-note/components/onboarding/starter-pack-badge.tsx`
|
||||
|
||||
**Modified:**
|
||||
- `memento-note/prisma/schema.prisma`
|
||||
- `memento-note/auth.ts`
|
||||
- `memento-note/auth.config.ts`
|
||||
- `memento-note/locales/*.json` (15 fichiers, clés `onboarding.*`)
|
||||
- `memento-note/components/providers-wrapper.tsx`
|
||||
- `memento-note/components/sidebar.tsx`
|
||||
- `docs/sprint-status.yaml`
|
||||
- `docs/user-stories.md`
|
||||
|
||||
### Change Log
|
||||
|
||||
- 2026-05-29: Implémentation complète story 6-1-onboarding-activation — DB migration, auth JWT, APIs, i18n 15 locales, wizard 3 étapes, StarterPackBadge, intégration providers + sidebar. 134 tests unitaires passés, 0 régression.
|
||||
|
||||
---
|
||||
|
||||
## Senior Developer Review (AI)
|
||||
|
||||
**Date:** 2026-05-29
|
||||
**Outcome:** Approved — all issues resolved
|
||||
**Layers:** Blind Hunter ✅ | Edge Case Hunter ✅ | Acceptance Auditor ✅
|
||||
|
||||
### Action Items
|
||||
|
||||
**Decision-Needed (4)**
|
||||
- [x] [Review][Decision] D1 — dismissed: dots animated are acceptable UX — Progress indicator: dots actuels vs texte "1/3 → 2/3 → 3/3" exigé par la spec — les dots sont UX-valides mais la spec est explicite
|
||||
- [x] [Review][Decision] D2 — dismissed: import stub acceptable, future story — Bouton "Importer mes notes" avance à l'étape 3 (onNext) au lieu d'ouvrir un vrai flux d'import — import peut être hors scope de cette story
|
||||
- [x] [Review][Decision] D3 — dismissed: client locale equiv to server-detected — Locale seed-demo-notes vient du body client vs `initialLanguage` serveur — client envoie `language` depuis LanguageProvider qui a été initialisé côté serveur (peut être équivalent)
|
||||
- [x] [Review][Decision] D4 — resolved: added withTimeout(6s) per embedding call — 5 embeddings synchrones dans un seul handler HTTP — intentionnel (notes cherchables immédiatement) mais peut dépasser le timeout serveur (10s Vercel)
|
||||
|
||||
**Patches (17)**
|
||||
|
||||
*HIGH*
|
||||
- [x] [Review][Patch] H1 — `countOnly` param non implémenté dans `/api/notes` → `getNoteCount()` retourne toujours 0 → step 2 toujours "pas de notes" [onboarding-wizard.tsx:22 + app/api/notes/route.ts]
|
||||
- [x] [Review][Patch] H2 — `tier` est `'BASIC'` jamais `'FREE'` → `StarterPackBadge` retourne `null` pour tous les utilisateurs [starter-pack-badge.tsx:28]
|
||||
- [x] [Review][Patch] H3 — `QuotaExceededError` silencieusement avalé → user voit "No results" sans feedback de quota dépassé [onboarding-step-aha.tsx:55]
|
||||
|
||||
*MED*
|
||||
- [x] [Review][Patch] M1 — Race condition: deux POST simultanés passent tous deux le check `existing.length >= 5` → création de 10 notes [seed-demo-notes/route.ts:~252]
|
||||
- [x] [Review][Patch] M2 — `setVisible(false)` avant `markOnboardingComplete()` complète → si PATCH échoue et user refresh, wizard réapparaît [onboarding-wizard.tsx:50]
|
||||
- [x] [Review][Patch] M3 — `markOnboardingComplete()` ne throw pas sur non-2xx → `updateSession()` s'exécute quand même → wizard revient après rotation du token [onboarding-wizard.tsx:14]
|
||||
- [x] [Review][Patch] M4 — Empty input déclenche une vraie recherche sémantique (crédits consommés) via le placeholder [onboarding-step-aha.tsx:42]
|
||||
- [x] [Review][Patch] M5 — `useSession().update({ onboardingCompleted, aiSessionConsent })` en un seul appel : les deux branches `trigger=update` sont des early-returns mutuellement exclusifs → seule la première clé est traitée [auth.ts JWT callback]
|
||||
- [x] [Review][Patch] M6 — `PATCH /api/user/me` accepte `onboardingStep` sans validation du type (peut recevoir une string, un float, ou négatif) [user/me/route.ts:~42]
|
||||
- [x] [Review][Patch] M7 — Idempotency partielle: si un appel précédent a créé 3 notes puis échoué, le suivant crée 2 nouvelles sans déduplication par titre [seed-demo-notes/route.ts]
|
||||
- [x] [Review][Patch] M8 — Animate-out cassé: `if (!visible) return null` est évalué avant `AnimatePresence` → le composant disparaît immédiatement sans animation de sortie [onboarding-wizard.tsx:68]
|
||||
|
||||
*Spec/i18n*
|
||||
- [x] [Review][Patch] S1 — Badge "✨ 1 recherche utilisée" absent après la recherche (spec US-ONBOARDING-2 Étape 3) [onboarding-step-aha.tsx]
|
||||
- [x] [Review][Patch] S2 — Champ de recherche commence vide au lieu d'être pré-rempli (spec: "champ pré-rempli") [onboarding-step-aha.tsx:40]
|
||||
- [x] [Review][Patch] S3 — Bouton recherche icône seule sans libellé "Chercher" ni aria-label [onboarding-step-aha.tsx:101]
|
||||
- [x] [Review][Patch] S4 — Seuil d'avertissement `<= 5` devrait être `< 5` (≤ 4) selon spec [starter-pack-badge.tsx:33]
|
||||
- [x] [Review][Patch] S5 — "No results — try another query." hardcodé en anglais, non passé par `t()` [onboarding-step-aha.tsx:123]
|
||||
- [x] [Review][Patch] S6 — `.replace('{count}', ...)` au lieu de `t(key, { count })` — bypass API i18n du projet [onboarding-step-notes.tsx:61]
|
||||
|
||||
**Deferred (2)**
|
||||
- [x] [Review][Defer] W1 — Session version check bypassed by trigger=update — préexistant, pas introduit par cette story [auth.ts] — deferred, pre-existing
|
||||
- [x] [Review][Defer] W2 — `isMarkdown: true` avec contenu HTML — format préexistant utilisé par l'app pour d'autres notes [seed-demo-notes/route.ts] — deferred, pre-existing
|
||||
|
||||
**Dismissed (1)**
|
||||
- StarterPackBadge sans error handling fetch — React Query gère les erreurs via son state interne, composant retourne null si !data
|
||||
@@ -1,8 +1,8 @@
|
||||
# Momento — Guide Stripe : Configuration, Architecture et Utilisation
|
||||
# Memento — Guide Stripe : Configuration, Architecture et Utilisation
|
||||
|
||||
## Vue d'ensemble
|
||||
|
||||
Momento utilise **Stripe** pour la gestion des abonnements payants (Pro, Business, Enterprise). Le système repose sur :
|
||||
Memento utilise **Stripe** pour la gestion des abonnements payants (Pro, Business, Enterprise). Le système repose sur :
|
||||
|
||||
- **Stripe Embedded Checkout** (modal dans l'app, sans redirection)
|
||||
- **Webhooks** pour synchroniser l'état des abonnements en temps réel
|
||||
@@ -86,11 +86,11 @@ Momento utilise **Stripe** pour la gestion des abonnements payants (Pro, Busines
|
||||
|
||||
Dans le **Stripe Dashboard** → **Produits** :
|
||||
|
||||
#### Produit 1 : Momento Pro
|
||||
#### Produit 1 : Memento Pro
|
||||
|
||||
| Champ | Valeur |
|
||||
|-------|--------|
|
||||
| Nom | Momento Pro |
|
||||
| Nom | Memento Pro |
|
||||
| Description | Pour les consultants et créateurs exigeants |
|
||||
|
||||
Créer **2 prix** :
|
||||
@@ -100,11 +100,11 @@ Créer **2 prix** :
|
||||
| Pro Mensuel | 9,90 EUR | Tous les mois |
|
||||
| Pro Annuel | 99 EUR | Tous les ans |
|
||||
|
||||
#### Produit 2 : Momento Business
|
||||
#### Produit 2 : Memento Business
|
||||
|
||||
| Champ | Valeur |
|
||||
|-------|--------|
|
||||
| Nom | Momento Business |
|
||||
| Nom | Memento Business |
|
||||
| Description | Pour les équipes et chefs de produit |
|
||||
|
||||
Créer **2 prix** :
|
||||
@@ -244,7 +244,7 @@ Utilisateur Frontend Backend
|
||||
|
||||
### 3.2 Webhook — Cycle de vie des abonnements
|
||||
|
||||
| Événement Stripe | Action Momento | Statut Prisma |
|
||||
| Événement Stripe | Action Memento | Statut Prisma |
|
||||
|------------------|---------------|---------------|
|
||||
| `checkout.session.completed` | Upsert subscription avec tier/periode | `ACTIVE` |
|
||||
| `customer.subscription.created` | Upsert (nouvelle souscription) | Selon Stripe |
|
||||
@@ -449,3 +449,44 @@ Devrait retourner :
|
||||
| Enterprise | Sur devis | Sur devis | — |
|
||||
|
||||
Devise : EUR (configurable dans Stripe Dashboard pour multi-devises).
|
||||
|
||||
---
|
||||
|
||||
## 11. Bons de réduction & Codes de promotion (Coupons & Promo Codes)
|
||||
|
||||
Memento intègre le support natif et sécurisé de Stripe pour les codes promotionnels lors du paiement en Embedded Checkout via l'attribut `allow_promotion_codes: true` dans `/api/billing/create-checkout/route.ts`.
|
||||
|
||||
### 11.1 Concepts Clés : Bon de réduction (Coupon) vs Code de promotion (Promo Code)
|
||||
Dans Stripe, la gestion des remises se fait en deux niveaux :
|
||||
1. **Le Bon de réduction (Coupon)** : C'est la règle financière sous-jacente (ex. `-20 % sur l'abonnement pendant 6 mois` ou `-10 € à vie`). Un coupon n'est pas vu par le client final sous cette forme.
|
||||
2. **Le Code de promotion (Promo Code)** : C'est la chaîne de caractères réelle saisie par le client (ex. `WELCOME20`, `LAUNCH50`). Un code promo est obligatoirement rattaché à un Coupon. Vous pouvez créer plusieurs codes promos pour un seul et même coupon (ex. `INFLUENCEUR1` et `INFLUENCEUR2` qui appliquent tous les deux la même réduction de -10%).
|
||||
|
||||
### 11.2 Comment créer un Code Promo sur Stripe (Dashboard)
|
||||
1. Connectez-vous à votre **Stripe Dashboard** (en mode test ou live selon votre cible).
|
||||
2. Rendez-vous dans **Produits** (Products) → **Bons de réduction** (Coupons) → bouton **+ Nouveau**.
|
||||
3. Remplissez les informations du Coupon :
|
||||
- **Nom** : Le nom interne pour vous y retrouver (ex: `Lancement 50%`).
|
||||
- **Type de réduction** : Pourcentage (ex: `50%`) ou Montant fixe (ex: `10 €`).
|
||||
- **Durée** :
|
||||
- *Une seule fois* (appliqué uniquement sur la première facture).
|
||||
- *Plusieurs mois* (Spécifier le nombre de mois, ex: 3 mois).
|
||||
- *Pour toujours* (appliqué à vie sur toutes les factures de l'abonnement).
|
||||
4. Sous le bloc **Codes de promotion**, cochez **"Créer un code de promotion orienté client"** :
|
||||
- **Code** : Saisissez le code en majuscules (ex: `LAUNCH50`).
|
||||
- **Limites d'utilisation** (optionnel) :
|
||||
- Nombre d'utilisations max (ex: limité aux 100 premiers utilisateurs).
|
||||
- Date limite de validité (ex: valable uniquement jusqu'au 31 décembre).
|
||||
- Limiter aux clients n'ayant jamais payé.
|
||||
- Restriction à des plans spécifiques (ex: restreindre ce code promo uniquement au produit `Memento Pro`).
|
||||
5. Cliquez sur **Créer le bon de réduction**.
|
||||
|
||||
### 11.3 Comment désactiver ou supprimer un Code Promo
|
||||
1. Allez dans **Produits** → **Bons de réduction** → **Codes de promotion**.
|
||||
2. Cliquez sur les `...` à côté du code promo concerné.
|
||||
3. Sélectionnez **Désactiver** (Deactivate) : le code ne sera plus utilisable par aucun client, mais les clients en ayant déjà bénéficié conserveront leur réduction active selon la durée définie (ex. s'ils ont déjà eu les 3 mois, Stripe continue de l'appliquer jusqu'à la fin de la période).
|
||||
4. Si vous souhaitez supprimer définitivement un coupon global et annuler la réduction pour tout le monde (y compris les abonnés actuels), allez dans **Bons de Réduction**, cliquez sur le coupon puis sur **Supprimer**.
|
||||
|
||||
### 11.4 Mode Test vs Production
|
||||
* **En local / Test** : Créez vos codes de promotion dans Stripe en ayant activé le commutateur **Mode Test** (Test Mode). Les codes créés ici ne fonctionneront qu'avec vos clés d'API de test (`sk_test_...`).
|
||||
* **En production / Live** : Désactivez le Mode Test sur Stripe pour passer en mode réel, et créez les coupons dans la section Live. Ils ne fonctionneront qu'avec vos clés d'API réelles (`sk_live_...`).
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
# User Stories — Momento Next Phase
|
||||
# User Stories — Memento Next Phase
|
||||
|
||||
> Basé sur l'analyse du prototype `architectural-grid/` et du code production `memento-note/`.
|
||||
> Dernière mise à jour : 2026-05-25 (US-NEXTGEN-EDITOR réorganisé, 4 nouvelles stories éditeur ajoutées)
|
||||
> Dernière mise à jour : 2026-06-28 (Epic 6 terminé — sync avec sprint-status.yaml)
|
||||
|
||||
---
|
||||
|
||||
@@ -20,11 +20,16 @@
|
||||
| **US-TEMPORAL** | Prédictions d'accès temporelles | ⏸️ **REPORTÉ** | Remplacé par rappels + révision SM-2 + Memory Echo ; heuristique faible, migration NoteAccessLog non prioritaire |
|
||||
| **US-FLASHCARDS** | Révision IA — Répétition espacée SM-2 | ✅ **LIVRÉ** | `/revision`, `/api/flashcards/*`, SM-2, génération IA depuis l'éditeur |
|
||||
| **US-STRUCTURED-VIEWS** | Vues Structurées (Tableau/Kanban/Galerie) | ✅ **LIVRÉ** | `/api/notebooks/[id]/schema`, `/api/notes/[id]/properties`, vues structurées + panneau propriétés éditeur |
|
||||
| **US-NEXTGEN-EDITOR** | Éditeur Next-Gen : Drag Handle + Menu Bloc + DB Inline + Smart Paste | 🚧 **PLANIFIÉ** | Voir `docs/story-nextgen-editor.md` |
|
||||
| **US-EDITOR-PERF** | Performance de frappe TipTap (quick wins) | 🚧 **PLANIFIÉ** | — |
|
||||
| **US-EDITOR-UX** | Micro-interactions saisie (slash menu, sélection multi-blocs, paste étendu, placeholders) | ⏳ **À FAIRE** | — |
|
||||
| **US-EDITOR-MOBILE** | Expérience tactile & toolbar mobile adaptée | ⏳ **À FAIRE** | — |
|
||||
| **US-EDITOR-MARKDOWN** | Rendu WYSIWYG Markdown fidèle (round-trip byte-for-byte) | ⏳ **À FAIRE** | — |
|
||||
| **US-NEXTGEN-EDITOR** | Éditeur Next-Gen : Drag Handle + Menu Bloc + **Vue Structurée Inline** (redesign US-4) + Smart Paste | ✅ **LIVRÉ** | Voir `docs/story-nextgen-editor.md` + `docs/story-nextgen-editor-us4-redesign.md` |
|
||||
| **US-EDITOR-PERF** | Performance de frappe TipTap (quick wins) | ✅ **LIVRÉ** | `rich-text-editor.tsx` (useEditorState), `note-editor-context.tsx` (debounced setContent) |
|
||||
| **US-EDITOR-UX** | Micro-interactions saisie (slash menu, sélection multi-blocs, paste étendu, placeholders) | ✅ **LIVRÉ** | Sélection globale, redesign Slash Menu (favoris/preview), placeholders contextuels, smart paste étendu, Turn Into & Undo/Redo |
|
||||
| **US-EDITOR-MOBILE** | Expérience tactile & toolbar mobile adaptée | ✅ **LIVRÉ** | Toolbar fixe premium 44px, Bottom Sheet tactile (actions de bloc + IA), sélection facilitée de bloc |
|
||||
| **US-EDITOR-MARKDOWN** | Rendu WYSIWYG Markdown fidèle (round-trip byte-for-byte) | ✅ **LIVRÉ** | Brief : `docs/brief-markdown-roundtrip.md` |
|
||||
| **US-ONBOARDING** | Wizard Activation — Effet "Aha!" Recherche Sémantique | ✅ **LIVRÉ** | Story : `docs/story-onboarding-activation.md` |
|
||||
| **US-BRAINSTORM-FINALIZE** | Brainstorm Canvas D3 — Finalisation (export PPTX, gaps UX) | ✅ **LIVRÉ** | `brainstorm-page.tsx`, 14 routes API |
|
||||
| **US-CHAT-PDF** | Chat with PDF — RAG documentaire | ✅ **LIVRÉ** | `document-qa-overlay.tsx`, `document-ingestion`, `document-search` tool |
|
||||
| **US-PPTX-EXPORT** | Export PPTX + Watermark | ✅ **LIVRÉ** | `lib/brainstorm/export-pptx.ts`, `lib/ai/tools/pptx.tool.ts` |
|
||||
| **US-PUBLISH-IA** | Publication IA (templates magazine/brief/essay + rewrite) | ✅ **LIVRÉ** | `lib/publish/`, `publish-enhance.service.ts`, 4 templates CSS, quota `publish_enhance` |
|
||||
|
||||
---
|
||||
|
||||
@@ -116,7 +121,7 @@ Le prototype `SearchModal.tsx` est une refonte complète avec dual-panel, regex,
|
||||
**Contexte :**
|
||||
Le prototype contient `ClipperSimulator.tsx` (618 lignes) qui simule le clipping avec données mock. Il n'existe rien d'équivalent dans `memento-note`. La feature doit être réalisée en deux parties : une **extension Chrome/Firefox** et un **modal de réception** côté app.
|
||||
|
||||
**En tant qu'utilisateur**, je veux capturer n'importe quelle page web depuis mon navigateur et l'enregistrer dans Momento avec résumé IA, tags suggérés et choix du carnet — sans quitter le navigateur.
|
||||
**En tant qu'utilisateur**, je veux capturer n'importe quelle page web depuis mon navigateur et l'enregistrer dans Memento avec résumé IA, tags suggérés et choix du carnet — sans quitter le navigateur.
|
||||
|
||||
**Critères d'acceptation :**
|
||||
|
||||
@@ -126,7 +131,7 @@ Le prototype contient `ClipperSimulator.tsx` (618 lignes) qui simule le clipping
|
||||
- Bouton "Analyser avec IA" → appel `POST /api/clip/analyze` (URL + HTML content) → retourne `{ title, summary, tags[], readingTime }`
|
||||
- Champ de sélection du carnet (dropdown hiérarchique, dernier carnet mémorisé)
|
||||
- Aperçu du contenu clipé (150px scrollable)
|
||||
- Bouton "Sauvegarder dans Momento" → appel `POST /api/clip/save` avec `{ url, title, content, summary, tags, notebookId }`
|
||||
- Bouton "Sauvegarder dans Memento" → appel `POST /api/clip/save` avec `{ url, title, content, summary, tags, notebookId }`
|
||||
- Feedback visuel : spinner → "Sauvegardé ✓" avec lien direct vers la note
|
||||
|
||||
### Route API `app/api/clip/analyze/route.ts` (nouvelle)
|
||||
@@ -619,15 +624,25 @@ L'éditeur actuel est un document linéaire classique. Pour rivaliser avec Notio
|
||||
- Collage d'un lien de bloc -> menu inline : "Bloc Connecté (Live)" ou "Texte simple"
|
||||
- Insère un nœud `liveBlock` synchronisé via Redis Pub/Sub
|
||||
|
||||
### US-4 : Bloc de Base de Données Relationnelle Inline
|
||||
- Slash `/database` -> insère un React NodeView
|
||||
- Vues Tableau / Fiches avec Rollup dynamique
|
||||
- Modèle relationnel local (auteurs/livres par défaut, ou lié au carnet)
|
||||
### US-4 : Vue Structurée de Carnet Inline — *Redesign*
|
||||
> ⚠️ Spec complète : [`docs/story-nextgen-editor-us4-redesign.md`](./story-nextgen-editor-us4-redesign.md)
|
||||
- Slash `/vue` (+ keywords `database`, `db`, `tableau`) → insère un `structuredViewBlock`
|
||||
- Affiche Table ou Galerie du carnet courant via l'API Structured Views existante
|
||||
- Bloc stocke uniquement `notebookId` + `displayMode` (pas de données en attrs TipTap)
|
||||
- Graceful fallback si carnet sans schéma ou note sans carnet
|
||||
- **Supprime** le code legacy `tiptap-database-block-extension.tsx` (Verne/Liu Cixin)
|
||||
- **Dépend de :** US-STRUCTURED-VIEWS ✅ (livré)
|
||||
|
||||
### Fichiers
|
||||
- `[NEW]` `tiptap-drag-handle-plugin.ts` — Plugin ProseMirror pur
|
||||
- `[NEW]` `tiptap-database-block-extension.tsx` — NodeView React
|
||||
- `[MODIFY]` `rich-text-editor.tsx` — Intégration drag handle + DB + paste intercept
|
||||
- `[NEW]` `tiptap-drag-handle-plugin.ts` — Plugin ProseMirror pur (US-1)
|
||||
- `[NEW]` `tiptap-structured-view-block-extension.tsx` — NodeView Vue Structurée (US-4 redesign)
|
||||
- `[NEW]` `structured-view-block-embed.tsx` — Composant embed avec SWR + états dégradés
|
||||
- `[DELETE]` `tiptap-database-block-extension.tsx` — Legacy Auteurs/Œuvres rejeté
|
||||
- `[DELETE]` `database-block-editor.tsx` — UI legacy rejetée
|
||||
- `[DELETE]` `lib/editor/database-block-types.ts` — Types legacy rejetés
|
||||
- `[MODIFY]` `note-content-area.tsx` — Passer `notebookId` à l'éditeur
|
||||
- `[MODIFY]` `rich-text-editor.tsx` — Swap extension DB → Vue Structurée, mise à jour slash
|
||||
- `[MODIFY]` `block-action-menu.tsx` — Remplacer option "Database" par "Vue structurée"
|
||||
- `[MODIFY]` `globals.css` — Gutter, poignée, glassmorphic dropdowns
|
||||
|
||||
---
|
||||
@@ -640,7 +655,7 @@ L'éditeur actuel est un document linéaire classique. Pour rivaliser avec Notio
|
||||
> **Source recherche :** TipTap 2.5 (mai 2026), TipTap docs performance, PR #7828
|
||||
|
||||
**Contexte :**
|
||||
Actuellement `rich-text-editor.tsx` utilise `immediatelyRender: false` mais pas `shouldRerenderOnTransaction` ni `useEditorState`. TipTap re-render le composant React à chaque transaction (frappe, déplacement curseur, sélection) — ce qui ajoute de la latence. Obsidian atteint <16ms de latence (local-first), Notion 50-150ms (cloud). Momento est local mais se comporte comme Notion à cause de ces re-renders inutiles.
|
||||
Actuellement `rich-text-editor.tsx` utilise `immediatelyRender: false` mais pas `shouldRerenderOnTransaction` ni `useEditorState`. TipTap re-render le composant React à chaque transaction (frappe, déplacement curseur, sélection) — ce qui ajoute de la latence. Obsidian atteint <16ms de latence (local-first), Notion 50-150ms (cloud). Memento est local mais se comporte comme Notion à cause de ces re-renders inutiles.
|
||||
|
||||
**En tant qu'utilisateur**, je veux que la frappe dans l'éditeur soit instantanée, sans aucun décalage perceptible, même sur des notes longues avec de nombreux blocs.
|
||||
|
||||
@@ -693,12 +708,12 @@ const { isBold, isItalic, isHeading } = useEditorState({
|
||||
|
||||
## US-EDITOR-UX — Micro-Interactions de Saisie
|
||||
|
||||
> **Status :** À FAIRE
|
||||
> **Status :** LIVRÉ
|
||||
> **Depends on :** US-NEXTGEN-EDITOR (drag handle et menu bloc doivent être en place)
|
||||
> **Source recherche :** Mintlify "22 UX improvements" (mai 2026), BlockNote v0.50, BlockNote v0.49
|
||||
|
||||
**Contexte :**
|
||||
Après les quick wins performance (US-EDITOR-PERF) et le drag handle (US-NEXTGEN-EDITOR), il reste des micro-interactions qui font la différence entre un éditeur "correct" et un éditeur "agréable". Mintlify a listé 22 améliorations UX en mai 2026 — voici les plus pertinentes pour Momento.
|
||||
Après les quick wins performance (US-EDITOR-PERF) et le drag handle (US-NEXTGEN-EDITOR), il reste des micro-interactions qui font la différence entre un éditeur "correct" et un éditeur "agréable". Mintlify a listé 22 améliorations UX en mai 2026 — voici les plus pertinentes pour Memento.
|
||||
|
||||
**En tant qu'utilisateur**, je veux que chaque interaction courante (insérer un bloc, déplacer du contenu, transformer un format) soit fluide et intuitive, sans recourir à des raccourcis clavier obscurs.
|
||||
|
||||
@@ -748,7 +763,7 @@ Après les quick wins performance (US-EDITOR-PERF) et le drag handle (US-NEXTGEN
|
||||
|
||||
## US-EDITOR-MOBILE — Expérience Tactile & Toolbar Mobile
|
||||
|
||||
> **Status :** À FAIRE
|
||||
> **Status :** LIVRÉ
|
||||
> **Depends on :** US-NEXTGEN-EDITOR (drag handle existant)
|
||||
> **Source recherche :** Notion mobile app, Obsidian mobile, benchmark 2026
|
||||
|
||||
@@ -789,7 +804,7 @@ L'éditeur fonctionne sur mobile mais l'expérience est dégradée : la bubble m
|
||||
> **Source recherche :** Milkdown v7.20, "Human Markdown" extension VSCode, round-trip byte-for-byte
|
||||
|
||||
**Contexte :**
|
||||
Momento stocke les notes en HTML (TipTap). Mais les notes de type `markdown` existent aussi. Le problème classique : éditer en riche et voir le Markdown reformatté intégralement (indentations changées, lignes vides supprimées, `##` convertis en soulignements). Milkdown (11k+ stars, ProseMirror + remark) résout ce problème avec un round-trip byte-for-byte.
|
||||
Memento stocke les notes en HTML (TipTap). Mais les notes de type `markdown` existent aussi. Le problème classique : éditer en riche et voir le Markdown reformatté intégralement (indentations changées, lignes vides supprimées, `##` convertis en soulignements). Milkdown (11k+ stars, ProseMirror + remark) résout ce problème avec un round-trip byte-for-byte.
|
||||
|
||||
**En tant qu'utilisateur**, je veux que mes fichiers Markdown restent intacts quand je les édite en mode visuel — pas de diff parasite sur chaque modification.
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ inputDocuments:
|
||||
- memento-note/docs/saas-deployment-prep.md
|
||||
---
|
||||
|
||||
# UX Design Specification Momento
|
||||
# UX Design Specification Memento
|
||||
|
||||
**Author:** devparsa
|
||||
**Date:** 2026-05-14
|
||||
|
||||
@@ -32,7 +32,7 @@ import { randomBytes } from 'crypto';
|
||||
import express from 'express';
|
||||
import cors from 'cors';
|
||||
import { registerTools } from './tools.js';
|
||||
import { validateApiKey, resolveUser } from './auth.js';
|
||||
import { validateApiKey } from './auth.js';
|
||||
import { requestContext } from './request-context.js';
|
||||
import config, { validateConfig, printConfig } from './config.js';
|
||||
import {
|
||||
@@ -266,6 +266,15 @@ app.get(config.healthPath, async (req, res) => {
|
||||
|
||||
if (config.enableMetrics) {
|
||||
app.get(config.metricsPath, (req, res) => {
|
||||
if (config.requireAuth) {
|
||||
const apiKey = req.headers['x-api-key']
|
||||
const validKey =
|
||||
(apiKey && config.staticApiKey && apiKey === config.staticApiKey) ||
|
||||
(apiKey && process.env.MCP_API_KEY && apiKey === process.env.MCP_API_KEY)
|
||||
if (!validKey) {
|
||||
return res.status(401).json(mcpError(McpErrors.AUTH_FAILED.code, { detail: 'Metrics require x-api-key' }))
|
||||
}
|
||||
}
|
||||
res.set('Content-Type', 'text/plain');
|
||||
res.send(getPrometheusMetrics());
|
||||
});
|
||||
@@ -278,21 +287,25 @@ if (config.enableMetrics) {
|
||||
app.use(
|
||||
withErrorHandling(async (req, res, next) => {
|
||||
if (!config.requireAuth) {
|
||||
req.userSession = { id: 'dev-user', name: 'Development User', isAuth: false };
|
||||
req.userSession = {
|
||||
id: 'dev-user',
|
||||
name: 'Development User',
|
||||
isAuth: false,
|
||||
userId: config.userId || null,
|
||||
};
|
||||
recordAuth(true, 'dev-mode');
|
||||
return next();
|
||||
}
|
||||
|
||||
const apiKey = req.headers['x-api-key'];
|
||||
const headerUserId = req.headers['x-user-id'];
|
||||
|
||||
if (!apiKey && !headerUserId) {
|
||||
if (!apiKey) {
|
||||
recordAuth(false, 'missing-credentials');
|
||||
return res
|
||||
.status(401)
|
||||
.json(
|
||||
mcpError(McpErrors.AUTH_FAILED.code, {
|
||||
detail: 'Provide x-api-key or x-user-id header',
|
||||
detail: 'Provide x-api-key header',
|
||||
})
|
||||
);
|
||||
}
|
||||
@@ -328,24 +341,6 @@ app.use(
|
||||
return res.status(401).json(mcpError(McpErrors.AUTH_FAILED.code, { detail: 'Invalid API key' }));
|
||||
}
|
||||
|
||||
if (headerUserId) {
|
||||
const user = await resolveUser(prisma, headerUserId);
|
||||
if (!user) {
|
||||
recordAuth(false, 'user-not-found');
|
||||
return res.status(401).json(mcpError(McpErrors.AUTH_FAILED.code, { detail: 'User not found' }));
|
||||
}
|
||||
req.userSession = getOrCreateSession(`user:${user.id}`, {
|
||||
name: user.name,
|
||||
userId: user.id,
|
||||
userName: user.name,
|
||||
userEmail: user.email,
|
||||
userRole: user.role,
|
||||
authMethod: 'user-id',
|
||||
});
|
||||
recordAuth(true, 'user-id');
|
||||
return next();
|
||||
}
|
||||
|
||||
recordAuth(false, 'auth-failed');
|
||||
return res.status(401).json(mcpError(McpErrors.AUTH_FAILED.code, { detail: 'Authentication failed' }));
|
||||
})
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
"start:http": "node index-sse.js",
|
||||
"start:sse": "node index-sse.js",
|
||||
"dev": "MCP_LOG_LEVEL=debug node index-sse.js",
|
||||
"test": "node test/test.js",
|
||||
"test": "vitest run",
|
||||
"test:perf": "node test/performance-test.js",
|
||||
"test:connection": "node test/connection-test.js",
|
||||
"test:validation": "node test/validation-test.js",
|
||||
|
||||
@@ -12,6 +12,7 @@ import {
|
||||
McpError,
|
||||
} from '@modelcontextprotocol/sdk/types.js';
|
||||
import { requestContext } from './request-context.js';
|
||||
import { mcpErrorContent, McpErrors } from './errors.js';
|
||||
|
||||
const DEFAULT_SEARCH_LIMIT = 50;
|
||||
const DEFAULT_NOTES_LIMIT = 100;
|
||||
@@ -473,26 +474,9 @@ export function registerTools(server, prisma) {
|
||||
return store?.userId || null;
|
||||
};
|
||||
|
||||
let fallbackUserId = null;
|
||||
let fallbackPromise = null;
|
||||
|
||||
const ensureUserId = async () => {
|
||||
const fromContext = getResolvedUserId();
|
||||
if (fromContext) return fromContext;
|
||||
if (fallbackUserId) return fallbackUserId;
|
||||
if (fallbackPromise) return fallbackPromise;
|
||||
|
||||
fallbackPromise = prisma.user.findFirst({ select: { id: true } }).then(u => {
|
||||
if (u) fallbackUserId = u.id;
|
||||
return fallbackUserId;
|
||||
});
|
||||
|
||||
return fallbackPromise;
|
||||
};
|
||||
|
||||
const noteWhere = (resolvedUserId, extra = {}) => ({
|
||||
trashedAt: null,
|
||||
...(resolvedUserId ? { userId: resolvedUserId } : {}),
|
||||
userId: resolvedUserId,
|
||||
...extra,
|
||||
});
|
||||
|
||||
@@ -503,6 +487,11 @@ export function registerTools(server, prisma) {
|
||||
server.setRequestHandler(CallToolRequestSchema, async (request) => {
|
||||
const { name, arguments: args } = request.params;
|
||||
const uid = getResolvedUserId();
|
||||
if (!uid) {
|
||||
return mcpErrorContent(McpErrors.AUTH_FAILED.code, {
|
||||
detail: 'Authentication required: missing user context',
|
||||
});
|
||||
}
|
||||
|
||||
try {
|
||||
switch (name) {
|
||||
@@ -527,7 +516,7 @@ export function registerTools(server, prisma) {
|
||||
isMarkdown: args.isMarkdown || false,
|
||||
size: args.size || 'small',
|
||||
notebookId: args.notebookId || null,
|
||||
userId: uid || await ensureUserId(),
|
||||
userId: uid,
|
||||
};
|
||||
|
||||
const note = await prisma.note.create({ data });
|
||||
@@ -560,7 +549,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
case 'get_note': {
|
||||
const note = await prisma.note.findUnique({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
});
|
||||
if (!note) throw new McpError(ErrorCode.InvalidRequest, 'Note not found');
|
||||
return textResult(parseNote(note));
|
||||
@@ -581,7 +570,7 @@ export function registerTools(server, prisma) {
|
||||
d.updatedAt = new Date();
|
||||
|
||||
const note = await prisma.note.update({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
data: d,
|
||||
});
|
||||
return textResult(parseNote(note));
|
||||
@@ -589,7 +578,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
case 'delete_note': {
|
||||
await prisma.note.delete({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
});
|
||||
return textResult({ success: true, deleted: args.id });
|
||||
}
|
||||
@@ -599,8 +588,8 @@ export function registerTools(server, prisma) {
|
||||
const params = [query]
|
||||
let paramIdx = 1
|
||||
|
||||
const userClause = uid ? `AND "userId" = $${++paramIdx}` : ''
|
||||
if (uid) params.push(uid)
|
||||
const userClause = `AND "userId" = $${++paramIdx}`
|
||||
params.push(uid)
|
||||
|
||||
const notebookClause = args.notebookId ? `AND "notebookId" = $${++paramIdx}` : ''
|
||||
if (args.notebookId) params.push(args.notebookId)
|
||||
@@ -628,7 +617,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
const [note, notebook] = await Promise.all([
|
||||
prisma.note.update({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
data: { notebookId: targetId, updatedAt: new Date() },
|
||||
}),
|
||||
targetId
|
||||
@@ -649,7 +638,7 @@ export function registerTools(server, prisma) {
|
||||
const ids = args.ids || [];
|
||||
|
||||
await prisma.note.updateMany({
|
||||
where: { id: { in: ids }, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: { in: ids }, userId: uid, trashedAt: null },
|
||||
data: { notebookId: targetId, updatedAt: new Date() },
|
||||
});
|
||||
|
||||
@@ -659,14 +648,14 @@ export function registerTools(server, prisma) {
|
||||
case 'batch_delete_notes': {
|
||||
const ids = args.ids || [];
|
||||
await prisma.note.deleteMany({
|
||||
where: { id: { in: ids }, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: { in: ids }, userId: uid, trashedAt: null },
|
||||
});
|
||||
return textResult({ success: true, count: ids.length });
|
||||
}
|
||||
|
||||
case 'toggle_pin': {
|
||||
const note = await prisma.note.findUnique({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
});
|
||||
if (!note) throw new McpError(ErrorCode.InvalidRequest, 'Note not found');
|
||||
const updated = await prisma.note.update({
|
||||
@@ -678,7 +667,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
case 'toggle_archive': {
|
||||
const note = await prisma.note.findUnique({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
});
|
||||
if (!note) throw new McpError(ErrorCode.InvalidRequest, 'Note not found');
|
||||
const updated = await prisma.note.update({
|
||||
@@ -689,7 +678,7 @@ export function registerTools(server, prisma) {
|
||||
}
|
||||
|
||||
case 'export_notes': {
|
||||
const nbWhere = uid ? { userId: uid } : {};
|
||||
const nbWhere = { userId: uid };
|
||||
|
||||
const [notes, notebooks, labels] = await Promise.all([
|
||||
prisma.note.findMany({
|
||||
@@ -741,7 +730,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
if (importData.data?.notebooks?.length > 0) {
|
||||
const existing = await prisma.notebook.findMany({
|
||||
where: uid ? { userId: uid } : {},
|
||||
where: { userId: uid },
|
||||
select: { name: true },
|
||||
});
|
||||
const existingNames = new Set(existing.map(nb => nb.name));
|
||||
@@ -752,7 +741,7 @@ export function registerTools(server, prisma) {
|
||||
name: nb.name,
|
||||
icon: nb.icon || '📁',
|
||||
color: nb.color || '#3B82F6',
|
||||
...(uid ? { userId: uid } : {}),
|
||||
userId: uid,
|
||||
}));
|
||||
|
||||
if (toCreate.length > 0) {
|
||||
@@ -763,7 +752,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
if (importData.data?.labels?.length > 0) {
|
||||
const notebooks = await prisma.notebook.findMany({
|
||||
where: uid ? { userId: uid } : {},
|
||||
where: { userId: uid },
|
||||
select: { id: true },
|
||||
});
|
||||
const nbIds = new Set(notebooks.map(nb => nb.id));
|
||||
@@ -796,7 +785,7 @@ export function registerTools(server, prisma) {
|
||||
size: note.size || 'small',
|
||||
labels: note.labels ?? null,
|
||||
notebookId: note.notebookId || null,
|
||||
...(uid ? { userId: uid } : {}),
|
||||
userId: uid,
|
||||
}));
|
||||
|
||||
try {
|
||||
@@ -817,7 +806,7 @@ export function registerTools(server, prisma) {
|
||||
// ═══ NOTEBOOKS ═══
|
||||
case 'create_notebook': {
|
||||
const highest = await prisma.notebook.findFirst({
|
||||
where: uid ? { userId: uid } : {},
|
||||
where: { userId: uid },
|
||||
orderBy: { order: 'desc' },
|
||||
select: { order: true },
|
||||
});
|
||||
@@ -830,7 +819,7 @@ export function registerTools(server, prisma) {
|
||||
color: args.color || '#3B82F6',
|
||||
order: nextOrder,
|
||||
parentId: args.parentId || null,
|
||||
userId: uid || await ensureUserId(),
|
||||
userId: uid,
|
||||
},
|
||||
include: { labels: true, _count: { select: { notes: true } } },
|
||||
});
|
||||
@@ -839,7 +828,7 @@ export function registerTools(server, prisma) {
|
||||
}
|
||||
|
||||
case 'get_notebooks': {
|
||||
const where = uid ? { userId: uid } : {};
|
||||
const where = { userId: uid };
|
||||
const notebooks = await prisma.notebook.findMany({
|
||||
where,
|
||||
include: {
|
||||
@@ -853,7 +842,7 @@ export function registerTools(server, prisma) {
|
||||
}
|
||||
|
||||
case 'get_notebook': {
|
||||
const where = { id: args.id, ...(uid ? { userId: uid } : {}) };
|
||||
const where = { id: args.id, userId: uid };
|
||||
const notebook = await prisma.notebook.findUnique({
|
||||
where,
|
||||
include: { labels: true, notes: { where: { trashedAt: null } }, _count: { select: { notes: true } } },
|
||||
@@ -875,7 +864,7 @@ export function registerTools(server, prisma) {
|
||||
if ('order' in args) d.order = args.order;
|
||||
if ('parentId' in args) d.parentId = args.parentId;
|
||||
|
||||
const where = { id: args.id, ...(uid ? { userId: uid } : {}) };
|
||||
const where = { id: args.id, userId: uid };
|
||||
const notebook = await prisma.notebook.update({
|
||||
where,
|
||||
data: d,
|
||||
@@ -888,11 +877,11 @@ export function registerTools(server, prisma) {
|
||||
case 'delete_notebook': {
|
||||
await prisma.$transaction([
|
||||
prisma.note.updateMany({
|
||||
where: { notebookId: args.id, ...(uid ? { userId: uid } : {}) },
|
||||
where: { notebookId: args.id, userId: uid },
|
||||
data: { notebookId: null },
|
||||
}),
|
||||
prisma.notebook.delete({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}) },
|
||||
where: { id: args.id, userId: uid },
|
||||
}),
|
||||
]);
|
||||
|
||||
@@ -901,7 +890,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
case 'reorder_notebooks': {
|
||||
const ids = args.notebookIds;
|
||||
const where = { id: { in: ids }, ...(uid ? { userId: uid } : {}) };
|
||||
const where = { id: { in: ids }, userId: uid };
|
||||
|
||||
const existing = await prisma.notebook.findMany({ where, select: { id: true } });
|
||||
const existingIds = new Set(existing.map(nb => nb.id));
|
||||
@@ -920,7 +909,7 @@ export function registerTools(server, prisma) {
|
||||
}
|
||||
|
||||
case 'get_notebook_hierarchy': {
|
||||
const where = uid ? { userId: uid } : {};
|
||||
const where = { userId: uid };
|
||||
const notebooks = await prisma.notebook.findMany({
|
||||
where,
|
||||
include: {
|
||||
@@ -972,7 +961,7 @@ export function registerTools(server, prisma) {
|
||||
orderBy: { name: 'asc' },
|
||||
});
|
||||
|
||||
const filtered = uid ? labels.filter(l => l.notebook?.userId === uid) : labels;
|
||||
const filtered = labels.filter(l => l.notebook?.userId === uid);
|
||||
return textResult(filtered);
|
||||
}
|
||||
|
||||
@@ -1017,7 +1006,7 @@ export function registerTools(server, prisma) {
|
||||
// ═══ TRASH ═══
|
||||
case 'trash_note': {
|
||||
const note = await prisma.note.update({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}) },
|
||||
where: { id: args.id, userId: uid },
|
||||
data: { trashedAt: new Date() },
|
||||
});
|
||||
return textResult({ success: true, id: note.id, trashedAt: note.trashedAt });
|
||||
@@ -1025,7 +1014,7 @@ export function registerTools(server, prisma) {
|
||||
|
||||
case 'restore_note': {
|
||||
const note = await prisma.note.findUnique({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}) },
|
||||
where: { id: args.id, userId: uid },
|
||||
});
|
||||
if (!note) throw new McpError(ErrorCode.InvalidRequest, 'Note not found');
|
||||
if (!note.trashedAt) return textResult({ success: true, message: 'Note was not in trash' });
|
||||
@@ -1037,7 +1026,7 @@ export function registerTools(server, prisma) {
|
||||
}
|
||||
|
||||
case 'get_trash': {
|
||||
const where = { trashedAt: { not: null }, ...(uid ? { userId: uid } : {}) };
|
||||
const where = { trashedAt: { not: null }, userId: uid };
|
||||
const trashed = await prisma.note.findMany({
|
||||
where,
|
||||
select: { id: true, title: true, content: true, color: true, trashedAt: true, notebookId: true },
|
||||
@@ -1052,7 +1041,7 @@ export function registerTools(server, prisma) {
|
||||
// ═══ ADVANCED NOTE OPERATIONS ═══
|
||||
case 'append_to_note': {
|
||||
const note = await prisma.note.findUnique({
|
||||
where: { id: args.id, ...(uid ? { userId: uid } : {}), trashedAt: null },
|
||||
where: { id: args.id, userId: uid, trashedAt: null },
|
||||
select: { content: true },
|
||||
});
|
||||
if (!note) throw new McpError(ErrorCode.InvalidRequest, 'Note not found');
|
||||
@@ -1072,8 +1061,8 @@ export function registerTools(server, prisma) {
|
||||
const params = [query]
|
||||
let paramIdx = 1
|
||||
|
||||
const userClause = uid ? `AND "userId" = $${++paramIdx}` : ''
|
||||
if (uid) params.push(uid)
|
||||
const userClause = `AND "userId" = $${++paramIdx}`
|
||||
params.push(uid)
|
||||
|
||||
const results = await prisma.$queryRawUnsafe(
|
||||
`SELECT id, title, content
|
||||
@@ -1095,7 +1084,7 @@ export function registerTools(server, prisma) {
|
||||
where: {
|
||||
trashedAt: null,
|
||||
isArchived: false,
|
||||
...(uid ? { userId: uid } : {}),
|
||||
userId: uid,
|
||||
OR: [
|
||||
{ title: { contains: query, mode: 'insensitive' } },
|
||||
{ content: { contains: query, mode: 'insensitive' } },
|
||||
|
||||
13
memento-mobile/.expo/README.md
Normal file
13
memento-mobile/.expo/README.md
Normal file
@@ -0,0 +1,13 @@
|
||||
> Why do I have a folder named ".expo" in my project?
|
||||
|
||||
The ".expo" folder is created when an Expo project is started using "expo start" command.
|
||||
|
||||
> What do the files contain?
|
||||
|
||||
- "devices.json": contains information about devices that have recently opened this project. This is used to populate the "Development sessions" list in your development builds.
|
||||
- "settings.json": contains the server configuration that is used to serve the application manifest.
|
||||
|
||||
> Should I commit the ".expo" folder?
|
||||
|
||||
No, you should not share the ".expo" folder. It does not contain any information that is relevant for other developers working on the project, it is specific to your machine.
|
||||
Upon project creation, the ".expo" folder is already added to your ".gitignore" file.
|
||||
3
memento-mobile/.expo/devices.json
Normal file
3
memento-mobile/.expo/devices.json
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"devices": []
|
||||
}
|
||||
14
memento-mobile/.expo/types/router.d.ts
vendored
Normal file
14
memento-mobile/.expo/types/router.d.ts
vendored
Normal file
@@ -0,0 +1,14 @@
|
||||
/* eslint-disable */
|
||||
import * as Router from 'expo-router';
|
||||
|
||||
export * from 'expo-router';
|
||||
|
||||
declare module 'expo-router' {
|
||||
export namespace ExpoRouter {
|
||||
export interface __routes<T extends string | object = string> {
|
||||
hrefInputParams: { pathname: Router.RelativePathString, params?: Router.UnknownInputParams } | { pathname: Router.ExternalPathString, params?: Router.UnknownInputParams } | { pathname: `/_sitemap`; params?: Router.UnknownInputParams; } | { pathname: `${'/(auth)'}/login` | `/login`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/home` | `/home`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/notebooks` | `/notebooks`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/profile` | `/profile`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/revision` | `/revision`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/search` | `/search`; params?: Router.UnknownInputParams; } | { pathname: `/note/create`; params?: Router.UnknownInputParams; } | { pathname: `/revision/session`; params?: Router.UnknownInputParams; } | { pathname: `/note/[id]`, params: Router.UnknownInputParams & { id: string | number; } } | { pathname: `/notebook/[id]`, params: Router.UnknownInputParams & { id: string | number; } };
|
||||
hrefOutputParams: { pathname: Router.RelativePathString, params?: Router.UnknownOutputParams } | { pathname: Router.ExternalPathString, params?: Router.UnknownOutputParams } | { pathname: `/_sitemap`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(auth)'}/login` | `/login`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(tabs)'}/home` | `/home`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(tabs)'}/notebooks` | `/notebooks`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(tabs)'}/profile` | `/profile`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(tabs)'}/revision` | `/revision`; params?: Router.UnknownOutputParams; } | { pathname: `${'/(tabs)'}/search` | `/search`; params?: Router.UnknownOutputParams; } | { pathname: `/note/create`; params?: Router.UnknownOutputParams; } | { pathname: `/revision/session`; params?: Router.UnknownOutputParams; } | { pathname: `/note/[id]`, params: Router.UnknownOutputParams & { id: string; } } | { pathname: `/notebook/[id]`, params: Router.UnknownOutputParams & { id: string; } };
|
||||
href: Router.RelativePathString | Router.ExternalPathString | `/_sitemap${`?${string}` | `#${string}` | ''}` | `${'/(auth)'}/login${`?${string}` | `#${string}` | ''}` | `/login${`?${string}` | `#${string}` | ''}` | `${'/(tabs)'}/home${`?${string}` | `#${string}` | ''}` | `/home${`?${string}` | `#${string}` | ''}` | `${'/(tabs)'}/notebooks${`?${string}` | `#${string}` | ''}` | `/notebooks${`?${string}` | `#${string}` | ''}` | `${'/(tabs)'}/profile${`?${string}` | `#${string}` | ''}` | `/profile${`?${string}` | `#${string}` | ''}` | `${'/(tabs)'}/revision${`?${string}` | `#${string}` | ''}` | `/revision${`?${string}` | `#${string}` | ''}` | `${'/(tabs)'}/search${`?${string}` | `#${string}` | ''}` | `/search${`?${string}` | `#${string}` | ''}` | `/note/create${`?${string}` | `#${string}` | ''}` | `/revision/session${`?${string}` | `#${string}` | ''}` | { pathname: Router.RelativePathString, params?: Router.UnknownInputParams } | { pathname: Router.ExternalPathString, params?: Router.UnknownInputParams } | { pathname: `/_sitemap`; params?: Router.UnknownInputParams; } | { pathname: `${'/(auth)'}/login` | `/login`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/home` | `/home`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/notebooks` | `/notebooks`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/profile` | `/profile`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/revision` | `/revision`; params?: Router.UnknownInputParams; } | { pathname: `${'/(tabs)'}/search` | `/search`; params?: Router.UnknownInputParams; } | { pathname: `/note/create`; params?: Router.UnknownInputParams; } | { pathname: `/revision/session`; params?: Router.UnknownInputParams; } | `/note/${Router.SingleRoutePart<T>}${`?${string}` | `#${string}` | ''}` | `/notebook/${Router.SingleRoutePart<T>}${`?${string}` | `#${string}` | ''}` | { pathname: `/note/[id]`, params: Router.UnknownInputParams & { id: string | number; } } | { pathname: `/notebook/[id]`, params: Router.UnknownInputParams & { id: string | number; } };
|
||||
}
|
||||
}
|
||||
}
|
||||
6
memento-mobile/.gitignore
vendored
Normal file
6
memento-mobile/.gitignore
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
|
||||
# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
|
||||
# The following patterns were generated by expo-cli
|
||||
|
||||
expo-env.d.ts
|
||||
# @end expo-cli
|
||||
1
memento-mobile/.npmrc
Normal file
1
memento-mobile/.npmrc
Normal file
@@ -0,0 +1 @@
|
||||
legacy-peer-deps=true
|
||||
41
memento-mobile/app.json
Normal file
41
memento-mobile/app.json
Normal file
@@ -0,0 +1,41 @@
|
||||
{
|
||||
"expo": {
|
||||
"name": "Momento",
|
||||
"slug": "memento-mobile",
|
||||
"version": "1.0.0",
|
||||
"orientation": "portrait",
|
||||
"icon": "./assets/icon.png",
|
||||
"userInterfaceStyle": "automatic",
|
||||
"scheme": "memento",
|
||||
"splash": {
|
||||
"image": "./assets/splash.png",
|
||||
"resizeMode": "contain",
|
||||
"backgroundColor": "#FAFAF8"
|
||||
},
|
||||
"ios": {
|
||||
"supportsTablet": true,
|
||||
"bundleIdentifier": "com.momentonote.app"
|
||||
},
|
||||
"android": {
|
||||
"adaptiveIcon": {
|
||||
"foregroundImage": "./assets/adaptive-icon.png",
|
||||
"backgroundColor": "#FAFAF8"
|
||||
},
|
||||
"package": "com.momentonote.app",
|
||||
"permissions": ["android.permission.RECORD_AUDIO"]
|
||||
},
|
||||
"plugins": [
|
||||
"expo-router",
|
||||
"expo-secure-store",
|
||||
[
|
||||
"expo-av",
|
||||
{
|
||||
"microphonePermission": "Momento a besoin du microphone pour la saisie vocale."
|
||||
}
|
||||
]
|
||||
],
|
||||
"experiments": {
|
||||
"typedRoutes": true
|
||||
}
|
||||
}
|
||||
}
|
||||
5
memento-mobile/app/(auth)/_layout.tsx
Normal file
5
memento-mobile/app/(auth)/_layout.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import { Stack } from 'expo-router'
|
||||
|
||||
export default function AuthLayout() {
|
||||
return <Stack screenOptions={{ headerShown: false }} />
|
||||
}
|
||||
189
memento-mobile/app/(auth)/login.tsx
Normal file
189
memento-mobile/app/(auth)/login.tsx
Normal file
@@ -0,0 +1,189 @@
|
||||
import { useState, useEffect, useCallback } from 'react'
|
||||
import {
|
||||
View, Text, TextInput, TouchableOpacity,
|
||||
KeyboardAvoidingView, Platform, ActivityIndicator,
|
||||
Alert, StyleSheet,
|
||||
} from 'react-native'
|
||||
import * as WebBrowser from 'expo-web-browser'
|
||||
import * as Linking from 'expo-linking'
|
||||
import { useAuthStore } from '@/lib/store'
|
||||
import { API_URL } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
WebBrowser.maybeCompleteAuthSession()
|
||||
|
||||
export default function LoginScreen() {
|
||||
const [email, setEmail] = useState('')
|
||||
const [password, setPassword] = useState('')
|
||||
const [showPwd, setShowPwd] = useState(false)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [googleLoading, setGoogleLoading] = useState(false)
|
||||
const { login, loginWithToken } = useAuthStore()
|
||||
|
||||
// Traitement du deep link OAuth — mémorisé pour éviter les re-créations
|
||||
const handleOAuthCallback = useCallback(async (url: string) => {
|
||||
const parsed = Linking.parse(url)
|
||||
// memento://auth?token=... → scheme='memento', hostname='auth', path=''
|
||||
if (parsed.scheme !== 'memento' || parsed.hostname !== 'auth') return
|
||||
|
||||
const p = parsed.queryParams as Record<string, string> | undefined
|
||||
if (p?.error) {
|
||||
Alert.alert('Connexion Google échouée', p.error === 'unauthorized' ? 'Non autorisé' : 'Erreur serveur')
|
||||
setGoogleLoading(false)
|
||||
return
|
||||
}
|
||||
if (p?.token && p?.id) {
|
||||
await loginWithToken(p.token, {
|
||||
id: p.id,
|
||||
name: p.name || null,
|
||||
email: p.email || '',
|
||||
tier: p.tier || 'FREE',
|
||||
})
|
||||
}
|
||||
setGoogleLoading(false)
|
||||
}, [loginWithToken])
|
||||
|
||||
// Écoute le deep link (Android + app lancée via deep link)
|
||||
useEffect(() => {
|
||||
const sub = Linking.addEventListener('url', (event) => handleOAuthCallback(event.url))
|
||||
Linking.getInitialURL().then((url) => { if (url) handleOAuthCallback(url) })
|
||||
return () => sub.remove()
|
||||
}, [handleOAuthCallback])
|
||||
|
||||
const handleLogin = async () => {
|
||||
if (!email.trim() || !password.trim()) return
|
||||
setLoading(true)
|
||||
try {
|
||||
await login(email.trim().toLowerCase(), password)
|
||||
} catch (e: any) {
|
||||
Alert.alert(
|
||||
'Connexion échouée',
|
||||
e.message?.includes('Identifiants invalides')
|
||||
? 'Email ou mot de passe incorrect.\n\nSi vous vous êtes inscrit avec Google, utilisez le bouton Google ci-dessous.'
|
||||
: e.message
|
||||
)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleGoogle = async () => {
|
||||
setGoogleLoading(true)
|
||||
try {
|
||||
const url = `${API_URL}/api/mobile/auth/google-start`
|
||||
const result = await WebBrowser.openAuthSessionAsync(url, 'memento://auth')
|
||||
if (result.type === 'success') {
|
||||
// iOS : le deep link est capturé dans result.url, pas via Linking.addEventListener
|
||||
await handleOAuthCallback(result.url)
|
||||
} else {
|
||||
// Annulé par l'utilisateur
|
||||
setGoogleLoading(false)
|
||||
}
|
||||
} catch (e: any) {
|
||||
Alert.alert('Erreur', e.message)
|
||||
setGoogleLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} style={s.container}>
|
||||
<View style={s.inner}>
|
||||
|
||||
{/* Logo */}
|
||||
<View style={s.logoBlock}>
|
||||
<Text style={s.logo}>Memento</Text>
|
||||
<Text style={s.tagline}>Votre espace de connaissance</Text>
|
||||
</View>
|
||||
|
||||
{/* Bouton Google */}
|
||||
<TouchableOpacity onPress={handleGoogle} disabled={googleLoading || loading} style={s.googleBtn} activeOpacity={0.8}>
|
||||
{googleLoading
|
||||
? <ActivityIndicator color={C.ink} size="small" />
|
||||
: <>
|
||||
<Text style={s.googleG}>G</Text>
|
||||
<Text style={s.googleText}>Continuer avec Google</Text>
|
||||
</>}
|
||||
</TouchableOpacity>
|
||||
|
||||
{/* Séparateur */}
|
||||
<View style={s.sep}>
|
||||
<View style={s.sepLine} />
|
||||
<Text style={s.sepText}>ou</Text>
|
||||
<View style={s.sepLine} />
|
||||
</View>
|
||||
|
||||
{/* Formulaire email/password */}
|
||||
<View style={s.form}>
|
||||
<Text style={s.label}>Email</Text>
|
||||
<TextInput
|
||||
value={email} onChangeText={setEmail}
|
||||
placeholder="vous@exemple.com" autoCapitalize="none"
|
||||
keyboardType="email-address" autoComplete="email"
|
||||
style={s.input} placeholderTextColor={C.concrete}
|
||||
/>
|
||||
|
||||
<Text style={[s.label, { marginTop: 16 }]}>Mot de passe</Text>
|
||||
<View style={s.pwdRow}>
|
||||
<TextInput
|
||||
value={password} onChangeText={setPassword}
|
||||
placeholder="••••••••"
|
||||
secureTextEntry={!showPwd}
|
||||
autoComplete="password"
|
||||
style={[s.input, { flex: 1, marginRight: 8 }]}
|
||||
placeholderTextColor={C.concrete}
|
||||
onSubmitEditing={handleLogin}
|
||||
/>
|
||||
<TouchableOpacity onPress={() => setShowPwd(!showPwd)} style={s.eyeBtn}>
|
||||
<Text style={s.eyeIcon}>{showPwd ? '🙈' : '👁️'}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<TouchableOpacity
|
||||
onPress={handleLogin}
|
||||
disabled={loading || !email || !password}
|
||||
style={[s.btn, (loading || !email || !password) && s.btnDisabled]}
|
||||
>
|
||||
{loading
|
||||
? <ActivityIndicator color={C.white} size="small" />
|
||||
: <Text style={s.btnText}>Se connecter</Text>}
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<Text style={s.footer}>memento-note.com</Text>
|
||||
</View>
|
||||
</KeyboardAvoidingView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
container: { flex: 1, backgroundColor: C.paper },
|
||||
inner: { flex: 1, justifyContent: 'center', paddingHorizontal: 32 },
|
||||
logoBlock: { marginBottom: 40, alignItems: 'center' },
|
||||
logo: { fontSize: 36, fontStyle: 'italic', color: C.ink, fontWeight: '600' },
|
||||
tagline: { fontSize: 14, color: C.concrete, marginTop: 4 },
|
||||
|
||||
googleBtn: {
|
||||
flexDirection: 'row', alignItems: 'center', justifyContent: 'center', gap: 10,
|
||||
backgroundColor: C.white, borderWidth: 1.5, borderColor: C.border,
|
||||
borderRadius: 12, paddingVertical: 14,
|
||||
shadowColor: '#000', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.06, shadowRadius: 3,
|
||||
},
|
||||
googleG: { fontSize: 18, fontWeight: '700', color: '#4285F4' },
|
||||
googleText: { fontSize: 15, fontWeight: '600', color: C.ink },
|
||||
|
||||
sep: { flexDirection: 'row', alignItems: 'center', marginVertical: 20, gap: 10 },
|
||||
sepLine: { flex: 1, height: 1, backgroundColor: C.border },
|
||||
sepText: { fontSize: 12, color: C.concrete, fontWeight: '500' },
|
||||
|
||||
form: {},
|
||||
label: { fontSize: 11, fontWeight: '700', letterSpacing: 1.5, textTransform: 'uppercase', color: C.concrete, marginBottom: 6 },
|
||||
input: { borderWidth: 1, borderColor: C.border, borderRadius: 12, paddingHorizontal: 16, paddingVertical: 13, fontSize: 15, color: C.ink, backgroundColor: C.white },
|
||||
pwdRow: { flexDirection: 'row', alignItems: 'center' },
|
||||
eyeBtn: { width: 44, height: 44, alignItems: 'center', justifyContent: 'center', backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 12 },
|
||||
eyeIcon: { fontSize: 18 },
|
||||
|
||||
btn: { marginTop: 20, backgroundColor: C.ink, borderRadius: 12, paddingVertical: 14, alignItems: 'center' },
|
||||
btnDisabled: { opacity: 0.4 },
|
||||
btnText: { color: C.white, fontWeight: '600', fontSize: 15 },
|
||||
footer: { textAlign: 'center', fontSize: 12, color: C.concrete, marginTop: 32 },
|
||||
})
|
||||
24
memento-mobile/app/(tabs)/_layout.tsx
Normal file
24
memento-mobile/app/(tabs)/_layout.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import { Tabs } from 'expo-router'
|
||||
import { BookOpen, Search, Home, User, GraduationCap } from 'lucide-react-native'
|
||||
import { C } from '@/lib/theme'
|
||||
import { t } from '@/lib/i18n'
|
||||
|
||||
export default function TabsLayout() {
|
||||
return (
|
||||
<Tabs
|
||||
screenOptions={{
|
||||
headerShown: false,
|
||||
tabBarActiveTintColor: C.brand,
|
||||
tabBarInactiveTintColor: C.concrete,
|
||||
tabBarStyle: { backgroundColor: C.paper, borderTopColor: C.border, borderTopWidth: 1, paddingBottom: 4, height: 60 },
|
||||
tabBarLabelStyle: { fontSize: 10, fontWeight: '600', marginTop: -2 },
|
||||
}}
|
||||
>
|
||||
<Tabs.Screen name="home" options={{ title: t('tab.home'), tabBarIcon: ({ color, size }) => <Home size={size} color={color} /> }} />
|
||||
<Tabs.Screen name="notebooks" options={{ title: t('tab.notebooks'), tabBarIcon: ({ color, size }) => <BookOpen size={size} color={color} /> }} />
|
||||
<Tabs.Screen name="revision" options={{ title: t('tab.revision'), tabBarIcon: ({ color, size }) => <GraduationCap size={size} color={color} /> }} />
|
||||
<Tabs.Screen name="search" options={{ title: t('tab.search'), tabBarIcon: ({ color, size }) => <Search size={size} color={color} /> }} />
|
||||
<Tabs.Screen name="profile" options={{ title: t('tab.profile'), tabBarIcon: ({ color, size }) => <User size={size} color={color} /> }} />
|
||||
</Tabs>
|
||||
)
|
||||
}
|
||||
158
memento-mobile/app/(tabs)/home.tsx
Normal file
158
memento-mobile/app/(tabs)/home.tsx
Normal file
@@ -0,0 +1,158 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import {
|
||||
View, Text, ScrollView, TouchableOpacity, Alert,
|
||||
ActivityIndicator, RefreshControl, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useRouter } from 'expo-router'
|
||||
import { CalendarDays, PenLine, GraduationCap, Clock, ChevronRight, Search } from 'lucide-react-native'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { useAuthStore } from '@/lib/store'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Note {
|
||||
id: string
|
||||
title: string
|
||||
updatedAt: string
|
||||
notebookName?: string
|
||||
color?: string
|
||||
}
|
||||
|
||||
export default function HomeScreen() {
|
||||
const user = useAuthStore((s) => s.user)
|
||||
const [recentNotes, setRecentNotes] = useState<Note[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [refreshing, setRefreshing] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const load = async () => {
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.notes())
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
setRecentNotes((data.notes ?? []).slice(0, 12))
|
||||
}
|
||||
} finally {
|
||||
setLoading(false)
|
||||
setRefreshing(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => { load() }, [])
|
||||
|
||||
const handleDailyNote = async () => {
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.dailyNote)
|
||||
if (!res.ok) {
|
||||
Alert.alert('Erreur', 'Impossible de charger la note du jour.')
|
||||
return
|
||||
}
|
||||
const data = await res.json()
|
||||
const id = data.id ?? data.note?.id
|
||||
if (!id) { Alert.alert('Erreur', 'Note introuvable.'); return }
|
||||
router.push({ pathname: '/note/[id]', params: { id } })
|
||||
} catch {
|
||||
Alert.alert('Erreur réseau', 'Vérifiez votre connexion.')
|
||||
}
|
||||
}
|
||||
|
||||
const now = new Date()
|
||||
const hour = now.getHours()
|
||||
const greeting = hour < 12 ? 'Bonjour' : hour < 18 ? 'Bon après-midi' : 'Bonsoir'
|
||||
const firstName = user?.name?.split(' ')[0] ?? ''
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
refreshControl={<RefreshControl refreshing={refreshing} onRefresh={() => { setRefreshing(true); load() }} tintColor={C.brand} />}
|
||||
>
|
||||
{/* Header */}
|
||||
<View style={s.header}>
|
||||
<View>
|
||||
<Text style={s.greeting}>{greeting}{firstName ? `, ${firstName}` : ''}</Text>
|
||||
<Text style={s.date}>{now.toLocaleDateString('fr-FR', { weekday: 'long', day: 'numeric', month: 'long' })}</Text>
|
||||
</View>
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/(tabs)/search' })} style={s.searchBtn}>
|
||||
<Search size={18} color={C.ink} />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
{/* Quick actions — actions uniques, pas de doublons avec le tab bar */}
|
||||
<View style={s.quickRow}>
|
||||
<TouchableOpacity onPress={handleDailyNote} style={s.quickCard} activeOpacity={0.7}>
|
||||
<View style={[s.quickIcon, { backgroundColor: '#f3ece4' }]}>
|
||||
<CalendarDays size={20} color={C.brand} />
|
||||
</View>
|
||||
<Text style={s.quickLabel}>Note du jour</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/note/create' })} style={s.quickCard} activeOpacity={0.7}>
|
||||
<View style={[s.quickIcon, { backgroundColor: '#edf0f7' }]}>
|
||||
<PenLine size={20} color="#5b7ec7" />
|
||||
</View>
|
||||
<Text style={s.quickLabel}>Nouvelle note</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/(tabs)/revision' })} style={s.quickCard} activeOpacity={0.7}>
|
||||
<View style={[s.quickIcon, { backgroundColor: '#eef7ed' }]}>
|
||||
<GraduationCap size={20} color="#4a9b61" />
|
||||
</View>
|
||||
<Text style={s.quickLabel}>Révision</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
{/* Recent notes */}
|
||||
<View style={s.section}>
|
||||
<View style={s.sectionHeader}>
|
||||
<Clock size={13} color={C.concrete} />
|
||||
<Text style={s.sectionLabel}>Récentes</Text>
|
||||
</View>
|
||||
|
||||
{loading
|
||||
? <ActivityIndicator color={C.brand} style={{ marginTop: 24 }} />
|
||||
: recentNotes.length === 0
|
||||
? <Text style={s.empty}>Aucune note pour l'instant.</Text>
|
||||
: recentNotes.map((note, i) => (
|
||||
<TouchableOpacity
|
||||
key={note.id}
|
||||
onPress={() => router.push({ pathname: '/note/[id]', params: { id: note.id } })}
|
||||
style={[s.noteRow, i === recentNotes.length - 1 && { borderBottomWidth: 0 }]}
|
||||
activeOpacity={0.6}
|
||||
>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.noteTitle} numberOfLines={1}>{note.title || 'Sans titre'}</Text>
|
||||
{note.notebookName && <Text style={s.noteMeta} numberOfLines={1}>{note.notebookName}</Text>}
|
||||
</View>
|
||||
<View style={s.noteRight}>
|
||||
<Text style={s.noteDate}>{new Date(note.updatedAt).toLocaleDateString('fr-FR', { day: 'numeric', month: 'short' })}</Text>
|
||||
<ChevronRight size={12} color={C.border} />
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
<View style={{ height: 40 }} />
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'flex-start', paddingHorizontal: 20, paddingTop: 20, paddingBottom: 16 },
|
||||
greeting: { fontSize: 22, fontWeight: '700', color: C.ink, letterSpacing: -0.3 },
|
||||
date: { fontSize: 13, color: C.concrete, marginTop: 3, textTransform: 'capitalize' },
|
||||
searchBtn: { width: 38, height: 38, borderRadius: 19, backgroundColor: C.white, borderWidth: 1, borderColor: C.border, alignItems: 'center', justifyContent: 'center' },
|
||||
quickRow: { flexDirection: 'row', gap: 10, paddingHorizontal: 20, marginBottom: 24 },
|
||||
quickCard: { flex: 1, backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 14, padding: 14, alignItems: 'center', gap: 10 },
|
||||
quickIcon: { width: 40, height: 40, borderRadius: 12, alignItems: 'center', justifyContent: 'center' },
|
||||
quickLabel: { fontSize: 11, fontWeight: '600', color: C.ink, textAlign: 'center' },
|
||||
section: { marginHorizontal: 20, backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 16, overflow: 'hidden' },
|
||||
sectionHeader: { flexDirection: 'row', alignItems: 'center', gap: 6, paddingHorizontal: 16, paddingVertical: 10, borderBottomWidth: 1, borderBottomColor: C.border, backgroundColor: '#f8f6f2' },
|
||||
sectionLabel: { fontSize: 11, fontWeight: '700', color: C.concrete, textTransform: 'uppercase', letterSpacing: 1 },
|
||||
empty: { color: C.concrete, fontSize: 14, textAlign: 'center', padding: 24 },
|
||||
noteRow: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 16, paddingVertical: 13, borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
noteTitle: { fontSize: 14, fontWeight: '500', color: C.ink },
|
||||
noteMeta: { fontSize: 11, color: C.concrete, marginTop: 2 },
|
||||
noteRight: { flexDirection: 'row', alignItems: 'center', gap: 4 },
|
||||
noteDate: { fontSize: 11, color: C.concrete },
|
||||
})
|
||||
116
memento-mobile/app/(tabs)/notebooks.tsx
Normal file
116
memento-mobile/app/(tabs)/notebooks.tsx
Normal file
@@ -0,0 +1,116 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import {
|
||||
View, Text, FlatList, TouchableOpacity,
|
||||
ActivityIndicator, RefreshControl, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useRouter } from 'expo-router'
|
||||
import { ChevronRight, BookOpen, Folder, Plus } from 'lucide-react-native'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Notebook {
|
||||
id: string
|
||||
name: string
|
||||
icon: string | null
|
||||
color: string | null
|
||||
_count: { notes: number }
|
||||
}
|
||||
|
||||
// icônes Lucide stockées en string → afficher composant, sinon emoji
|
||||
const LUCIDE_ICONS = new Set(['folder','book','archive','bookmark','file','note','inbox'])
|
||||
|
||||
function NotebookIcon({ icon, color }: { icon: string | null, color: string | null }) {
|
||||
const tint = color || C.brand
|
||||
if (!icon || LUCIDE_ICONS.has(icon.toLowerCase())) {
|
||||
return <Folder size={18} color={tint} />
|
||||
}
|
||||
// emoji ou autre caractère unicode
|
||||
return <Text style={{ fontSize: 18, lineHeight: 22 }}>{icon}</Text>
|
||||
}
|
||||
|
||||
export default function NotebooksScreen() {
|
||||
const [notebooks, setNotebooks] = useState<Notebook[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [refreshing, setRefreshing] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const load = async () => {
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.notebooks)
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
setNotebooks(data.notebooks ?? [])
|
||||
}
|
||||
} finally {
|
||||
setLoading(false)
|
||||
setRefreshing(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => { load() }, [])
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<SafeAreaView style={[s.safe, { alignItems: 'center', justifyContent: 'center' }]}>
|
||||
<ActivityIndicator color={C.brand} />
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<View style={s.header}>
|
||||
<BookOpen size={18} color={C.brand} style={{ marginRight: 8 }} />
|
||||
<Text style={s.title}>Carnets</Text>
|
||||
<Text style={s.count}>{notebooks.length}</Text>
|
||||
<TouchableOpacity
|
||||
onPress={() => router.push({ pathname: '/note/create' })}
|
||||
style={s.newNoteBtn}
|
||||
>
|
||||
<Plus size={18} color={C.brand} />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<FlatList
|
||||
data={notebooks}
|
||||
keyExtractor={(item) => item.id}
|
||||
contentContainerStyle={s.list}
|
||||
refreshControl={<RefreshControl refreshing={refreshing} onRefresh={() => { setRefreshing(true); load() }} tintColor={C.brand} />}
|
||||
renderItem={({ item }) => (
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/notebook/[id]', params: { id: item.id } })} style={s.card} activeOpacity={0.7}>
|
||||
<View style={[s.iconWrap, { backgroundColor: (item.color || C.brand) + '18' }]}>
|
||||
<NotebookIcon icon={item.icon} color={item.color} />
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.cardTitle} numberOfLines={1}>{item.name}</Text>
|
||||
<Text style={s.cardMeta}>{item._count?.notes ?? 0} note{(item._count?.notes ?? 0) !== 1 ? 's' : ''}</Text>
|
||||
</View>
|
||||
<ChevronRight size={14} color={C.border} />
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
ListEmptyComponent={
|
||||
<View style={s.emptyWrap}>
|
||||
<BookOpen size={32} color={C.border} />
|
||||
<Text style={s.empty}>Aucun carnet</Text>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 20, paddingTop: 16, paddingBottom: 12, borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
title: { fontSize: 20, fontWeight: '700', color: C.ink, flex: 1 },
|
||||
count: { fontSize: 12, color: C.concrete, backgroundColor: C.border, paddingHorizontal: 8, paddingVertical: 2, borderRadius: 10, overflow: 'hidden', marginRight: 8 },
|
||||
newNoteBtn: { width: 34, height: 34, borderRadius: 17, backgroundColor: '#f3ece4', alignItems: 'center', justifyContent: 'center' },
|
||||
list: { padding: 12 },
|
||||
card: { flexDirection: 'row', alignItems: 'center', gap: 12, backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 14, padding: 14, marginBottom: 8 },
|
||||
iconWrap: { width: 38, height: 38, borderRadius: 10, alignItems: 'center', justifyContent: 'center' },
|
||||
cardTitle: { fontSize: 14, fontWeight: '600', color: C.ink, marginBottom: 2 },
|
||||
cardMeta: { fontSize: 12, color: C.concrete },
|
||||
emptyWrap: { alignItems: 'center', marginTop: 60, gap: 12 },
|
||||
empty: { color: C.concrete, fontSize: 14 },
|
||||
})
|
||||
84
memento-mobile/app/(tabs)/profile.tsx
Normal file
84
memento-mobile/app/(tabs)/profile.tsx
Normal file
@@ -0,0 +1,84 @@
|
||||
import { View, Text, TouchableOpacity, ScrollView, Alert, StyleSheet } from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { LogOut, CreditCard, Globe } from 'lucide-react-native'
|
||||
import { useAuthStore } from '@/lib/store'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
const TIER_LABELS: Record<string, string> = {
|
||||
FREE: 'Gratuit',
|
||||
BASIC: 'Basic',
|
||||
PRO: 'Pro',
|
||||
BUSINESS: 'Business',
|
||||
ENTERPRISE: 'Enterprise',
|
||||
}
|
||||
|
||||
export default function ProfileScreen() {
|
||||
const { user, logout } = useAuthStore()
|
||||
const initial = (user?.name?.[0] ?? user?.email?.[0] ?? '?').toUpperCase()
|
||||
|
||||
const handleLogout = () => {
|
||||
Alert.alert(
|
||||
'Se déconnecter',
|
||||
'Voulez-vous vraiment vous déconnecter ?',
|
||||
[
|
||||
{ text: 'Annuler', style: 'cancel' },
|
||||
{ text: 'Déconnecter', style: 'destructive', onPress: logout },
|
||||
]
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<ScrollView style={{ flex: 1, paddingHorizontal: 20 }}>
|
||||
<Text style={s.title}>Profil</Text>
|
||||
|
||||
<View style={s.card}>
|
||||
<View style={s.avatar}>
|
||||
<Text style={s.avatarText}>{initial}</Text>
|
||||
</View>
|
||||
<Text style={s.name}>{user?.name ?? 'Utilisateur'}</Text>
|
||||
<Text style={s.email}>{user?.email}</Text>
|
||||
{user?.tier && (
|
||||
<View style={s.badge}>
|
||||
<Text style={s.badgeText}>{TIER_LABELS[user.tier] ?? user.tier}</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
<View style={s.actionsCard}>
|
||||
<TouchableOpacity style={[s.actionRow, s.actionRowBorder]}>
|
||||
<CreditCard size={18} color={C.concrete} />
|
||||
<Text style={s.actionText}>Abonnement</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity style={s.actionRow}>
|
||||
<Globe size={18} color={C.concrete} />
|
||||
<Text style={s.actionText}>Ouvrir memento-note.com</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<TouchableOpacity onPress={handleLogout} style={s.logoutBtn}>
|
||||
<LogOut size={18} color={C.rose} />
|
||||
<Text style={s.logoutText}>Se déconnecter</Text>
|
||||
</TouchableOpacity>
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
title: { fontSize: 22, fontStyle: 'italic', fontWeight: '700', color: C.ink, paddingTop: 16, paddingBottom: 24 },
|
||||
card: { backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 20, padding: 20, marginBottom: 16 },
|
||||
avatar: { width: 56, height: 56, borderRadius: 28, backgroundColor: '#f3ece4', alignItems: 'center', justifyContent: 'center', marginBottom: 12 },
|
||||
avatarText: { fontSize: 22, fontWeight: '700', color: C.brand },
|
||||
name: { fontSize: 17, fontWeight: '600', color: C.ink },
|
||||
email: { fontSize: 13, color: C.concrete, marginTop: 2 },
|
||||
badge: { marginTop: 12, alignSelf: 'flex-start', backgroundColor: '#f3ece4', paddingHorizontal: 12, paddingVertical: 4, borderRadius: 20 },
|
||||
badgeText: { fontSize: 11, fontWeight: '800', color: C.brand, letterSpacing: 1, textTransform: 'uppercase' },
|
||||
actionsCard: { backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 20, overflow: 'hidden', marginBottom: 16 },
|
||||
actionRow: { flexDirection: 'row', alignItems: 'center', gap: 12, paddingHorizontal: 16, paddingVertical: 14 },
|
||||
actionRowBorder: { borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
actionText: { fontSize: 15, color: C.ink, flex: 1 },
|
||||
logoutBtn: { backgroundColor: C.white, borderWidth: 1, borderColor: C.roseBorder, borderRadius: 20, flexDirection: 'row', alignItems: 'center', gap: 12, paddingHorizontal: 16, paddingVertical: 14 },
|
||||
logoutText: { fontSize: 15, color: C.rose, fontWeight: '500' },
|
||||
})
|
||||
174
memento-mobile/app/(tabs)/revision.tsx
Normal file
174
memento-mobile/app/(tabs)/revision.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
import { useEffect, useState, useCallback } from 'react'
|
||||
import {
|
||||
View, Text, StyleSheet, FlatList, TouchableOpacity,
|
||||
ActivityIndicator, RefreshControl,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useRouter } from 'expo-router'
|
||||
import { GraduationCap, BookOpen, ChevronRight, Clock } from 'lucide-react-native'
|
||||
import { C } from '@/lib/theme'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
|
||||
interface Deck {
|
||||
id: string
|
||||
name: string
|
||||
notebookName: string | null
|
||||
totalCards: number
|
||||
dueCount: number
|
||||
masteredCount: number
|
||||
}
|
||||
|
||||
export default function RevisionScreen() {
|
||||
const router = useRouter()
|
||||
const [decks, setDecks] = useState<Deck[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [refreshing, setRefreshing] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
const load = useCallback(async (silent = false) => {
|
||||
if (!silent) setLoading(true)
|
||||
setError(null)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.flashcardDecks)
|
||||
const data = await res.json()
|
||||
if (!res.ok) throw new Error(data.error ?? `Erreur ${res.status}`)
|
||||
setDecks(data.decks ?? [])
|
||||
} catch (e: any) {
|
||||
setError(e.message ?? 'Erreur de chargement')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
setRefreshing(false)
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => { load() }, [load])
|
||||
|
||||
const totalDue = decks.reduce((s, d) => s + d.dueCount, 0)
|
||||
|
||||
if (loading) return (
|
||||
<SafeAreaView style={s.center}>
|
||||
<ActivityIndicator color={C.brand} size="large" />
|
||||
</SafeAreaView>
|
||||
)
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
{/* Header */}
|
||||
<View style={s.header}>
|
||||
<View style={s.headerLeft}>
|
||||
<GraduationCap size={22} color={C.brand} />
|
||||
<Text style={s.title}>Révision</Text>
|
||||
</View>
|
||||
{totalDue > 0 && (
|
||||
<View style={s.badge}>
|
||||
<Text style={s.badgeTxt}>{totalDue} à revoir</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
{error ? (
|
||||
<View style={s.center}>
|
||||
<Text style={s.errorTxt}>{error}</Text>
|
||||
<TouchableOpacity onPress={() => load()} style={s.retryBtn}>
|
||||
<Text style={s.retryTxt}>Réessayer</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
) : decks.length === 0 ? (
|
||||
<View style={s.center}>
|
||||
<GraduationCap size={48} color={C.concrete} />
|
||||
<Text style={s.emptyTitle}>Aucun paquet</Text>
|
||||
<Text style={s.emptyHint}>
|
||||
Générez des flashcards depuis une note (bouton ✦ dans l'éditeur) pour commencer à réviser.
|
||||
</Text>
|
||||
</View>
|
||||
) : (
|
||||
<FlatList
|
||||
data={decks}
|
||||
keyExtractor={(d) => d.id}
|
||||
refreshControl={<RefreshControl refreshing={refreshing} onRefresh={() => { setRefreshing(true); load(true) }} tintColor={C.brand} />}
|
||||
contentContainerStyle={s.list}
|
||||
renderItem={({ item }) => <DeckCard deck={item} onPress={() => router.push({ pathname: '/revision/session', params: { deckId: item.id, deckName: item.name } })} />}
|
||||
/>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
function DeckCard({ deck, onPress }: { deck: Deck; onPress: () => void }) {
|
||||
const progress = deck.totalCards > 0 ? deck.masteredCount / deck.totalCards : 0
|
||||
|
||||
return (
|
||||
<TouchableOpacity style={s.card} onPress={onPress} activeOpacity={0.8}>
|
||||
<View style={s.cardLeft}>
|
||||
<View style={s.deckIcon}>
|
||||
<BookOpen size={18} color={C.brand} />
|
||||
</View>
|
||||
<View style={s.cardInfo}>
|
||||
<Text style={s.deckName} numberOfLines={1}>{deck.name}</Text>
|
||||
{deck.notebookName && <Text style={s.deckSub} numberOfLines={1}>{deck.notebookName}</Text>}
|
||||
<View style={s.progressBar}>
|
||||
<View style={[s.progressFill, { width: `${Math.round(progress * 100)}%` }]} />
|
||||
</View>
|
||||
<Text style={s.progressTxt}>
|
||||
{deck.masteredCount}/{deck.totalCards} maîtrisées
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View style={s.cardRight}>
|
||||
{deck.dueCount > 0 ? (
|
||||
<View style={s.duePill}>
|
||||
<Clock size={11} color="#e11d48" />
|
||||
<Text style={s.dueTxt}>{deck.dueCount}</Text>
|
||||
</View>
|
||||
) : (
|
||||
<Text style={s.upToDate}>✓</Text>
|
||||
)}
|
||||
<ChevronRight size={16} color={C.concrete} style={{ marginTop: 4 }} />
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
center: { flex: 1, alignItems: 'center', justifyContent: 'center', padding: 24 },
|
||||
header: {
|
||||
flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between',
|
||||
paddingHorizontal: 20, paddingTop: 12, paddingBottom: 16,
|
||||
borderBottomWidth: 1, borderBottomColor: C.border,
|
||||
},
|
||||
headerLeft: { flexDirection: 'row', alignItems: 'center', gap: 8 },
|
||||
title: { fontSize: 20, fontWeight: '700', color: C.ink },
|
||||
badge: { backgroundColor: '#fee2e2', paddingHorizontal: 10, paddingVertical: 4, borderRadius: 20 },
|
||||
badgeTxt: { fontSize: 12, fontWeight: '600', color: '#e11d48' },
|
||||
list: { padding: 16, gap: 10 },
|
||||
card: {
|
||||
backgroundColor: C.surface, borderRadius: 14, padding: 14,
|
||||
flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between',
|
||||
borderWidth: 1, borderColor: C.border,
|
||||
},
|
||||
cardLeft: { flex: 1, flexDirection: 'row', alignItems: 'center', gap: 12, marginRight: 8 },
|
||||
deckIcon: {
|
||||
width: 40, height: 40, borderRadius: 12,
|
||||
backgroundColor: '#f0f7ff', alignItems: 'center', justifyContent: 'center',
|
||||
},
|
||||
cardInfo: { flex: 1 },
|
||||
deckName: { fontSize: 15, fontWeight: '600', color: C.ink, marginBottom: 2 },
|
||||
deckSub: { fontSize: 12, color: C.concrete, marginBottom: 6 },
|
||||
progressBar: { height: 4, backgroundColor: C.border, borderRadius: 2, marginBottom: 4 },
|
||||
progressFill: { height: 4, backgroundColor: C.brand, borderRadius: 2 },
|
||||
progressTxt: { fontSize: 11, color: C.concrete },
|
||||
cardRight: { alignItems: 'flex-end', gap: 2 },
|
||||
duePill: {
|
||||
flexDirection: 'row', alignItems: 'center', gap: 3,
|
||||
backgroundColor: '#fee2e2', paddingHorizontal: 8, paddingVertical: 3, borderRadius: 10,
|
||||
},
|
||||
dueTxt: { fontSize: 12, fontWeight: '700', color: '#e11d48' },
|
||||
upToDate: { fontSize: 16, color: C.brand, fontWeight: '700' },
|
||||
emptyTitle: { fontSize: 18, fontWeight: '700', color: C.ink, marginTop: 16, marginBottom: 8 },
|
||||
emptyHint: { fontSize: 14, color: C.concrete, textAlign: 'center', lineHeight: 20 },
|
||||
errorTxt: { fontSize: 15, color: '#e11d48', textAlign: 'center', marginBottom: 12 },
|
||||
retryBtn: { backgroundColor: C.brand, paddingHorizontal: 20, paddingVertical: 10, borderRadius: 10 },
|
||||
retryTxt: { color: '#fff', fontWeight: '600' },
|
||||
})
|
||||
99
memento-mobile/app/(tabs)/search.tsx
Normal file
99
memento-mobile/app/(tabs)/search.tsx
Normal file
@@ -0,0 +1,99 @@
|
||||
import { useState } from 'react'
|
||||
import {
|
||||
View, Text, TextInput, FlatList,
|
||||
TouchableOpacity, ActivityIndicator, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { Search as SearchIcon, X } from 'lucide-react-native'
|
||||
import { useRouter } from 'expo-router'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface SearchResult {
|
||||
id: string
|
||||
title: string
|
||||
snippet: string
|
||||
notebookName?: string
|
||||
score?: number
|
||||
}
|
||||
|
||||
export default function SearchScreen() {
|
||||
const [query, setQuery] = useState('')
|
||||
const [results, setResults] = useState<SearchResult[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [searched, setSearched] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const handleSearch = async () => {
|
||||
if (!query.trim()) return
|
||||
setLoading(true)
|
||||
setSearched(true)
|
||||
try {
|
||||
const res = await apiFetch(`${ENDPOINTS.search}?q=${encodeURIComponent(query)}`)
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
setResults(data.results ?? [])
|
||||
}
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<View style={s.top}>
|
||||
<Text style={s.title}>Recherche</Text>
|
||||
<View style={s.inputRow}>
|
||||
<SearchIcon size={16} color={C.concrete} />
|
||||
<TextInput
|
||||
value={query} onChangeText={setQuery}
|
||||
placeholder="Chercher dans vos notes…"
|
||||
style={s.input} placeholderTextColor={C.concrete}
|
||||
returnKeyType="search" onSubmitEditing={handleSearch}
|
||||
/>
|
||||
{query.length > 0 && (
|
||||
<TouchableOpacity onPress={() => { setQuery(''); setResults([]); setSearched(false) }}>
|
||||
<X size={14} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{loading
|
||||
? <View style={s.center}><ActivityIndicator color={C.brand} /></View>
|
||||
: <FlatList
|
||||
data={results}
|
||||
keyExtractor={(item) => item.id}
|
||||
contentContainerStyle={s.list}
|
||||
renderItem={({ item }) => (
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/note/[id]', params: { id: item.id } })} style={s.card}>
|
||||
<Text style={s.cardTitle} numberOfLines={1}>{item.title || 'Sans titre'}</Text>
|
||||
{item.snippet && <Text style={s.snippet} numberOfLines={2}>{item.snippet}</Text>}
|
||||
{item.notebookName && <Text style={s.nb}>{item.notebookName}</Text>}
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
ListEmptyComponent={
|
||||
<Text style={s.empty}>
|
||||
{searched ? `Aucun résultat pour "${query}"` : 'Tapez votre recherche puis appuyez sur Entrée'}
|
||||
</Text>
|
||||
}
|
||||
/>}
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
top: { paddingHorizontal: 20, paddingTop: 16, paddingBottom: 8 },
|
||||
title: { fontSize: 22, fontStyle: 'italic', fontWeight: '700', color: C.ink, marginBottom: 16 },
|
||||
inputRow: { flexDirection: 'row', alignItems: 'center', backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 12, paddingHorizontal: 12, paddingVertical: 10, gap: 8 },
|
||||
input: { flex: 1, fontSize: 15, color: C.ink },
|
||||
center: { flex: 1, alignItems: 'center', justifyContent: 'center' },
|
||||
list: { paddingHorizontal: 20, paddingTop: 12, paddingBottom: 32 },
|
||||
card: { backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 16, padding: 16, marginBottom: 10 },
|
||||
cardTitle: { fontSize: 15, fontWeight: '600', color: C.ink },
|
||||
snippet: { fontSize: 12, color: C.concrete, marginTop: 4 },
|
||||
nb: { fontSize: 11, color: C.concrete, marginTop: 4, opacity: 0.7 },
|
||||
empty: { textAlign: 'center', color: C.concrete, marginTop: 48, fontSize: 13 },
|
||||
})
|
||||
46
memento-mobile/app/_layout.tsx
Normal file
46
memento-mobile/app/_layout.tsx
Normal file
@@ -0,0 +1,46 @@
|
||||
import { useEffect } from 'react'
|
||||
import { Slot, useRouter, useSegments } from 'expo-router'
|
||||
import { SafeAreaProvider } from 'react-native-safe-area-context'
|
||||
import { StatusBar } from 'expo-status-bar'
|
||||
import { View, ActivityIndicator, StyleSheet } from 'react-native'
|
||||
import { useAuthStore } from '@/lib/store'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
// Ré-exporter C pour la compatibilité avec les anciens imports
|
||||
export { C } from '@/lib/theme'
|
||||
|
||||
export default function RootLayout() {
|
||||
const { user, loading, restore } = useAuthStore()
|
||||
const router = useRouter()
|
||||
const segments = useSegments()
|
||||
|
||||
useEffect(() => { restore() }, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (loading) return
|
||||
const inAuth = segments[0] === '(auth)'
|
||||
if (!user && !inAuth) router.replace({ pathname: '/(auth)/login' })
|
||||
else if (user && inAuth) router.replace({ pathname: '/(tabs)/home' })
|
||||
}, [user, loading, segments])
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<SafeAreaProvider>
|
||||
<View style={s.loader}>
|
||||
<ActivityIndicator size="large" color={C.brand} />
|
||||
</View>
|
||||
</SafeAreaProvider>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaProvider>
|
||||
<StatusBar style="auto" />
|
||||
<Slot />
|
||||
</SafeAreaProvider>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
loader: { flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: C.paper },
|
||||
})
|
||||
311
memento-mobile/app/note/[id].tsx
Normal file
311
memento-mobile/app/note/[id].tsx
Normal file
@@ -0,0 +1,311 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import {
|
||||
View, Text, ActivityIndicator,
|
||||
TouchableOpacity, Share, Alert,
|
||||
TextInput, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useLocalSearchParams, useRouter } from 'expo-router'
|
||||
import { ArrowLeft, Share2, Pencil, Check, Trash2, GraduationCap } from 'lucide-react-native'
|
||||
import { WebView } from 'react-native-webview'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
import { AISheet } from '@/components/AISheet'
|
||||
import { MicButton } from '@/components/MicButton'
|
||||
import { FlashcardSheet } from '@/components/FlashcardSheet'
|
||||
import { useAudioRecorder } from '@/lib/useAudioRecorder'
|
||||
|
||||
interface Note {
|
||||
id: string
|
||||
title: string
|
||||
content: string
|
||||
updatedAt: string
|
||||
notebookName?: string
|
||||
}
|
||||
|
||||
const AI_MODES = [
|
||||
{ key: 'improve', label: '✨ Améliorer le style' },
|
||||
{ key: 'fix_grammar', label: '🔤 Corriger la grammaire' },
|
||||
{ key: 'shorten', label: '✂️ Raccourcir' },
|
||||
{ key: 'clarify', label: '💡 Clarifier' },
|
||||
]
|
||||
|
||||
/** Extrait le texte brut depuis le HTML TipTap */
|
||||
function htmlToPlainText(html: string): string {
|
||||
return html
|
||||
.replace(/<br\s*\/?>/gi, '\n')
|
||||
.replace(/<\/p>/gi, '\n')
|
||||
.replace(/<\/h[1-6]>/gi, '\n')
|
||||
.replace(/<\/li>/gi, '\n')
|
||||
.replace(/<[^>]+>/g, '')
|
||||
.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/ /g, ' ')
|
||||
.replace(/\n{3,}/g, '\n\n')
|
||||
.trim()
|
||||
}
|
||||
|
||||
function tipTapToHtml(node: any): string {
|
||||
if (!node) return ''
|
||||
if (node.type === 'doc') return (node.content ?? []).map(tipTapToHtml).join('')
|
||||
if (node.type === 'text') {
|
||||
let t = (node.text ?? '').replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')
|
||||
if (node.marks?.some((m: any) => m.type === 'bold')) t = `<strong>${t}</strong>`
|
||||
if (node.marks?.some((m: any) => m.type === 'italic')) t = `<em>${t}</em>`
|
||||
if (node.marks?.some((m: any) => m.type === 'code')) t = `<code>${t}</code>`
|
||||
return t
|
||||
}
|
||||
const inner = (node.content ?? []).map(tipTapToHtml).join('')
|
||||
switch (node.type) {
|
||||
case 'paragraph': return `<p>${inner || '​'}</p>`
|
||||
case 'heading': return `<h${node.attrs?.level ?? 1}>${inner}</h${node.attrs?.level ?? 1}>`
|
||||
case 'bulletList': return `<ul>${inner}</ul>`
|
||||
case 'orderedList': return `<ol>${inner}</ol>`
|
||||
case 'listItem': return `<li>${inner}</li>`
|
||||
case 'blockquote': return `<blockquote>${inner}</blockquote>`
|
||||
case 'codeBlock': return `<pre><code>${inner}</code></pre>`
|
||||
case 'hardBreak': return '<br>'
|
||||
default: return inner
|
||||
}
|
||||
}
|
||||
|
||||
function buildHtml(content: string, title: string) {
|
||||
const safeTitle = title.replace(/</g, '<').replace(/>/g, '>')
|
||||
let body: string
|
||||
const trimmed = content.trimStart()
|
||||
if (trimmed.startsWith('<')) {
|
||||
body = content
|
||||
} else if (trimmed.startsWith('{')) {
|
||||
try { body = tipTapToHtml(JSON.parse(content)) } catch { body = `<p>${content.replace(/\n/g, '<br>')}</p>` }
|
||||
} else {
|
||||
body = `<p>${content.replace(/\n/g, '<br>')}</p>`
|
||||
}
|
||||
|
||||
return `<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=3">
|
||||
<style>
|
||||
:root { --brand: #A47148; --ink: #1A1A18; --paper: #FAFAF8; --concrete: #8A8A82; --border: #E8E6E0; --code-bg: #f0ede8; }
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-text-size-adjust: 100%; }
|
||||
body { font-family: -apple-system, 'Helvetica Neue', sans-serif; font-size: 16px; line-height: 1.75; color: var(--ink); background: var(--paper); padding: 20px 20px 80px; word-break: break-word; }
|
||||
.note-title { font-size: 24px; font-weight: 800; letter-spacing: -0.5px; color: var(--ink); margin-bottom: 4px; line-height: 1.3; }
|
||||
.note-sep { border: none; border-top: 1px solid var(--border); margin: 16px 0 20px; }
|
||||
h1 { font-size: 22px; font-weight: 700; margin: 24px 0 10px; }
|
||||
h2 { font-size: 19px; font-weight: 700; margin: 20px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
|
||||
h3 { font-size: 16px; font-weight: 600; margin: 16px 0 6px; }
|
||||
p { margin: 0 0 12px; }
|
||||
ul, ol { padding-left: 24px; margin: 0 0 12px; }
|
||||
li { margin-bottom: 4px; }
|
||||
li::marker { color: var(--brand); }
|
||||
blockquote { border-left: 3px solid var(--brand); margin: 16px 0; padding: 10px 14px; background: #f7f2ec; border-radius: 0 10px 10px 0; color: #5a5a52; font-style: italic; }
|
||||
blockquote p { margin: 0; }
|
||||
code { background: var(--code-bg); padding: 2px 7px; border-radius: 6px; font-size: 13px; font-family: 'Menlo', 'Courier New', monospace; color: var(--brand); }
|
||||
pre { background: #1e1e1c; padding: 16px; border-radius: 12px; overflow-x: auto; margin: 16px 0; }
|
||||
pre code { background: none; padding: 0; color: #e8e6e0; font-size: 13px; line-height: 1.6; }
|
||||
a { color: var(--brand); text-decoration: none; border-bottom: 1px solid #d4b896; }
|
||||
img { max-width: 100%; border-radius: 12px; margin: 12px 0; display: block; }
|
||||
hr { border: none; border-top: 1px solid var(--border); margin: 20px 0; }
|
||||
table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; }
|
||||
th { background: var(--code-bg); font-weight: 700; padding: 10px 12px; text-align: left; border-bottom: 2px solid var(--border); }
|
||||
td { padding: 9px 12px; border-bottom: 1px solid var(--border); }
|
||||
tr:last-child td { border-bottom: none; }
|
||||
strong, b { font-weight: 700; }
|
||||
em, i { font-style: italic; }
|
||||
del, s { text-decoration: line-through; color: var(--concrete); }
|
||||
mark { background: #fff3cd; padding: 1px 3px; border-radius: 3px; }
|
||||
input[type=checkbox] { accent-color: var(--brand); margin-right: 6px; width: 16px; height: 16px; }
|
||||
ul[data-type="taskList"] { list-style: none; padding-left: 4px; }
|
||||
ul[data-type="taskList"] li { display: flex; align-items: flex-start; gap: 8px; }
|
||||
ul[data-type="taskList"] li > label { margin-top: 2px; }
|
||||
[data-type="liveBlock"], [data-type="structuredViewBlock"] { border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; margin: 8px 0; background: #f8f6f2; color: var(--concrete); font-size: 13px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="note-title">${safeTitle}</div>
|
||||
<hr class="note-sep">
|
||||
<div id="content">${body}</div>
|
||||
</body>
|
||||
</html>`
|
||||
}
|
||||
|
||||
export default function NoteScreen() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>()
|
||||
const [note, setNote] = useState<Note | null>(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [editMode, setEditMode] = useState(false)
|
||||
const [editTitle, setEditTitle] = useState('')
|
||||
const [editContent, setEditContent] = useState('')
|
||||
const [saving, setSaving] = useState(false)
|
||||
const [aiSheetOpen, setAiSheetOpen] = useState(false)
|
||||
const [flashcardSheetOpen, setFlashcardSheetOpen] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
// Audio en mode édition
|
||||
const { state: audioState, startRecording, stopAndTranscribe, cancelRecording } = useAudioRecorder(
|
||||
(text) => setEditContent((prev) => prev ? prev + ' ' + text : text)
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
if (!id) return
|
||||
apiFetch(ENDPOINTS.note(id as string))
|
||||
.then((r) => { if (!r.ok) throw new Error(`Erreur ${r.status}`); return r.json() })
|
||||
.then((data) => setNote(data.note ?? null))
|
||||
.catch((e) => setError(e.message))
|
||||
.finally(() => setLoading(false))
|
||||
}, [id])
|
||||
|
||||
const handleEdit = () => {
|
||||
if (!note) return
|
||||
setEditTitle(note.title)
|
||||
setEditMode(true)
|
||||
}
|
||||
|
||||
const handleSave = async () => {
|
||||
if (!note || !editTitle.trim()) return
|
||||
setSaving(true)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.note(note.id), {
|
||||
method: 'PUT',
|
||||
body: JSON.stringify({ title: editTitle.trim() }),
|
||||
})
|
||||
if (!res.ok) throw new Error('Erreur de sauvegarde')
|
||||
setNote((prev) => prev ? { ...prev, title: editTitle.trim() } : prev)
|
||||
setEditMode(false)
|
||||
} catch (e: any) {
|
||||
Alert.alert('Erreur', e.message)
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleMic = () => {
|
||||
if (audioState === 'idle' || audioState === 'error') startRecording()
|
||||
else if (audioState === 'recording') stopAndTranscribe()
|
||||
else cancelRecording()
|
||||
}
|
||||
|
||||
const handleShare = async () => {
|
||||
if (!note) return
|
||||
const publicUrl = note.publicSlug ? `https://memento-note.com/p/${note.publicSlug}` : null
|
||||
const plain = note.content?.replace(/<[^>]+>/g, ' ').replace(/\s+/g, ' ').trim().slice(0, 200) || ''
|
||||
const message = publicUrl
|
||||
? `${note.title}\n\n${plain}...\n\nLire: ${publicUrl}`
|
||||
: `${note.title}\n\n${plain}${plain.length === 200 ? '...' : ''}`
|
||||
await Share.share({ title: note.title, message })
|
||||
}
|
||||
|
||||
const handleDelete = () => {
|
||||
if (!note) return
|
||||
Alert.alert(
|
||||
'Supprimer la note',
|
||||
`Mettre "${note.title}" à la corbeille ?`,
|
||||
[
|
||||
{ text: 'Annuler', style: 'cancel' },
|
||||
{
|
||||
text: 'Supprimer', style: 'destructive',
|
||||
onPress: async () => {
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.note(note.id), { method: 'DELETE' })
|
||||
if (!res.ok) throw new Error(`Erreur ${res.status}`)
|
||||
router.back()
|
||||
} catch (e: any) {
|
||||
Alert.alert('Erreur', e.message ?? 'Impossible de supprimer la note')
|
||||
}
|
||||
},
|
||||
},
|
||||
]
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<View style={s.header}>
|
||||
<TouchableOpacity onPress={() => { if (editMode) setEditMode(false); else router.back() }} style={s.backBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
|
||||
<ArrowLeft size={22} color={C.ink} />
|
||||
</TouchableOpacity>
|
||||
<Text style={s.headerTitle} numberOfLines={1}>{editMode ? (editTitle || '…') : (note?.title ?? '…')}</Text>
|
||||
{note && !editMode && (
|
||||
<>
|
||||
<TouchableOpacity onPress={handleEdit} style={s.iconBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
|
||||
<Pencil size={18} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={() => setFlashcardSheetOpen(true)} style={s.iconBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
|
||||
<GraduationCap size={18} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={handleShare} style={s.iconBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
|
||||
<Share2 size={18} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity onPress={handleDelete} style={s.iconBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
|
||||
<Trash2 size={18} color="#e11d48" />
|
||||
</TouchableOpacity>
|
||||
</>
|
||||
)}
|
||||
{editMode && (
|
||||
<TouchableOpacity onPress={handleSave} disabled={saving || !editTitle.trim()} style={[s.saveBtn, (!editTitle.trim() || saving) && { opacity: 0.35 }]}>
|
||||
{saving ? <ActivityIndicator size="small" color={C.white} /> : <Check size={18} color={C.white} />}
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
|
||||
{loading && <View style={s.center}><ActivityIndicator color={C.brand} size="large" /></View>}
|
||||
{error && <View style={s.center}><Text style={{ color: '#e11d48' }}>{error}</Text></View>}
|
||||
{!loading && !error && !note && <View style={s.center}><Text style={{ color: C.concrete }}>Note introuvable.</Text></View>}
|
||||
|
||||
{/* Mode lecture */}
|
||||
{note && !editMode && (
|
||||
<WebView
|
||||
source={{ html: buildHtml(note.content ?? '', note.title ?? '') }}
|
||||
style={{ flex: 1, backgroundColor: C.paper }}
|
||||
javaScriptEnabled scrollEnabled showsVerticalScrollIndicator={false} originWhitelist={['*']}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Mode édition — titre uniquement, contenu preserve HTML */}
|
||||
{note && editMode && (
|
||||
<View style={{ flex: 1 }}>
|
||||
<TextInput value={editTitle} onChangeText={setEditTitle} style={s.editTitle} placeholder="Titre…" placeholderTextColor={C.border} autoFocus />
|
||||
<View style={s.editDivider} />
|
||||
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', paddingHorizontal: 20 }}>
|
||||
<Text style={{ fontSize: 14, color: C.concrete, textAlign: 'center', lineHeight: 22 }}>
|
||||
Le contenu enrichi ne peut pas être édité depuis mobile.{`\n\n`}Utilisez la version web pour modifier le texte.
|
||||
</Text>
|
||||
</View>
|
||||
{/* Barre outils */}
|
||||
<View style={s.toolbar}>
|
||||
<TouchableOpacity onPress={handleSave} disabled={saving} style={[s.aiBtn, { flex: 1, justifyContent: 'center' }]} activeOpacity={0.8}>
|
||||
<Text style={s.aiBtnText}>{saving ? 'Sauvegarde…' : 'Enregistrer le titre'}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
|
||||
<AISheet visible={aiSheetOpen} onClose={() => setAiSheetOpen(false)} text={editContent} onApply={(t) => setEditContent(t)} />
|
||||
{note && (
|
||||
<FlashcardSheet
|
||||
visible={flashcardSheetOpen}
|
||||
onClose={() => setFlashcardSheetOpen(false)}
|
||||
noteId={note.id}
|
||||
noteTitle={note.title}
|
||||
/>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: { flexDirection: 'row', alignItems: 'center', gap: 8, paddingHorizontal: 16, paddingVertical: 12, borderBottomWidth: 1, borderBottomColor: C.border, backgroundColor: C.paper },
|
||||
backBtn: { padding: 4 },
|
||||
headerTitle: { flex: 1, fontSize: 15, fontWeight: '600', color: C.ink },
|
||||
iconBtn: { padding: 4 },
|
||||
saveBtn: { backgroundColor: C.brand, padding: 7, borderRadius: 10 },
|
||||
center: { flex: 1, alignItems: 'center', justifyContent: 'center' },
|
||||
editTitle: { fontSize: 24, fontWeight: '800', color: C.ink, paddingHorizontal: 20, paddingTop: 16, paddingBottom: 8, letterSpacing: -0.5 },
|
||||
editDivider: { height: 1, backgroundColor: C.border, marginHorizontal: 20, marginBottom: 12 },
|
||||
editContent: { flex: 1, fontSize: 16, color: C.ink, lineHeight: 26, paddingHorizontal: 20, paddingBottom: 80 },
|
||||
toolbar: { flexDirection: 'row', alignItems: 'center', gap: 10, paddingHorizontal: 16, paddingVertical: 12, borderTopWidth: 1, borderTopColor: C.border, backgroundColor: C.paper },
|
||||
recordHint: { flex: 1, fontSize: 13, color: '#e11d48', fontWeight: '500' },
|
||||
aiBtn: { flex: 1, flexDirection: 'row', alignItems: 'center', gap: 6, backgroundColor: C.ink, paddingVertical: 11, paddingHorizontal: 14, borderRadius: 12, justifyContent: 'center' },
|
||||
aiBtnText: { color: C.white, fontWeight: '600', fontSize: 14 },
|
||||
})
|
||||
177
memento-mobile/app/note/create.tsx
Normal file
177
memento-mobile/app/note/create.tsx
Normal file
@@ -0,0 +1,177 @@
|
||||
import { useState, useRef } from 'react'
|
||||
import {
|
||||
View, Text, TextInput, TouchableOpacity, ScrollView,
|
||||
KeyboardAvoidingView, Platform, ActivityIndicator,
|
||||
Alert, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useRouter, useLocalSearchParams } from 'expo-router'
|
||||
import { Sparkles, X } from 'lucide-react-native'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
import { AISheet } from '@/components/AISheet'
|
||||
import { TitleSheet } from '@/components/TitleSheet'
|
||||
import { MicButton } from '@/components/MicButton'
|
||||
import { useAudioRecorder } from '@/lib/useAudioRecorder'
|
||||
|
||||
export default function CreateNoteScreen() {
|
||||
const router = useRouter()
|
||||
const { notebookId } = useLocalSearchParams<{ notebookId?: string }>()
|
||||
|
||||
const [title, setTitle] = useState('')
|
||||
const [content, setContent] = useState('')
|
||||
const [saving, setSaving] = useState(false)
|
||||
const [aiSheetOpen, setAiSheetOpen] = useState(false)
|
||||
const [titleSheetOpen, setTitleSheetOpen] = useState(false)
|
||||
const contentRef = useRef<TextInput>(null)
|
||||
|
||||
// Audio
|
||||
const { state: audioState, startRecording, stopAndTranscribe, cancelRecording } = useAudioRecorder(
|
||||
(text) => setContent((prev) => prev ? prev + ' ' + text : text)
|
||||
)
|
||||
|
||||
const handleMic = () => {
|
||||
if (audioState === 'idle' || audioState === 'error') startRecording()
|
||||
else if (audioState === 'recording') stopAndTranscribe()
|
||||
else cancelRecording()
|
||||
}
|
||||
|
||||
const handleSave = async () => {
|
||||
if (!title.trim()) {
|
||||
Alert.alert('Titre requis', 'Donnez un titre à votre note.')
|
||||
return
|
||||
}
|
||||
setSaving(true)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.createNote, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ title: title.trim(), content, notebookId }),
|
||||
})
|
||||
if (!res.ok) {
|
||||
const d = await res.json().catch(() => ({}))
|
||||
throw new Error(d.error ?? 'Erreur serveur')
|
||||
}
|
||||
const { note } = await res.json()
|
||||
router.replace({ pathname: '/note/[id]', params: { id: note.id } })
|
||||
} catch (e: any) {
|
||||
Alert.alert('Erreur', e.message)
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} style={{ flex: 1 }}>
|
||||
|
||||
{/* Header */}
|
||||
<View style={s.header}>
|
||||
<TouchableOpacity onPress={() => router.back()} style={s.cancelBtn}>
|
||||
<X size={20} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
<Text style={s.headerTitle}>Nouvelle note</Text>
|
||||
<TouchableOpacity
|
||||
onPress={handleSave}
|
||||
disabled={saving || !title.trim()}
|
||||
style={[s.saveBtn, (!title.trim() || saving) && s.saveBtnDisabled]}
|
||||
>
|
||||
{saving
|
||||
? <ActivityIndicator size="small" color={C.white} />
|
||||
: <Text style={s.saveBtnText}>Enregistrer</Text>}
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<ScrollView style={{ flex: 1 }} keyboardShouldPersistTaps="handled">
|
||||
{/* Titre */}
|
||||
<View style={s.titleRow}>
|
||||
<TextInput
|
||||
value={title}
|
||||
onChangeText={setTitle}
|
||||
placeholder="Titre de la note…"
|
||||
style={s.titleInput}
|
||||
placeholderTextColor={C.border}
|
||||
returnKeyType="next"
|
||||
onSubmitEditing={() => contentRef.current?.focus()}
|
||||
autoFocus
|
||||
/>
|
||||
{content.trim().length >= 10 && (
|
||||
<TouchableOpacity onPress={() => setTitleSheetOpen(true)} style={s.sparkleBtn} activeOpacity={0.8}>
|
||||
<Sparkles size={16} color={C.brand} />
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
|
||||
<View style={s.divider} />
|
||||
|
||||
{/* Contenu */}
|
||||
<TextInput
|
||||
ref={contentRef}
|
||||
value={content}
|
||||
onChangeText={setContent}
|
||||
placeholder="Commencez à écrire…"
|
||||
style={s.contentInput}
|
||||
placeholderTextColor={C.concrete}
|
||||
multiline
|
||||
textAlignVertical="top"
|
||||
scrollEnabled={false}
|
||||
/>
|
||||
</ScrollView>
|
||||
|
||||
{/* Barre outils bas */}
|
||||
<View style={s.toolbar}>
|
||||
<MicButton state={audioState} onPress={handleMic} />
|
||||
{audioState === 'recording' && (
|
||||
<Text style={s.recordingHint}>● Enregistrement… Appuyez pour arrêter</Text>
|
||||
)}
|
||||
{audioState !== 'recording' && (
|
||||
<TouchableOpacity
|
||||
onPress={() => setAiSheetOpen(true)}
|
||||
disabled={!content.trim()}
|
||||
style={[s.aiBtn, !content.trim() && s.aiBtnDisabled]}
|
||||
activeOpacity={0.8}
|
||||
>
|
||||
<Sparkles size={15} color={C.white} />
|
||||
<Text style={s.aiBtnText}>Améliorer avec l'IA</Text>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
|
||||
</KeyboardAvoidingView>
|
||||
|
||||
{/* Modaux propres */}
|
||||
<AISheet
|
||||
visible={aiSheetOpen}
|
||||
onClose={() => setAiSheetOpen(false)}
|
||||
text={content}
|
||||
onApply={(improved) => setContent(improved)}
|
||||
/>
|
||||
<TitleSheet
|
||||
visible={titleSheetOpen}
|
||||
onClose={() => setTitleSheetOpen(false)}
|
||||
content={content}
|
||||
onSelect={(t) => setTitle(t)}
|
||||
/>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 16, paddingVertical: 12, borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
cancelBtn: { padding: 4, marginRight: 4 },
|
||||
headerTitle: { flex: 1, fontSize: 15, fontWeight: '600', color: C.ink, textAlign: 'center' },
|
||||
saveBtn: { backgroundColor: C.brand, paddingHorizontal: 14, paddingVertical: 7, borderRadius: 10 },
|
||||
saveBtnDisabled: { opacity: 0.35 },
|
||||
saveBtnText: { color: C.white, fontWeight: '700', fontSize: 13 },
|
||||
titleRow: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 20, paddingTop: 20, paddingBottom: 8, gap: 8 },
|
||||
titleInput: { flex: 1, fontSize: 26, fontWeight: '800', color: C.ink, letterSpacing: -0.5, lineHeight: 32 },
|
||||
sparkleBtn: { padding: 8, borderRadius: 10, backgroundColor: '#f3ece4' },
|
||||
divider: { height: 1, backgroundColor: C.border, marginHorizontal: 20, marginBottom: 16 },
|
||||
contentInput: { flex: 1, fontSize: 16, color: C.ink, lineHeight: 26, paddingHorizontal: 20, paddingBottom: 120, minHeight: 300 },
|
||||
toolbar: { flexDirection: 'row', alignItems: 'center', gap: 10, paddingHorizontal: 16, paddingVertical: 12, borderTopWidth: 1, borderTopColor: C.border, backgroundColor: C.paper },
|
||||
recordingHint: { flex: 1, fontSize: 13, color: '#e11d48', fontWeight: '500' },
|
||||
aiBtn: { flex: 1, flexDirection: 'row', alignItems: 'center', gap: 6, backgroundColor: C.ink, paddingVertical: 11, paddingHorizontal: 14, borderRadius: 12, justifyContent: 'center' },
|
||||
aiBtnDisabled: { opacity: 0.35 },
|
||||
aiBtnText: { color: C.white, fontWeight: '600', fontSize: 14 },
|
||||
})
|
||||
89
memento-mobile/app/notebook/[id].tsx
Normal file
89
memento-mobile/app/notebook/[id].tsx
Normal file
@@ -0,0 +1,89 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import {
|
||||
View, Text, FlatList, TouchableOpacity, ActivityIndicator, RefreshControl, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useLocalSearchParams, useRouter } from 'expo-router'
|
||||
import { ArrowLeft, Plus } from 'lucide-react-native'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Note {
|
||||
id: string
|
||||
title: string
|
||||
updatedAt: string
|
||||
}
|
||||
|
||||
export default function NotebookScreen() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>()
|
||||
const [notes, setNotes] = useState<Note[]>([])
|
||||
const [notebookName, setNotebookName] = useState('')
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [refreshing, setRefreshing] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const load = async () => {
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.notes(id))
|
||||
if (res.ok) {
|
||||
const data = await res.json()
|
||||
setNotes(data.notes ?? [])
|
||||
setNotebookName(data.notebookName ?? '')
|
||||
}
|
||||
} finally {
|
||||
setLoading(false)
|
||||
setRefreshing(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => { load() }, [id])
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
<View style={s.header}>
|
||||
<TouchableOpacity onPress={() => router.back()} style={{ padding: 4 }}>
|
||||
<ArrowLeft size={22} color={C.ink} />
|
||||
</TouchableOpacity>
|
||||
<Text style={s.headerTitle}>{notebookName || 'Carnet'}</Text>
|
||||
<TouchableOpacity
|
||||
onPress={() => router.push({ pathname: '/note/create', params: { notebookId: id } })}
|
||||
style={s.addBtn}
|
||||
>
|
||||
<Plus size={20} color={C.brand} />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
{loading
|
||||
? <View style={s.center}><ActivityIndicator color={C.brand} /></View>
|
||||
: <FlatList
|
||||
data={notes}
|
||||
keyExtractor={(item) => item.id}
|
||||
contentContainerStyle={s.list}
|
||||
refreshControl={<RefreshControl refreshing={refreshing} onRefresh={() => { setRefreshing(true); load() }} tintColor={C.brand} />}
|
||||
renderItem={({ item }) => (
|
||||
<TouchableOpacity onPress={() => router.push({ pathname: '/note/[id]', params: { id: item.id } })} style={s.card}>
|
||||
<Text style={s.cardTitle} numberOfLines={1}>{item.title || 'Sans titre'}</Text>
|
||||
<Text style={s.cardDate}>
|
||||
{new Date(item.updatedAt).toLocaleDateString('fr-FR', { day: 'numeric', month: 'short' })}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
ListEmptyComponent={<Text style={s.empty}>Carnet vide.</Text>}
|
||||
/>}
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: { flexDirection: 'row', alignItems: 'center', gap: 12, paddingHorizontal: 16, paddingVertical: 12, borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
headerTitle: { fontSize: 17, fontWeight: '600', color: C.ink, flex: 1 },
|
||||
addBtn: { width: 34, height: 34, borderRadius: 17, backgroundColor: '#f3ece4', alignItems: 'center', justifyContent: 'center' },
|
||||
center: { flex: 1, alignItems: 'center', justifyContent: 'center' },
|
||||
list: { paddingHorizontal: 20, paddingTop: 16, paddingBottom: 32 },
|
||||
card: { backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 16, padding: 16, marginBottom: 10 },
|
||||
cardTitle: { fontSize: 15, fontWeight: '600', color: C.ink },
|
||||
cardDate: { fontSize: 12, color: C.concrete, marginTop: 4 },
|
||||
empty: { textAlign: 'center', color: C.concrete, marginTop: 48 },
|
||||
})
|
||||
237
memento-mobile/app/revision/session.tsx
Normal file
237
memento-mobile/app/revision/session.tsx
Normal file
@@ -0,0 +1,237 @@
|
||||
import { useState, useCallback, useRef } from 'react'
|
||||
import {
|
||||
View, Text, StyleSheet, TouchableOpacity, ActivityIndicator,
|
||||
Animated, ScrollView,
|
||||
} from 'react-native'
|
||||
import { SafeAreaView } from 'react-native-safe-area-context'
|
||||
import { useLocalSearchParams, useRouter } from 'expo-router'
|
||||
import { ArrowLeft, GraduationCap } from 'lucide-react-native'
|
||||
import { C } from '@/lib/theme'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { useFocusEffect } from 'expo-router'
|
||||
|
||||
interface Card {
|
||||
id: string
|
||||
front: string
|
||||
back: string
|
||||
interval: number
|
||||
type?: string
|
||||
}
|
||||
|
||||
type SessionState = 'loading' | 'reviewing' | 'done' | 'error'
|
||||
|
||||
const GRADE_LABELS: { grade: 1 | 2 | 3 | 4; label: string; color: string; bg: string; border: string }[] = [
|
||||
{ grade: 1, label: 'Oublié', color: '#dc2626', bg: 'rgba(239,68,68,0.10)', border: 'rgba(239,68,68,0.30)' },
|
||||
{ grade: 2, label: 'Difficile',color: '#b45309', bg: 'rgba(245,158,11,0.10)', border: 'rgba(245,158,11,0.30)' },
|
||||
{ grade: 3, label: 'Bien', color: '#047857', bg: 'rgba(16,185,129,0.10)', border: 'rgba(16,185,129,0.30)' },
|
||||
{ grade: 4, label: 'Parfait', color: '#A47148', bg: 'rgba(164,113,72,0.10)', border: 'rgba(164,113,72,0.30)' },
|
||||
]
|
||||
|
||||
export default function SessionScreen() {
|
||||
const router = useRouter()
|
||||
const params = useLocalSearchParams<{ deckId: string; deckName: string }>()
|
||||
const { deckId, deckName } = params
|
||||
|
||||
const [state, setState] = useState<SessionState>('loading')
|
||||
const [cards, setCards] = useState<Card[]>([])
|
||||
const [index, setIndex] = useState(0)
|
||||
const [flipped, setFlipped] = useState(false)
|
||||
const [reviewed, setReviewed] = useState(0)
|
||||
const [errorMsg, setErrorMsg] = useState<string | null>(null)
|
||||
|
||||
// Animation flip
|
||||
const flipAnim = useRef(new Animated.Value(0)).current
|
||||
const frontInterp = flipAnim.interpolate({ inputRange: [0, 1], outputRange: ['0deg', '180deg'] })
|
||||
const backInterp = flipAnim.interpolate({ inputRange: [0, 1], outputRange: ['180deg', '360deg'] })
|
||||
|
||||
const loadSession = useCallback(async () => {
|
||||
if (!deckId) return
|
||||
setState('loading')
|
||||
setIndex(0)
|
||||
setFlipped(false)
|
||||
setReviewed(0)
|
||||
flipAnim.setValue(0)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.flashcardSession(deckId))
|
||||
const data = await res.json()
|
||||
if (!res.ok) throw new Error(data.error ?? `Erreur ${res.status}`)
|
||||
setCards(data.cards ?? [])
|
||||
setState(data.cards?.length === 0 ? 'done' : 'reviewing')
|
||||
} catch (e: any) {
|
||||
setErrorMsg(e.message ?? 'Erreur')
|
||||
setState('error')
|
||||
}
|
||||
}, [deckId])
|
||||
|
||||
useFocusEffect(useCallback(() => { loadSession() }, [loadSession]))
|
||||
|
||||
const flip = () => {
|
||||
if (flipped) return
|
||||
setFlipped(true)
|
||||
Animated.spring(flipAnim, { toValue: 1, useNativeDriver: true, friction: 8 }).start()
|
||||
}
|
||||
|
||||
const grade = async (g: 1 | 2 | 3 | 4) => {
|
||||
const card = cards[index]
|
||||
if (!card) return
|
||||
try {
|
||||
await apiFetch(ENDPOINTS.flashcardReview, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ cardId: card.id, grade: g }),
|
||||
})
|
||||
} catch { /* silencieux — on avance quand même */ }
|
||||
|
||||
const next = index + 1
|
||||
setReviewed((r) => r + 1)
|
||||
if (next >= cards.length) {
|
||||
setState('done')
|
||||
} else {
|
||||
setIndex(next)
|
||||
setFlipped(false)
|
||||
Animated.timing(flipAnim, { toValue: 0, duration: 0, useNativeDriver: true }).start()
|
||||
}
|
||||
}
|
||||
|
||||
const current = cards[index]
|
||||
const progress = cards.length > 0 ? index / cards.length : 0
|
||||
|
||||
return (
|
||||
<SafeAreaView style={s.safe}>
|
||||
{/* Header */}
|
||||
<View style={s.header}>
|
||||
<TouchableOpacity onPress={() => router.back()} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
|
||||
<ArrowLeft size={22} color={C.ink} />
|
||||
</TouchableOpacity>
|
||||
<Text style={s.headerTitle} numberOfLines={1}>{deckName ?? 'Révision'}</Text>
|
||||
{state === 'reviewing' && (
|
||||
<Text style={s.counter}>{index + 1}/{cards.length}</Text>
|
||||
)}
|
||||
</View>
|
||||
|
||||
{/* Barre de progression */}
|
||||
{state === 'reviewing' && (
|
||||
<View style={s.progressBarWrap}>
|
||||
<View style={[s.progressBarFill, { width: `${Math.round(progress * 100)}%` }]} />
|
||||
</View>
|
||||
)}
|
||||
|
||||
{/* Contenu */}
|
||||
{state === 'loading' && (
|
||||
<View style={s.center}>
|
||||
<ActivityIndicator color={C.brand} size="large" />
|
||||
</View>
|
||||
)}
|
||||
|
||||
{state === 'error' && (
|
||||
<View style={s.center}>
|
||||
<Text style={s.errorTxt}>{errorMsg}</Text>
|
||||
<TouchableOpacity onPress={loadSession} style={s.retryBtn}>
|
||||
<Text style={s.retryTxt}>Réessayer</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
|
||||
{state === 'done' && (
|
||||
<View style={s.center}>
|
||||
<GraduationCap size={56} color={C.brand} />
|
||||
<Text style={s.doneTitle}>Session terminée !</Text>
|
||||
<Text style={s.doneSub}>
|
||||
{reviewed > 0 ? `${reviewed} carte${reviewed > 1 ? 's' : ''} révisée${reviewed > 1 ? 's' : ''}` : 'Tout est à jour 🎉'}
|
||||
</Text>
|
||||
<TouchableOpacity onPress={() => router.back()} style={s.doneBtn}>
|
||||
<Text style={s.doneBtnTxt}>Retour aux paquets</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
|
||||
{state === 'reviewing' && current && (
|
||||
<View style={s.sessionWrap}>
|
||||
{/* Carte flip */}
|
||||
<TouchableOpacity activeOpacity={0.95} onPress={flip} style={s.cardWrap}>
|
||||
{/* Face avant */}
|
||||
<Animated.View style={[s.card, s.cardFront, { transform: [{ rotateY: frontInterp }] }]}>
|
||||
<ScrollView contentContainerStyle={s.cardContent} showsVerticalScrollIndicator={false}>
|
||||
<Text style={s.cardLabel}>Question</Text>
|
||||
<Text style={s.cardText}>{current.front}</Text>
|
||||
</ScrollView>
|
||||
{!flipped && (
|
||||
<View style={s.tapHint}>
|
||||
<Text style={s.tapTxt}>Appuyez pour révéler la réponse</Text>
|
||||
</View>
|
||||
)}
|
||||
</Animated.View>
|
||||
|
||||
{/* Face arrière */}
|
||||
<Animated.View style={[s.card, s.cardBack, { transform: [{ rotateY: backInterp }] }]}>
|
||||
<ScrollView contentContainerStyle={s.cardContent} showsVerticalScrollIndicator={false}>
|
||||
<Text style={s.cardLabel}>Réponse</Text>
|
||||
<Text style={s.cardText}>{current.back}</Text>
|
||||
</ScrollView>
|
||||
</Animated.View>
|
||||
</TouchableOpacity>
|
||||
|
||||
{/* Boutons de note (visibles seulement après flip) */}
|
||||
{flipped && (
|
||||
<View style={s.gradeRow}>
|
||||
{GRADE_LABELS.map(({ grade: g, label, color, bg, border }) => (
|
||||
<TouchableOpacity
|
||||
key={g}
|
||||
style={[s.gradeBtn, { backgroundColor: bg, borderColor: border }]}
|
||||
onPress={() => grade(g)}
|
||||
activeOpacity={0.8}
|
||||
>
|
||||
<Text style={[s.gradeNum, { color }]}>{g}</Text>
|
||||
<Text style={[s.gradeLbl, { color }]}>{label}</Text>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
safe: { flex: 1, backgroundColor: C.paper },
|
||||
header: {
|
||||
flexDirection: 'row', alignItems: 'center', gap: 12,
|
||||
paddingHorizontal: 20, paddingVertical: 14,
|
||||
borderBottomWidth: 1, borderBottomColor: C.border,
|
||||
},
|
||||
headerTitle: { flex: 1, fontSize: 17, fontWeight: '700', color: C.ink },
|
||||
counter: { fontSize: 13, color: C.concrete, fontWeight: '600' },
|
||||
progressBarWrap: { height: 3, backgroundColor: C.border },
|
||||
progressBarFill: { height: 3, backgroundColor: C.brand },
|
||||
center: { flex: 1, alignItems: 'center', justifyContent: 'center', padding: 24 },
|
||||
sessionWrap: { flex: 1, padding: 20, justifyContent: 'space-between' },
|
||||
cardWrap: { flex: 1, marginBottom: 16 },
|
||||
card: {
|
||||
position: 'absolute', inset: 0,
|
||||
borderRadius: 18, borderWidth: 1, borderColor: C.border,
|
||||
backgroundColor: C.surface,
|
||||
backfaceVisibility: 'hidden',
|
||||
padding: 24,
|
||||
},
|
||||
cardFront: { zIndex: 1 },
|
||||
cardBack: { backgroundColor: '#f0f7ff' },
|
||||
cardContent: { flexGrow: 1, justifyContent: 'center', alignItems: 'center', paddingBottom: 48 },
|
||||
cardLabel: { fontSize: 11, fontWeight: '700', color: C.brand, letterSpacing: 1, textTransform: 'uppercase', marginBottom: 16 },
|
||||
cardText: { fontSize: 20, color: C.ink, textAlign: 'center', lineHeight: 30, fontWeight: '500' },
|
||||
tapHint: { position: 'absolute', bottom: 20, left: 0, right: 0, alignItems: 'center' },
|
||||
tapTxt: { fontSize: 12, color: C.concrete, fontStyle: 'italic' },
|
||||
gradeRow: { flexDirection: 'row', gap: 8 },
|
||||
gradeBtn: {
|
||||
flex: 1, alignItems: 'center', paddingVertical: 12, borderRadius: 14, borderWidth: 1.5,
|
||||
},
|
||||
gradeNum: { fontSize: 18, fontWeight: '800' },
|
||||
gradeLbl: { fontSize: 10, fontWeight: '600', marginTop: 2 },
|
||||
doneTitle: { fontSize: 24, fontWeight: '800', color: C.ink, marginTop: 20, marginBottom: 8 },
|
||||
doneSub: { fontSize: 15, color: C.concrete, marginBottom: 32 },
|
||||
doneBtn: { backgroundColor: C.brand, paddingHorizontal: 28, paddingVertical: 14, borderRadius: 14 },
|
||||
doneBtnTxt: { color: '#fff', fontWeight: '700', fontSize: 16 },
|
||||
errorTxt: { fontSize: 15, color: '#e11d48', textAlign: 'center', marginBottom: 12 },
|
||||
retryBtn: { backgroundColor: C.brand, paddingHorizontal: 20, paddingVertical: 10, borderRadius: 10 },
|
||||
retryTxt: { color: '#fff', fontWeight: '600' },
|
||||
})
|
||||
BIN
memento-mobile/assets/adaptive-icon.png
Normal file
BIN
memento-mobile/assets/adaptive-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
memento-mobile/assets/icon.png
Normal file
BIN
memento-mobile/assets/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
memento-mobile/assets/splash.png
Normal file
BIN
memento-mobile/assets/splash.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
6
memento-mobile/babel.config.js
Normal file
6
memento-mobile/babel.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
module.exports = function (api) {
|
||||
api.cache(true);
|
||||
return {
|
||||
presets: ['babel-preset-expo'],
|
||||
};
|
||||
};
|
||||
142
memento-mobile/components/AISheet.tsx
Normal file
142
memento-mobile/components/AISheet.tsx
Normal file
@@ -0,0 +1,142 @@
|
||||
/**
|
||||
* AISheet — bottom sheet IA avec modes d'amélioration + résultat
|
||||
* Remplace les Alert.alert natifs par une UI propre au design Memento
|
||||
*/
|
||||
import { useState } from 'react'
|
||||
import {
|
||||
View, Text, TouchableOpacity, ActivityIndicator,
|
||||
ScrollView, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { Sparkles, Scissors, MessageSquare, Pencil, CheckCircle2, RefreshCw } from 'lucide-react-native'
|
||||
import { BottomSheet } from '@/components/BottomSheet'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
const MODES = [
|
||||
{ key: 'improve', label: 'Améliorer le style', icon: Sparkles, color: C.brand },
|
||||
{ key: 'fix_grammar', label: 'Corriger la grammaire', icon: CheckCircle2, color: '#5b7ec7' },
|
||||
{ key: 'shorten', label: 'Raccourcir', icon: Scissors, color: '#4a9b61' },
|
||||
{ key: 'clarify', label: 'Clarifier les idées', icon: MessageSquare,color: '#c77a3a' },
|
||||
]
|
||||
|
||||
interface Props {
|
||||
visible: boolean
|
||||
onClose: () => void
|
||||
text: string
|
||||
onApply: (improved: string) => void
|
||||
}
|
||||
|
||||
export function AISheet({ visible, onClose, text, onApply }: Props) {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [result, setResult] = useState<string | null>(null)
|
||||
const [selectedMode, setSelectedMode] = useState<string | null>(null)
|
||||
|
||||
const handleClose = () => {
|
||||
setResult(null)
|
||||
setSelectedMode(null)
|
||||
onClose()
|
||||
}
|
||||
|
||||
const handleMode = async (mode: string) => {
|
||||
setSelectedMode(mode)
|
||||
setLoading(true)
|
||||
setResult(null)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.aiImprove, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ text, mode }),
|
||||
})
|
||||
const d = await res.json().catch(() => ({}))
|
||||
if (!res.ok) {
|
||||
setResult(`⚠️ ${d.error === 'quota_exceeded' ? 'Quota IA dépassé' : (d.error ?? 'Erreur serveur')}`)
|
||||
return
|
||||
}
|
||||
setResult(d.improved ?? '')
|
||||
} catch {
|
||||
setResult('⚠️ Erreur réseau — vérifiez votre connexion.')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleApply = () => {
|
||||
if (result && !result.startsWith('⚠️')) {
|
||||
onApply(result)
|
||||
}
|
||||
handleClose()
|
||||
}
|
||||
|
||||
const handleRetry = () => {
|
||||
if (selectedMode) handleMode(selectedMode)
|
||||
}
|
||||
|
||||
const title = result ? 'Résultat IA' : 'Améliorer avec l\'IA'
|
||||
|
||||
return (
|
||||
<BottomSheet visible={visible} onClose={handleClose} title={title}>
|
||||
{!result && !loading && (
|
||||
<View style={s.modeList}>
|
||||
{MODES.map((m) => {
|
||||
const Icon = m.icon
|
||||
return (
|
||||
<TouchableOpacity key={m.key} onPress={() => handleMode(m.key)} style={s.modeRow} activeOpacity={0.7}>
|
||||
<View style={[s.modeIcon, { backgroundColor: m.color + '18' }]}>
|
||||
<Icon size={18} color={m.color} />
|
||||
</View>
|
||||
<Text style={s.modeLabel}>{m.label}</Text>
|
||||
</TouchableOpacity>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
)}
|
||||
|
||||
{loading && (
|
||||
<View style={s.loadingBox}>
|
||||
<ActivityIndicator color={C.brand} size="large" />
|
||||
<Text style={s.loadingText}>Génération en cours…</Text>
|
||||
</View>
|
||||
)}
|
||||
|
||||
{result && !loading && (
|
||||
<View style={s.resultBox}>
|
||||
<ScrollView style={s.resultScroll} showsVerticalScrollIndicator={false}>
|
||||
<Text style={[s.resultText, result.startsWith('⚠️') && { color: '#e11d48' }]}>
|
||||
{result}
|
||||
</Text>
|
||||
</ScrollView>
|
||||
{!result.startsWith('⚠️') && (
|
||||
<TouchableOpacity onPress={handleApply} style={s.applyBtn} activeOpacity={0.8}>
|
||||
<Pencil size={15} color={C.white} />
|
||||
<Text style={s.applyBtnText}>Remplacer le texte</Text>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
<TouchableOpacity onPress={handleRetry} style={s.retryBtn} activeOpacity={0.8}>
|
||||
<RefreshCw size={14} color={C.concrete} />
|
||||
<Text style={s.retryText}>Réessayer</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
</BottomSheet>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
modeList: { paddingHorizontal: 12, paddingTop: 8, paddingBottom: 8 },
|
||||
modeRow: {
|
||||
flexDirection: 'row', alignItems: 'center', gap: 14,
|
||||
paddingHorizontal: 12, paddingVertical: 14,
|
||||
borderRadius: 14, marginBottom: 4,
|
||||
},
|
||||
modeIcon: { width: 40, height: 40, borderRadius: 12, alignItems: 'center', justifyContent: 'center' },
|
||||
modeLabel: { fontSize: 15, fontWeight: '500', color: C.ink },
|
||||
loadingBox: { alignItems: 'center', paddingVertical: 36, gap: 12 },
|
||||
loadingText: { fontSize: 14, color: C.concrete },
|
||||
resultBox: { paddingHorizontal: 20, paddingTop: 8 },
|
||||
resultScroll: { maxHeight: 200, backgroundColor: C.white, borderWidth: 1, borderColor: C.border, borderRadius: 14, padding: 14, marginBottom: 14 },
|
||||
resultText: { fontSize: 15, color: C.ink, lineHeight: 23 },
|
||||
applyBtn: { flexDirection: 'row', alignItems: 'center', gap: 8, backgroundColor: C.ink, paddingVertical: 13, borderRadius: 14, justifyContent: 'center', marginBottom: 8 },
|
||||
applyBtnText: { color: C.white, fontWeight: '700', fontSize: 14 },
|
||||
retryBtn: { flexDirection: 'row', alignItems: 'center', gap: 6, justifyContent: 'center', paddingVertical: 10 },
|
||||
retryText: { fontSize: 13, color: C.concrete },
|
||||
})
|
||||
80
memento-mobile/components/BottomSheet.tsx
Normal file
80
memento-mobile/components/BottomSheet.tsx
Normal file
@@ -0,0 +1,80 @@
|
||||
/**
|
||||
* BottomSheet — modal bas d'écran respectant le design Memento
|
||||
* Usage:
|
||||
* <BottomSheet visible={v} onClose={() => setV(false)} title="Titre">
|
||||
* ...children
|
||||
* </BottomSheet>
|
||||
*/
|
||||
import { useEffect, useRef } from 'react'
|
||||
import {
|
||||
View, Text, Modal, TouchableOpacity, Animated,
|
||||
Pressable, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { X } from 'lucide-react-native'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Props {
|
||||
visible: boolean
|
||||
onClose: () => void
|
||||
title?: string
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
export function BottomSheet({ visible, onClose, title, children }: Props) {
|
||||
const translateY = useRef(new Animated.Value(400)).current
|
||||
const opacity = useRef(new Animated.Value(0)).current
|
||||
|
||||
useEffect(() => {
|
||||
if (visible) {
|
||||
Animated.parallel([
|
||||
Animated.spring(translateY, { toValue: 0, useNativeDriver: true, damping: 20, stiffness: 200 }),
|
||||
Animated.timing(opacity, { toValue: 1, duration: 200, useNativeDriver: true }),
|
||||
]).start()
|
||||
} else {
|
||||
Animated.parallel([
|
||||
Animated.timing(translateY, { toValue: 400, duration: 220, useNativeDriver: true }),
|
||||
Animated.timing(opacity, { toValue: 0, duration: 200, useNativeDriver: true }),
|
||||
]).start()
|
||||
}
|
||||
}, [visible])
|
||||
|
||||
return (
|
||||
<Modal visible={visible} transparent animationType="none" onRequestClose={onClose}>
|
||||
<Animated.View style={[s.overlay, { opacity }]}>
|
||||
<Pressable style={StyleSheet.absoluteFill} onPress={onClose} />
|
||||
<Animated.View style={[s.sheet, { transform: [{ translateY }] }]}>
|
||||
{/* Handle bar */}
|
||||
<View style={s.handle} />
|
||||
{title && (
|
||||
<View style={s.titleRow}>
|
||||
<Text style={s.title}>{title}</Text>
|
||||
<TouchableOpacity onPress={onClose} style={s.closeBtn} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
|
||||
<X size={18} color={C.concrete} />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
{children}
|
||||
</Animated.View>
|
||||
</Animated.View>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
overlay: { flex: 1, backgroundColor: 'rgba(26,26,24,0.5)', justifyContent: 'flex-end' },
|
||||
sheet: {
|
||||
backgroundColor: C.paper,
|
||||
borderTopLeftRadius: 24,
|
||||
borderTopRightRadius: 24,
|
||||
paddingBottom: 32,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: -4 },
|
||||
shadowOpacity: 0.12,
|
||||
shadowRadius: 16,
|
||||
elevation: 16,
|
||||
},
|
||||
handle: { width: 36, height: 4, backgroundColor: C.border, borderRadius: 2, alignSelf: 'center', marginTop: 12, marginBottom: 4 },
|
||||
titleRow: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 20, paddingVertical: 14, borderBottomWidth: 1, borderBottomColor: C.border },
|
||||
title: { flex: 1, fontSize: 15, fontWeight: '700', color: C.ink },
|
||||
closeBtn: { padding: 2 },
|
||||
})
|
||||
173
memento-mobile/components/FlashcardSheet.tsx
Normal file
173
memento-mobile/components/FlashcardSheet.tsx
Normal file
@@ -0,0 +1,173 @@
|
||||
/**
|
||||
* FlashcardSheet — génère et sauvegarde des flashcards depuis une note
|
||||
*/
|
||||
import { useState } from 'react'
|
||||
import { View, Text, StyleSheet, TouchableOpacity, ActivityIndicator, ScrollView } from 'react-native'
|
||||
import { GraduationCap, Check, RefreshCw } from 'lucide-react-native'
|
||||
import { BottomSheet } from './BottomSheet'
|
||||
import { C } from '@/lib/theme'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { useRouter } from 'expo-router'
|
||||
|
||||
const STYLES = [
|
||||
{ key: 'qa', label: 'Q&A', desc: 'Questions / Réponses' },
|
||||
{ key: 'concept', label: 'Concept', desc: 'Terme / Définition' },
|
||||
{ key: 'cloze', label: 'Cloze', desc: 'Texte à trous' },
|
||||
] as const
|
||||
|
||||
const COUNTS = [5, 10, 15, 20]
|
||||
|
||||
interface Props {
|
||||
visible: boolean
|
||||
onClose: () => void
|
||||
noteId: string
|
||||
noteTitle: string
|
||||
}
|
||||
|
||||
export function FlashcardSheet({ visible, onClose, noteId, noteTitle }: Props) {
|
||||
const router = useRouter()
|
||||
const [style, setStyle] = useState<'qa' | 'concept' | 'cloze'>('qa')
|
||||
const [count, setCount] = useState(10)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [result, setResult] = useState<{ deckId: string; count: number } | null>(null)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
const generate = async () => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
setResult(null)
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.flashcardGenerate, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ noteId, style, count }),
|
||||
})
|
||||
const data = await res.json()
|
||||
if (!res.ok) throw new Error(data.error ?? `Erreur ${res.status}`)
|
||||
setResult({ deckId: data.deckId, count: data.count })
|
||||
} catch (e: any) {
|
||||
setError(e.message ?? 'Erreur de génération')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const goRevise = () => {
|
||||
onClose()
|
||||
router.push({ pathname: '/(tabs)/revision' })
|
||||
}
|
||||
|
||||
const reset = () => { setResult(null); setError(null) }
|
||||
|
||||
return (
|
||||
<BottomSheet visible={visible} onClose={onClose}>
|
||||
<View style={s.header}>
|
||||
<GraduationCap size={20} color={C.brand} />
|
||||
<Text style={s.title}>Générer des flashcards</Text>
|
||||
</View>
|
||||
<Text style={s.noteTitle} numberOfLines={1}>📝 {noteTitle}</Text>
|
||||
|
||||
{!result && !loading && (
|
||||
<ScrollView showsVerticalScrollIndicator={false}>
|
||||
{/* Style */}
|
||||
<Text style={s.sectionLabel}>Type de cartes</Text>
|
||||
<View style={s.pills}>
|
||||
{STYLES.map((st) => (
|
||||
<TouchableOpacity
|
||||
key={st.key}
|
||||
style={[s.pill, style === st.key && s.pillActive]}
|
||||
onPress={() => setStyle(st.key)}
|
||||
activeOpacity={0.8}
|
||||
>
|
||||
<Text style={[s.pillLabel, style === st.key && s.pillLabelActive]}>{st.label}</Text>
|
||||
<Text style={[s.pillDesc, style === st.key && s.pillDescActive]}>{st.desc}</Text>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
|
||||
{/* Nombre */}
|
||||
<Text style={s.sectionLabel}>Nombre de cartes</Text>
|
||||
<View style={s.countRow}>
|
||||
{COUNTS.map((n) => (
|
||||
<TouchableOpacity
|
||||
key={n}
|
||||
style={[s.countBtn, count === n && s.countBtnActive]}
|
||||
onPress={() => setCount(n)}
|
||||
activeOpacity={0.8}
|
||||
>
|
||||
<Text style={[s.countTxt, count === n && s.countTxtActive]}>{n}</Text>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
|
||||
{error && <Text style={s.error}>{error}</Text>}
|
||||
|
||||
<TouchableOpacity style={s.generateBtn} onPress={generate} activeOpacity={0.85}>
|
||||
<GraduationCap size={16} color="#fff" />
|
||||
<Text style={s.generateTxt}>Générer {count} cartes</Text>
|
||||
</TouchableOpacity>
|
||||
</ScrollView>
|
||||
)}
|
||||
|
||||
{loading && (
|
||||
<View style={s.center}>
|
||||
<ActivityIndicator color={C.brand} size="large" />
|
||||
<Text style={s.loadingTxt}>Génération en cours…</Text>
|
||||
</View>
|
||||
)}
|
||||
|
||||
{result && (
|
||||
<View style={s.resultWrap}>
|
||||
<View style={s.checkCircle}>
|
||||
<Check size={28} color="#16a34a" />
|
||||
</View>
|
||||
<Text style={s.resultTitle}>{result.count} cartes créées !</Text>
|
||||
<Text style={s.resultSub}>Votre paquet est prêt pour la révision.</Text>
|
||||
<View style={s.resultActions}>
|
||||
<TouchableOpacity style={s.reviseBtn} onPress={goRevise} activeOpacity={0.85}>
|
||||
<GraduationCap size={16} color="#fff" />
|
||||
<Text style={s.reviseTxt}>Réviser maintenant</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity style={s.retryBtn} onPress={reset} activeOpacity={0.8}>
|
||||
<RefreshCw size={14} color={C.concrete} />
|
||||
<Text style={s.retryTxt}>Regénérer</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
</BottomSheet>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
header: { flexDirection: 'row', alignItems: 'center', gap: 8, marginBottom: 4 },
|
||||
title: { fontSize: 17, fontWeight: '700', color: C.ink },
|
||||
noteTitle: { fontSize: 13, color: C.concrete, marginBottom: 20 },
|
||||
sectionLabel: { fontSize: 11, fontWeight: '700', color: C.concrete, letterSpacing: 0.8, textTransform: 'uppercase', marginBottom: 10 },
|
||||
pills: { flexDirection: 'row', gap: 8, marginBottom: 20 },
|
||||
pill: { flex: 1, padding: 12, borderRadius: 12, borderWidth: 1.5, borderColor: C.border, backgroundColor: C.paper },
|
||||
pillActive: { borderColor: C.brand, backgroundColor: 'rgba(164,113,72,0.08)' },
|
||||
pillLabel: { fontSize: 13, fontWeight: '700', color: C.ink, marginBottom: 2 },
|
||||
pillLabelActive: { color: C.brand },
|
||||
pillDesc: { fontSize: 10, color: C.concrete },
|
||||
pillDescActive: { color: C.brand },
|
||||
countRow: { flexDirection: 'row', gap: 8, marginBottom: 24 },
|
||||
countBtn: { flex: 1, paddingVertical: 12, borderRadius: 12, borderWidth: 1.5, borderColor: C.border, alignItems: 'center', backgroundColor: C.paper },
|
||||
countBtnActive: { borderColor: C.brand, backgroundColor: 'rgba(164,113,72,0.08)' },
|
||||
countTxt: { fontSize: 15, fontWeight: '700', color: C.ink },
|
||||
countTxtActive: { color: C.brand },
|
||||
error: { color: '#e11d48', fontSize: 13, marginBottom: 12, textAlign: 'center' },
|
||||
generateBtn: { backgroundColor: C.brand, borderRadius: 14, paddingVertical: 14, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', gap: 8 },
|
||||
generateTxt: { color: '#fff', fontWeight: '700', fontSize: 15 },
|
||||
center: { alignItems: 'center', justifyContent: 'center', paddingVertical: 40 },
|
||||
loadingTxt: { marginTop: 16, color: C.concrete, fontSize: 14 },
|
||||
resultWrap: { alignItems: 'center', paddingVertical: 20 },
|
||||
checkCircle: { width: 64, height: 64, borderRadius: 32, backgroundColor: '#dcfce7', alignItems: 'center', justifyContent: 'center', marginBottom: 16 },
|
||||
resultTitle: { fontSize: 20, fontWeight: '800', color: C.ink, marginBottom: 8 },
|
||||
resultSub: { fontSize: 14, color: C.concrete, marginBottom: 28 },
|
||||
resultActions: { width: '100%', gap: 10 },
|
||||
reviseBtn: { backgroundColor: C.brand, borderRadius: 14, paddingVertical: 14, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', gap: 8 },
|
||||
reviseTxt: { color: '#fff', fontWeight: '700', fontSize: 15 },
|
||||
retryBtn: { borderRadius: 14, paddingVertical: 12, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', gap: 6, borderWidth: 1, borderColor: C.border },
|
||||
retryTxt: { color: C.concrete, fontWeight: '600', fontSize: 13 },
|
||||
})
|
||||
66
memento-mobile/components/MicButton.tsx
Normal file
66
memento-mobile/components/MicButton.tsx
Normal file
@@ -0,0 +1,66 @@
|
||||
/**
|
||||
* MicButton — bouton enregistrement vocal avec feedback visuel
|
||||
* États : idle → recording (pulsé rouge) → processing (spinner)
|
||||
*/
|
||||
import { useEffect, useRef } from 'react'
|
||||
import { TouchableOpacity, ActivityIndicator, Animated, StyleSheet, View, Text } from 'react-native'
|
||||
import { Mic, MicOff, Square } from 'lucide-react-native'
|
||||
import { AudioState } from '@/lib/useAudioRecorder'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Props {
|
||||
state: AudioState
|
||||
onPress: () => void
|
||||
errorMsg?: string | null
|
||||
size?: number
|
||||
}
|
||||
|
||||
export function MicButton({ state, onPress, errorMsg, size = 20 }: Props) {
|
||||
const pulse = useRef(new Animated.Value(1)).current
|
||||
|
||||
useEffect(() => {
|
||||
if (state === 'recording') {
|
||||
Animated.loop(
|
||||
Animated.sequence([
|
||||
Animated.timing(pulse, { toValue: 1.25, duration: 600, useNativeDriver: true }),
|
||||
Animated.timing(pulse, { toValue: 1, duration: 600, useNativeDriver: true }),
|
||||
])
|
||||
).start()
|
||||
} else {
|
||||
pulse.stopAnimation()
|
||||
pulse.setValue(1)
|
||||
}
|
||||
}, [state])
|
||||
|
||||
const bgColor =
|
||||
state === 'recording' ? '#fee2e2' :
|
||||
state === 'processing' ? '#f3ece4' :
|
||||
state === 'error' ? '#fee2e2' :
|
||||
'#f3ece4'
|
||||
|
||||
const borderColor =
|
||||
state === 'recording' ? '#fca5a5' :
|
||||
state === 'error' ? '#fca5a5' :
|
||||
C.border
|
||||
|
||||
return (
|
||||
<Animated.View style={[s.wrap, { backgroundColor: bgColor, borderColor }, { transform: [{ scale: state === 'recording' ? pulse : 1 }] }]}>
|
||||
<TouchableOpacity onPress={onPress} disabled={state === 'processing'} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
|
||||
{state === 'processing'
|
||||
? <ActivityIndicator size="small" color={C.brand} />
|
||||
: state === 'recording'
|
||||
? <Square size={size - 2} color="#e11d48" />
|
||||
: state === 'error'
|
||||
? <MicOff size={size} color="#e11d48" />
|
||||
: <Mic size={size} color={C.brand} />}
|
||||
</TouchableOpacity>
|
||||
</Animated.View>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
wrap: {
|
||||
width: 40, height: 40, borderRadius: 12,
|
||||
borderWidth: 1, alignItems: 'center', justifyContent: 'center',
|
||||
},
|
||||
})
|
||||
115
memento-mobile/components/TitleSheet.tsx
Normal file
115
memento-mobile/components/TitleSheet.tsx
Normal file
@@ -0,0 +1,115 @@
|
||||
/**
|
||||
* TitleSheet — suggère 3 titres IA dans un bottom sheet propre
|
||||
*/
|
||||
import { useState, useEffect } from 'react'
|
||||
import {
|
||||
View, Text, TouchableOpacity, ActivityIndicator, StyleSheet,
|
||||
} from 'react-native'
|
||||
import { Sparkles } from 'lucide-react-native'
|
||||
import { BottomSheet } from '@/components/BottomSheet'
|
||||
import { apiFetch } from '@/lib/api'
|
||||
import { ENDPOINTS } from '@/lib/config'
|
||||
import { C } from '@/lib/theme'
|
||||
|
||||
interface Props {
|
||||
visible: boolean
|
||||
onClose: () => void
|
||||
content: string
|
||||
onSelect: (title: string) => void
|
||||
}
|
||||
|
||||
export function TitleSheet({ visible, onClose, content, onSelect }: Props) {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [suggestions, setSuggestions] = useState<string[]>([])
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
if (visible && content.trim()) {
|
||||
fetchTitles()
|
||||
}
|
||||
}, [visible, content])
|
||||
|
||||
const fetchTitles = async () => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
setSuggestions([])
|
||||
try {
|
||||
const res = await apiFetch(ENDPOINTS.aiTitle, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ content }),
|
||||
})
|
||||
const d = await res.json().catch(() => ({}))
|
||||
if (!res.ok) {
|
||||
setError(d.error === 'quota_exceeded' ? 'Quota dépassé' : 'Erreur serveur')
|
||||
return
|
||||
}
|
||||
const raw: unknown[] = d.suggestions ?? []
|
||||
setSuggestions(raw.map((s) => (typeof s === 'string' ? s : (s as any).title ?? '')).filter(Boolean))
|
||||
} catch {
|
||||
setError('Erreur réseau')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleSelect = (t: string) => {
|
||||
onSelect(t)
|
||||
onClose()
|
||||
}
|
||||
|
||||
return (
|
||||
<BottomSheet visible={visible} onClose={onClose} title="Titres suggérés">
|
||||
{loading && (
|
||||
<View style={s.center}>
|
||||
<ActivityIndicator color={C.brand} size="large" />
|
||||
<Text style={s.hint}>Génération des titres…</Text>
|
||||
</View>
|
||||
)}
|
||||
{error && !loading && (
|
||||
<View style={s.center}>
|
||||
<Text style={s.errorText}>{error}</Text>
|
||||
<TouchableOpacity onPress={fetchTitles} style={s.retryBtn}>
|
||||
<Text style={s.retryText}>Réessayer</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
{!loading && !error && suggestions.length > 0 && (
|
||||
<View style={s.list}>
|
||||
{suggestions.map((t, i) => (
|
||||
<TouchableOpacity key={i} onPress={() => handleSelect(t)} style={s.row} activeOpacity={0.7}>
|
||||
<View style={s.numBadge}>
|
||||
<Text style={s.numText}>{i + 1}</Text>
|
||||
</View>
|
||||
<Text style={s.titleText}>{t}</Text>
|
||||
<Sparkles size={14} color={C.brand} />
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
)}
|
||||
{!loading && !error && suggestions.length === 0 && (
|
||||
<View style={s.center}>
|
||||
<Text style={s.hint}>Aucune suggestion disponible</Text>
|
||||
</View>
|
||||
)}
|
||||
</BottomSheet>
|
||||
)
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
center: { alignItems: 'center', paddingVertical: 32, gap: 12 },
|
||||
hint: { fontSize: 14, color: C.concrete },
|
||||
errorText: { fontSize: 14, color: '#e11d48' },
|
||||
retryBtn: { paddingHorizontal: 20, paddingVertical: 10, borderRadius: 10, backgroundColor: C.border },
|
||||
retryText: { fontSize: 13, color: C.ink, fontWeight: '600' },
|
||||
list: { paddingHorizontal: 12, paddingTop: 8, paddingBottom: 8 },
|
||||
row: {
|
||||
flexDirection: 'row', alignItems: 'center', gap: 12,
|
||||
paddingHorizontal: 12, paddingVertical: 14,
|
||||
borderRadius: 14, marginBottom: 8,
|
||||
backgroundColor: C.white, borderWidth: 1, borderColor: C.border,
|
||||
marginHorizontal: 8,
|
||||
},
|
||||
numBadge: { width: 26, height: 26, borderRadius: 13, backgroundColor: '#f3ece4', alignItems: 'center', justifyContent: 'center' },
|
||||
numText: { fontSize: 12, fontWeight: '700', color: C.brand },
|
||||
titleText: { flex: 1, fontSize: 14, fontWeight: '500', color: C.ink },
|
||||
})
|
||||
1
memento-mobile/index.ts
Normal file
1
memento-mobile/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
import 'expo-router/entry';
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user