@sfxcode/nuxt-ui-mongocamp 1.1.0

package/dist/runtime/components/MongocampDatabases.vue

@@ -0,0 +1,112 @@
+<script setup>
+import { h, ref, resolveComponent } from "vue";
+import { useMongocampSystem } from "#imports";
+const { getDatabaseInfos, listCollectionsByDatabase } = useMongocampSystem();
+const databases = ref([]);
+const loading = ref(false);
+const sorting = ref([]);
+const errorMessage = ref("");
+async function fetchDatabases() {
+  loading.value = true;
+  errorMessage.value = "";
+  try {
+    const infos = await getDatabaseInfos();
+    const rows = await Promise.all(
+      infos.map(async (info) => {
+        const collections = await listCollectionsByDatabase(info.name);
+        return {
+          name: info.name,
+          sizeKb: Math.round(info.sizeOnDisk / 1024),
+          empty: info.empty,
+          collectionCount: collections.length
+        };
+      })
+    );
+    databases.value = rows;
+  } catch (e) {
+    errorMessage.value = e instanceof Error ? e.message : "Failed to load databases";
+  } finally {
+    loading.value = false;
+  }
+}
+const UBadge = resolveComponent("UBadge");
+const UButton = resolveComponent("UButton");
+function sortHeader(column, label) {
+  const isSorted = column.getIsSorted();
+  return h(UButton, {
+    color: "neutral",
+    variant: "ghost",
+    label,
+    icon: isSorted === "asc" ? "i-lucide-arrow-up-narrow-wide" : isSorted === "desc" ? "i-lucide-arrow-down-wide-narrow" : "i-lucide-arrow-up-down",
+    class: "-mx-2.5",
+    onClick: () => column.toggleSorting(isSorted === "asc")
+  });
+}
+const columns = [
+  {
+    accessorKey: "name",
+    header: ({ column }) => sortHeader(column, "Database")
+  },
+  {
+    accessorKey: "sizeKb",
+    header: ({ column }) => sortHeader(column, "Size (KB)")
+  },
+  {
+    accessorKey: "collectionCount",
+    header: "Collections",
+    cell: ({ row }) => h(UBadge, { label: String(row.original.collectionCount), color: "primary", variant: "subtle" })
+  },
+  {
+    accessorKey: "empty",
+    header: "Empty",
+    cell: ({ row }) => row.original.empty ? h(UBadge, { label: "Empty", color: "neutral", variant: "subtle" }) : h("span", { class: "text-dimmed" }, "\u2014")
+  }
+];
+fetchDatabases();
+</script>
+
+<template>
+  <div class="flex flex-col gap-4">
+    <div class="flex items-center justify-between gap-4">
+      <h2 class="text-xl font-semibold">
+        Databases
+      </h2>
+      <UTooltip text="Refresh">
+        <UButton
+          icon="i-lucide-refresh-cw"
+          color="neutral"
+          variant="ghost"
+          :loading="loading"
+          aria-label="Refresh"
+          @click="fetchDatabases"
+        />
+      </UTooltip>
+    </div>
+
+    <UAlert
+      v-if="errorMessage"
+      color="error"
+      variant="subtle"
+      icon="i-lucide-circle-alert"
+      title="Failed to load databases"
+      :description="errorMessage"
+    >
+      <template #actions>
+        <UButton
+          label="Retry"
+          color="error"
+          variant="subtle"
+          icon="i-lucide-refresh-cw"
+          @click="fetchDatabases"
+        />
+      </template>
+    </UAlert>
+
+    <UTable
+      v-model:sorting="sorting"
+      :data="databases"
+      :columns="columns"
+      :loading="loading"
+    />
+  </div>
+</template>

package/dist/runtime/components/MongocampDatabases.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/MongocampJobs.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/MongocampJobs.vue

@@ -0,0 +1,354 @@
+<script setup>
+import { h, reactive, ref, resolveComponent } from "vue";
+import { useMongocampJobs, useToast } from "#imports";
+const { listJobs, listPossibleJobs, registerJob, updateJob, executeJob, deleteJob } = useMongocampJobs();
+const toast = useToast();
+const jobs = ref([]);
+const loading = ref(false);
+const sorting = ref([]);
+const isAddModalOpen = ref(false);
+const isEditModalOpen = ref(false);
+const isDeleteModalOpen = ref(false);
+const errorMessage = ref("");
+const executingJobs = ref(/* @__PURE__ */ new Set());
+function jobKey(group, name) {
+  return `${group}/${name}`;
+}
+async function fetchJobs() {
+  loading.value = true;
+  try {
+    jobs.value = await listJobs();
+  } finally {
+    loading.value = false;
+  }
+}
+const emptyJobConfig = () => ({ name: "", group: "", className: "", description: "", cronExpression: "", priority: 5 });
+const newJob = ref(emptyJobConfig());
+const editJobOriginal = ref({ group: "", name: "" });
+const editJobClassName = ref("");
+const editJob = ref({ name: "", group: "", description: "", cronExpression: "", priority: 5 });
+function extractSelectValue(raw) {
+  if (typeof raw === "object" && raw !== null) {
+    const obj = raw;
+    return obj.value ?? obj.label ?? "";
+  }
+  return String(raw ?? "");
+}
+const addJobSchema = reactive([
+  {
+    $formkit: "nuxtUIInput",
+    name: "name",
+    label: "Name",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "group",
+    label: "Group",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUISelectMenu",
+    name: "className",
+    label: "Job Class",
+    options: [],
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "description",
+    label: "Description"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "cronExpression",
+    label: "Cron Expression",
+    help: "Quartz cron syntax, e.g. 0 0 * * * ?",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInputNumber",
+    name: "priority",
+    label: "Priority"
+  }
+]);
+const editJobSchema = reactive([
+  {
+    $formkit: "nuxtUIInput",
+    name: "name",
+    label: "Name",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "group",
+    label: "Group",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "description",
+    label: "Description"
+  },
+  {
+    $formkit: "nuxtUIInput",
+    name: "cronExpression",
+    label: "Cron Expression",
+    help: "Quartz cron syntax, e.g. 0 0 * * * ?",
+    validation: "required"
+  },
+  {
+    $formkit: "nuxtUIInputNumber",
+    name: "priority",
+    label: "Priority"
+  }
+]);
+async function openAdd() {
+  errorMessage.value = "";
+  addJobSchema[2].options = await listPossibleJobs();
+  newJob.value = emptyJobConfig();
+  isAddModalOpen.value = true;
+}
+async function handleAddJob() {
+  errorMessage.value = "";
+  try {
+    const className = extractSelectValue(newJob.value.className);
+    await registerJob({ ...newJob.value, className });
+    isAddModalOpen.value = false;
+    await fetchJobs();
+  } catch (e) {
+    errorMessage.value = e instanceof Error ? e.message : "Failed to register job";
+  }
+}
+function openEdit(job) {
+  errorMessage.value = "";
+  editJobOriginal.value = { group: job.group, name: job.name };
+  editJobClassName.value = job.jobClassName;
+  editJob.value = {
+    name: job.name,
+    group: job.group,
+    description: job.description,
+    cronExpression: job.cronExpression,
+    priority: job.priority
+  };
+  isEditModalOpen.value = true;
+}
+async function handleEditJob() {
+  errorMessage.value = "";
+  try {
+    const jobConfig = { ...editJob.value, className: editJobClassName.value };
+    await updateJob(editJobOriginal.value.group, editJobOriginal.value.name, jobConfig);
+    isEditModalOpen.value = false;
+    await fetchJobs();
+  } catch (e) {
+    errorMessage.value = e instanceof Error ? e.message : "Failed to update job";
+  }
+}
+const jobToDelete = ref({ group: "", name: "" });
+function confirmDelete(group, name) {
+  jobToDelete.value = { group, name };
+  isDeleteModalOpen.value = true;
+}
+async function handleDeleteJob() {
+  await deleteJob(jobToDelete.value.group, jobToDelete.value.name);
+  isDeleteModalOpen.value = false;
+  await fetchJobs();
+}
+async function handleExecuteJob(group, name) {
+  const key = jobKey(group, name);
+  executingJobs.value.add(key);
+  try {
+    await executeJob(group, name);
+    toast.add({ title: "Job executed", description: `"${name}" was triggered.`, color: "success" });
+  } catch {
+    toast.add({ title: "Execution failed", description: `Could not execute "${name}".`, color: "error" });
+  } finally {
+    executingJobs.value.delete(key);
+  }
+}
+function formatFireTime(date) {
+  if (!date) return "\u2014";
+  return new Date(date).toLocaleString();
+}
+const UButton = resolveComponent("UButton");
+const UTooltip = resolveComponent("UTooltip");
+function withTooltip(text, node) {
+  return h(UTooltip, { text }, { default: () => node });
+}
+function sortHeader(column, label) {
+  const isSorted = column.getIsSorted();
+  return h(UButton, {
+    color: "neutral",
+    variant: "ghost",
+    label,
+    icon: isSorted === "asc" ? "i-lucide-arrow-up-narrow-wide" : isSorted === "desc" ? "i-lucide-arrow-down-wide-narrow" : "i-lucide-arrow-up-down",
+    class: "-mx-2.5",
+    onClick: () => column.toggleSorting(isSorted === "asc")
+  });
+}
+const columns = [
+  {
+    accessorKey: "name",
+    header: ({ column }) => sortHeader(column, "Name")
+  },
+  {
+    accessorKey: "group",
+    header: ({ column }) => sortHeader(column, "Group")
+  },
+  {
+    accessorKey: "cronExpression",
+    header: "Cron Expression",
+    cell: ({ row }) => h("span", { class: "font-mono text-xs" }, row.original.cronExpression)
+  },
+  {
+    accessorKey: "nextScheduledFireTime",
+    header: "Next Fire Time",
+    cell: ({ row }) => h("span", formatFireTime(row.original.nextScheduledFireTime))
+  },
+  {
+    accessorKey: "priority",
+    header: ({ column }) => sortHeader(column, "Priority")
+  },
+  {
+    id: "actions",
+    header: "",
+    cell: ({ row }) => {
+      const key = jobKey(row.original.group, row.original.name);
+      return h("div", { class: "flex gap-1 justify-end" }, [
+        withTooltip("Execute now", h(UButton, {
+          "icon": "i-lucide-play",
+          "color": "neutral",
+          "variant": "ghost",
+          "size": "sm",
+          "aria-label": "Execute now",
+          "loading": executingJobs.value.has(key),
+          "onClick": () => handleExecuteJob(row.original.group, row.original.name)
+        })),
+        withTooltip("Edit job", h(UButton, {
+          "icon": "i-lucide-pencil",
+          "color": "neutral",
+          "variant": "ghost",
+          "size": "sm",
+          "aria-label": "Edit job",
+          "onClick": () => openEdit(row.original)
+        })),
+        withTooltip("Delete job", h(UButton, {
+          "icon": "i-lucide-trash-2",
+          "color": "error",
+          "variant": "ghost",
+          "size": "sm",
+          "aria-label": "Delete job",
+          "onClick": () => confirmDelete(row.original.group, row.original.name)
+        }))
+      ]);
+    }
+  }
+];
+fetchJobs();
+</script>
+
+<template>
+  <div class="flex flex-col gap-4">
+    <div class="flex items-center justify-between gap-4">
+      <h2 class="text-xl font-semibold">
+        Jobs
+      </h2>
+      <div class="flex items-center gap-2">
+        <UTooltip text="Refresh">
+          <UButton
+            icon="i-lucide-refresh-cw"
+            color="neutral"
+            variant="ghost"
+            :loading="loading"
+            aria-label="Refresh"
+            @click="fetchJobs"
+          />
+        </UTooltip>
+        <UButton
+          icon="i-lucide-plus"
+          label="Add Job"
+          @click="openAdd"
+        />
+      </div>
+    </div>
+
+    <UTable
+      v-model:sorting="sorting"
+      :data="jobs"
+      :columns="columns"
+      :loading="loading"
+    />
+
+    <!-- Add Job Modal -->
+    <UModal
+      v-model:open="isAddModalOpen"
+      title="Add Job"
+    >
+      <template #body>
+        <FUDataEdit
+          :data="newJob"
+          :schema="addJobSchema"
+          submit-label="Add Job"
+          submit-icon="i-lucide-plus"
+          @data-saved="handleAddJob"
+        />
+        <p
+          v-if="errorMessage"
+          class="mt-2 text-sm text-error-500"
+        >
+          {{ errorMessage }}
+        </p>
+      </template>
+    </UModal>
+
+    <!-- Edit Job Modal -->
+    <UModal
+      v-model:open="isEditModalOpen"
+      :title="`Edit Job: ${editJobOriginal.name}`"
+    >
+      <template #body>
+        <FUDataEdit
+          :data="editJob"
+          :schema="editJobSchema"
+          submit-label="Save Changes"
+          submit-icon="i-lucide-save"
+          @data-saved="handleEditJob"
+        />
+        <p
+          v-if="errorMessage"
+          class="mt-2 text-sm text-error-500"
+        >
+          {{ errorMessage }}
+        </p>
+      </template>
+    </UModal>
+
+    <!-- Delete Confirmation Modal -->
+    <UModal
+      v-model:open="isDeleteModalOpen"
+      title="Delete Job"
+      :ui="{ footer: 'justify-end' }"
+    >
+      <template #body>
+        <p>
+          Are you sure you want to delete job <strong>{{ jobToDelete.name }}</strong>?
+          This action cannot be undone.
+        </p>
+      </template>
+      <template #footer>
+        <UButton
+          label="Cancel"
+          color="neutral"
+          variant="ghost"
+          @click="isDeleteModalOpen = false"
+        />
+        <UButton
+          label="Delete"
+          color="error"
+          icon="i-lucide-trash-2"
+          @click="handleDeleteJob"
+        />
+      </template>
+    </UModal>
+  </div>
+</template>

package/dist/runtime/components/MongocampJobs.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/MongocampLogin.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/MongocampLogin.vue

@@ -0,0 +1,63 @@
+<script setup>
+import { consola } from "consola";
+import { ref, reactive } from "vue";
+import { useMongocampAuth } from "#imports";
+import { navigateTo, useCookie } from "#app";
+const { login } = useMongocampAuth();
+const errorMessage = ref("");
+const loginMail = useCookie("mongocamp_login", { maxAge: 30 * 24 * 60 * 60 });
+const data = ref({ userId: loginMail.value, password: "" });
+const schema = reactive(
+  [
+    {
+      $el: "h3",
+      children: "Mongocamp Login"
+    },
+    {
+      $formkit: "nuxtUIInput",
+      name: "userId",
+      label: "Email",
+      validation: "required|email"
+    },
+    {
+      $formkit: "nuxtUIInput",
+      name: "password",
+      label: "Password",
+      inputType: "password",
+      validation: "required|length:3"
+    }
+  ]
+);
+async function actionLogin() {
+  errorMessage.value = "";
+  const loginId = data.value?.userId || "";
+  try {
+    await login(loginId, data.value?.password);
+    loginMail.value = loginId;
+    navigateTo("/secured");
+  } catch (e) {
+    consola.log(e);
+    errorMessage.value = "Wrong Login or Password !";
+  }
+}
+</script>
+
+<template>
+  <div class="flex flex-col items-center justify-center gap-4 p-4 w-1/2">
+    <UPageCard class="w-full max-w-md">
+      <FUDataEdit
+        :data="data"
+        :schema="schema"
+        submit-label="Login"
+        debug-data
+        @data-saved="actionLogin"
+      />
+      <div
+        v-if="errorMessage.length > 0"
+        class="m-4 mt-2 text-2xl text-red-700 font-medium"
+      >
+        {{ errorMessage }}
+      </div>
+    </UPageCard>
+  </div>
+</template>

package/dist/runtime/components/MongocampLogin.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/MongocampRoleGrants.d.vue.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    roleName: 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;