@jskit-ai/agent-docs 0.1.20 → 0.1.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/guide/agent/app-setup/authentication.md +8 -0
- package/guide/agent/app-setup/initial-scaffolding.md +52 -4
- package/guide/agent/app-setup/quickstart.md +216 -0
- package/guide/agent/app-setup/working-with-the-jskit-cli.md +16 -0
- package/guide/agent/index.md +4 -2
- package/package.json +1 -1
- package/patterns/INDEX.md +6 -0
- package/patterns/crud-scaffolding.md +30 -0
- package/patterns/page-scaffolding.md +30 -0
- package/patterns/ui-testing.md +8 -0
- package/reference/autogen/packages/auth-provider-supabase-core.md +6 -0
- package/reference/autogen/tooling/jskit-cli.md +2 -1
- package/templates/APP_BLUEPRINT.md +1 -0
- package/templates/app/AGENTS.md +9 -3
- package/workflow/bootstrap.md +2 -0
- package/workflow/feature-delivery.md +16 -5
- package/workflow/review.md +4 -0
- package/workflow/scoping.md +5 -0
|
@@ -1030,6 +1030,14 @@ npx jskit app verify-ui \
|
|
|
1030
1030
|
--auth-mode dev-auth-login-as
|
|
1031
1031
|
```
|
|
1032
1032
|
|
|
1033
|
+
For local pre-merge review, the next step after recording that Playwright run is usually:
|
|
1034
|
+
|
|
1035
|
+
```bash
|
|
1036
|
+
npx jskit doctor --against origin/main
|
|
1037
|
+
```
|
|
1038
|
+
|
|
1039
|
+
Advanced CI pipelines can use the same `--against` contract too, but JSKIT does not scaffold hosted auth/database/browser verification by default.
|
|
1040
|
+
|
|
1033
1041
|
That flow is preferable to driving the real sign-in form in feature tests because it keeps the test focused on the UI feature being added, not on an external auth dependency. If a chunk changes user-facing UI and the flow requires login, the expected JSKIT review standard is:
|
|
1034
1042
|
|
|
1035
1043
|
- use Playwright
|
|
@@ -14,17 +14,63 @@ npm install
|
|
|
14
14
|
|
|
15
15
|
The first command creates a new folder called `exampleapp` and fills it with JSKIT's base shell template. The `exampleapp` name is used in a few template replacements, such as the package name and the browser title. The `--tenancy-mode none` flag tells JSKIT to start with the smallest routing model. In this mode, the app is not workspace-aware (more of this later in the guide, when multihoming is introduced). That keeps the first scaffold easier to read because there is no workspace slug handling yet.
|
|
16
16
|
|
|
17
|
-
If you are working with an AI agent and want the agent to
|
|
17
|
+
If you are working with an AI agent and want the agent to drive the initial JSKIT setup conversation, there is now a dedicated seed path:
|
|
18
18
|
|
|
19
19
|
```bash
|
|
20
|
-
npx @jskit-ai/create-app exampleapp
|
|
20
|
+
npx @jskit-ai/create-app exampleapp --template ai-seed
|
|
21
21
|
cd exampleapp
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
That seed writes only `AGENTS.md`. It is not a runnable app yet. The agent should use that file to ask the Stage 1 platform questions first, make sure the chosen MySQL or Postgres database already exists or can be created with the developer's local admin access, and then promote the same directory into the real scaffold with:
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
npx @jskit-ai/create-app exampleapp --target . --force --tenancy-mode <mode>
|
|
22
28
|
npm install
|
|
23
29
|
```
|
|
24
30
|
|
|
25
|
-
|
|
31
|
+
After that promotion, the overwritten app `AGENTS.md` becomes the source of truth for the normal JSKIT workflow.
|
|
32
|
+
|
|
33
|
+
After creating the real app scaffolding (the base shell, not the seed wrapper), you will need to run `npm install` to install dependencies.
|
|
34
|
+
|
|
35
|
+
If you already know you want a small non-workspace baseline right after the scaffold, this is the shortest reproducible path:
|
|
26
36
|
|
|
27
|
-
|
|
37
|
+
```bash
|
|
38
|
+
SUPABASE_URL=...
|
|
39
|
+
SUPABASE_KEY=...
|
|
40
|
+
DB_HOST=127.0.0.1
|
|
41
|
+
DB_PORT=3306
|
|
42
|
+
DB_NAME=exampleapp
|
|
43
|
+
DB_USER=...
|
|
44
|
+
DB_PASSWORD=...
|
|
45
|
+
|
|
46
|
+
npx @jskit-ai/create-app exampleapp --tenancy-mode none
|
|
47
|
+
cd exampleapp
|
|
48
|
+
npm install
|
|
49
|
+
|
|
50
|
+
npx jskit add package shell-web
|
|
51
|
+
|
|
52
|
+
npx jskit add package auth-provider-supabase-core \
|
|
53
|
+
--auth-supabase-url "$SUPABASE_URL" \
|
|
54
|
+
--auth-supabase-publishable-key "$SUPABASE_KEY" \
|
|
55
|
+
--app-public-url "http://localhost:5173"
|
|
56
|
+
|
|
57
|
+
npx jskit add bundle auth-base
|
|
58
|
+
|
|
59
|
+
npx jskit add package database-runtime-mysql \
|
|
60
|
+
--db-host "$DB_HOST" \
|
|
61
|
+
--db-port "$DB_PORT" \
|
|
62
|
+
--db-name "$DB_NAME" \
|
|
63
|
+
--db-user "$DB_USER" \
|
|
64
|
+
--db-password "$DB_PASSWORD"
|
|
65
|
+
|
|
66
|
+
npx jskit add package users-web
|
|
67
|
+
npx jskit add package console-web
|
|
68
|
+
|
|
69
|
+
npm install
|
|
70
|
+
npm run db:migrate
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
If you want the larger workspace-enabled stack with the first assistant already configured, use [Quickstart](/guide/app-setup/quickstart) instead.
|
|
28
74
|
|
|
29
75
|
**Try Bash Completion!**
|
|
30
76
|
|
|
@@ -151,6 +197,8 @@ That matters because JSKIT maintenance policy changes over time. If the scaffold
|
|
|
151
197
|
|
|
152
198
|
`jskit app verify` is worth noticing specifically. Linting, tests, and builds check your source code and runtime behavior. The JSKIT part of that flow runs `doctor`, which checks JSKIT-managed app state: installed package visibility, lock-file-backed managed files, and other JSKIT-specific health rules. It is there because a JSKIT app is not only code. It is also a descriptor-driven managed project.
|
|
153
199
|
|
|
200
|
+
The starter scaffold also writes `.github/workflows/verify.yml`. That workflow stays intentionally small: it runs `npm run verify` for the normal GitHub Actions gate and leaves browser/auth/database-heavy review flows to app-specific local or CI setups. The `--against <base-ref>` review mode exists in the CLI for local pre-merge checks and for advanced CI pipelines, but it is not assumed by the starter scaffold.
|
|
201
|
+
|
|
154
202
|
The surface-specific script names are also worth noticing early, even in this tiny app. `dev:home`, `server:home`, and `build:home` are the first concrete places where surface selection shows up in the scaffold. They work by setting `VITE_SURFACE=home` on the client side and `SERVER_SURFACE=home` on the server side. In this first chapter, where `home` is the only surface, those variants behave almost the same as the default commands. Later, once more surfaces exist, those scripts become the simplest way to run or build just one surface at a time.
|
|
155
203
|
|
|
156
204
|
### App surfaces in JSKIT
|
|
@@ -0,0 +1,216 @@
|
|
|
1
|
+
<!-- Generated by `npm run agent-docs:build` from `packages/agent-docs/site/guide/app-setup/quickstart.md`. Do not edit manually. -->
|
|
2
|
+
|
|
3
|
+
---
|
|
4
|
+
title: Quickstart
|
|
5
|
+
description: The fastest path to a real JSKIT app, plus the first page-extension patterns you will usually need.
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Quickstart
|
|
9
|
+
|
|
10
|
+
This chapter is the fastest reproducible path to a real JSKIT app.
|
|
11
|
+
|
|
12
|
+
The base flow below gives you:
|
|
13
|
+
|
|
14
|
+
- personal workspaces
|
|
15
|
+
- users
|
|
16
|
+
- console
|
|
17
|
+
- MySQL
|
|
18
|
+
- Supabase auth
|
|
19
|
+
- one `admin` assistant configured from `console`
|
|
20
|
+
|
|
21
|
+
It also shows the first page-extension moves most apps need:
|
|
22
|
+
|
|
23
|
+
- add two workspace settings pages
|
|
24
|
+
- make one of them the default landing page
|
|
25
|
+
- add a page to the admin cog
|
|
26
|
+
- add a normal left-menu page
|
|
27
|
+
- inspect placement destinations and understand why some links are inferred automatically
|
|
28
|
+
|
|
29
|
+
## Step 1: Create the app
|
|
30
|
+
|
|
31
|
+
Set these values first:
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
OPENAI_API_KEY=...
|
|
35
|
+
SUPABASE_URL=...
|
|
36
|
+
SUPABASE_KEY=...
|
|
37
|
+
DB_HOST=127.0.0.1
|
|
38
|
+
DB_PORT=3306
|
|
39
|
+
DB_NAME=testapp
|
|
40
|
+
DB_USER=...
|
|
41
|
+
DB_PASSWORD=...
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
Before continuing, make sure the MySQL database already exists and that the chosen `DB_USER` / `DB_PASSWORD` can connect to it. If the database does not exist yet, create it first or use a local MySQL account with enough privileges to create it before the runtime install step.
|
|
45
|
+
|
|
46
|
+
Then run the exact sequence below:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
npx @jskit-ai/create-app testapp --tenancy-mode personal
|
|
50
|
+
cd testapp
|
|
51
|
+
npm install
|
|
52
|
+
|
|
53
|
+
npx jskit add package shell-web
|
|
54
|
+
|
|
55
|
+
npx jskit add package auth-provider-supabase-core \
|
|
56
|
+
--auth-supabase-url "$SUPABASE_URL" \
|
|
57
|
+
--auth-supabase-publishable-key "$SUPABASE_KEY" \
|
|
58
|
+
--app-public-url "http://localhost:5173"
|
|
59
|
+
|
|
60
|
+
npx jskit add bundle auth-base
|
|
61
|
+
|
|
62
|
+
npx jskit add package database-runtime-mysql \
|
|
63
|
+
--db-host "$DB_HOST" \
|
|
64
|
+
--db-port "$DB_PORT" \
|
|
65
|
+
--db-name "$DB_NAME" \
|
|
66
|
+
--db-user "$DB_USER" \
|
|
67
|
+
--db-password "$DB_PASSWORD"
|
|
68
|
+
|
|
69
|
+
npx jskit add package users-web
|
|
70
|
+
npx jskit add package console-web
|
|
71
|
+
npx jskit add package workspaces-core
|
|
72
|
+
npx jskit add package workspaces-web
|
|
73
|
+
|
|
74
|
+
npx jskit generate assistant setup \
|
|
75
|
+
--surface admin \
|
|
76
|
+
--settings-surface console \
|
|
77
|
+
--config-scope global \
|
|
78
|
+
--ai-provider openai \
|
|
79
|
+
--ai-api-key "$OPENAI_API_KEY"
|
|
80
|
+
|
|
81
|
+
npx jskit generate assistant page \
|
|
82
|
+
w/[workspaceSlug]/admin/assistant/index.vue \
|
|
83
|
+
--name "Assistant"
|
|
84
|
+
|
|
85
|
+
npx jskit generate assistant settings-page \
|
|
86
|
+
console/settings/admin-assistant/index.vue \
|
|
87
|
+
--surface admin \
|
|
88
|
+
--name "Admin Assistant" \
|
|
89
|
+
--link-placement console-settings:primary-menu \
|
|
90
|
+
--link-component-token local.main.ui.surface-aware-menu-link-item
|
|
91
|
+
|
|
92
|
+
npm install
|
|
93
|
+
npm run db:migrate
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
At this point you have:
|
|
97
|
+
|
|
98
|
+
- a workspace-enabled app with `tenancyMode = "personal"`
|
|
99
|
+
- an `admin` assistant at `/w/[workspaceSlug]/admin/assistant`
|
|
100
|
+
- an assistant settings page at `/console/settings/admin-assistant`
|
|
101
|
+
|
|
102
|
+
## Step 2: Add two workspace settings pages
|
|
103
|
+
|
|
104
|
+
Generate two child pages under the workspace settings host:
|
|
105
|
+
|
|
106
|
+
```bash
|
|
107
|
+
npx jskit generate ui-generator page \
|
|
108
|
+
w/[workspaceSlug]/admin/workspace/settings/billing/index.vue \
|
|
109
|
+
--name "Billing"
|
|
110
|
+
|
|
111
|
+
npx jskit generate ui-generator page \
|
|
112
|
+
w/[workspaceSlug]/admin/workspace/settings/branding/index.vue \
|
|
113
|
+
--name "Branding"
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
These commands create:
|
|
117
|
+
|
|
118
|
+
- `src/pages/w/[workspaceSlug]/admin/workspace/settings/billing/index.vue`
|
|
119
|
+
- `src/pages/w/[workspaceSlug]/admin/workspace/settings/branding/index.vue`
|
|
120
|
+
|
|
121
|
+
They also append matching menu entries into `src/placement.js`.
|
|
122
|
+
|
|
123
|
+
## Step 3: Make one settings page the default
|
|
124
|
+
|
|
125
|
+
Best practice is to make the default child explicit.
|
|
126
|
+
|
|
127
|
+
Edit:
|
|
128
|
+
|
|
129
|
+
```text
|
|
130
|
+
src/pages/w/[workspaceSlug]/admin/workspace/settings/index.vue
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
and replace its contents with:
|
|
134
|
+
|
|
135
|
+
```vue
|
|
136
|
+
<script setup>
|
|
137
|
+
import { redirectToChild } from "@jskit-ai/kernel/client/pageRedirects";
|
|
138
|
+
|
|
139
|
+
definePage({
|
|
140
|
+
redirect: redirectToChild("billing")
|
|
141
|
+
});
|
|
142
|
+
</script>
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
That makes `/w/[workspaceSlug]/admin/workspace/settings` land on `/w/[workspaceSlug]/admin/workspace/settings/billing`.
|
|
146
|
+
|
|
147
|
+
Use this explicit redirect pattern instead of trying to infer the default child from placement order or “the first generated page”.
|
|
148
|
+
|
|
149
|
+
## Step 4: Add a page to the admin cog
|
|
150
|
+
|
|
151
|
+
First list the available placement destinations:
|
|
152
|
+
|
|
153
|
+
```bash
|
|
154
|
+
npx jskit list-placements
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
In a workspace-enabled app, that output includes `admin-cog:primary-menu`.
|
|
158
|
+
|
|
159
|
+
Then generate the page:
|
|
160
|
+
|
|
161
|
+
```bash
|
|
162
|
+
npx jskit generate ui-generator page \
|
|
163
|
+
w/[workspaceSlug]/admin/catalogue/index.vue \
|
|
164
|
+
--name "Catalogue" \
|
|
165
|
+
--link-placement admin-cog:primary-menu
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
`--link-placement` is necessary here because this is just a normal `admin` page. It is not a child page under a local route host that already owns a nested outlet.
|
|
169
|
+
|
|
170
|
+
## Step 5: Add a normal left-menu page
|
|
171
|
+
|
|
172
|
+
Generate a normal `admin` page without an explicit placement:
|
|
173
|
+
|
|
174
|
+
```bash
|
|
175
|
+
npx jskit generate ui-generator page \
|
|
176
|
+
w/[workspaceSlug]/admin/reports/index.vue \
|
|
177
|
+
--name "Reports"
|
|
178
|
+
```
|
|
179
|
+
|
|
180
|
+
Because this page is not under a more specific local host, JSKIT falls back to the app's default shell menu outlet. In practice, that means a normal left-menu entry.
|
|
181
|
+
|
|
182
|
+
## Step 6: Understand the placement "magic"
|
|
183
|
+
|
|
184
|
+
The workspace settings pages in Step 2 auto-linked into the settings menu for two reasons:
|
|
185
|
+
|
|
186
|
+
1. The parent host already exposes a named outlet:
|
|
187
|
+
|
|
188
|
+
```vue
|
|
189
|
+
<ShellOutlet
|
|
190
|
+
target="admin-settings:primary-menu"
|
|
191
|
+
default-link-component-token="local.main.ui.surface-aware-menu-link-item"
|
|
192
|
+
/>
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
2. Your generated pages live under that host route:
|
|
196
|
+
|
|
197
|
+
```text
|
|
198
|
+
w/[workspaceSlug]/admin/workspace/settings/...
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
So JSKIT can infer both:
|
|
202
|
+
|
|
203
|
+
- the placement target: `admin-settings:primary-menu`
|
|
204
|
+
- the default link renderer: `local.main.ui.surface-aware-menu-link-item`
|
|
205
|
+
|
|
206
|
+
That is why the simple settings-page commands do not need `--link-placement` or `--link-component-token`.
|
|
207
|
+
|
|
208
|
+
The admin cog example is different. `w/[workspaceSlug]/admin/catalogue/index.vue` is just a normal admin page, so there is no local nested outlet to infer. That is why you must pass `--link-placement admin-cog:primary-menu` there.
|
|
209
|
+
|
|
210
|
+
If you want a little more context than the raw destination list, this is also useful:
|
|
211
|
+
|
|
212
|
+
```bash
|
|
213
|
+
npx jskit show @jskit-ai/workspaces-web --details
|
|
214
|
+
```
|
|
215
|
+
|
|
216
|
+
That output shows both the workspace-owned placement outlets and the default entries already targeting them.
|
|
@@ -80,6 +80,8 @@ This gives you a clean ownership split:
|
|
|
80
80
|
|
|
81
81
|
That split is worth keeping in mind through the rest of the guide. When you see `npm run verify`, that is now shorthand for "run the app's JSKIT baseline verification policy, then any app-specific extra verification hook".
|
|
82
82
|
|
|
83
|
+
The starter scaffold also includes `.github/workflows/verify.yml`. That workflow is intentionally conservative: it runs `npm run verify` and does not assume that every app can stand up full browser, auth, seed-data, and database verification inside hosted CI.
|
|
84
|
+
|
|
83
85
|
If your app uses a non-default npm registry for JSKIT packages, pass it to the maintained CLI command rather than hard-coding it in the scaffold. For example:
|
|
84
86
|
|
|
85
87
|
```bash
|
|
@@ -747,6 +749,20 @@ That command does two things:
|
|
|
747
749
|
|
|
748
750
|
`doctor` then compares the current changed UI files to that receipt. If you edit the UI again afterwards, the receipt is stale and `doctor` tells you to rerun `jskit app verify-ui`.
|
|
749
751
|
|
|
752
|
+
For local pre-merge review, use `--against <base-ref>` so JSKIT compares against the branch delta instead of only the current dirty worktree. The common shape is:
|
|
753
|
+
|
|
754
|
+
```bash
|
|
755
|
+
npx jskit doctor --against origin/main
|
|
756
|
+
```
|
|
757
|
+
|
|
758
|
+
If the UI changed, the normal local sequence is:
|
|
759
|
+
|
|
760
|
+
1. run the targeted Playwright flow locally
|
|
761
|
+
2. record it with `jskit app verify-ui ...`
|
|
762
|
+
3. run `jskit doctor --against <base-ref>`
|
|
763
|
+
|
|
764
|
+
Advanced CI pipelines can also use `--against <base-ref>`, but that is intentionally app-specific. JSKIT does not scaffold hosted browser/auth/database verification by default, because many real apps need secrets, seeded databases, local auth bypass, or environment-specific bootstrap paths that do not belong in a one-size-fits-all template.
|
|
765
|
+
|
|
750
766
|
### Why `--json` exists
|
|
751
767
|
|
|
752
768
|
If you want machine-readable output, use:
|
package/guide/agent/index.md
CHANGED
|
@@ -4,12 +4,13 @@
|
|
|
4
4
|
|
|
5
5
|
This guide is the main hands-on path through JSKIT.
|
|
6
6
|
|
|
7
|
-
It starts with
|
|
7
|
+
It now starts with a fast reproducible Quickstart, then steps back to the smaller scaffold-first chapters that explain how the app is assembled piece by piece. After that, it introduces the database-backed users layer, expands into console and workspace-aware app structure, and adds a small `App extras` section for optional runtime packages such as realtime and assistant. Finally, the guide breaks out generator-specific workflows into their own section.
|
|
8
8
|
|
|
9
9
|
## Table of Contents
|
|
10
10
|
|
|
11
11
|
### App Setup
|
|
12
12
|
|
|
13
|
+
- [Quickstart](/guide/app-setup/quickstart)
|
|
13
14
|
- [Initial Scaffolding](/guide/app-setup/initial-scaffolding)
|
|
14
15
|
- [Working With The JSKIT CLI](/guide/app-setup/working-with-the-jskit-cli)
|
|
15
16
|
- [A More Interesting Shell](/guide/app-setup/a-more-interesting-shell)
|
|
@@ -33,7 +34,8 @@ It starts with the smallest scaffold, then explains how to work with the JSKIT C
|
|
|
33
34
|
|
|
34
35
|
## How to use this guide
|
|
35
36
|
|
|
36
|
-
- Start with `
|
|
37
|
+
- Start with `Quickstart` if you want the fastest route to a real workspace-enabled app and the first page-extension patterns.
|
|
38
|
+
- Start with the rest of `App Setup` if you want to understand the base scaffold layer by layer.
|
|
37
39
|
- Use `App Extras` once the base app structure is in place and you want optional runtime packages.
|
|
38
40
|
- Jump into `Generators` if you already understand the runtime packages and want app-owned scaffolding workflows.
|
|
39
41
|
- Inside `Generators`, read `CRUD Generators` before `Advanced CRUDs`: the first chapter teaches the workflow, and the second explains the generated anatomy and customization points.
|
package/package.json
CHANGED
package/patterns/INDEX.md
CHANGED
|
@@ -14,8 +14,12 @@ How to use it:
|
|
|
14
14
|
- `placements.md`
|
|
15
15
|
- surfaces, app/admin/home/console, "which surface", route ownership, placement visibility
|
|
16
16
|
- `surfaces.md`
|
|
17
|
+
- page, route page, placeholder page, screen stub, menu-linked page, `ui-generator page`, `list-placements`
|
|
18
|
+
- `page-scaffolding.md`
|
|
17
19
|
- child crud, nested crud, embedded list, subroute, separate page, parent/child layout
|
|
18
20
|
- `child-cruds.md`
|
|
21
|
+
- crud scaffold, crud server, crud ui, table creation, migrations, `crud-server-generator`, `crud-ui-generator`
|
|
22
|
+
- `crud-scaffolding.md`
|
|
19
23
|
- CRUD links, record placeholders, `paths.page()`, `resolveViewUrl`, `resolveEditUrl`, `resolveParams`
|
|
20
24
|
- `crud-links.md`
|
|
21
25
|
- `definePage`, redirect, child redirect, settings landing, `redirectToChild`
|
|
@@ -37,7 +41,9 @@ How to use it:
|
|
|
37
41
|
|
|
38
42
|
- [placements.md](./placements.md)
|
|
39
43
|
- [surfaces.md](./surfaces.md)
|
|
44
|
+
- [page-scaffolding.md](./page-scaffolding.md)
|
|
40
45
|
- [child-cruds.md](./child-cruds.md)
|
|
46
|
+
- [crud-scaffolding.md](./crud-scaffolding.md)
|
|
41
47
|
- [crud-links.md](./crud-links.md)
|
|
42
48
|
- [page-redirects.md](./page-redirects.md)
|
|
43
49
|
- [live-actions.md](./live-actions.md)
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
# CRUD Scaffolding Patterns
|
|
2
|
+
|
|
3
|
+
Use when:
|
|
4
|
+
|
|
5
|
+
- creating a new CRUD-backed entity
|
|
6
|
+
- deciding how to create a CRUD table
|
|
7
|
+
- deciding whether to scaffold server first or UI first
|
|
8
|
+
- deciding whether a CRUD needs a migration, a generator, or both
|
|
9
|
+
|
|
10
|
+
Check first:
|
|
11
|
+
|
|
12
|
+
- the intended ownership model
|
|
13
|
+
- the real database table shape
|
|
14
|
+
- `jskit show crud-server-generator --details`
|
|
15
|
+
- whether the request is server-only CRUD or server-plus-UI CRUD
|
|
16
|
+
|
|
17
|
+
Rules:
|
|
18
|
+
|
|
19
|
+
- For a CRUD-backed entity, start with `jskit generate crud-server-generator scaffold ...`.
|
|
20
|
+
- That server scaffold is the crucial first step even if no CRUD UI will be created yet.
|
|
21
|
+
- Create the real table directly in the database before scaffolding. `crud-server-generator` reads the live table shape.
|
|
22
|
+
- If `crud-server-generator` is going to own the CRUD, do not hand-write a separate CRUD migration for that table. The generator installs and manages the CRUD migration scaffold itself.
|
|
23
|
+
- Do not scaffold CRUD UI, hand-build CRUD routes, or hand-build CRUD endpoints before the server CRUD package and shared resource file exist.
|
|
24
|
+
- Treat the generated shared resource file as the canonical CRUD contract for later UI scaffolding and CRUD behavior changes.
|
|
25
|
+
|
|
26
|
+
Avoid:
|
|
27
|
+
|
|
28
|
+
- writing a hand migration for a CRUD table that JSKIT CRUD scaffolding is supposed to own
|
|
29
|
+
- starting with `crud-ui-generator` before the server scaffold exists
|
|
30
|
+
- hand-building CRUD routes or validators that duplicate the generated server resource contract
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
# Page Scaffolding Patterns
|
|
2
|
+
|
|
3
|
+
Use when:
|
|
4
|
+
|
|
5
|
+
- adding a non-CRUD route page
|
|
6
|
+
- adding a placeholder page or screen stub
|
|
7
|
+
- adding a menu-linked page
|
|
8
|
+
- deciding whether a page and its link should be generated or hand-written
|
|
9
|
+
|
|
10
|
+
Check first:
|
|
11
|
+
|
|
12
|
+
- the blueprint route family and chosen surface
|
|
13
|
+
- `jskit show ui-generator --details`
|
|
14
|
+
- `jskit list-placements`
|
|
15
|
+
- the nearest existing routed host under `src/pages`
|
|
16
|
+
|
|
17
|
+
Rules:
|
|
18
|
+
|
|
19
|
+
- Default to `jskit generate ui-generator page ...` for a new app-owned non-CRUD route page.
|
|
20
|
+
- Let the generator create both the page file and the matching `src/placement.js` entry, then adapt the generated output if needed.
|
|
21
|
+
- If the page link belongs in a non-default outlet, discover the outlet first with `jskit list-placements` and pass `--link-placement`.
|
|
22
|
+
- If the page sits under an existing routed host, check whether `ui-generator page` can infer the correct child placement before writing a custom link by hand.
|
|
23
|
+
- If you do not use `ui-generator page`, state exactly why the generator does not fit before editing code.
|
|
24
|
+
- For a small placeholder route inside an existing route family, update the workboard rather than rewriting the blueprint unless the durable route or surface plan changed.
|
|
25
|
+
|
|
26
|
+
Avoid:
|
|
27
|
+
|
|
28
|
+
- hand-writing both `src/pages/...` and `src/placement.js` for a normal non-CRUD page before checking `ui-generator`
|
|
29
|
+
- treating a small page stub as permission to rewrite marketing copy, route architecture, or blueprint scope
|
|
30
|
+
- claiming that no generator exists without checking the actual `jskit` generator inventory first
|
package/patterns/ui-testing.md
CHANGED
|
@@ -12,6 +12,8 @@ Rules:
|
|
|
12
12
|
- Any chunk that adds or changes user-facing UI must include a Playwright flow that exercises the changed behavior before the chunk is done.
|
|
13
13
|
- Record that Playwright run with `jskit app verify-ui --command "<playwright command>" --feature "<label>" --auth-mode <mode>`.
|
|
14
14
|
- `jskit doctor` expects `.jskit/verification/ui.json` to match the current dirty UI file set when UI files are changed.
|
|
15
|
+
- For local pre-merge review, follow the recorded Playwright run with `jskit doctor --against <base-ref>` so `doctor` compares against the branch delta instead of only the local dirty worktree.
|
|
16
|
+
- Advanced CI setups may also use `--against <base-ref>`, but JSKIT does not scaffold hosted browser/auth/database verification by default.
|
|
15
17
|
- Do not rely on a live external auth provider for Playwright verification of normal app features.
|
|
16
18
|
- For authenticated UI in the standard JSKIT auth stack, use the development-only dev auth bypass route instead.
|
|
17
19
|
- The standard route is `POST /api/dev-auth/login-as`.
|
|
@@ -31,6 +33,12 @@ npx jskit app verify-ui \
|
|
|
31
33
|
--auth-mode dev-auth-login-as
|
|
32
34
|
```
|
|
33
35
|
|
|
36
|
+
Local pre-merge follow-up:
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
npx jskit doctor --against origin/main
|
|
40
|
+
```
|
|
41
|
+
|
|
34
42
|
The Playwright command itself should follow this setup shape when login is needed:
|
|
35
43
|
|
|
36
44
|
```ts
|
|
@@ -190,6 +190,12 @@ Local functions
|
|
|
190
190
|
- `cloneProfile(profile)`
|
|
191
191
|
- `createEmailConflictError()`
|
|
192
192
|
|
|
193
|
+
### `src/server/lib/supabaseClientOptions.js`
|
|
194
|
+
Exports
|
|
195
|
+
- `buildSupabaseServerClientOptions(options = {})`
|
|
196
|
+
Local functions
|
|
197
|
+
- `resolveRealtimeTransport({ nativeWebSocket = globalThis.WebSocket, fallbackTransport = WebSocket } = {})`
|
|
198
|
+
|
|
193
199
|
### `src/server/lib/test-utils.js`
|
|
194
200
|
Exports
|
|
195
201
|
- `createAccountFlows`
|
|
@@ -701,7 +701,8 @@ Exports
|
|
|
701
701
|
- `isUiVerificationPath(relativePath = "")`
|
|
702
702
|
- `isValidUiVerificationReceipt(receipt)`
|
|
703
703
|
- `normalizeUiVerificationReceipt(rawReceipt = {})`
|
|
704
|
-
- `
|
|
704
|
+
- `resolveChangedPathsFromGit(appRoot = "", { against = "", pathspecs = ["src", "packages"] } = {})`
|
|
705
|
+
- `resolveChangedUiFilesFromGit(appRoot = "", { against = "" } = {})`
|
|
705
706
|
- `sortUniqueStrings(values = [])`
|
|
706
707
|
Local functions
|
|
707
708
|
- `normalizeText(value = "")`
|
|
@@ -69,6 +69,7 @@ Chunk notes:
|
|
|
69
69
|
|
|
70
70
|
- One CRUD is usually one chunk.
|
|
71
71
|
- Platform/auth/shell work may be its own chunk.
|
|
72
|
+
- Prefer vertical slices that produce visible or end-to-end progress the developer can inspect.
|
|
72
73
|
- Each chunk must be independently reviewable and testable.
|
|
73
74
|
|
|
74
75
|
## Verification
|
package/templates/app/AGENTS.md
CHANGED
|
@@ -32,10 +32,10 @@ Before any non-trivial change:
|
|
|
32
32
|
4. Before editing, print a compact read receipt with:
|
|
33
33
|
- `Read receipt: ...`
|
|
34
34
|
- `Active chunk: ...`
|
|
35
|
-
- `Generator decision: ...`
|
|
35
|
+
- `Generator decision: ...` with the exact `jskit` command to run, or the exact generator/placement discovery commands checked and why no generator applies
|
|
36
36
|
- `Relevant patterns: ...`
|
|
37
37
|
- `Active rules from docs: ...`
|
|
38
|
-
5. When files need to be created, prefer `jskit generate ...` over creating them from scratch, even if the generated output will need follow-up adaptation. If not using a generator, say why.
|
|
38
|
+
5. When files need to be created, prefer `jskit generate ...` over creating them from scratch, even if the generated output will need follow-up adaptation. For a new non-CRUD route page or menu-linked screen, default to `jskit generate ui-generator page ...`. If not using a generator, say why.
|
|
39
39
|
6. Do not edit code until the read receipt is printed and the workboard step is complete when it applies.
|
|
40
40
|
|
|
41
41
|
## Mandatory Done Gate
|
|
@@ -70,15 +70,21 @@ Core rules:
|
|
|
70
70
|
- Example: if the app is workspace-capable and uses `workspaces-core` plus `workspaces-web`, assume the standard workspace invite flow is part of the baseline package behavior.
|
|
71
71
|
- For baseline package setup, ask plainly for the exact local development values needed for the next install step, but only for the modules or packages that are actually selected.
|
|
72
72
|
- Use the real env var names or option names instead of vague requests for "credentials". Values such as `DB_NAME`, `DB_USER`, `DB_PASSWORD`, `AUTH_SUPABASE_URL`, `AUTH_SUPABASE_PUBLISHABLE_KEY`, and `APP_PUBLIC_URL` are routine setup inputs when the relevant package stack needs them.
|
|
73
|
+
- For CRUD chunks, creating the server CRUD with `jskit generate crud-server-generator scaffold ...` is the crucial first step even if no CRUD UI will be created yet.
|
|
74
|
+
- For a CRUD table that `crud-server-generator` will own, do not hand-write a separate migration. Create the real table directly in the database first, then scaffold the server CRUD so JSKIT can install and manage the CRUD migration scaffold itself.
|
|
75
|
+
- Do not generate CRUD UI or hand-build CRUD routes before the server CRUD package and shared resource file exist.
|
|
73
76
|
- For CRUD chunks, ask the developer which operations are allowed, which fields belong in the list view if one exists, and the intended look of the view and edit/new forms before generating code.
|
|
74
77
|
- Every user-facing screen must pass a Material Design and Vuetify quality review before the chunk is considered done.
|
|
75
78
|
- Any chunk that adds or changes user-facing UI must include a Playwright check that exercises the changed behavior before the chunk is considered done.
|
|
76
|
-
- Record that Playwright run with `jskit app verify-ui --command "<playwright command>" --feature "<label>" --auth-mode <mode>` so `jskit doctor` can verify the receipt.
|
|
79
|
+
- Record that Playwright run with `jskit app verify-ui --command "<playwright command>" --feature "<label>" --auth-mode <mode>` so `jskit doctor` can verify the receipt. For local pre-merge review, normally follow it with `jskit doctor --against <base-ref>`. Advanced CI setups may also use `--against <base-ref>`, but that is app-specific.
|
|
77
80
|
- If the UI flow requires login, use the app's development-only auth bypass or session bootstrap path instead of a live external auth login flow.
|
|
78
81
|
- In JSKIT apps using the standard auth stack, that means enabling the dev auth bypass in development and using `POST /api/dev-auth/login-as` during Playwright setup.
|
|
79
82
|
- If authenticated UI work has no usable local auth bootstrap path yet, treat that as a testability gap and call it out before the chunk can be considered complete.
|
|
80
83
|
- Do not implement app features before the blueprint has the database, surfaces, ownership model, and route/screen plan written down.
|
|
84
|
+
- Plan implementation work as vertical slices. Each chunk should deliver a user-visible or end-to-end outcome that the developer can recognize in the app or behavior, not just an isolated layer change.
|
|
85
|
+
- Do not churn `.jskit/APP_BLUEPRINT.md` for a small placeholder page or route stub that fits an existing route family unless the durable route/surface plan actually changed. Track request-level movement in `.jskit/WORKBOARD.md` instead.
|
|
81
86
|
- Break planned work into reviewable chunks before implementing. One CRUD is usually one chunk, but auth/platform setup, shell work, and cross-cutting integrations can be their own chunks.
|
|
87
|
+
- Avoid horizontal chunk plans like "all migrations first", "all routes next", or "all UI last" unless platform setup truly forces that order. Prefer slices the developer can inspect as real progress.
|
|
82
88
|
- Do not move to the next chunk until the current chunk has passed implementation, deslop review, JSKIT best-practices review, Material Design/Vuetify review, and verification.
|
|
83
89
|
- If a feature spans more than one chunk, run a final whole-changeset deslop pass, JSKIT pass, Material Design/Vuetify pass, and verification pass after the last chunk.
|
|
84
90
|
- Prefer a fresh review agent for chunk and whole-changeset review when the runtime supports delegation.
|
package/workflow/bootstrap.md
CHANGED
|
@@ -40,6 +40,8 @@ Ask setup values plainly:
|
|
|
40
40
|
- Only ask for setup values that correspond to the modules or packages already chosen for the baseline.
|
|
41
41
|
- When the next package install needs concrete local development values, ask for them directly using the exact env var names or option names.
|
|
42
42
|
- Do not hide behind vague requests for "credentials" or "values after that boundary".
|
|
43
|
+
- If MySQL or Postgres is selected, confirm that the target database already exists before the runtime install, or that the developer has enough local admin or create-database access to create it now.
|
|
44
|
+
- Do not proceed as if `DB_NAME` alone means the database is ready. The actual database must exist before the database runtime install and migration flow can be treated as valid.
|
|
43
45
|
- In this workflow, these are routine setup inputs:
|
|
44
46
|
- If the MySQL runtime is selected: `DB_NAME`, `DB_USER`, `DB_PASSWORD`
|
|
45
47
|
- If the MySQL host or port differs from the local default `127.0.0.1:3306`: `DB_HOST`, `DB_PORT`
|
|
@@ -7,7 +7,9 @@ Chunk rules:
|
|
|
7
7
|
- One CRUD is usually one chunk.
|
|
8
8
|
- Platform setup, shell/navigation, and cross-cutting integrations may be separate chunks.
|
|
9
9
|
- A chunk must be independently reviewable and testable.
|
|
10
|
+
- Prefer vertical slices. A chunk should usually produce a user-visible or end-to-end outcome, not just a hidden layer-only milestone.
|
|
10
11
|
- If a chunk is too broad to review confidently, split it before coding.
|
|
12
|
+
- Avoid horizontal plans like "database first, then routes, then UI" unless the work is foundational platform setup that genuinely cannot be sliced vertically yet.
|
|
11
13
|
|
|
12
14
|
For each chunk, follow this order:
|
|
13
15
|
|
|
@@ -18,6 +20,7 @@ For each chunk, follow this order:
|
|
|
18
20
|
- generator scaffolding
|
|
19
21
|
- custom local code
|
|
20
22
|
- or a combination
|
|
23
|
+
Record the exact `jskit` commands that will be used if generators or package installs apply.
|
|
21
24
|
4. Implement the smallest correct change.
|
|
22
25
|
5. Deslop the chunk.
|
|
23
26
|
6. Review the chunk against JSKIT reuse and best practices.
|
|
@@ -29,11 +32,12 @@ For each chunk, follow this order:
|
|
|
29
32
|
For CRUD chunks:
|
|
30
33
|
|
|
31
34
|
1. Decide the table shape first.
|
|
32
|
-
2.
|
|
33
|
-
3.
|
|
34
|
-
4.
|
|
35
|
-
5.
|
|
36
|
-
6.
|
|
35
|
+
2. Create the real table directly in the database before scaffolding. `crud-server-generator` reads the live table shape; it does not invent the table for you.
|
|
36
|
+
3. If `crud-server-generator` is going to own the CRUD schema, do not hand-write a separate migration for that CRUD table. The server generator installs and manages the CRUD migration scaffold itself.
|
|
37
|
+
4. Scaffold the server side first with `crud-server-generator`, even if no CRUD UI will be created yet.
|
|
38
|
+
5. Only after the shared resource file exists, scaffold the client side against that resource.
|
|
39
|
+
6. Treat that shared resource file as the canonical CRUD definition. Put field and ownership changes there instead of hand-duplicating derived CRUD validators elsewhere.
|
|
40
|
+
7. Do not guess CRUD operations or screen shape. Ask the developer:
|
|
37
41
|
- which operations are allowed
|
|
38
42
|
- which fields belong in the list view if one exists
|
|
39
43
|
- what the view form should look like
|
|
@@ -45,8 +49,13 @@ During implementation:
|
|
|
45
49
|
- If a selected JSKIT package already ships the required baseline workflow, install and verify that workflow before inventing custom code around it.
|
|
46
50
|
- Ask only about overrides, restrictions, or app-specific additions to packaged baseline workflows.
|
|
47
51
|
- Use generated CRUD/UI scaffolds only after the route and ownership model are decided.
|
|
52
|
+
- Do not hand-build CRUD routes, CRUD endpoints, or CRUD page trees before `crud-server-generator` has created the server package and shared resource file.
|
|
53
|
+
- For app-owned non-CRUD route pages, default to `jskit generate ui-generator page ...` instead of hand-writing both `src/pages/...` and `src/placement.js`.
|
|
54
|
+
- Before hand-writing a route page or placement entry, check `jskit show ui-generator --details` and `jskit list-placements`.
|
|
55
|
+
- If `ui-generator page` applies and you still choose not to use it, stop and explain the exact gap before coding.
|
|
48
56
|
- Keep runtime, UI, and data concerns separated.
|
|
49
57
|
- Avoid “while I’m here” scope creep unless it is required for correctness.
|
|
58
|
+
- Do not turn a small placeholder or route stub into a copy-polish or blueprint-rewrite task unless the developer asked for that broader work.
|
|
50
59
|
|
|
51
60
|
After the last chunk:
|
|
52
61
|
|
|
@@ -62,6 +71,8 @@ Playwright note:
|
|
|
62
71
|
|
|
63
72
|
- When login is required, use a test-only auth bypass or session bootstrap path instead of dependence on a live external auth provider.
|
|
64
73
|
- Record the run through `jskit app verify-ui --command "<playwright command>" --feature "<label>" --auth-mode <mode>` so `jskit doctor` can verify the receipt against the current changed UI files.
|
|
74
|
+
- In local pre-merge review, use `jskit doctor --against <base-ref>` after the recorded Playwright run so JSKIT compares against the branch delta, not only the current dirty worktree.
|
|
75
|
+
- Advanced CI setups may also use `--against <base-ref>`, but JSKIT does not scaffold hosted browser/auth/database verification by default.
|
|
65
76
|
- In the standard JSKIT auth stack, the default development path is `POST /api/dev-auth/login-as`, guarded by `AUTH_DEV_BYPASS_ENABLED=true` and `AUTH_DEV_BYPASS_SECRET=...`.
|
|
66
77
|
- That route is development-only and must not be enabled in production.
|
|
67
78
|
- Because it is still an unsafe POST, fetch `csrfToken` from `/api/session`, send it as the `csrf-token` header, and make the request in the same browser context that will run the Playwright assertions so the session cookies land in the page session.
|
package/workflow/review.md
CHANGED
|
@@ -20,6 +20,9 @@ Before calling a chunk or a whole changeset done, review it in four passes:
|
|
|
20
20
|
- existing helper/runtime seam available?
|
|
21
21
|
- duplicate local code that should reuse kernel/runtime support?
|
|
22
22
|
- should this have been a package install, generator step, or scaffold extension instead of hand code?
|
|
23
|
+
- if a generator existed, was the exact `jskit` command used or was the gap documented clearly before hand-coding?
|
|
24
|
+
- for CRUD work, was `crud-server-generator scaffold` used before any CRUD UI or CRUD route hand-coding?
|
|
25
|
+
- for CRUD tables owned by JSKIT, did the change avoid a separate hand-written CRUD migration?
|
|
23
26
|
- are surface, route, ownership, and migration choices aligned with JSKIT conventions?
|
|
24
27
|
- package metadata and actual behavior still aligned?
|
|
25
28
|
3. UI standards review
|
|
@@ -33,6 +36,7 @@ Before calling a chunk or a whole changeset done, review it in four passes:
|
|
|
33
36
|
- run the widest relevant verification commands for a whole changeset
|
|
34
37
|
- any added or changed user-facing UI must be exercised with Playwright
|
|
35
38
|
- that Playwright run should normally be recorded through `jskit app verify-ui`
|
|
39
|
+
- for local pre-merge review, prefer following that receipt with `jskit doctor --against <base-ref>`
|
|
36
40
|
- if login is required, use the chosen local test-auth path instead of live external auth
|
|
37
41
|
- in the standard JSKIT auth stack, prefer the development-only `POST /api/dev-auth/login-as` path
|
|
38
42
|
- if there is no usable local auth bootstrap path, explicitly record that as a blocking testability gap
|
package/workflow/scoping.md
CHANGED
|
@@ -30,11 +30,16 @@ Scoping rules:
|
|
|
30
30
|
|
|
31
31
|
- Use `guide/agent/index.md` for fast navigation and `site/guide/index.md` for exact details.
|
|
32
32
|
- Inspect packages and generators before choosing them.
|
|
33
|
+
- Make the generator plan concrete. Name the exact `jskit` commands expected for the chunk, not just a package or a general idea.
|
|
34
|
+
- For non-CRUD route page work, check `jskit show ui-generator --details` and `jskit list-placements` before deciding that custom page or placement code is necessary.
|
|
35
|
+
- For CRUD work, make the server-first plan explicit. Name the exact `jskit generate crud-server-generator scaffold ...` command before any CRUD UI plan.
|
|
36
|
+
- If a CRUD will be owned by `crud-server-generator`, plan around a real table that already exists in the database. Do not plan a separate hand-written CRUD migration for that table.
|
|
33
37
|
- Decide ownership early; do not treat it as a UI-only detail.
|
|
34
38
|
- If Stage 1 platform choices are still provisional, finish them before installing tenancy-sensitive runtime packages.
|
|
35
39
|
- Record which selected JSKIT package-owned workflows are accepted as baseline and which, if any, need custom behavior.
|
|
36
40
|
- Do not ask the developer to redesign package-owned baseline workflows from scratch. Ask only whether the default behavior is accepted or whether the app needs overrides, restrictions, or extensions.
|
|
37
41
|
- Create or refresh `.jskit/WORKBOARD.md` for substantial or multi-chunk work so the request has an explicit execution tracker.
|
|
42
|
+
- Do not rewrite `.jskit/APP_BLUEPRINT.md` for a one-off placeholder page inside an already planned route family unless the durable route plan, surface plan, or ownership model changed.
|
|
38
43
|
- Break delivery into chunks that can be independently reviewed and tested.
|
|
39
44
|
- One CRUD is usually one chunk. Platform setup, shell work, and cross-cutting integrations may also be separate chunks.
|
|
40
45
|
- For each CRUD chunk, decide these before implementation:
|