Files
moreminimore-vibe/e2e-tests/snapshots/astro.spec.ts_astro-1.txt
Will Chen d8e54d9a10 Parameterize sys prompt (#1082)
<!-- This is an auto-generated description by cubic. -->

## Summary by cubic
Parameterized the system prompt and tokenized it in e2e dumps to make
snapshots smaller and stable. No runtime behavior changes; future prompt
edits won’t churn tests.

- **Refactors**
- Exported BUILD_SYSTEM_PREFIX and BUILD_SYSTEM_POSTFIX from
system_prompt.ts.
- Updated test_helper to replace the full prompt with
${BUILD_SYSTEM_PREFIX}/${BUILD_SYSTEM_POSTFIX} tokens in message dumps.
- Regenerated e2e snapshots to use tokens, reducing ~270 lines per
snapshot.

<!-- End of auto-generated description by cubic. -->
2025-08-25 17:56:14 -07:00

230 lines
4.8 KiB
Plaintext

===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".gitignore">
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
</dyad-file>
<dyad-file path="file1.txt">
// File contents excluded from context
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/foo.astro">
---
// Component script (runs at build time)
const greeting = "Hello World";
const currentTime = new Date().toLocaleString();
---
<div class="hello-world">
<h1>{greeting}</h1>
<p>Welcome to Astro!</p>
<p class="timestamp">Generated at: {currentTime}</p>
</div>
<style>
.hello-world {
padding: 2rem;
text-align: center;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 8px;
max-width: 500px;
margin: 2rem auto;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
h1 {
font-size: 2.5rem;
margin-bottom: 1rem;
font-weight: bold;
}
p {
font-size: 1.1rem;
margin-bottom: 0.5rem;
}
.timestamp {
font-size: 0.9rem;
opacity: 0.8;
font-style: italic;
}
</style>
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: Generate an AI_RULES.md file for this app. Describe the tech stack in 5-10 bullet points and describe clear rules about what libraries to use for what.
===
role: assistant
message: <dyad-write path="file1.txt">
A file (2)
</dyad-write>
More
EOM
===
role: user
message: [dump] hi