@raclettejs/workbench 0.0.1

package/plugins/pacifico__compositions/frontend/components/compositionConfiguration/widgetsLayout/WidgetSettings.vue

@@ -0,0 +1,96 @@
+<template>
+  <v-list>
+    <v-list-subheader>
+      Settings for {{ selectedWigdetModel.name }}
+    </v-list-subheader>
+
+    <!-- NEW -->
+    <v-list-item v-for="(value, key) in configurableParameteters" :key="key">
+      <!-- text -->
+      <v-text-field
+        v-if="value.inputType === 'text'"
+        :model-value="getConfigValue(key)"
+        persistent-placeholder
+        :label="key"
+        @update:model-value="setConfigValue(key, $event)"
+      />
+
+      <!-- checkbox -->
+      <v-checkbox
+        v-else-if="value.inputType === 'checkbox'"
+        :model-value="getConfigValue(key)"
+        :label="key"
+        @update:model-value="setConfigValue(key, $event)"
+      />
+
+      <!-- switch -->
+      <v-switch
+        v-else-if="value.inputType === 'switch'"
+        :model-value="getConfigValue(key)"
+        :label="key"
+        @update:model-value="setConfigValue(key, $event)"
+      />
+
+      <!-- number -->
+      <v-text-field
+        v-else-if="value.inputType === 'number'"
+        :model-value="getConfigValue(key)"
+        :label="key"
+        type="number"
+        :min="value.min"
+        :max="value.max"
+        :step="value.step"
+        @update:model-value="setConfigValue(key, parseFloat($event))"
+      />
+
+      <!-- multiselect -->
+      <v-select
+        v-else-if="
+          value.inputType === 'multiselect' || value.inputType === 'select'
+        "
+        :label="key"
+        :items="value.selectionValues"
+        :model-value="getConfigValue(key)"
+        :multiple="value.inputType === 'multiselect'"
+        @update:model-value="setConfigValue(key, $event)"
+      />
+    </v-list-item>
+  </v-list>
+</template>
+
+<script setup lang="ts">
+import { computed } from "vue"
+import useWidgets from "@raclettejs/core/orchestrator/composables/useWidgets"
+import { WidgetBase } from "@raclettejs/core/frontend/store/types"
+
+const selectedWigdetModel = defineModel<WidgetBase>({ required: true })
+
+const { findWidgetByName } = useWidgets()
+
+const widget = computed(() => findWidgetByName(selectedWigdetModel.value.name))
+
+const configurableParameteters = computed(
+  () => widget.value?.configurableParameters,
+)
+
+const getConfigValue = (key: string) => {
+  const config = selectedWigdetModel.value.config
+
+  if (config && key in config) {
+    return config[key]
+  }
+
+  const defaultValue = configurableParameteters.value![key].defaultValue
+
+  return defaultValue
+}
+
+const setConfigValue = (key: string, value: any) => {
+  if (!selectedWigdetModel.value.config) {
+    selectedWigdetModel.value.config = {}
+  }
+  const config = selectedWigdetModel.value.config
+
+  config[key] = value
+}
+</script>

package/plugins/pacifico__compositions/frontend/widgets/CompositionCreateWidget.vue

@@ -0,0 +1,51 @@
+<template>
+  <CompositionConfiguration
+    v-model="newComposition"
+    :disabled="isLoading"
+    @save-and-finish="onSubmit(true)"
+    @save="onSubmit"
+  />
+</template>
+
+<script setup lang="ts">
+import { CompositionCreate } from "@raclettejs/core"
+import { ref } from "vue"
+import CompositionConfiguration from "../components/compositionConfiguration/CompositionConfiguration.vue"
+import {
+  usePluginApi,
+  useRouteState,
+} from "@raclettejs/core/orchestrator/composables"
+
+const props = defineProps<{
+  uuid: string
+}>()
+
+const { $data } = usePluginApi("raclette__core")
+const { triggerInteractionLinkById } = useRouteState()
+
+const { execute, isLoading, error } = $data.composition.create()
+
+const newComposition = ref<CompositionCreate>({
+  title: "",
+  description: "",
+  tags: [],
+  pathname: {
+    default: "",
+    de: "",
+    en: "",
+  },
+  status: "inProgress",
+  widgetsLayout: [[]],
+})
+
+const navigateBack = () =>
+  triggerInteractionLinkById("compositionListInteractionLink")
+
+const onSubmit = async (finish = false) => {
+  await execute(newComposition.value)
+
+  if (!error.value && finish) {
+    navigateBack()
+  }
+}
+</script>

package/plugins/pacifico__compositions/frontend/widgets/CompositionEditWidget.vue

@@ -0,0 +1,66 @@
+<template>
+  <CompositionConfiguration
+    v-if="editableComposition"
+    v-model="editableComposition"
+    :disabled="isLoading"
+    is-editing
+    @save="onSubmit"
+    @save-and-finish="onSubmit(true)"
+  />
+</template>
+
+<script setup lang="ts">
+import {
+  usePluginApi,
+  useRouteState,
+} from "@raclettejs/core/orchestrator/composables"
+import { computed, ref, toRaw } from "vue"
+import CompositionConfiguration from "../components/compositionConfiguration/CompositionConfiguration.vue"
+import { Composition } from "@raclettejs/core"
+import { clone } from "ramda"
+import { DEFAULT_SLOT_NAME } from "@raclettejs/core/orchestrator/router/routeParserHelper"
+
+const props = defineProps<{
+  uuid: string
+}>()
+
+const { compositionSlots, triggerInteractionLinkById } = useRouteState()
+const { $data } = usePluginApi("raclette__core")
+
+const id = computed(
+  () =>
+    compositionSlots.value.find((slot) => slot.slotName === DEFAULT_SLOT_NAME)
+      ?.slotParams?.id,
+)
+
+const { data } = $data.composition.get({
+  params: { _id: id.value },
+  options: {
+    immediate: true,
+    cb: () => {
+      if (!composition.value) {
+        return navigateBack()
+      }
+
+      editableComposition.value = clone(composition.value)
+    },
+  },
+})
+
+const { execute: executeUpdate, isLoading } = $data.composition.update()
+const editableComposition = ref<Composition>()
+
+const composition = computed<Composition | undefined>(() => {
+  if (!id.value) {
+    return undefined
+  }
+
+  return data.value?.[id.value]
+})
+
+const navigateBack = () =>
+  triggerInteractionLinkById("compositionListInteractionLink")
+
+const onSubmit = async (finish = false) =>
+  await executeUpdate(toRaw(editableComposition.value))
+</script>

package/plugins/pacifico__compositions/frontend/widgets/CompositionListWidget.vue

@@ -0,0 +1,132 @@
+<template>
+  <BaseDataTable
+    :items="parsedCompositions"
+    :loading="compositionsLoading || tagsLoading"
+    :headers="headers"
+    create-interaction-link-id="compositionCreateInteractionLink"
+    edit-interaction-link-id="compositionEditInteractionLink"
+    :data-name="$t('workbench.compositionList.dataName')"
+    :data-article="$t('workbench.compositionList.dataArticle')"
+    @delete="deleteComposition"
+  >
+    <!-- Custom status column -->
+    <template #item.status="{ item }">
+      <v-icon
+        :icon="item.statusIcon"
+        :color="item.statusColor"
+        size="x-large"
+      />
+    </template>
+  </BaseDataTable>
+</template>
+
+<script setup lang="ts">
+import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
+import { computed } from "vue"
+import type { Composition } from "@raclettejs/core"
+import { formatDistance } from "date-fns"
+import BaseDataTable from "@app/components/BaseDataTable.vue"
+import { useI18n } from "vue-i18n"
+
+const { t } = useI18n()
+
+const headers = computed<
+  { title: string; key: keyof Composition | "actions" }[]
+>(() => [
+  {
+    title: t("workbench.compositionList.tableHeaders.title"),
+    key: "title",
+  },
+  {
+    title: t("workbench.compositionList.tableHeaders.status"),
+    key: "status",
+  },
+  {
+    title: t("workbench.compositionList.tableHeaders.tags"),
+    key: "tags",
+  },
+  {
+    title: t("workbench.compositionList.tableHeaders.lastEditor"),
+    key: "lastEditor",
+  },
+  {
+    title: t("workbench.compositionList.tableHeaders.author"),
+    key: "author",
+  },
+  {
+    title: t("workbench.compositionList.tableHeaders.updatedAt"),
+    key: "updatedAt",
+  },
+])
+
+const props = defineProps<{
+  uuid: string
+}>()
+
+const { $data, $socket } = usePluginApi("raclette__core")
+const {
+  data: compositions,
+  execute,
+  isLoading: compositionsLoading,
+} = $data.composition.getAll({
+  options: { immediate: true },
+})
+
+const { data: tags, isLoading: tagsLoading } = $data.tag.getAll({
+  options: { immediate: true },
+})
+const { data: users } = $data.user.getAll({
+  options: { immediate: true },
+})
+const { execute: executeDelete } = await $data.composition.delete({
+  options: { cb: () => execute() },
+})
+
+const parsedCompositions = computed(() => {
+  if (compositions.value && tags.value) {
+    return Object.values(
+      compositions.value as { [key: string]: Composition },
+    ).map((composition) => ({
+      ...composition,
+      tags: composition.tags.map((tag) => tags.value?.[tag]),
+      lastEditor: users.value?.[composition.author]?.email,
+      author: users.value?.[composition.author]?.email,
+      status: composition.status, // TODO: parse status
+      statusIcon: getStatusIcon(composition.status),
+      statusColor: getStatusColor(composition.status),
+      createdAt: formatDistance(new Date(composition.createdAt), new Date()),
+      updatedAt: formatDistance(new Date(composition.updatedAt), new Date()),
+    }))
+  }
+
+  return []
+})
+
+// TODO: replace with composition status type
+const getStatusIcon = (status: string) => {
+  // if (status === "published") {
+  if (status === "inProgress") {
+    return "mdi-check-circle-outline"
+  } else if (status === "inProgress") {
+    return "mdi-pencil-circle-outline"
+  } else if (status === "removed") {
+    return "mdi-alert-circle-outline"
+  }
+}
+
+const getStatusColor = (status: string) => {
+  // if (status === "published") {
+  if (status === "inProgress") {
+    return "#19A038"
+  } else if (status === "inProgress") {
+    return "#898989"
+  } else if (status === "removed") {
+    return "#B66218"
+  }
+}
+
+const deleteComposition = async (composition: Composition) =>
+  await executeDelete({ _id: composition._id })
+
+$socket.on("compositionCreated", () => execute())
+</script>

package/plugins/pacifico__compositions/raclette.plugin.ts

@@ -0,0 +1,8 @@
+export default {
+  name: "compositions",
+  author: "pacifico",
+  version: "0.0.1",
+  description: "A plugin for compositions",
+  // Specify where the main frontend and backend entry points are
+  frontendDir: "./frontend",
+}

package/plugins/pacifico__core/backend/index.ts

@@ -0,0 +1,25 @@
+import type {
+  PluginOptions,
+  PluginFastifyInstance,
+} from "@raclettejs/core/backend" // this import is needed for TS support
+import { registerRoutes } from "./routes"
+
+const corePlugin = async (
+  fastify: PluginFastifyInstance,
+  _opts: PluginOptions,
+) => {
+  /*
+   * ---------------------------------------------------------------------
+   * REGISTER ALL YOUR ROUTES
+   * ---------------------------------------------------------------------
+   */
+
+  try {
+    await fastify.register((instance) => registerRoutes(instance))
+  } catch (error) {
+    fastify.log.error("Failed to register routes.", error)
+    throw error // Let the application handle the error
+  }
+}
+
+export default corePlugin

package/plugins/pacifico__core/backend/routes.ts

@@ -0,0 +1,220 @@
+import { callDataTypeOperation } from "@raclettejs/core/backend"
+import type { PluginFastifyInstance } from "@raclettejs/core"
+import { Type } from "@sinclair/typebox"
+import type { Static } from "@sinclair/typebox"
+import type { FastifyRequest, FastifyReply } from "fastify"
+
+const BodySchema = Type.Object({
+  title: Type.String(),
+  user: Type.Object({
+    email: Type.String(),
+    password: Type.String(),
+    firstname: Type.String(),
+    lastname: Type.String(),
+  }),
+})
+
+type Body = Static<typeof BodySchema>
+
+export const registerRoutes = async (fastify: PluginFastifyInstance) => {
+  fastify.post(
+    "/init-project",
+    { schema: { body: BodySchema } },
+    async (
+      req: FastifyRequest<{
+        Body: Body
+      }>,
+      reply: FastifyReply,
+    ) => {
+      const created = {}
+      try {
+        // Check if setup is already completed
+        const existingProjects = await callDataTypeOperation(
+          "raclette__core",
+          "project",
+          "readAll",
+          fastify,
+        )
+        const existingAccounts = await callDataTypeOperation(
+          "raclette__core",
+          "account",
+          "readAll",
+          fastify,
+        )
+        const existingUsers = await callDataTypeOperation(
+          "raclette__core",
+          "user",
+          "readAll",
+          fastify,
+        )
+
+        // If everything exists, lock the endpoint
+        if (
+          existingProjects.length > 0 &&
+          existingAccounts.length > 0 &&
+          existingUsers.length > 0
+        ) {
+          return reply.status(403).send({
+            error: "Setup already completed. Init-project endpoint is locked.",
+          })
+        }
+
+        let account
+        let adminTag
+        let user
+        let project
+        let projectConfig
+
+        // Step 1: Create or retrieve account
+        if (existingAccounts.length === 0) {
+          account = await callDataTypeOperation(
+            "raclette__core",
+            "account",
+            "create",
+            fastify,
+            { name: "DEFAULT" },
+            "SYSTEM",
+          )
+
+          fastify.log.info("Created new account")
+        } else {
+          account = existingAccounts[0]
+          fastify.log.info("Using existing account", account._id)
+        }
+        created.account = account
+
+        // Step 2: Create or retrieve admin tag
+        const existingTags = await callDataTypeOperation(
+          "raclette__core",
+          "tag",
+          "readAll",
+          fastify,
+          {
+            title: "ADMIN",
+            type: "system",
+          },
+        )
+
+        if (existingTags.length === 0) {
+          adminTag = await callDataTypeOperation(
+            "raclette__core",
+            "tag",
+            "create",
+            fastify,
+            {
+              title: "ADMIN",
+              color: "#FF0000",
+              type: "system",
+              locked: true,
+            },
+          )
+
+          fastify.log.info("Created admin tag")
+        } else {
+          adminTag = existingTags[0]
+          fastify.log.info("Using existing admin tag", adminTag._id)
+        }
+
+        // Step 3: Create or retrieve user
+        const existingUser = await callDataTypeOperation(
+          "raclette__core",
+          "user",
+          "readByMail",
+          req.body.user?.email,
+        )
+
+        if (!existingUser) {
+          user = await callDataTypeOperation(
+            "raclette__core",
+            "user",
+            "create",
+            fastify,
+            {
+              email: req.body.user?.email,
+              account: account._id,
+              password: req.body.user?.password,
+              email_verified: true,
+              tags: [adminTag._id],
+              firstname: req.body.user?.firstname,
+              lastname: req.body.user?.lastname,
+            },
+          )
+          fastify.log.info("Created new user")
+        } else {
+          user = existingUser[0]
+          fastify.log.info("Using existing user", user._id)
+        }
+        created.user = user
+
+        // Step 4: Update account with owner if not already set
+        if (!account.owner || account.owner === "SYSTEM") {
+          const updatedAccount = await callDataTypeOperation(
+            "raclette__core",
+            "account",
+            "update",
+            fastify,
+            account._id,
+            {
+              owner: user._id,
+            },
+            user._id,
+          )
+
+          account = updatedAccount.updated
+          fastify.log.info("Updated account with owner")
+        }
+
+        // Step 5: Create or retrieve project
+        const existingProject = await callDataTypeOperation(
+          "raclette__core",
+          "project",
+          "readAll",
+          fastify,
+          {
+            account: account._id,
+            isDefault: true,
+          },
+        )
+
+        if (existingProject.length === 0) {
+          project = await callDataTypeOperation(
+            "raclette__core",
+            "project",
+            "create",
+            fastify,
+            {
+              title: req.body.title,
+              account: account._id,
+              isDefault: true,
+            },
+          )
+
+          fastify.log.info("Created new project")
+        } else {
+          project = existingProject[0]
+          fastify.log.info("Using existing project", project._id)
+        }
+        created.project = project
+
+        const payload = {
+          success: true,
+          partial: false,
+          created,
+        }
+
+        reply.status(200).send(payload)
+      } catch (error) {
+        fastify.log.error(
+          "Error during init-project call. Process partially completed.",
+          error,
+        )
+        reply.status(500).send({
+          error:
+            "Error during init-project call. Process partially completed. You can retry to continue setup.",
+          details: error instanceof Error ? error.message : String(error),
+          created,
+        })
+      }
+    },
+  )
+}

package/plugins/pacifico__core/raclette.plugin.ts

@@ -0,0 +1,9 @@
+export default {
+  name: "core",
+  author: "pacifico",
+  version: "0.0.1",
+  description: "A plugin for core dataTypes",
+  // Specify where the main frontend and backend entry points are
+  backendDir: "./backend",
+  frontendDir: "./frontend",
+}