initial commit

ui/.gitignore

@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example

ui/README.md

@@ -0,0 +1,75 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

ui/app.vue

@@ -0,0 +1,5 @@
+<template>
+    <div>
+        <NuxtPage />
+    </div>
+</template>

ui/assets/css/main.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

ui/components/Nav.vue

@@ -0,0 +1,2 @@
+<template>
+</template>

ui/embed.go

@@ -0,0 +1,14 @@
+// Package ui handles the frontend embedding
+package ui
+
+import (
+	"embed"
+
+	"github.com/labstack/echo/v4"
+)
+
+//go:embed all:.output/public
+var distDir embed.FS
+
+// DistDirFS contains the embedded dist directory files (without the "dist" prefix)
+var DistDirFS = echo.MustSubFS(distDir, ".output/public")

ui/nuxt.config.ts

@@ -0,0 +1,25 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+    compatibilityDate: '2024-04-03',
+
+    css: ['~/assets/css/main.css'],
+
+    ssr: true,
+
+    modules: [
+        '@nuxtjs/color-mode',
+    ],
+
+    colorMode: {
+        classSuffix: ''
+    },
+
+    devtools: { enabled: true },
+
+    postcss: {
+        plugins: {
+            tailwindcss: {},
+            autoprefixer: {},
+        },
+    },
+})

ui/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "@nuxtjs/color-mode": "^3.4.4",
+    "nuxt": "^3.13.0",
+    "vue": "latest"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.4.20",
+    "postcss": "^8.4.44",
+    "tailwindcss": "^3.4.10"
+  }
+}

ui/pages/home.vue

@@ -0,0 +1,12 @@
+<template>
+    <div>
+        <Nav />
+        WOAH IS THAT FRICKING SCOTT THE WOZ DUDE
+    </div>
+</template>
+
+<script lang="ts" setup>
+
+</script>
+
+<style></style>

ui/pages/index.vue

@@ -0,0 +1,11 @@
+<template>
+    <div>
+        OMG IS THAT SCOTT THE WOZ?!?!?!?!?!?!??!?!??!?!?!?!?!?!?
+    </div>
+</template>
+
+<script lang="ts" setup>
+
+</script>
+
+<style></style>

ui/pages/login.vue

@@ -0,0 +1,38 @@
+<script setup>
+console.log(useCookie("sessionToken").value)
+
+if (useCookie("sessionToken").value) {
+    await navigateTo('/')
+}
+
+let email = ref('')
+let password = ref('')
+
+const submitForm = async () => {
+    await useFetch('/api/login', {
+        method: 'POST',
+        body: {
+            "email": email.value,
+            "password": password.value,
+        }
+    })
+
+    await navigateTo('/')
+}
+</script>
+
+<template>
+    <div class="min-h-screen min-w-screen grid place-content-center">
+        <div class="flex flex-col max-w-72 w-full text-center">
+            <input
+                class="py-2 px-4 resize-none rounded-md my-2 border-gray-200 dark:border-dark-gray-800 focus:border-gray-300 dark:focus:border-dark-gray-800 border focus:outline-none placeholder:italic placeholder:text-slate-500 dark:placeholder:text-gray-300"
+                v-model="email" type="email" placeholder="Email..." />
+            <input
+                class="py-2 px-4 resize-none rounded-md my-2 border-gray-200 dark:border-dark-gray-800 focus:border-gray-300 dark:focus:border-dark-gray-800 border focus:outline-none placeholder:italic placeholder:text-slate-500 dark:placeholder:text-gray-300"
+                v-model="password" type="password" placeholder="Password..." />
+            <button @click="submitForm" class="py-2 px-4 bg-blue-500 text-white rounded-md">Login</button>
+            <p>Or <NuxtLink to="/signup" class="text-pink-600">Sign up</NuxtLink>
+            </p>
+        </div>
+    </div>
+</template>

ui/pages/signup.vue

@@ -0,0 +1,36 @@
+<script setup>
+if (useCookie("sessionToken").value) {
+    await navigateTo('/')
+}
+
+let email = ref('')
+let password = ref('')
+
+const submitForm = async () => {
+    await useFetch('/api/signup', {
+        method: 'POST',
+        body: {
+            "email": email.value,
+            "password": password.value,
+        }
+    })
+
+    await navigateTo('/')
+}
+</script>
+
+<template>
+    <div class="min-h-screen min-w-screen grid place-content-center">
+        <div class="flex flex-col max-w-72 w-full text-center">
+            <input
+                class="py-2 px-4 resize-none rounded-md my-2 border-gray-200 dark:border-dark-gray-800 focus:border-gray-300 dark:focus:border-dark-gray-800 border focus:outline-none placeholder:italic placeholder:text-slate-500 dark:placeholder:text-gray-300"
+                v-model="email" type="email" placeholder="Email..." />
+            <input
+                class="py-2 px-4 resize-none rounded-md my-2 border-gray-200 dark:border-dark-gray-800 focus:border-gray-300 dark:focus:border-dark-gray-800 border focus:outline-none placeholder:italic placeholder:text-slate-500 dark:placeholder:text-gray-300"
+                v-model="password" type="password" placeholder="Password..." />
+            <button @click="submitForm" class="py-2 px-4 bg-blue-500 text-white rounded-md">Signup</button>
+            <p>Or <NuxtLink to="/login" class="text-pink-600">Log in</NuxtLink>
+            </p>
+        </div>
+    </div>
+</template>

ui/public/robots.txt

@@ -0,0 +1 @@
+

ui/tailwind.config.js

@@ -0,0 +1,15 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./components/**/*.{js,vue,ts}",
+    "./layouts/**/*.vue",
+    "./pages/**/*.vue",
+    "./plugins/**/*.{js,ts}",
+    "./app.vue",
+    "./error.vue",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+};

ui/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "extends": "./.nuxt/tsconfig.json"
+}