@raclettejs/workbench 0.1.15 → 0.1.17

package/CHANGELOG.md

@@ -7,6 +7,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.1.17] - 06.11.2025 <a href="https://gitlab.com/raclettejs/workbench/-/compare/v0.1.15...v0.1.17" target="_blank" rel="noopener"><b>Overview of all changes</b></a>
+
+### Added
+
+- added isDeleted switch to lists
+- added hard deletion to all core types
+
 ## [0.1.15] - 02.11.2025 <a href="https://gitlab.com/raclettejs/workbench/-/compare/v0.1.13...v0.1.15" target="_blank" rel="noopener"><b>Overview of all changes</b></a>
 
 ### Updated

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@raclettejs/workbench",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "license": "MIT",
   "description": "racletteJS Workbench - used to configure your application, for dev and prod",
   "repository": "https://gitlab.com/raclettejs/workbench",
@@ -31,13 +31,13 @@
     ".": "./index.ts"
   },
   "dependencies": {
-    "@raclettejs/core": "0.1.15",
+    "@raclettejs/core": "0.1.17",
     "three": "0.180.0",
     "vanta": "0.5.24"
   },
   "devDependencies": {
     "@eslint/js": "9.35.0",
-    "@raclettejs/types": "0.1.15",
+    "@raclettejs/types": "0.1.17",
     "@sinclair/typebox": "0.34.41",
     "@types/ramda": "0.31.1",
     "@vueuse/core": "13.9.0",

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

@@ -8,7 +8,28 @@
     :data-name="$t('workbench.compositionList.dataName')"
     :data-article="$t('workbench.compositionList.dataArticle')"
     @delete="deleteComposition"
+    :itemsDeleted="showDeleted"
   >
+    <template #actions>
+      <v-tooltip
+        :text="showDeleted ? $t('core.hideDeleted') : $t('core.showDeleted')"
+      >
+        <template v-slot:activator="{ props }">
+          <v-btn-toggle
+            density="compact"
+            v-bind="props"
+            v-model="showDeleted"
+            mandatory
+            :color="showDeleted ? 'error' : 'success'"
+          >
+            <v-btn :value="true">
+              <v-icon>mdi-table-eye-off</v-icon>
+            </v-btn>
+            <v-btn :value="false"><v-icon>mdi-table-eye</v-icon></v-btn>
+          </v-btn-toggle>
+        </template>
+      </v-tooltip>
+    </template>
     <!-- Custom status column -->
     <template #item.status="{ item }">
       <v-icon
@@ -22,11 +43,12 @@
 
 <script setup lang="ts">
 import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
-import { computed } from "vue"
+import { computed, watch, ref } 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 showDeleted = ref(false)
 
 const { t } = useI18n()
 
@@ -68,9 +90,7 @@ const {
   data: compositions,
   execute,
   isLoading: compositionsLoading,
-} = $data.composition.getAll({
-  options: { immediate: true },
-})
+} = $data.composition.getAll()
 
 const { data: tags, isLoading: tagsLoading } = $data.tag.getAll({
   options: { immediate: true },
@@ -79,9 +99,11 @@ const { data: users } = $data.user.getAll({
   options: { immediate: true },
 })
 const { execute: executeDelete } = await $data.composition.delete({
-  options: { cb: () => execute() },
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
+})
+const { execute: executeHardDelete } = await $data.composition.deleteHard({
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-
 const parsedCompositions = computed(() => {
   if (compositions.value && tags.value) {
     return Object.values(
@@ -125,8 +147,22 @@ const getStatusColor = (status: string) => {
   }
 }
 
-const deleteComposition = async (composition: Composition) =>
-  await executeDelete({ _id: composition._id })
+const deleteComposition = async (composition: Composition) => {
+  if (showDeleted.value) {
+    await executeHardDelete({ _id: composition._id })
+  } else {
+    await executeDelete({ _id: composition._id })
+  }
+}
 
-$socket.on("compositionCreated", () => execute())
+$socket.on("compositionCreated", () =>
+  execute({ isDeleted: showDeleted.value }),
+)
+watch(
+  showDeleted,
+  () => {
+    execute({ isDeleted: showDeleted.value })
+  },
+  { immediate: true },
+)
 </script>

package/plugins/pacifico__interactionLinks/frontend/widgets/InteractionLinkListWidget.vue

@@ -8,7 +8,28 @@
     :data-name="$t('workbench.interactionLinkList.dataName')"
     :data-article="$t('workbench.interactionLinkList.dataArticle')"
     @delete="deleteInteractionLink"
+    :itemsDeleted="showDeleted"
   >
+    <template #actions>
+      <v-tooltip
+        :text="showDeleted ? $t('core.hideDeleted') : $t('core.showDeleted')"
+      >
+        <template v-slot:activator="{ props }">
+          <v-btn-toggle
+            density="compact"
+            v-bind="props"
+            v-model="showDeleted"
+            mandatory
+            :color="showDeleted ? 'error' : 'success'"
+          >
+            <v-btn :value="true">
+              <v-icon>mdi-table-eye-off</v-icon>
+            </v-btn>
+            <v-btn :value="false"><v-icon>mdi-table-eye</v-icon></v-btn>
+          </v-btn-toggle>
+        </template>
+      </v-tooltip>
+    </template>
     <!-- Custom triggers column -->
     <template #item.triggers="{ item }">
       <span class="tw:flex tw:gap-2">
@@ -24,8 +45,9 @@ import BaseDataTable from "@app/components/BaseDataTable.vue"
 import { InteractionLink } from "@raclettejs/core"
 import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
 import { formatDistance } from "date-fns"
-import { computed } from "vue"
+import { computed, ref, watch } from "vue"
 import { useI18n } from "vue-i18n"
+const showDeleted = ref(false)
 
 const { t } = useI18n()
 
@@ -72,9 +94,7 @@ const {
   data: interactionLinks,
   execute,
   isLoading: interactionLinksLoading,
-} = $data.interactionLink.getAll({
-  options: { immediate: true },
-})
+} = $data.interactionLink.getAll()
 
 const { data: tags, isLoading: tagsLoading } = $data.tag.getAll({
   options: { immediate: true },
@@ -89,9 +109,11 @@ const { data: compositions } = $data.composition.getAll({
 })
 
 const { execute: executeDelete } = $data.interactionLink.delete({
-  options: { cb: () => execute() },
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
+})
+const { execute: executeHardDelete } = await $data.interactionLink.deleteHard({
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-
 const parsedInteractionLinks = computed(() => {
   if (interactionLinks.value && tags.value) {
     return Object.values(
@@ -119,8 +141,22 @@ const parsedInteractionLinks = computed(() => {
   return []
 })
 
-const deleteInteractionLink = async (interactionLink: InteractionLink) =>
-  await executeDelete({ _id: interactionLink._id })
+const deleteInteractionLink = async (interactionLink: InteractionLink) => {
+  if (showDeleted.value) {
+    await executeHardDelete({ _id: interactionLink._id })
+  } else {
+    await executeDelete({ _id: interactionLink._id })
+  }
+}
 
-$socket.on("interactionLinkCreated", () => execute())
+$socket.on("interactionLinkCreated", () =>
+  execute({ isDeleted: showDeleted.value }),
+)
+watch(
+  showDeleted,
+  () => {
+    execute({ isDeleted: showDeleted.value })
+  },
+  { immediate: true },
+)
 </script>

package/plugins/pacifico__tags/frontend/widgets/TagListWidget.vue

@@ -8,17 +8,39 @@
     :data-name="$t('workbench.tagList.dataName')"
     :data-article="$t('workbench.tagList.dataArticle')"
     @delete="deleteTag"
-  />
+    :itemsDeleted="showDeleted"
+  >
+    <template #actions>
+      <v-tooltip
+        :text="showDeleted ? $t('core.hideDeleted') : $t('core.showDeleted')"
+      >
+        <template v-slot:activator="{ props }">
+          <v-btn-toggle
+            density="compact"
+            v-bind="props"
+            v-model="showDeleted"
+            mandatory
+            :color="showDeleted ? 'error' : 'success'"
+          >
+            <v-btn :value="true">
+              <v-icon>mdi-table-eye-off</v-icon>
+            </v-btn>
+            <v-btn :value="false"><v-icon>mdi-table-eye</v-icon></v-btn>
+          </v-btn-toggle>
+        </template>
+      </v-tooltip>
+    </template>
+  </BaseDataTable>
 </template>
 
 <script setup lang="ts">
 import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
-import { computed } from "vue"
+import { computed, ref, watch } from "vue"
 import type { Tag } from "@raclettejs/core"
 import { useI18n } from "vue-i18n"
 import BaseDataTable from "@app/components/BaseDataTable.vue"
 import { formatDistance } from "date-fns"
-
+const showDeleted = ref(false)
 const { t } = useI18n()
 
 const headers = computed<{ title: string; key: keyof Tag }[]>(() => [
@@ -51,13 +73,16 @@ const {
   execute,
   isLoading: tagsLoading,
 } = $data.tag.getAll({
+  params: { isDeleted: false },
   options: { immediate: true },
 })
 
 const { execute: executeDelete } = $data.tag.delete({
-  options: { cb: () => execute() },
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
+})
+const { execute: executeHardDelete } = await $data.tag.deleteHard({
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-
 const parsedTags = computed(() => {
   if (tags.value) {
     return Object.values(tags.value as { [key: string]: Tag }).map((tag) => ({
@@ -69,7 +94,20 @@ const parsedTags = computed(() => {
   return []
 })
 
-const deleteTag = async (tag: Tag) => await executeDelete({ _id: tag._id })
+const deleteTag = async (tag: Tag) => {
+  if (showDeleted.value) {
+    await executeHardDelete({ _id: tag._id })
+  } else {
+    await executeDelete({ _id: tag._id })
+  }
+}
 
-$socket.on("tagCreated", () => execute())
+$socket.on("tagCreated", () => execute({ isDeleted: showDeleted.value }))
+watch(
+  showDeleted,
+  () => {
+    execute({ isDeleted: showDeleted.value })
+  },
+  { immediate: true },
+)
 </script>

package/plugins/pacifico__users/frontend/widgets/UserListWidget.vue

@@ -9,16 +9,39 @@
     :data-article="$t('workbench.userList.dataArticle')"
     :delete-validator="(user) => user._id !== $user?._id"
     @delete="deleteUser"
-  />
+    :itemsDeleted="showDeleted"
+  >
+    <template #actions>
+      <v-tooltip
+        :text="showDeleted ? $t('core.hideDeleted') : $t('core.showDeleted')"
+      >
+        <template v-slot:activator="{ props }">
+          <v-btn-toggle
+            density="compact"
+            v-bind="props"
+            v-model="showDeleted"
+            mandatory
+            :color="showDeleted ? 'error' : 'success'"
+          >
+            <v-btn :value="true">
+              <v-icon>mdi-table-eye-off</v-icon>
+            </v-btn>
+            <v-btn :value="false"><v-icon>mdi-table-eye</v-icon></v-btn>
+          </v-btn-toggle>
+        </template>
+      </v-tooltip>
+    </template>
+  </BaseDataTable>
 </template>
 
 <script setup lang="ts">
 import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
-import { computed } from "vue"
+import { computed, watch, ref } from "vue"
 import type { User } from "@raclettejs/core"
 import { formatDistance } from "date-fns"
 import { useI18n } from "vue-i18n"
 import BaseDataTable from "@app/components/BaseDataTable.vue"
+const showDeleted = ref(false)
 
 const props = defineProps<{
   uuid: string
@@ -51,22 +74,18 @@ const headers = computed<{ title: string; key: keyof User }[]>(() => [
 
 const { $data, $socket, $user } = usePluginApi("raclette__core")
 
-const {
-  data: users,
-  execute,
-  isLoading: usersLoading,
-} = $data.user.getAll({
-  options: { immediate: true },
-})
+const { data: users, execute, isLoading: usersLoading } = $data.user.getAll()
 
 const { data: tags, isLoading: tagsLoading } = $data.tag.getAll({
   options: { immediate: true },
 })
 
 const { execute: executeDelete } = $data.user.delete({
-  options: { cb: () => execute() },
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
+})
+const { execute: executeHardDelete } = await $data.user.deleteHard({
+  options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-
 const parsedUsers = computed(() => {
   if (users.value && tags.value) {
     return Object.values(users.value as { [key: string]: User }).map(
@@ -79,8 +98,20 @@ const parsedUsers = computed(() => {
   }
   return []
 })
+const deleteUser = async (user: User) => {
+  if (showDeleted.value) {
+    await executeHardDelete({ _id: user._id })
+  } else {
+    await executeDelete({ _id: user._id })
+  }
+}
 
-const deleteUser = async (user: User) => await executeDelete({ _id: user._id })
-
-$socket.on("userCreated", () => execute())
+$socket.on("userCreated", () => execute({ isDeleted: showDeleted.value }))
+watch(
+  showDeleted,
+  () => {
+    execute({ isDeleted: showDeleted.value })
+  },
+  { immediate: true },
+)
 </script>

package/services/frontend/src/app/components/BaseDataTable.vue

@@ -35,7 +35,6 @@
       <!-- Additional action buttons slot -->
       <slot name="actions" />
     </div>
-
     <!-- Data Table -->
     <v-data-table
       v-model:search="search"
@@ -47,6 +46,7 @@
       :items="items"
       :loading="loading"
       @click:row="handleRowClick"
+      :class="{ itemsDeleted }"
     >
       <template
         #item.color="{ item }"
@@ -112,50 +112,50 @@
       <!-- Additional table slots (this caused the table to be empty) -->
       <!-- <slot name="table-slots" /> -->
     </v-data-table>
-  </div>
-
-  <!-- Delete Confirmation Dialog -->
-  <v-dialog
-    v-model="deleteDialog"
-    max-width="400"
-    v-if="showDeleteAction && itemToDelete"
-  >
-    <v-card>
-      <v-card-title class="text-h6">
-        {{
-          $t("workbench.baseDataTable.deleteDataTitle", {
-            dataName,
-          })
-        }}
-      </v-card-title>
 
-      <v-card-text
-        v-html="
-          $t('workbench.baseDataTable.deleteDataConfirmMessage', {
-            article: dataArticle,
-            dataName,
-            value:
-              itemToDelete.email ||
-              itemToDelete.title ||
-              itemToDelete.name ||
-              itemToDelete._id,
-          })
-        "
-      />
-      <v-card-actions>
-        <v-spacer />
-        <v-btn variant="text" @click="deleteDialog = false">
-          {{ $t("workbench.baseDataTable.deleteDataConfirmCancel") }}
-        </v-btn>
-        <v-btn color="red" variant="flat" @click="confirmDelete">
-          {{ $t("workbench.baseDataTable.deleteDataConfirmButton") }}
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-
-  <!-- Additional dialogs slot -->
-  <slot name="dialogs" />
+    <!-- Delete Confirmation Dialog -->
+    <v-dialog
+      v-model="deleteDialog"
+      max-width="400"
+      v-if="showDeleteAction && itemToDelete"
+    >
+      <v-card>
+        <v-card-title class="text-h6">
+          {{
+            $t("workbench.baseDataTable.deleteDataTitle", {
+              dataName,
+            })
+          }}
+        </v-card-title>
+
+        <v-card-text
+          v-html="
+            $t('workbench.baseDataTable.deleteDataConfirmMessage', {
+              article: dataArticle,
+              dataName,
+              value:
+                itemToDelete.email ||
+                itemToDelete.title ||
+                itemToDelete.name ||
+                itemToDelete._id,
+            })
+          "
+        />
+        <v-card-actions>
+          <v-spacer />
+          <v-btn variant="text" @click="deleteDialog = false">
+            {{ $t("workbench.baseDataTable.deleteDataConfirmCancel") }}
+          </v-btn>
+          <v-btn color="red" variant="flat" @click="confirmDelete">
+            {{ $t("workbench.baseDataTable.deleteDataConfirmButton") }}
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+
+    <!-- Additional dialogs slot -->
+    <slot name="dialogs" />
+  </div>
 </template>
 
 <script setup lang="ts" generic="T extends Record<string, any>">
@@ -168,7 +168,7 @@ export interface BaseDataTableProps<T> {
   // Data props
   items?: T[]
   loading?: boolean
-
+  itemsDeleted?: boolean
   // Table configuration
   headers: Array<{
     title: string
@@ -201,6 +201,7 @@ export interface BaseDataTableProps<T> {
 const props = withDefaults(defineProps<BaseDataTableProps<T>>(), {
   uuid: undefined,
   items: () => [],
+  itemsDeleted: false,
   itemsPerPage: 50,
   showCreateButton: true,
   showActionsColumn: true,
@@ -292,3 +293,8 @@ const isDeleteDisabled = (item: T): boolean => {
   return props.deleteValidator ? !props.deleteValidator(item) : false
 }
 </script>
+<style lang="css">
+.itemsDeleted .v-data-table__tr {
+  background-color: rgb(233, 190, 190);
+}
+</style>

package/yarn.lock

@@ -476,10 +476,10 @@
   resolved "https://registry.yarnpkg.com/@pkgr/core/-/core-0.2.9.tgz#d229a7b7f9dac167a156992ef23c7f023653f53b"
   integrity sha512-QNqXyfVS2wm9hweSYD2O7F0G06uurj9kZ96TRQE5Y9hU7+tgdZwIkbAKc5Ocy1HxEY2kuDQa6cQ1WRs/O5LFKA==
 
-"@raclettejs/core@^0.1.14":
-  version "0.1.14"
-  resolved "https://registry.yarnpkg.com/@raclettejs/core/-/core-0.1.14.tgz#c49e0d23b21f3918501fed66f29c3b1f8b6b5af1"
-  integrity sha512-8uiqUZXZIFxqeW9hpzuuIONOpyb3v02Q+LZ0aV9ogLRijWGFJlDkGFYRPg9jC2NsDxo1znoOdinZLFvhPOhPhA==
+"@raclettejs/core@0.1.17":
+  version "0.1.17"
+  resolved "https://registry.yarnpkg.com/@raclettejs/core/-/core-0.1.17.tgz#36712a73791a5115b09c50fcbe8856793dd9ed9c"
+  integrity sha512-dMUW+/TikBRbZ4gOEvmSlwKJyRtvvGyJ9VFvhTbvYPMTjmnT/OzOIN9WMj6wG8b2tYFSNWtq+RNSQuc/G/nLxw==
   dependencies:
     chalk "5.6.2"
     chokidar "3.6.0"
@@ -492,10 +492,10 @@
     ramda "0.31.3"
     tsc-alias "1.8.16"
 
-"@raclettejs/types@^0.1.14":
-  version "0.1.14"
-  resolved "https://registry.yarnpkg.com/@raclettejs/types/-/types-0.1.14.tgz#585958921aaecab98dc301be4e1ce7207e90aeae"
-  integrity sha512-Uh3006SOIUDQw5LFvPj2ewLKglBnORNY+9IE9cqsDFHXZo++/9eBwaEGPvQKTJ6XbjpJPxUezKvbtaaE8MMIFg==
+"@raclettejs/types@0.1.17":
+  version "0.1.17"
+  resolved "https://registry.yarnpkg.com/@raclettejs/types/-/types-0.1.17.tgz#ced377e5fa8879a5790b1c0c838f621917032690"
+  integrity sha512-WBhi6Nf/XJPlisF1stEB0KGo5TWw+EMaTuYt39fJKc+Vtyf/SFmZqP2D3BKlssE5N/8bo2DFgf2qUeKowo0onA==
   dependencies:
     "@types/node" "24.5.2"
     fastify "5.6.0"