Started working on WaspAi web app.

wasp-ai/.gitignore

@@ -0,0 +1,3 @@
+/.wasp/
+/.env.server
+/.env.client

wasp-ai/.wasproot

@@ -0,0 +1 @@
+File marking the root of Wasp project.

wasp-ai/main.wasp

@@ -0,0 +1,11 @@
+app waspAi {
+  wasp: {
+    version: "^0.10.6"
+  },
+  title: "wasp-ai"
+}
+
+route RootRoute { path: "/", to: MainPage }
+page MainPage {
+  component: import Main from "@client/MainPage.jsx"
+}

wasp-ai/src/.waspignore

@@ -0,0 +1,3 @@
+# Ignore editor tmp files
+**/*~
+**/#*#

wasp-ai/src/client/Main.css

@@ -0,0 +1,89 @@
+* {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
+    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
+    sans-serif;
+}
+
+.container {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+main {
+  padding: 5rem 0;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+main p {
+  font-size: 1.2rem;
+}
+
+.logo {
+  margin-bottom: 2rem;
+}
+
+.logo img {
+  max-height: 200px;
+}
+
+.welcome-title {
+  font-weight: 500;
+}
+
+.welcome-subtitle {
+  font-weight: 400;
+  margin-bottom: 3rem;
+}
+
+.buttons {
+  display: flex;
+  flex-direction: row;
+}
+
+.buttons .button:not(:last-child) {
+  margin-right: 0.5rem;
+}
+
+.button {
+  border-radius: 3px;
+  font-size: 1.2rem;
+  padding: 1rem 2rem;
+  text-align: center;
+  font-weight: 700;
+  text-decoration: none;
+}
+
+.button-filled {
+  border: 2px solid #bf9900;
+  background-color: #bf9900;
+  color: #f4f4f4;
+}
+
+.button-outline {
+  border: 2px solid #8a9cff;
+  color: #8a9cff;
+  background-color: none;
+}
+
+code {
+  border-radius: 5px;
+  padding: 0.2rem;
+  background: #efefef;
+  font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
+    Bitstream Vera Sans Mono, Courier New, monospace;
+}

wasp-ai/src/client/MainPage.jsx

@@ -0,0 +1,72 @@
+import waspLogo from './waspLogo.png'
+import './Main.css'
+import { useState } from 'react'
+
+const MainPage = () => {
+  const [appName, setAppName] = useState('')
+  const [appDesc, setAppDesc] = useState('')
+  const [inputDisabled, setInputDisabled] = useState(false)
+
+  const fillInExampleAppDetails = () => {
+    setAppName('TodoApp')
+    setAppDesc('A simple todo app with one main page that lists all the tasks. I can create new tasks, or toggle existing ones.'
+     + 'User owns tasks. User can only see and edit their own tasks. Tasks are saved in the database.')
+  }
+
+  const generate = () => {
+    if (!(appName && appDesc)) {
+      return window.alert('Please enter an app name and description.')
+    }
+    setInputDisabled(true)
+    window.alert('Generating app. This may take a while. Please wait.')
+    // Idea #1:
+    //   We could use websockets -> we first send the message to start generating the app, then we pick up messages from the server.
+    //   We would need to identify this specific client probably, so that the server knows whom to send messages to.
+    //   We could do that by sending some unique UUID we generate on client for new request, and server would send that UUID back.
+    //   But wait, then all the clients can see those messages coming?
+    //   I think we need to be able to open a websocket room that only our client and server see.
+    // Idea #2:
+    //   We use action to start the generation, and it runs as long as generation runs.
+    //   It stores the results of generation into the local variable, under the UUID specific for this generation.
+    //   We can then use another action, that we call regularly (every second) from client, to get the results of generation, and we can use the UUID to get the results.
+    //   It would need to be smart about how to correctly consume piece of the results, but I think we can handle that.
+  }
+
+  return (
+    <div className="container">
+      <main>
+        <div className="logo">
+          <img src={waspLogo} alt="wasp" />
+        </div>
+        <p>
+          Wasp AI App Generator
+        </p>
+        
+        <div>
+          <input
+            type="text"
+            placeholder="AppName"
+            value={appName}
+            onChange={(e) => setAppName(e.target.value)}
+            disabled={inputDisabled}
+          />
+        </div>
+
+        <div>
+          <textarea
+            placeholder="App description"
+            value={appDesc}
+            rows="5"
+            cols="50"
+            onChange={(e) => setAppDesc(e.target.value)}
+            disabled={inputDisabled}
+          />
+        </div>
+
+        <button disabled={inputDisabled} onClick={() => fillInExampleAppDetails()}>Fill in with example app details</button>
+        <button onClick={() => generate()}>Generate</button>
+      </main>
+    </div>
+  )
+}
+export default MainPage

wasp-ai/src/client/tsconfig.json

@@ -0,0 +1,55 @@
+// =============================== IMPORTANT =================================
+//
+// This file is only used for Wasp IDE support. You can change it to configure
+// your IDE checks, but none of these options will affect the TypeScript
+// compiler. Proper TS compiler configuration in Wasp is coming soon :)
+{
+  "compilerOptions": {
+    // JSX support
+    "jsx": "preserve",
+    "strict": true,
+    // Allow default imports.
+    "esModuleInterop": true,
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    // Wasp needs the following settings enable IDE support in your source
+    // files. Editing them might break features like import autocompletion and
+    // definition lookup. Don't change them unless you know what you're doing.
+    //
+    // The relative path to the generated web app's root directory. This must be
+    // set to define the "paths" option.
+    "baseUrl": "../../.wasp/out/web-app/",
+    "paths": {
+      // Resolve all "@wasp" imports to the generated source code.
+      "@wasp/*": [
+        "src/*"
+      ],
+      // Resolve all non-relative imports to the correct node module. Source:
+      // https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping
+      "*": [
+        // Start by looking for the definiton inside the node modules root
+        // directory...
+        "node_modules/*",
+        // ... If that fails, try to find it inside definitely-typed type
+        // definitions.
+        "node_modules/@types/*"
+      ]
+    },
+    // Correctly resolve types: https://www.typescriptlang.org/tsconfig#typeRoots
+    "typeRoots": [
+      "../../.wasp/out/web-app/node_modules/@types"
+    ],
+    // Since this TS config is used only for IDE support and not for
+    // compilation, the following directory doesn't exist. We need to specify
+    // it to prevent this error:
+    // https://stackoverflow.com/questions/42609768/typescript-error-cannot-write-file-because-it-would-overwrite-input-file
+    "outDir": "phantom"
+  },
+  "exclude": [
+    "phantom"
+  ],
+}

wasp-ai/src/client/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="../../.wasp/out/web-app/node_modules/vite/client" />

wasp-ai/src/server/tsconfig.json

@@ -0,0 +1,48 @@
+// =============================== IMPORTANT =================================
+//
+// This file is only used for Wasp IDE support. You can change it to configure
+// your IDE checks, but none of these options will affect the TypeScript
+// compiler. Proper TS compiler configuration in Wasp is coming soon :)
+{
+  "compilerOptions": {
+    // Allows default imports.
+    "esModuleInterop": true,
+    "allowJs": true,
+    "strict": true,
+    // Wasp needs the following settings enable IDE support in your source
+    // files. Editing them might break features like import autocompletion and
+    // definition lookup. Don't change them unless you know what you're doing.
+    //
+    // The relative path to the generated web app's root directory. This must be
+    // set to define the "paths" option.
+    "baseUrl": "../../.wasp/out/server/",
+    "paths": {
+      // Resolve all "@wasp" imports to the generated source code.
+      "@wasp/*": [
+        "src/*"
+      ],
+      // Resolve all non-relative imports to the correct node module. Source:
+      // https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping
+      "*": [
+        // Start by looking for the definiton inside the node modules root
+        // directory...
+        "node_modules/*",
+        // ... If that fails, try to find it inside definitely-typed type
+        // definitions.
+        "node_modules/@types/*"
+      ]
+    },
+    // Correctly resolve types: https://www.typescriptlang.org/tsconfig#typeRoots
+    "typeRoots": [
+      "../../.wasp/out/server/node_modules/@types"
+    ],
+    // Since this TS config is used only for IDE support and not for
+    // compilation, the following directory doesn't exist. We need to specify
+    // it to prevent this error:
+    // https://stackoverflow.com/questions/42609768/typescript-error-cannot-write-file-because-it-would-overwrite-input-file
+    "outDir": "phantom",
+  },
+  "exclude": [
+    "phantom"
+  ],
+}

wasp-ai/src/shared/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    // Enable default imports in TypeScript.
+    "esModuleInterop": true,
+    "allowJs": true,
+    // The following settings enable IDE support in user-provided source files. 
+    // Editing them might break features like import autocompletion and
+    // definition lookup. Don't change them unless you know what you're doing.
+    //
+    // The relative path to the generated web app's root directory. This must be
+    // set to define the "paths" option.
+    "baseUrl": "../../.wasp/out/server/",
+    "paths": {
+      // Resolve all non-relative imports to the correct node module. Source:
+      // https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping
+      "*": [
+        // Start by looking for the definiton inside the node modules root
+        // directory...
+        "node_modules/*",
+        // ... If that fails, try to find it inside definitely-typed type
+        // definitions.
+        "node_modules/@types/*"
+      ]
+    },
+    // Correctly resolve types: https://www.typescriptlang.org/tsconfig#typeRoots
+    "typeRoots": ["../../.wasp/out/server/node_modules/@types"]
+  }
+}