Use tech stack vite

[skip gpt_engineer]
city17 · Jun 20, 2024 · 2944919 · 2944919
commit 2944919
Show file tree

Hide file tree

Showing 16 changed files with 6,168 additions and 0 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -0,0 +1,20 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:react-hooks/recommended",
+  ],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parserOptions: { ecmaVersion: "latest", sourceType: "module" },
+  settings: { react: { version: "18.2" } },
+  plugins: ["react-refresh"],
+  rules: {
+    "react-refresh/only-export-components": [
+      "warn",
+      { allowConstantExport: true },
+    ],
+  },
+};
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -0,0 +1,25 @@
+name: Build
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [18.x]
+
+    steps:
+    - uses: actions/checkout@v4
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v4
+      with:
+        node-version: ${{ matrix.node-version }}
+    - name: Install deps
+      run: npm ci
+    - name: Build
+      run: npm run build
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,4 @@
+dist
+node_modules
+.env.local
+.DS_Store
diff --git a/.gpt_engineer_internals/report-url-change.js b/.gpt_engineer_internals/report-url-change.js
@@ -0,0 +1,25 @@
+const main = () => {
+  /**
+   * Listen to URL changes and report them to the parent window
+   *
+   * See https://stackoverflow.com/a/46428962
+   * The Navigation API https://developer.mozilla.org/en-US/docs/Web/API/Navigation_API seemed promising,
+   * but it is not supported in all major browsers.
+   */
+  const observeUrlChange = () => {
+    let oldHref = document.location.href;
+    const body = document.querySelector("body");
+    const observer = new MutationObserver(() => {
+      if (oldHref !== document.location.href) {
+        oldHref = document.location.href;
+        window.top.postMessage({ type: "URL_CHANGED", url: document.location.href }, "https://run.gptengineer.app");
+        window.top.postMessage({ type: "URL_CHANGED", url: document.location.href }, "http://localhost:3000");
+      }
+    });
+    observer.observe(body, { childList: true, subtree: true });
+  };
+
+  window.addEventListener("load", observeUrlChange);
+};
+
+main().catch(console.error);
diff --git a/README.md b/README.md
@@ -0,0 +1,37 @@
+# piano-soundscape
+
+create a piano app where i can presson keys and you hear music
+
+## Collaborate with GPT Engineer
+
+This is a [gptengineer.app](https://gptengineer.app)-synced repository 🌟🤖
+
+Changes made via gptengineer.app will be committed to this repo.
+
+If you clone this repo and push changes, you will have them reflected in the GPT Engineer UI.
+
+## Tech stack
+
+This project is built with React and Chakra UI.
+
+- Vite
+- React
+- Chakra UI
+
+## Setup
+
+```sh
+git clone https://github.com/GPT-Engineer-App-Dev/piano-soundscape.git
+cd piano-soundscape
+npm i
+```
+
+```sh
+npm run dev
+```
+
+This will run a dev server with auto reloading and an instant preview.
+
+## Requirements
+
+- Node.js & npm - [install with nvm](https://github.com/nvm-sh/nvm#installing-and-updating)
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -0,0 +1,13 @@
+version: "2"
+services:
+  node:
+    image: "node:current"
+    user: "node"
+    working_dir: /home/node/app
+    environment:
+      - NODE_ENV=development
+    volumes:
+      - ./:/home/node/app
+    ports:
+      - "8080:8080"
+    command: "sh run.sh"
diff --git a/gpt-engineer.toml b/gpt-engineer.toml
@@ -0,0 +1,5 @@
+[run]
+build = "npm run build"
+
+[gptengineer-app]
+project_id = "..."
diff --git a/index.html b/index.html
@@ -0,0 +1,12 @@
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
+    <title>piano-soundscape</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="/src/main.jsx" type="module"></script>
+    <script src="/.gpt_engineer_internals/report-url-change.js" type="module"></script>
+  </body>
+</html>