KungRaseri
b192cd53ba
- Add comprehensive project overview and core philosophy - Document file structure reference for the codebase - Create key files reference table for task-specific guidance - Include multi-tenant guidelines and site resolution flow
81 lines
2.8 KiB
Markdown
81 lines
2.8 KiB
Markdown
---
|
|
description: 'Scaffold a new SvelteKit route with a server load function and Svelte 5 page component for The Collective Hub. Generates +page.server.ts (auth guard, site-scoped Drizzle query, typed return) and +page.svelte (runes, Tailwind layout).'
|
|
name: 'New Route'
|
|
argument-hint: "Route path and purpose (e.g. 'admin/events detail page' or 'public schedule page')"
|
|
agent: 'agent'
|
|
---
|
|
|
|
Scaffold a new SvelteKit route for: ${input}
|
|
|
|
Follow all conventions in:
|
|
|
|
- [multi-tenant-architecture.instructions.md](.github/instructions/multi-tenant-architecture.instructions.md)
|
|
- [auth-and-roles.instructions.md](.github/instructions/auth-and-roles.instructions.md)
|
|
- [svelte5.instructions.md](.github/instructions/svelte5.instructions.md)
|
|
- [server-ts.instructions.md](.github/instructions/server-ts.instructions.md)
|
|
|
|
## What to create
|
|
|
|
Determine the route path from the input (e.g. `admin/events` → `src/routes/admin/events/`).
|
|
|
|
### 1. `+page.server.ts`
|
|
|
|
```ts
|
|
import { redirect } from '@sveltejs/kit';
|
|
import { db } from '$lib/server/db';
|
|
import { eq, and } from 'drizzle-orm';
|
|
import { /* yourTable */ } from '$lib/server/db/schema';
|
|
import type { PageServerLoad } from './$types';
|
|
|
|
export const load: PageServerLoad = async ({ locals, params }) => {
|
|
if (!locals.user) redirect(302, '/login');
|
|
|
|
const siteId = locals.site.id;
|
|
|
|
// Site-scoped query — always filter by siteId
|
|
const items = await db
|
|
.select()
|
|
.from(/* yourTable */)
|
|
.where(
|
|
and(
|
|
eq(/* yourTable */.siteId, siteId),
|
|
// Add more filters as needed
|
|
)
|
|
)
|
|
.orderBy(/* yourTable */.createdAt);
|
|
|
|
return {
|
|
items,
|
|
settings: locals.siteSettings,
|
|
};
|
|
};
|
|
```
|
|
|
|
- For **admin routes**, add a role check after the auth guard: `if (locals.membership?.role !== 'owner' && locals.membership?.role !== 'admin') redirect(302, '/admin');`
|
|
- For **public routes**, skip the auth guard entirely — just load data scoped by `siteId`
|
|
- Add `actions: Actions` only if the route has a form — skip it for read-only pages
|
|
- Use `fail` / `redirect` from `@sveltejs/kit` in actions per [server-ts.instructions.md](.github/instructions/server-ts.instructions.md)
|
|
|
|
### 2. `+page.svelte`
|
|
|
|
```svelte
|
|
<script lang="ts">
|
|
import type { PageData } from './$types';
|
|
let { data }: { data: PageData } = $props();
|
|
let { items, settings } = data;
|
|
</script>
|
|
|
|
<div class="p-6">
|
|
<h1 class="text-2xl font-bold"><!-- Page title --></h1>
|
|
<!-- Render {items} here -->
|
|
</div>
|
|
```
|
|
|
|
- Use Svelte 5 runes throughout (`$props`, `$state`, `$derived`)
|
|
- Tailwind utility classes for layout (`p-6`, `flex`, `gap-4`, etc.)
|
|
- No `export let`, no `on:` directives, no `<slot>`
|
|
|
|
## After generating
|
|
|
|
List the files created and their paths. Ask if a form action should be added.
|