wcz-layout/skills/template-init.md

---
description: "Initializes a new app from this project template"
---

You are an AI assistant helping a developer initialize a new project from a template.

Follow these steps in exact order.

1. GIT BRANCH CHECK
   Autonomously check if the current git branch is named `master` (you can execute `git branch --show-current` in the terminal to check).
   - If the branch is `master`: Proceed directly to step 2.
   - If the branch is not `master` (e.g., it is `main`): Execute the command `git branch -m main master` in the terminal to rename it. Wait for the command to finish before proceeding to step 2.

2. DEPENDENCY CHECK
   Check the project root for the presence of a `node_modules` directory.
   - If `node_modules` is found: Proceed directly to step 3.
   - If `node_modules` is not found: Output this exact message to the user: "I see `node_modules` is missing. I am running your install script to get your dependencies set up. This might take a moment..."
     Then, execute the command `npm run npm:install` in the terminal. Wait for the installation process to complete fully before proceeding to step 3.

3. ENVIRONMENT SETUP
   Search the workspace root for a `.env.local` file.
   - If found: Proceed directly to step 4.
   - If not found: Use your edit tools to create `.env.local` in the root directory and populate it with the following initial keys:

     VAULT_ADDRESS=https://vault-dev.wistron.com:8200/
     VAULT_SECRET_PATH=wcz/sat-qas-01/project-name-wcz/default
     VAULT_USERNAME=
     VAULT_PASSWORD=

     DATABASE_URL=

   Once created, let the user know and proceed to step 4.

4. PROJECT NAME REPLACEMENT
   Ask the user: "What is your project name?"
   Once the user provides the name, standardise it across the project workspace. You will use your search and edit tools across the entire workspace for placeholder strings and replace them with the user's input, matching the exact casing conventions.

   For example, if the user inputs "Dev Portal":
   - Replace "project-name" with "dev-portal" (kebab-case)
   - Replace "Project Name" with "Dev Portal" (Title Case)

   Execute this workspace-wide search and replace. Once completed, tell the user how many files were updated, and proceed to step 5.

5. DATABASE SETUP
   Ask the user: "Do you already have a Postgres database created?"
   Wait for the user's response.
   - If the user answers "yes":
     Ask the user: "Please enter your database schema name (e.g., 'dev_portal')."
     Wait for their input. Once provided, **use your file edit tool** to update the `.env` file by setting `DATABASE_SCHEMA=[user-input]`. Then proceed to step 6.
   - If the user answers "no":
     Ask the user: "Would you like me to create a local database using Docker?"
     Wait for the user's response.
     - If the user answers "yes": Execute the following command in the terminal:
       `docker run --name drizzle-postgres -e POSTGRES_PASSWORD=admin -d -p 5432:5432 postgres`
       - If the command succeeds: **Use your file edit tool** to update the `.env.local` file to set `DATABASE_URL=postgres://postgres:admin@localhost:5432/postgres`. Then proceed to step 6.
       - If the command fails: Output: "It looks like the Docker command failed. Please ensure Docker Desktop is running. Let me know when you are ready to try again, or type 'no' to skip this step." Wait for the user to try again or skip, then proceed accordingly.
     - If the user answers "no" to creating a local database: Proceed to step 6.

6. ENTRA ID SETUP
   This step has three parts. Complete them sequentially, waiting for the user at each prompt.

   **Part A: Application Creation**
   Ask the user: "Is the Entra ID application already created for this project? (yes/no)"
   - If "no": Output this instruction:
     "Please navigate to https://itsr.wistron.com/homepage/apply and request the application creation.
     Path: ITSR Apply -> Service Apply -> Select Service Type -> Azure AD - Application Management - Add or Modify -> fill the information.
     Since application approval takes time, we will skip the rest of the Entra ID configuration for now. Please type 'continue' once you have submitted the request."
     Wait for the user to type "continue". Once they do, **SKIP Part B and Part C entirely**, and proceed directly to step 7.
   - If "yes": Proceed to Part B.

   **Part B: Application Configuration**
   Ask the user: "Have you configured the created Entra ID application settings? (yes/no)"
   - If "no": Output this configuration guide:
     "Please navigate to https://entra.microsoft.com/ and configure your application using these steps:

     **App Registrations:**
     1. **Authentication:** Add 'Single-page application' and configure your Redirect URIs.
     2. **Token Configuration:** Add groups claims -> Security groups. Ensure ID, Access, and SAML token properties have checked `sAMAccountName`.
     3. **Expose an API:** Set the Application ID URI. Add a Scope named `access_as_user` (Admins and users) with appropriate display names/descriptions.
     4. **Owners:** Add other developers as owners.
     5. **Manifest:** Update the `api` object properties to `"acceptMappedClaims": true` and `"requestedAccessTokenVersion": 2`.

     **Enterprise Applications:**
     1. Search for your application.
     2. **Single Sign-on:** Add custom claims for `employeeId` (Source: user.extensionattribute5) and `department` (Source: user.department). Optionally, add `employeeCategory` (Source: user.extensionattribute13) and `companyName` (Source: user.companyname).
     3. **Owners:** Add other developers as owners.

     Once you have finished these steps, type 'continue'."
     Wait for the user to type "continue".

   - If "yes" or once they continue: Proceed to Part C.

   **Part C: Credentials**
   Ask the user: "Please provide the CLIENT_ID and CLIENT_SECRET for your Entra ID application."
   Wait for the user's input.
   Once provided:
   1. **Use your file edit tool** to update the `.env` file. Find the `VITE_ENTRA_CLIENT_ID=` line and set it to the provided Client ID (e.g., `VITE_ENTRA_CLIENT_ID=[user-provided-client-id]`).
   2. **CRITICAL:** Do not save the CLIENT_SECRET to any file. Only memorize the CLIENT_SECRET in your context history, as it will be used in a later step.

7. VAULT SETUP
   Ask the user: "Would you like to set up your environment variables in Vault now? (yes/skip)"
   - If the user answers "skip": Proceed directly to step 8.
   - If the user answers "yes": Complete these parts sequentially.

   **Part A: Default Secrets**
   Output the following instructions:
   "1. Navigate to https://vault-dev.wistron.com:8200/ui/ and log in. 2. Find your project, open the secret path, and click 'Edit' (ensure you toggle 'View as JSON'). 3. Copy and paste the following JSON block, then save. Once finished, type 'continue'."

   Provide the user with this exact JSON block (fill in the bracketed values dynamically based on the current `.env` and `.env.local` state, and the `CLIENT_SECRET` you memorized in Step 6):

   ```json
   {
     "DATABASE_URL": "[DATABASE_URL]",
     "ENTRA_CLIENT_ID": "[VITE_ENTRA_CLIENT_ID]",
     "ENTRA_CLIENT_SECRET": "[CLIENT_SECRET]",
     "ENTRA_TENANT_ID": "de0795e0-d7c0-4eeb-b9bb-bc94d8980d3b"
   }
   ```

   Wait for the user to type "continue".

   **Part B: Harbor Vault Secret**
   Output the following instructions:
   "Now, go to the root path of your project in Vault and click 'Create secret'.
   1. Name it exactly: `harborvault`
   2. Toggle 'JSON' mode.
   3. Please go to another existing project in your Vault, copy the JSON values from its `harborvault` secret, and paste them into this new one, then save.
      Once finished, type 'continue'."

   Wait for the user to type "continue".

   **Part C: Local Vault Credentials**
   Ask the user: "Please provide your Vault Username and Password so I can add them to your local environment."
   Wait for their input. Once provided, **use your file edit tool** to update the `.env.local` file with the values:
   `VAULT_USERNAME=[user-provided-username]`
   `VAULT_PASSWORD=[user-provided-password]`
   Proceed to step 8.

8. FAVICON GENERATION
   Ask the user: "Would you like to generate a custom favicon for this project?"
   - If the user answers "yes": Output this exact instruction:
     "1. Please navigate to https://favicon.io/favicon-converter/ 2. Upload your app logo (it should be at least 512x512 pixels for the best results). 3. Download the generated file and extract its contents inside your project's `/public` folder.

"Project initialization is complete! Happy coding." and END the workflow.

- If the user answers "no": Output "Project initialization is complete! Happy coding." and END the workflow.