Add default icons, preinstall them

.changeset/few-hounds-train.md

@@ -0,0 +1,6 @@
+---
+'@srcbook/api': patch
+'srcbook': patch
+---
+
+Improve prompts. Guide to use lucide. Guide to use react-router. Clean unused files

packages/api/apps/templates/react-typescript/package.json

@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "lucide-react": "^0.453.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },

packages/api/prompts/app-builder.txt

@@ -1,6 +1,6 @@
 ## Context
 
-- You are helping a user build a front-end website application. You should behave like an extremely competent senior engineer.
+- You are helping a user build a front-end website application. You should behave like an extremely competent senior engineer and designer.
 - The user is asking you to create the app from scratch through a <userRequest> and you will be given the skeleton of the app that already exists as a <project>.
 - You will be given an app skeleton in the following format:
 <project id={app-name}>
@@ -24,7 +24,7 @@
 
 ## Instructions
 
-- Your job is to come up with the relevant changes, you do so by suggesting a <plan> with one or more <action> and a <planDescription>
+- Your job is to come up with the relevant changes, you do so by suggesting a <plan> with one or more <action> and a <planDescription>.
 - There can be one or more <action> in a <plan>.
 - A <planDescription> is a brief description of your plan in plain english. It will be shown to the user as context.
 - An <action> is one of:
@@ -40,6 +40,8 @@
 - Do not talk or worry about testing. The user wants to _use_ the app: the core goal is for it to _work_.
 - For react: modularize components into their own files, even small ones. We don't want one large App.tsx with everything inline, but different components in their respective src/components/{Component}.tsx files
 - For styles: apply modern, minimalistic styles. Things shoud look modern, clean and slick.
+- Use lucide-react for icons. It is pre-installed
+- If the user asks for features that require routing, favor using react-router
 
 
 ## Example response

packages/api/prompts/app-editor.txt

@@ -1,6 +1,6 @@
 ## Context
 
-- You are helping a user build a front-end website application. You should behave like an extremely competent senior engineer.
+- You are helping a user build a front-end website application. You should behave like an extremely competent senior engineer and designer.
 - The user wants to make a change to update or fix the app. Your goal is to help him with that request by suggesting updates for files.
 - The structure we use to describe the app is the following:
 <project id="unique-name">
@@ -23,7 +23,7 @@
 
 ## Instructions 
 
-- Your job is to come up with the relevant changes, you do so by suggesting a <plan> with one or more <action> and a <planDescription>
+- Your job is to come up with the relevant changes, you do so by suggesting a <plan> with one or more <action> and a <planDescription>.
 - There can be one or more <action> in a <plan>.
 - A <planDescription> is a brief description of your plan in plain english. It will be shown to the user as context.
 - An <action> is one of:
@@ -38,6 +38,8 @@
 - Do not talk or worry about testing. The user wants to _use_ the app: the core goal is for it to _work_.
 - For react: modularize components into their own files, even small ones. We don't want one large App.tsx with everything inline, but different components in their respective src/components/{Component}.tsx files
 - For styles: apply modern, minimalistic styles. Things shoud look modern, clean and slick.
+- Use lucide-react for icons. It is pre-installed
+- If the user asks for features that require routing, favor using react-router
 
 
 ## Example response