nuxt-observe 0.0.2

package/dist/runtime/app/components/settings/ObserveServiceEditForm.d.vue.ts

@@ -0,0 +1,38 @@
+import { type ServiceDetail, type GroupListItem } from '../../../shared/schema/provisioning.js';
+/**
+ * Edit form for an existing service. Emits a ServiceUpdate patch; the parent performs the
+ * PATCH + refresh. When the service is config-managed, config-owned fields are read-only
+ * (they reconcile on reboot regardless of a UI edit).
+ */
+type __VLS_Props = {
+    service: ServiceDetail;
+    groups: GroupListItem[];
+    canManage: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    save: (patch: {
+        name?: string | undefined;
+        type?: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile" | undefined;
+        kind?: "server" | "browser" | undefined;
+        appNames?: string[] | undefined;
+        allowedOrigins?: string[] | undefined;
+        env?: string | null | undefined;
+        groupId?: string | null | undefined;
+        versionTracking?: boolean | undefined;
+        currentVersion?: string | null | undefined;
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSave?: ((patch: {
+        name?: string | undefined;
+        type?: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile" | undefined;
+        kind?: "server" | "browser" | undefined;
+        appNames?: string[] | undefined;
+        allowedOrigins?: string[] | undefined;
+        env?: string | null | undefined;
+        groupId?: string | null | undefined;
+        versionTracking?: boolean | undefined;
+        currentVersion?: string | null | undefined;
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveServiceEditForm.vue

@@ -0,0 +1,216 @@
+<script setup>
+import { reactive, ref, computed, watch } from "vue";
+import {
+  SERVICE_TYPES,
+  SERVICE_TYPE_META
+} from "../../../shared/schema/provisioning";
+const props = defineProps({
+  service: { type: Object, required: true },
+  groups: { type: Array, required: true },
+  canManage: { type: Boolean, required: true }
+});
+const emit = defineEmits(["save"]);
+const managed = computed(() => props.service.managedByConfig);
+const state = reactive({
+  name: props.service.name,
+  type: props.service.type,
+  kind: props.service.kind,
+  appNames: props.service.appNames.length ? [...props.service.appNames] : [""],
+  allowedOrigins: [...props.service.allowedOrigins],
+  env: props.service.env ?? "",
+  groupId: props.service.groupId,
+  versionTracking: props.service.versionTracking
+});
+const currentVersion = ref(props.service.currentVersion);
+watch(() => props.service, (s) => {
+  state.name = s.name;
+  state.type = s.type;
+  state.kind = s.kind;
+  state.appNames = s.appNames.length ? [...s.appNames] : [""];
+  state.allowedOrigins = [...s.allowedOrigins];
+  state.env = s.env ?? "";
+  state.groupId = s.groupId;
+  state.versionTracking = s.versionTracking;
+  currentVersion.value = s.currentVersion;
+});
+const typeItems = SERVICE_TYPES.map((t) => ({ value: t, label: SERVICE_TYPE_META[t].label, icon: SERVICE_TYPE_META[t].icon }));
+const kindItems = [
+  { value: "server", label: "Server" },
+  { value: "browser", label: "Browser" }
+];
+const groupItems = computed(() => [
+  { value: null, label: "No group" },
+  ...props.groups.map((g) => ({ value: g.id, label: g.name }))
+]);
+function addAppName() {
+  state.appNames.push("");
+}
+function updateAppName(i, v) {
+  state.appNames[i] = v;
+}
+function removeAppName(i) {
+  state.appNames.splice(i, 1);
+}
+function save() {
+  const patch = {
+    name: state.name.trim(),
+    type: state.type,
+    kind: state.kind,
+    appNames: state.appNames.map((a) => a.trim()).filter(Boolean),
+    allowedOrigins: state.kind === "browser" ? state.allowedOrigins.map((o) => o.trim()).filter(Boolean) : [],
+    env: state.env.trim() || null,
+    groupId: state.groupId,
+    versionTracking: state.versionTracking,
+    currentVersion: state.versionTracking ? currentVersion.value : null
+  };
+  emit("save", patch);
+}
+</script>
+
+<template>
+  <div class="space-y-4">
+    <UAlert
+      v-if="managed"
+      color="info"
+      variant="subtle"
+      icon="i-lucide-info"
+      title="Managed by config"
+      description="This service is declared in observe.services. App names, origins, type and kind reconcile to config on every reboot."
+    />
+
+    <UFormField
+      label="Name"
+      name="name"
+    >
+      <UInput
+        v-model="state.name"
+        :disabled="!canManage"
+      />
+    </UFormField>
+
+    <div class="grid grid-cols-2 gap-3">
+      <UFormField
+        label="Type"
+        name="type"
+      >
+        <USelectMenu
+          v-model="state.type"
+          :items="typeItems"
+          value-key="value"
+          :search-input="false"
+          :disabled="!canManage || managed"
+        />
+      </UFormField>
+      <UFormField
+        label="Kind"
+        name="kind"
+      >
+        <USelectMenu
+          v-model="state.kind"
+          :items="kindItems"
+          value-key="value"
+          :search-input="false"
+          :disabled="!canManage || managed"
+        />
+      </UFormField>
+    </div>
+
+    <UFormField
+      label="App names"
+      name="appNames"
+    >
+      <div class="space-y-2">
+        <div
+          v-for="(app, i) in state.appNames"
+          :key="i"
+          class="flex items-center gap-2"
+        >
+          <UInput
+            :model-value="app"
+            class="flex-1"
+            :disabled="!canManage || managed"
+            @update:model-value="updateAppName(i, String($event))"
+          />
+          <UButton
+            icon="i-lucide-x"
+            color="neutral"
+            variant="ghost"
+            :disabled="!canManage || managed || state.appNames.length === 1"
+            aria-label="Remove app name"
+            @click="removeAppName(i)"
+          />
+        </div>
+        <UButton
+          v-if="canManage && !managed"
+          icon="i-lucide-plus"
+          color="neutral"
+          variant="subtle"
+          size="sm"
+          label="Add app name"
+          @click="addAppName"
+        />
+      </div>
+    </UFormField>
+
+    <UFormField
+      v-if="state.kind === 'browser'"
+      label="Allowed browser origins"
+      name="allowedOrigins"
+    >
+      <ObserveOriginAllowlistEditor
+        v-if="canManage && !managed"
+        v-model="state.allowedOrigins"
+      />
+      <div
+        v-else
+        class="text-sm text-muted"
+      >
+        {{ state.allowedOrigins.join(", ") || "none" }}
+      </div>
+    </UFormField>
+
+    <div class="grid grid-cols-2 gap-3">
+      <UFormField
+        label="Environment"
+        name="env"
+      >
+        <UInput
+          v-model="state.env"
+          :disabled="!canManage"
+        />
+      </UFormField>
+      <UFormField
+        label="Group"
+        name="groupId"
+      >
+        <USelectMenu
+          v-model="state.groupId"
+          :items="groupItems"
+          value-key="value"
+          :search-input="false"
+          :disabled="!canManage"
+        />
+      </UFormField>
+    </div>
+
+    <UFormField
+      label="Versions"
+      name="versionTracking"
+    >
+      <ObserveVersionTrackingField
+        v-model:enabled="state.versionTracking"
+        v-model:current-version="currentVersion"
+      />
+    </UFormField>
+
+    <div
+      v-if="canManage"
+      class="flex justify-end"
+    >
+      <UButton
+        label="Save changes"
+        @click="save"
+      />
+    </div>
+  </div>
+</template>

package/dist/runtime/app/components/settings/ObserveServiceEditForm.vue.d.ts

@@ -0,0 +1,38 @@
+import { type ServiceDetail, type GroupListItem } from '../../../shared/schema/provisioning.js';
+/**
+ * Edit form for an existing service. Emits a ServiceUpdate patch; the parent performs the
+ * PATCH + refresh. When the service is config-managed, config-owned fields are read-only
+ * (they reconcile on reboot regardless of a UI edit).
+ */
+type __VLS_Props = {
+    service: ServiceDetail;
+    groups: GroupListItem[];
+    canManage: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    save: (patch: {
+        name?: string | undefined;
+        type?: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile" | undefined;
+        kind?: "server" | "browser" | undefined;
+        appNames?: string[] | undefined;
+        allowedOrigins?: string[] | undefined;
+        env?: string | null | undefined;
+        groupId?: string | null | undefined;
+        versionTracking?: boolean | undefined;
+        currentVersion?: string | null | undefined;
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSave?: ((patch: {
+        name?: string | undefined;
+        type?: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile" | undefined;
+        kind?: "server" | "browser" | undefined;
+        appNames?: string[] | undefined;
+        allowedOrigins?: string[] | undefined;
+        env?: string | null | undefined;
+        groupId?: string | null | undefined;
+        versionTracking?: boolean | undefined;
+        currentVersion?: string | null | undefined;
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveServiceFormModal.d.vue.ts

@@ -0,0 +1,37 @@
+type __VLS_Props = {
+    loading?: boolean;
+};
+type __VLS_ModelProps = {
+    /**
+     * Create-a-service modal. `kind` toggles the browser origin allowlist; `type` is the
+     * descriptive category (icon + badge). Validation rides serviceCreateSchema so the form
+     * and the POST route agree. On submit the parent performs the create + list refresh.
+     */
+    'open': boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (input: {
+        name: string;
+        type: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile";
+        kind: "server" | "browser";
+        appNames: string[];
+        allowedOrigins: string[];
+        env?: string | undefined;
+        versionTracking?: boolean | undefined;
+    }) => any;
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSubmit?: ((input: {
+        name: string;
+        type: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile";
+        kind: "server" | "browser";
+        appNames: string[];
+        allowedOrigins: string[];
+        env?: string | undefined;
+        versionTracking?: boolean | undefined;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveServiceFormModal.vue

@@ -0,0 +1,192 @@
+<script setup>
+import { reactive, ref, computed, watch } from "vue";
+import {
+  serviceCreateSchema,
+  SERVICE_TYPES,
+  SERVICE_TYPE_META
+} from "../../../shared/schema/provisioning";
+const open = defineModel("open", { type: Boolean, ...{ required: true } });
+const props = defineProps({
+  loading: { type: Boolean, required: false }
+});
+const emit = defineEmits(["submit"]);
+function blank() {
+  return {
+    name: "",
+    type: "service",
+    kind: "server",
+    appNames: [""],
+    allowedOrigins: [],
+    env: "",
+    versionTracking: false
+  };
+}
+const state = reactive(blank());
+const currentVersion = ref(null);
+watch(open, (v) => {
+  if (v) Object.assign(state, blank());
+});
+const typeItems = SERVICE_TYPES.map((t) => ({ value: t, label: SERVICE_TYPE_META[t].label, icon: SERVICE_TYPE_META[t].icon }));
+const kindItems = [
+  { value: "server", label: "Server (no browser CORS)" },
+  { value: "browser", label: "Browser (needs origin allowlist)" }
+];
+function addAppName() {
+  state.appNames.push("");
+}
+function updateAppName(i, v) {
+  state.appNames[i] = v;
+}
+function removeAppName(i) {
+  state.appNames.splice(i, 1);
+}
+const cleaned = computed(() => ({
+  name: state.name.trim(),
+  type: state.type,
+  kind: state.kind,
+  appNames: state.appNames.map((a) => a.trim()).filter(Boolean),
+  allowedOrigins: state.kind === "browser" ? state.allowedOrigins.map((o) => o.trim()).filter(Boolean) : [],
+  env: state.env.trim() || void 0,
+  versionTracking: state.versionTracking
+}));
+function onSubmit(_e) {
+  emit("submit", cleaned.value);
+}
+</script>
+
+<template>
+  <UModal
+    v-model:open="open"
+    title="New service"
+    description="Register an observable. Slug is derived from the name."
+  >
+    <template #body>
+      <UForm
+        :schema="serviceCreateSchema"
+        :state="cleaned"
+        class="space-y-4"
+        @submit="onSubmit"
+      >
+        <UFormField
+          label="Name"
+          name="name"
+          required
+        >
+          <UInput
+            v-model="state.name"
+            placeholder="Marketing site"
+            autofocus
+          />
+        </UFormField>
+
+        <div class="grid grid-cols-2 gap-3">
+          <UFormField
+            label="Type"
+            name="type"
+          >
+            <USelectMenu
+              v-model="state.type"
+              :items="typeItems"
+              value-key="value"
+              :search-input="false"
+            />
+          </UFormField>
+          <UFormField
+            label="Kind"
+            name="kind"
+          >
+            <USelectMenu
+              v-model="state.kind"
+              :items="kindItems"
+              value-key="value"
+              :search-input="false"
+            />
+          </UFormField>
+        </div>
+
+        <UFormField
+          label="App names"
+          name="appNames"
+          hint="Frogger source.app values that attribute logs to this service"
+          required
+        >
+          <div class="space-y-2">
+            <div
+              v-for="(app, i) in state.appNames"
+              :key="i"
+              class="flex items-center gap-2"
+            >
+              <UInput
+                :model-value="app"
+                placeholder="my-frontend"
+                class="flex-1"
+                @update:model-value="updateAppName(i, String($event))"
+              />
+              <UButton
+                icon="i-lucide-x"
+                color="neutral"
+                variant="ghost"
+                aria-label="Remove app name"
+                :disabled="state.appNames.length === 1"
+                @click="removeAppName(i)"
+              />
+            </div>
+            <UButton
+              icon="i-lucide-plus"
+              color="neutral"
+              variant="subtle"
+              size="sm"
+              label="Add app name"
+              @click="addAppName"
+            />
+          </div>
+        </UFormField>
+
+        <UFormField
+          v-if="state.kind === 'browser'"
+          label="Allowed browser origins"
+          name="allowedOrigins"
+        >
+          <ObserveOriginAllowlistEditor v-model="state.allowedOrigins" />
+        </UFormField>
+
+        <div class="grid grid-cols-2 gap-3">
+          <UFormField
+            label="Environment"
+            name="env"
+          >
+            <UInput
+              v-model="state.env"
+              placeholder="production"
+            />
+          </UFormField>
+          <UFormField
+            label="Versions"
+            name="versionTracking"
+          >
+            <ObserveVersionTrackingField
+              v-model:enabled="state.versionTracking"
+              v-model:current-version="currentVersion"
+            />
+          </UFormField>
+        </div>
+
+        <div class="flex justify-end gap-2 pt-2">
+          <UButton
+            color="neutral"
+            variant="ghost"
+            label="Cancel"
+            @click="() => {
+  open = false;
+}"
+          />
+          <UButton
+            type="submit"
+            label="Create service"
+            :loading="props.loading"
+          />
+        </div>
+      </UForm>
+    </template>
+  </UModal>
+</template>

package/dist/runtime/app/components/settings/ObserveServiceFormModal.vue.d.ts

@@ -0,0 +1,37 @@
+type __VLS_Props = {
+    loading?: boolean;
+};
+type __VLS_ModelProps = {
+    /**
+     * Create-a-service modal. `kind` toggles the browser origin allowlist; `type` is the
+     * descriptive category (icon + badge). Validation rides serviceCreateSchema so the form
+     * and the POST route agree. On submit the parent performs the create + list refresh.
+     */
+    'open': boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (input: {
+        name: string;
+        type: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile";
+        kind: "server" | "browser";
+        appNames: string[];
+        allowedOrigins: string[];
+        env?: string | undefined;
+        versionTracking?: boolean | undefined;
+    }) => any;
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSubmit?: ((input: {
+        name: string;
+        type: "service" | "other" | "website" | "webapp" | "api" | "worker" | "mobile";
+        kind: "server" | "browser";
+        appNames: string[];
+        allowedOrigins: string[];
+        env?: string | undefined;
+        versionTracking?: boolean | undefined;
+    }) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveServiceTypeBadge.d.vue.ts

@@ -0,0 +1,11 @@
+/**
+ * The `type` axis rendered as a badge + icon. Lenient: an unknown/hand-edited type
+ * falls back to `other` rather than throwing (serviceTypeMeta). `type` is presentational
+ * only and never affects runtime behaviour (that is `kind`).
+ */
+type __VLS_Props = {
+    type: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveServiceTypeBadge.vue

@@ -0,0 +1,18 @@
+<script setup>
+import { computed } from "vue";
+import { serviceTypeMeta } from "../../../shared/schema/provisioning";
+const props = defineProps({
+  type: { type: String, required: true }
+});
+const meta = computed(() => serviceTypeMeta(props.type));
+</script>
+
+<template>
+  <UBadge
+    color="neutral"
+    variant="subtle"
+    :icon="meta.icon"
+    :label="meta.label"
+    size="sm"
+  />
+</template>

package/dist/runtime/app/components/settings/ObserveServiceTypeBadge.vue.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The `type` axis rendered as a badge + icon. Lenient: an unknown/hand-edited type
+ * falls back to `other` rather than throwing (serviceTypeMeta). `type` is presentational
+ * only and never affects runtime behaviour (that is `kind`).
+ */
+type __VLS_Props = {
+    type: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/app/components/settings/ObserveSettingsServicesTable.d.vue.ts

@@ -0,0 +1,19 @@
+import type { ServiceListItem } from '../../../shared/schema/provisioning.js';
+/**
+ * The provisioning services table. Rows lead with a name link + type badge, carry a kind
+ * badge, and — for a soft-deleted service — a live countdown to permanent purge plus a
+ * restore control. Gating is presentational (useObserveAbility); the server enforces.
+ */
+type __VLS_Props = {
+    services: ServiceListItem[];
+    pending?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    delete: (service: ServiceListItem) => any;
+    restore: (service: ServiceListItem) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onDelete?: ((service: ServiceListItem) => any) | undefined;
+    onRestore?: ((service: ServiceListItem) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;