@jskit-ai/create-app 0.1.2 → 0.1.6

package/templates/base-shell/scripts/verdaccio-reset-and-publish-packages.sh

@@ -0,0 +1,314 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+ROOT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")/.." && pwd)"
+DEFAULT_VERDACCIO_CONFIG="$ROOT_DIR/scripts/verdaccio/config.yaml"
+if [[ -f "$DEFAULT_VERDACCIO_CONFIG" ]]; then
+  VERDACCIO_CONFIG="${VERDACCIO_CONFIG:-$DEFAULT_VERDACCIO_CONFIG}"
+else
+  VERDACCIO_CONFIG="${VERDACCIO_CONFIG:-$HOME/.config/verdaccio/config.yaml}"
+fi
+VERDACCIO_LISTEN="${VERDACCIO_LISTEN:-127.0.0.1:4873}"
+VERDACCIO_REGISTRY="${VERDACCIO_REGISTRY:-http://$VERDACCIO_LISTEN}"
+VERDACCIO_REGISTRY="${VERDACCIO_REGISTRY%/}"
+VERDACCIO_LOG_FILE="${VERDACCIO_LOG_FILE:-/tmp/verdaccio-jskit.log}"
+VERDACCIO_PID_FILE="${VERDACCIO_PID_FILE:-/tmp/verdaccio-jskit.pid}"
+PUBLISH_CONCURRENCY="${PUBLISH_CONCURRENCY:-10}"
+JSKIT_REPO_ROOT="${JSKIT_REPO_ROOT:-}"
+PACKAGES_DIR="${PACKAGES_DIR:-}"
+TOOLING_DIR="${TOOLING_DIR:-}"
+
+is_valid_jskit_repo_root() {
+  local candidate_root="$1"
+  [[ -d "$candidate_root/packages" && -d "$candidate_root/packages/kernel" && -d "$candidate_root/tooling" ]]
+}
+
+resolve_jskit_repo_root() {
+  if [[ -n "$JSKIT_REPO_ROOT" ]]; then
+    echo "$JSKIT_REPO_ROOT"
+    return 0
+  fi
+
+  local current_dir="$ROOT_DIR"
+  while true; do
+    if is_valid_jskit_repo_root "$current_dir"; then
+      echo "$current_dir"
+      return 0
+    fi
+    if [[ "$current_dir" == "/" ]]; then
+      return 1
+    fi
+    current_dir="$(dirname "$current_dir")"
+  done
+}
+
+configure_source_dirs() {
+  if [[ -z "$PACKAGES_DIR" || -z "$TOOLING_DIR" ]]; then
+    local detected_root
+    detected_root="$(resolve_jskit_repo_root || true)"
+    if [[ -n "$detected_root" ]]; then
+      JSKIT_REPO_ROOT="$detected_root"
+      if [[ -z "$PACKAGES_DIR" ]]; then
+        PACKAGES_DIR="$JSKIT_REPO_ROOT/packages"
+      fi
+      if [[ -z "$TOOLING_DIR" ]]; then
+        TOOLING_DIR="$JSKIT_REPO_ROOT/tooling"
+      fi
+    fi
+  fi
+
+  if [[ -z "$PACKAGES_DIR" ]]; then
+    echo "Packages directory not configured." >&2
+    echo "Set PACKAGES_DIR directly, or set JSKIT_REPO_ROOT to a local jskit-ai checkout." >&2
+    exit 1
+  fi
+
+  if [[ -z "$TOOLING_DIR" ]]; then
+    TOOLING_DIR="/dev/null"
+  fi
+}
+
+resolve_storage_dir() {
+  if [[ -n "${VERDACCIO_STORAGE_DIR:-}" ]]; then
+    echo "$VERDACCIO_STORAGE_DIR"
+    return
+  fi
+
+  if [[ -f "$VERDACCIO_CONFIG" ]]; then
+    local configured_storage=""
+    configured_storage="$(sed -nE 's/^[[:space:]]*storage:[[:space:]]*([^#]+).*$/\1/p' "$VERDACCIO_CONFIG" | head -n 1 | xargs || true)"
+    if [[ -n "$configured_storage" ]]; then
+      if [[ "$configured_storage" = /* ]]; then
+        echo "$configured_storage"
+      else
+        echo "$(cd "$(dirname "$VERDACCIO_CONFIG")" && pwd)/$configured_storage"
+      fi
+      return
+    fi
+  fi
+
+  echo "$HOME/.local/share/verdaccio/storage"
+}
+
+stop_verdaccio() {
+  local listen_port
+  listen_port="${VERDACCIO_LISTEN##*:}"
+
+  if [[ -f "$VERDACCIO_PID_FILE" ]]; then
+    local pid
+    pid="$(cat "$VERDACCIO_PID_FILE" || true)"
+    if [[ -n "${pid:-}" ]] && kill -0 "$pid" 2>/dev/null; then
+      kill "$pid" || true
+    fi
+    rm -f "$VERDACCIO_PID_FILE"
+  fi
+
+  if command -v lsof >/dev/null 2>&1; then
+    local listener_pids
+    listener_pids="$(lsof -tiTCP:"$listen_port" -sTCP:LISTEN 2>/dev/null || true)"
+    if [[ -n "$listener_pids" ]]; then
+      for pid in $listener_pids; do
+        if [[ "$pid" != "$$" ]]; then
+          kill "$pid" >/dev/null 2>&1 || true
+        fi
+      done
+    fi
+
+    local attempts=0
+    while lsof -tiTCP:"$listen_port" -sTCP:LISTEN >/dev/null 2>&1; do
+      attempts=$((attempts + 1))
+      if (( attempts > 20 )); then
+        break
+      fi
+      sleep 0.25
+    done
+
+    listener_pids="$(lsof -tiTCP:"$listen_port" -sTCP:LISTEN 2>/dev/null || true)"
+    if [[ -n "$listener_pids" ]]; then
+      for pid in $listener_pids; do
+        if [[ "$pid" != "$$" ]]; then
+          kill -9 "$pid" >/dev/null 2>&1 || true
+        fi
+      done
+    fi
+  fi
+}
+
+start_verdaccio() {
+  local cmd=(npx --yes verdaccio --listen "$VERDACCIO_LISTEN")
+  local config_dir
+  config_dir="$(pwd)"
+  if [[ -f "$VERDACCIO_CONFIG" ]]; then
+    cmd+=(--config "$VERDACCIO_CONFIG")
+    config_dir="$(cd "$(dirname "$VERDACCIO_CONFIG")" && pwd)"
+  fi
+
+  (
+    cd "$config_dir"
+    nohup "${cmd[@]}" >"$VERDACCIO_LOG_FILE" 2>&1 &
+  )
+
+  local attempts=0
+  until curl -fsS "$VERDACCIO_REGISTRY/-/ping" >/dev/null 2>&1; do
+    attempts=$((attempts + 1))
+    if (( attempts > 60 )); then
+      echo "Verdaccio did not become ready at $VERDACCIO_REGISTRY within 60s." >&2
+      echo "See log: $VERDACCIO_LOG_FILE" >&2
+      exit 1
+    fi
+    sleep 1
+  done
+
+  local listen_port
+  listen_port="${VERDACCIO_LISTEN##*:}"
+  local listener_pid
+  listener_pid="$(lsof -tiTCP:"$listen_port" -sTCP:LISTEN 2>/dev/null | head -n 1 || true)"
+  if [[ -n "$listener_pid" ]]; then
+    echo "$listener_pid" >"$VERDACCIO_PID_FILE"
+  fi
+}
+
+publish_packages() {
+  if [[ ! -d "$PACKAGES_DIR" ]]; then
+    echo "Packages directory not found: $PACKAGES_DIR" >&2
+    echo "Set PACKAGES_DIR to your monorepo packages path, or set JSKIT_REPO_ROOT." >&2
+    exit 1
+  fi
+
+  local dirs=()
+  if [[ -d "$TOOLING_DIR" ]]; then
+    while IFS= read -r dir; do
+      if [[ ! -f "$dir/package.json" ]]; then
+        continue
+      fi
+      local package_name
+      package_name="$(cd "$dir" && node -p "require('./package.json').name || ''" 2>/dev/null || true)"
+      if [[ "$package_name" == @jskit-ai/* ]]; then
+        dirs+=("$dir")
+      fi
+    done < <(find "$TOOLING_DIR" -mindepth 1 -maxdepth 1 -type d | sort)
+  fi
+  while IFS= read -r dir; do
+    dirs+=("$dir")
+  done < <(find "$PACKAGES_DIR" -mindepth 1 -maxdepth 1 -type d | sort)
+
+  if (( ${#dirs[@]} > 1 )); then
+    local deduped=()
+    local seen=":"
+    for dir in "${dirs[@]}"; do
+      if [[ "$seen" != *":$dir:"* ]]; then
+        deduped+=("$dir")
+        seen="${seen}${dir}:"
+      fi
+    done
+    dirs=("${deduped[@]}")
+  fi
+
+  if (( ${#dirs[@]} == 0 )); then
+    echo "No package directories found under $PACKAGES_DIR" >&2
+    exit 1
+  fi
+
+  local npm_userconfig
+  local registry_with_slash
+  local verdaccio_auth_token
+  npm_userconfig="$(mktemp)"
+  registry_with_slash="${VERDACCIO_REGISTRY%/}/"
+  verdaccio_auth_token="${VERDACCIO_AUTH_TOKEN:-dev-local-token}"
+  printf "@jskit-ai:registry=%s\nregistry=%s\n//%s/:_authToken=%s\n" \
+    "$registry_with_slash" \
+    "$registry_with_slash" \
+    "${VERDACCIO_LISTEN}" \
+    "$verdaccio_auth_token" >"$npm_userconfig"
+
+  if [[ ! "$PUBLISH_CONCURRENCY" =~ ^[0-9]+$ ]] || (( PUBLISH_CONCURRENCY < 1 )); then
+    echo "PUBLISH_CONCURRENCY must be a positive integer (got: $PUBLISH_CONCURRENCY)." >&2
+    exit 1
+  fi
+
+  echo "Publishing with concurrency=$PUBLISH_CONCURRENCY"
+
+  publish_one_package() {
+    local dir="$1"
+    local npm_userconfig="$2"
+    if [[ ! -f "$dir/package.json" ]]; then
+      return 0
+    fi
+
+    local package_name
+    local publish_dir
+    package_name="$(cd "$dir" && node -p "require('./package.json').name || ''")"
+    echo "Publishing $package_name from $dir"
+
+    publish_dir="$(mktemp -d)"
+    (
+      cd "$dir"
+      tar --exclude='./node_modules' -cf - .
+    ) | (
+      cd "$publish_dir"
+      tar -xf -
+    )
+    node -e 'const fs=require("node:fs");const p=process.argv[1];const j=JSON.parse(fs.readFileSync(p,"utf8"));delete j.private;fs.writeFileSync(p,`${JSON.stringify(j,null,2)}\n`);' "$publish_dir/package.json"
+    (
+      cd "$publish_dir"
+      npm publish \
+        --registry "$VERDACCIO_REGISTRY" \
+        --access public \
+        --workspaces=false \
+        --userconfig "$npm_userconfig"
+    )
+    rm -rf "$publish_dir"
+  }
+
+  local running_jobs=0
+  local publish_failed=0
+  for dir in "${dirs[@]}"; do
+    publish_one_package "$dir" "$npm_userconfig" &
+    running_jobs=$((running_jobs + 1))
+
+    if (( running_jobs >= PUBLISH_CONCURRENCY )); then
+      if ! wait -n; then
+        publish_failed=1
+      fi
+      running_jobs=$((running_jobs - 1))
+    fi
+  done
+
+  while (( running_jobs > 0 )); do
+    if ! wait -n; then
+      publish_failed=1
+    fi
+    running_jobs=$((running_jobs - 1))
+  done
+
+  if (( publish_failed != 0 )); then
+    echo "One or more package publishes failed." >&2
+    exit 1
+  fi
+
+  rm -f "$npm_userconfig"
+}
+
+main() {
+  configure_source_dirs
+
+  local storage_dir
+  storage_dir="$(resolve_storage_dir)"
+
+  echo "Stopping Verdaccio..."
+  stop_verdaccio
+
+  echo "Clearing Verdaccio storage: $storage_dir"
+  rm -rf "$storage_dir"
+  mkdir -p "$storage_dir"
+
+  echo "Starting Verdaccio at $VERDACCIO_REGISTRY..."
+  start_verdaccio
+
+  echo "Publishing packages from $PACKAGES_DIR and tooling in $TOOLING_DIR..."
+  publish_packages
+
+  echo "Done. Verdaccio is running at $VERDACCIO_REGISTRY"
+}
+
+main "$@"

package/templates/base-shell/server/lib/runtimeEnv.js

@@ -1,3 +1,8 @@
+import { createRequire } from "node:module";
+import { surfaceRuntime } from "./surfaceRuntime.js";
+
+const require = createRequire(import.meta.url);
+
 function toPort(value, fallback = 3000) {
   const parsed = Number.parseInt(String(value || "").trim(), 10);
   if (Number.isInteger(parsed) && parsed > 0) {
@@ -6,8 +11,32 @@ function toPort(value, fallback = 3000) {
   return fallback;
 }
 
+let envLoaded = false;
+
+function ensureRuntimeEnvLoaded() {
+  if (envLoaded) {
+    return;
+  }
+  try {
+    const dotenvModule = require("dotenv");
+    const loadDotEnv = dotenvModule?.config;
+    if (typeof loadDotEnv === "function") {
+      loadDotEnv();
+    }
+  } catch {
+    // dotenv is optional in base-shell; bundles can add it when needed.
+  }
+  envLoaded = true;
+}
+
 function resolveRuntimeEnv() {
+  ensureRuntimeEnvLoaded();
+  const serverSurface = surfaceRuntime.normalizeSurfaceMode(
+    process.env.JSKIT_SERVER_SURFACE || process.env.SERVER_SURFACE
+  );
   return {
+    ...process.env,
+    SERVER_SURFACE: serverSurface,
     PORT: toPort(process.env.PORT, 3000),
     HOST: String(process.env.HOST || "").trim() || "0.0.0.0"
   };

package/templates/base-shell/server/lib/surfaceRuntime.js

@@ -0,0 +1,10 @@
+import { createSurfaceRuntime } from "@jskit-ai/kernel/shared/surface/runtime";
+import { config } from "../../config/public.js";
+
+const surfaceRuntime = createSurfaceRuntime({
+  allMode: config.surfaceModeAll,
+  surfaces: config.surfaceDefinitions,
+  defaultSurfaceId: config.surfaceDefaultId
+});
+
+export { surfaceRuntime };

package/templates/base-shell/server.js

@@ -1,86 +1,57 @@
 import Fastify from "fastify";
+import { TypeBoxValidatorCompiler } from "@fastify/type-provider-typebox";
+import { registerTypeBoxFormats } from "@jskit-ai/http-runtime/shared/validators/typeboxFormats";
 import { resolveRuntimeEnv } from "./server/lib/runtimeEnv.js";
-import { registerApiRouteDefinitions } from "@jskit-ai/server-runtime-core/apiRouteRegistration";
-import { createServerRuntimeFromApp, applyContributedRuntimeLifecycle } from "@jskit-ai/server-runtime-core/serverContributions";
 import path from "node:path";
+import {
+  registerSurfaceRequestConstraint,
+  resolveRuntimeProfileFromSurface,
+  tryCreateProviderRuntimeFromApp
+} from "@jskit-ai/kernel/server/platform";
+import { surfaceRuntime } from "./server/lib/surfaceRuntime.js";
 
-function registerFallbackHealthRoute(app) {
-  app.get("/api/v1/health", async () => {
+async function createServer() {
+  const app = Fastify({ logger: true });
+  registerTypeBoxFormats();
+  app.setValidatorCompiler(TypeBoxValidatorCompiler);
+
+  app.get("/api/health", async () => {
     return {
       ok: true,
       app: "__APP_NAME__"
     };
   });
-}
-
-async function registerContributedRuntime(app, { appRoot, runtimeEnv }) {
-  try {
-    const composed = await createServerRuntimeFromApp({
-      appRoot,
-      strict: false,
-      dependencies: {
-        env: runtimeEnv,
-        logger: app.log
-      },
-      routeConfig: {}
-    });
-
-    const routeCount = Array.isArray(composed.routes) ? composed.routes.length : 0;
-    if (routeCount > 0) {
-      registerApiRouteDefinitions(app, {
-        routes: composed.routes
-      });
-    }
+  const runtimeEnv = resolveRuntimeEnv();
+  const appRoot = path.resolve(process.cwd());
+  const runtime = await tryCreateProviderRuntimeFromApp({
+    appRoot,
+    profile: resolveRuntimeProfileFromSurface({
+      surfaceRuntime,
+      serverSurface: runtimeEnv.SERVER_SURFACE,
+      defaultProfile: "app"
+    }),
+    env: runtimeEnv,
+    logger: app.log,
+    fastify: app
+  });
 
-    const lifecycleResult = await applyContributedRuntimeLifecycle({
-      app,
-      runtimeResult: composed,
-      dependencies: {
-        env: runtimeEnv,
-        logger: app.log
-      }
-    });
+  registerSurfaceRequestConstraint({
+    fastify: app,
+    surfaceRuntime,
+    serverSurface: runtimeEnv.SERVER_SURFACE,
+    globalUiPaths: runtime?.globalUiPaths || []
+  });
 
+  if (runtime) {
     app.log.info(
       {
-        routeCount,
-        pluginCount: lifecycleResult.pluginCount,
-        workerCount: lifecycleResult.workerCount,
-        onBootCount: lifecycleResult.onBootCount,
-        packageOrder: composed.packageOrder
+        routeCount: runtime.routeCount,
+        surface: surfaceRuntime.normalizeSurfaceMode(runtimeEnv.SERVER_SURFACE),
+        providerPackages: runtime.providerPackageOrder,
+        packageOrder: runtime.packageOrder
       },
-      "Registered JSKIT contributed server runtime."
+      "Registered JSKIT provider server runtime."
     );
-
-    return {
-      enabled: true,
-      routeCount,
-      pluginCount: lifecycleResult.pluginCount,
-      workerCount: lifecycleResult.workerCount,
-      onBootCount: lifecycleResult.onBootCount
-    };
-  } catch (error) {
-    const message = String(error?.message || "");
-    if (message.includes("Lock file not found:")) {
-      return {
-        enabled: false,
-        routeCount: 0
-      };
-    }
-    throw error;
-  }
-}
-
-async function createServer() {
-  const app = Fastify({ logger: true });
-  const runtimeEnv = resolveRuntimeEnv();
-  const appRoot = path.resolve(process.cwd());
-  const contributed = await registerContributedRuntime(app, {
-    appRoot,
-    runtimeEnv
-  });
-  if (!contributed.enabled || contributed.routeCount < 1) {
-    registerFallbackHealthRoute(app);
   }
 
   return app;

package/templates/base-shell/src/App.vue

@@ -1,24 +1,13 @@
-<script setup>
-import { onMounted, ref } from "vue";
-
-const appTitle = "__APP_TITLE__";
-const health = ref("loading...");
-
-onMounted(async () => {
-  try {
-    const response = await fetch("/api/v1/health");
-    const payload = await response.json();
-    health.value = payload?.ok ? "ok" : "unhealthy";
-  } catch {
-    health.value = "unreachable";
-  }
-});
-</script>
-
 <template>
-  <main style="font-family: sans-serif; max-width: 48rem; margin: 3rem auto; padding: 0 1rem;">
-    <h1>{{ appTitle }}</h1>
-    <p>Minimal starter shell is running.</p>
-    <p><strong>Health:</strong> {{ health }}</p>
-  </main>
+  <v-app>
+    <v-main>
+      <v-container class="py-10 py-md-14">
+        <v-row justify="center">
+          <v-col cols="12" sm="11" md="10" lg="8" xl="7">
+            <RouterView />
+          </v-col>
+        </v-row>
+      </v-container>
+    </v-main>
+  </v-app>
 </template>

package/templates/base-shell/src/main.js

@@ -1,4 +1,90 @@
 import { createApp } from "vue";
+import { createRouter, createWebHistory } from "vue-router/auto";
+import { routes } from "vue-router/auto-routes";
+import "vuetify/styles";
+import { createVuetify } from "vuetify";
+import * as components from "vuetify/components";
+import * as directives from "vuetify/directives";
+import { aliases as mdiAliases, mdi } from "vuetify/iconsets/mdi-svg";
 import App from "./App.vue";
+import NotFoundView from "./views/NotFound.vue";
+import { bootInstalledClientModules } from "virtual:jskit-client-bootstrap";
+import { createSurfaceRuntime } from "@jskit-ai/kernel/shared/surface/runtime";
+import {
+  bootstrapClientShellApp,
+  createShellRouter
+} from "@jskit-ai/kernel/client";
+import { config } from "../config/public.js";
 
-createApp(App).mount("#app");
+const surfaceRuntime = createSurfaceRuntime({
+  allMode: config.surfaceModeAll,
+  surfaces: config.surfaceDefinitions,
+  defaultSurfaceId: config.surfaceDefaultId
+});
+
+const surfaceMode = surfaceRuntime.normalizeSurfaceMode(import.meta.env.VITE_SURFACE);
+const { router, fallbackRoute } = createShellRouter({
+  createRouter,
+  history: createWebHistory(),
+  routes,
+  surfaceRuntime,
+  surfaceMode,
+  notFoundComponent: NotFoundView,
+  guard: {
+    surfaceDefinitions: config.surfaceDefinitions,
+    defaultSurfaceId: config.surfaceDefaultId,
+    webRootAllowed: config.webRootAllowed
+  }
+});
+
+const vuetify = createVuetify({
+  components,
+  directives,
+  theme: {
+    defaultTheme: "light",
+    themes: {
+      light: {
+        colors: {
+          primary: "#0f6b54",
+          secondary: "#3f5150",
+          background: "#eef3ee",
+          surface: "#f7fbf6",
+          "surface-variant": "#dfe8df",
+          "on-surface-variant": "#3b4c44",
+          error: "#9f1d1d"
+        }
+      },
+      dark: {
+        colors: {
+          primary: "#6fd0b5",
+          secondary: "#9db2af",
+          background: "#0f1715",
+          surface: "#16211e",
+          "surface-variant": "#253430",
+          "on-surface-variant": "#c5d6d2",
+          error: "#ffb4ab"
+        }
+      }
+    }
+  },
+  icons: {
+    defaultSet: "mdi",
+    aliases: mdiAliases,
+    sets: { mdi }
+  }
+});
+
+void bootstrapClientShellApp({
+  createApp,
+  rootComponent: App,
+  appConfig: config,
+  appPlugins: [vuetify],
+  router,
+  bootClientModules: bootInstalledClientModules,
+  surfaceRuntime,
+  surfaceMode,
+  env: import.meta.env,
+  fallbackRoute
+}).catch((error) => {
+  console.error("Failed to bootstrap client app.", error);
+});

package/templates/base-shell/src/pages/console/index.vue

@@ -0,0 +1,12 @@
+<template>
+  <v-card class="mx-auto" max-width="960" rounded="xl" border elevation="1">
+    <v-card-item class="px-6 py-5 px-md-8 py-md-7">
+      <v-card-title class="text-h4">console</v-card-title>
+      <v-card-subtitle class="text-subtitle-1 mt-2">operations surface</v-card-subtitle>
+    </v-card-item>
+    <v-divider />
+    <v-card-text class="px-6 py-5 px-md-8 py-md-7 text-body-1 text-medium-emphasis">
+      This surface is intended for operational tooling.
+    </v-card-text>
+  </v-card>
+</template>

package/templates/base-shell/src/pages/console.vue

@@ -0,0 +1,13 @@
+<route lang="json">
+{
+  "meta": {
+    "jskit": {
+      "surface": "console"
+    }
+  }
+}
+</route>
+
+<template>
+  <RouterView />
+</template>

package/templates/base-shell/src/pages/home/index.vue

@@ -0,0 +1,12 @@
+<template>
+  <v-card class="mx-auto" max-width="960" rounded="xl" border elevation="1">
+    <v-card-item class="px-6 py-5 px-md-8 py-md-7">
+      <v-card-title class="text-h4">welcome</v-card-title>
+      <v-card-subtitle class="text-subtitle-1 mt-2">starter app</v-card-subtitle>
+    </v-card-item>
+    <v-divider />
+    <v-card-text class="px-6 py-5 px-md-8 py-md-7 text-body-1 text-medium-emphasis">
+      Start by adding packages and pages to this app.
+    </v-card-text>
+  </v-card>
+</template>

package/templates/base-shell/src/pages/home.vue

@@ -0,0 +1,13 @@
+<route lang="json">
+{
+  "meta": {
+    "jskit": {
+      "surface": "home"
+    }
+  }
+}
+</route>
+
+<template>
+  <RouterView />
+</template>

package/templates/base-shell/src/views/NotFound.vue

@@ -0,0 +1,13 @@
+<script setup>
+const title = "Not Found";
+const message = "The page you requested does not exist.";
+</script>
+
+<template>
+  <v-container class="fill-height d-flex align-center justify-center">
+    <v-card class="pa-6 text-center" max-width="560" rounded="lg">
+      <v-card-title class="text-h4">{{ title }}</v-card-title>
+      <v-card-text class="text-medium-emphasis">{{ message }}</v-card-text>
+    </v-card>
+  </v-container>
+</template>