Initial boilerplate scaffold for continuum-app

apps/web/pages/index.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { PrinterCard } from "@continuum/ui";
+import { useTelemetryStore } from "~/stores/telemetry";
+
+const telemetry = useTelemetryStore();
+const config = useRuntimeConfig();
+
+const { data: printers } = await useFetch(`${config.public.apiBase}/printers`, {
+  headers: useRequestHeaders(["cookie"]),
+});
+</script>
+
+<template>
+  <div class="fleet">
+    <h1>Fleet overview</h1>
+    <div class="fleet__grid">
+      <PrinterCard
+        v-for="printer in printers ?? []"
+        :key="printer.id"
+        :printer="printer"
+        :live="telemetry.printers[printer.id]"
+      />
+    </div>
+    <p v-if="!printers?.length">No printers registered yet.</p>
+  </div>
+</template>
+
+<style scoped>
+.fleet__grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+  gap: 1rem;
+  margin-top: 1rem;
+}
+</style>

apps/web/pages/login.vue

@@ -0,0 +1,42 @@
+<script setup lang="ts">
+const email = ref("");
+const sent = ref(false);
+const error = ref<string | null>(null);
+const client = useSupabaseClient();
+
+async function sendMagicLink() {
+  error.value = null;
+  const { error: authError } = await client.auth.signInWithOtp({ email: email.value });
+  if (authError) {
+    error.value = authError.message;
+    return;
+  }
+  sent.value = true;
+}
+</script>
+
+<template>
+  <div class="login">
+    <h1>Sign in to Continuum</h1>
+    <form v-if="!sent" @submit.prevent="sendMagicLink">
+      <input v-model="email" type="email" placeholder="you@farm.com" required />
+      <button type="submit">Send magic link</button>
+    </form>
+    <p v-else>Check your inbox for a sign-in link.</p>
+    <p v-if="error" class="login__error">{{ error }}</p>
+  </div>
+</template>
+
+<style scoped>
+.login {
+  max-width: 320px;
+  margin: 4rem auto;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.login__error {
+  color: #f2604c;
+}
+</style>