@raclettejs/workbench 0.1.36-canary.1 → 0.1.37

package/CHANGELOG.md

@@ -7,6 +7,42 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.1.37] - 2026-06-25 <a href="https://gitlab.com/raclettejs/core-dev/-/compare/v0.1.37...v0.1.37" target="_blank" rel="noopener"><b>Overview of all changes</b></a>
+
+
+### Patch Changes
+
+- fix: json importer and exporter fixed for workbench datatypes. Export selection reset after filter reset
+- Updated dependencies
+  - @raclettejs/core@0.1.37
+
+## [0.1.37] - 2026-06-25 <a href="https://gitlab.com/raclettejs/core-dev/-/compare/v0.1.36...v0.1.37" target="_blank" rel="noopener"><b>Overview of all changes</b></a>
+
+### Fixed
+
+- Importer can now properly import compositions and interactionLinks
+
+## [0.1.36] - 2026-06-22 <a href="https://gitlab.com/raclettejs/core-dev/-/compare/v0.1.35...v0.1.36" target="_blank" rel="noopener"><b>Overview of all changes</b></a>
+
+### Changed
+
+- Improved UX of workbenchs "create composition" flow
+- feat: Enhanced basedatatable to provide group by and footer slot abilities
+- WidgetLayout: removed icon as fallback option after image -> only render image or fallback block, never icon in WidgetRenderer
+- feat: added a workbench plugin which let's admins see all valkey entries in a datatable
+- Adjusted package.json to improve monorepo handling
+- Greatly imporoved the docs structure, hardened the code snipped interpolation logic
+
+### Updated
+
+- Updated dependencies
+- Updated dependencies
+- Updated dependencies
+- Updated dependencies
+- Updated dependencies
+- Updated dependencies
+  - @raclettejs/core@0.1.36
+
 ### Fixed
 
 - WidgetLayout: removed icon as fallback option after image -> only render image or fallback block, never icon in WidgetRenderer

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@raclettejs/workbench",
-  "version": "0.1.36-canary.1",
+  "version": "0.1.37",
   "license": "MIT",
   "description": "racletteJS Workbench - used to configure your application, for dev and prod",
   "repository": "https://gitlab.com/raclettejs/workbench",
@@ -33,7 +33,7 @@
     ".": "./index.ts"
   },
   "dependencies": {
-    "@raclettejs/core": "0.1.36-canary.1",
+    "@raclettejs/core": "0.1.37",
     "@vueuse/integrations": "14.2.1",
     "fuse.js": "7.1.0",
     "three": "0.183.2",
@@ -43,7 +43,7 @@
     "@emnapi/core": "1.9.2",
     "@emnapi/runtime": "1.9.2",
     "@eslint/js": "9.35.0",
-    "@raclettejs/types": "0.1.36-canary.1",
+    "@raclettejs/types": "0.1.37",
     "@sinclair/typebox": "0.34.48",
     "@types/ramda": "0.31.1",
     "@vueuse/core": "14.2.1",

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

@@ -3,6 +3,8 @@
     <BaseDataTable
       :items="parsedCompositions"
       :exportable-items="exportableCompositions"
+      export-row-shape="full-records"
+      :export-show-data-scope-switch="false"
       :loading="compositionsLoading || tagsLoading"
       :headers="headers"
       :row-click-handler="handleRowClick"
@@ -108,24 +110,15 @@ import type { Composition } from "@raclettejs/core"
 import { formatDistance } from "date-fns"
 import BaseDataTable from "@raclettejs/core/orchestrator/components/dataTable/BaseDataTable.vue"
 import { useI18n } from "vue-i18n"
-import {
-  mapJsonValues,
-  parseAndNormalizeWorkbenchImportJson,
-  resolveWorkbenchImportSelection,
-} from "@app/lib/jsonTools"
+import { recordsFromStore } from "@app/lib/workbenchListTransfer"
 import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
+import useWorkbenchListImport from "@app/composables/useWorkbenchListImport"
 import ImportSelectionDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSelectionDialog.vue"
 import ImportSummaryDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSummaryDialog.vue"
 
 const { t } = useI18n()
 const { goToCreate, goToEditById } = useWorkbenchTableActions()
 const showDeleted = ref(false)
-const showImportDialog = ref(false)
-const showImportSummary = ref(false)
-
-const importableItems = ref<any[]>([])
-const importedItems = ref<any[]>([])
-const pendingImportById = ref<Record<string, any>>({})
 
 const headers = computed<
   { title: string; key: keyof Composition | "actions" }[]
@@ -160,7 +153,7 @@ const props = defineProps<{
   uuid: string
 }>()
 
-const { $data, $socket, $user } = usePluginApi("raclette__core")
+const { $data, $socket } = usePluginApi("raclette__core")
 const { compositionSlots } = useRouteState()
 
 const COMPOSITION_LIST_PATH = "composition-list"
@@ -194,7 +187,20 @@ const { execute: executeRestore } = await $data.composition.updateRestore({
 const { execute: executeHardDelete } = await $data.composition.deleteHard({
   options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-const compositionTableRows = (relativeDates: boolean) => {
+
+const {
+  showImportDialog,
+  showImportSummary,
+  importableItems,
+  importedItems,
+  handleFileUpload,
+  handleImportConfirm,
+  finalizeImport,
+} = useWorkbenchListImport({
+  onBulkCreate: (items) => executeBulkCreate(items),
+})
+
+const compositionTableRows = () => {
   if (!compositions.value || !tags.value) {
     return []
   }
@@ -209,24 +215,16 @@ const compositionTableRows = (relativeDates: boolean) => {
     status: composition.status, // TODO: parse status
     statusIcon: getStatusIcon(composition.status),
     statusColor: getStatusColor(composition.status),
-    ...(relativeDates
-      ? {
-          createdAt: formatDistance(
-            new Date(composition.createdAt),
-            new Date(),
-          ),
-          updatedAt: formatDistance(
-            new Date(composition.updatedAt),
-            new Date(),
-          ),
-        }
-      : {}),
+    createdAt: formatDistance(new Date(composition.createdAt), new Date()),
+    updatedAt: formatDistance(new Date(composition.updatedAt), new Date()),
   }))
 }
 
-const parsedCompositions = computed(() => compositionTableRows(true))
+const parsedCompositions = computed(() => compositionTableRows())
 
-const exportableCompositions = computed(() => compositionTableRows(false))
+const exportableCompositions = computed(() =>
+  recordsFromStore(compositions.value as Record<string, Composition> | undefined),
+)
 
 // TODO: replace with composition status type
 const getStatusIcon = (status: string) => {
@@ -250,51 +248,6 @@ const getStatusColor = (status: string) => {
     return "#B66218"
   }
 }
-// Import functions
-const handleFileUpload = (content: string | ArrayBuffer) => {
-  if (typeof content !== "string") {
-    return
-  }
-  try {
-    const { items, byId } = parseAndNormalizeWorkbenchImportJson(content)
-    importableItems.value = items
-    pendingImportById.value = byId
-    showImportDialog.value = true
-  } catch (error) {
-    console.error("Failed to prepare import:", error)
-  }
-}
-
-const handleImportConfirm = (selectedIds: string[]) => {
-  importedItems.value = resolveWorkbenchImportSelection(
-    pendingImportById.value,
-    selectedIds,
-  )
-  showImportSummary.value = true
-}
-
-const finalizeImport = async () => {
-  const mapping = {
-    owner: $user.value._id,
-    lastEditor: $user.value._id,
-    createdBy: $user.value._id,
-  }
-
-  const dataToImport = importedItems.value.reduce((acc, item) => {
-    const mappedItem = mapJsonValues(item, mapping)
-    acc[item._id] = mappedItem
-    return acc
-  }, {} as any)
-
-  await executeBulkCreate(Object.values(dataToImport))
-  // TODO: Add your actual import logic here
-  // e.g., call an API endpoint to save the imported compositions
-
-  // Reset states
-  pendingImportById.value = {}
-  importableItems.value = []
-  importedItems.value = []
-}
 const deleteComposition = async (composition: Composition) => {
   if (showDeleted.value) {
     await executeHardDelete({ _id: composition._id })

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

@@ -3,6 +3,8 @@
     <BaseDataTable
       :items="parsedInteractionLinks"
       :exportable-items="exportableInteractionLinks"
+      export-row-shape="full-records"
+      :export-show-data-scope-switch="false"
       :loading="interactionLinksLoading || tagsLoading"
       :headers="headers"
       :row-click-handler="handleRowClick"
@@ -99,21 +101,13 @@ import { usePluginApi } from "@raclettejs/core/orchestrator/composables"
 import { formatDistance } from "date-fns"
 import { computed, ref, watch } from "vue"
 import { useI18n } from "vue-i18n"
-import {
-  mapJsonValues,
-  parseAndNormalizeWorkbenchImportJson,
-  resolveWorkbenchImportSelection,
-} from "@app/lib/jsonTools"
+import { recordsFromStore } from "@app/lib/workbenchListTransfer"
+import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
+import useWorkbenchListImport from "@app/composables/useWorkbenchListImport"
 import ImportSelectionDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSelectionDialog.vue"
 import ImportSummaryDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSummaryDialog.vue"
-import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
-const showDeleted = ref(false)
-const showImportDialog = ref(false)
-const showImportSummary = ref(false)
 
-const importableItems = ref<any[]>([])
-const importedItems = ref<any[]>([])
-const pendingImportById = ref<Record<string, any>>({})
+const showDeleted = ref(false)
 
 const { t } = useI18n()
 const { goToCreate, goToEditById } = useWorkbenchTableActions()
@@ -155,7 +149,7 @@ const props = defineProps<{
   uuid: string
 }>()
 
-const { $data, $socket, $user } = usePluginApi("raclette__core")
+const { $data, $socket } = usePluginApi("raclette__core")
 
 const {
   data: interactionLinks,
@@ -188,7 +182,41 @@ const { execute: executeHardDelete } = await $data.interactionLink.deleteHard({
 const { execute: executeRestore } = await $data.interactionLink.updateRestore({
   options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-const interactionLinkTableRows = (relativeDates: boolean) => {
+
+const enrichInteractionLinkDescription = (
+  link: Record<string, unknown>,
+): Record<string, unknown> => {
+  const enriched = { ...link }
+  let linkTitleString = `${enriched.slotType ?? ""}`
+  const triggers = enriched.triggers
+  if (Array.isArray(triggers)) {
+    for (const trigger of triggers) {
+      if (trigger && typeof trigger === "object") {
+        const settings = (trigger as { settings?: { title?: { default?: string } } })
+          .settings
+        const type = (trigger as { type?: string }).type ?? ""
+        linkTitleString += `${type} - ${settings?.title?.default ?? ""} `
+      }
+    }
+  }
+  enriched.description = linkTitleString + (enriched.description ?? "")
+  return enriched
+}
+
+const {
+  showImportDialog,
+  showImportSummary,
+  importableItems,
+  importedItems,
+  handleFileUpload,
+  handleImportConfirm,
+  finalizeImport,
+} = useWorkbenchListImport({
+  prepareRecord: enrichInteractionLinkDescription,
+  onBulkCreate: (items) => executeBulkCreate(items),
+})
+
+const interactionLinkTableRows = () => {
   if (!interactionLinks.value || !tags.value) {
     return []
   }
@@ -202,25 +230,23 @@ const interactionLinkTableRows = (relativeDates: boolean) => {
     lastEditor: users.value?.[interactionLink.author]?.email,
     author: users.value?.[interactionLink.author]?.email,
     triggers: interactionLink.triggers.length,
-    ...(relativeDates
-      ? {
-          createdAt: formatDistance(
-            new Date(interactionLink.createdAt),
-            new Date(),
-          ),
-          updatedAt: formatDistance(
-            new Date(interactionLink.updatedAt),
-            new Date(),
-          ),
-        }
-      : {}),
+    createdAt: formatDistance(
+      new Date(interactionLink.createdAt),
+      new Date(),
+    ),
+    updatedAt: formatDistance(
+      new Date(interactionLink.updatedAt),
+      new Date(),
+    ),
   }))
 }
 
-const parsedInteractionLinks = computed(() => interactionLinkTableRows(true))
+const parsedInteractionLinks = computed(() => interactionLinkTableRows())
 
 const exportableInteractionLinks = computed(() =>
-  interactionLinkTableRows(false),
+  recordsFromStore(
+    interactionLinks.value as Record<string, InteractionLink> | undefined,
+  ),
 )
 const restore = async (_id: string) => {
   executeRestore({ _id })
@@ -240,62 +266,6 @@ const deleteInteractionLink = async (interactionLink: InteractionLink) => {
 $socket.on("interactionLinkCreated", () =>
   execute({ isDeleted: showDeleted.value }),
 )
-const createTitleString = (link) => {
-  let linkTitleString = `${link.slotType}`
-  if (link.triggers) {
-    link.triggers.forEach((trigger) => {
-      linkTitleString += `${trigger.type} - ${trigger.settings?.title?.default} `
-    })
-  }
-  link.description = linkTitleString + link.description
-  return link
-}
-
-// Import functions
-const handleFileUpload = (content: string | ArrayBuffer) => {
-  if (typeof content !== "string") {
-    return
-  }
-  try {
-    const { items, byId } = parseAndNormalizeWorkbenchImportJson(content)
-    importableItems.value = items
-    pendingImportById.value = byId
-    showImportDialog.value = true
-  } catch (error) {
-    console.error("Failed to prepare import:", error)
-  }
-}
-
-const handleImportConfirm = (selectedIds: string[]) => {
-  importedItems.value = resolveWorkbenchImportSelection(
-    pendingImportById.value,
-    selectedIds,
-  )
-  showImportSummary.value = true
-}
-
-const finalizeImport = async () => {
-  const mapping = {
-    owner: $user.value._id,
-    lastEditor: $user.value._id,
-    createdBy: $user.value._id,
-  }
-
-  const dataToImport = importedItems.value.reduce((acc, item) => {
-    const mappedItem = mapJsonValues(item, mapping)
-    acc[item._id] = createTitleString(mappedItem)
-    return acc
-  }, {} as any)
-
-  await executeBulkCreate(Object.values(dataToImport))
-  // TODO: Add your actual import logic here
-  // e.g., call an API endpoint to save the imported compositions
-
-  // Reset states
-  pendingImportById.value = {}
-  importableItems.value = []
-  importedItems.value = []
-}
 watch(
   showDeleted,
   () => {

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

@@ -3,6 +3,8 @@
     <BaseDataTable
       :items="parsedTags"
       :exportable-items="exportableTags"
+      export-row-shape="full-records"
+      :export-show-data-scope-switch="false"
       :loading="tagsLoading"
       :headers="headers"
       :row-click-handler="handleRowClick"
@@ -92,23 +94,15 @@ import type { Tag } from "@raclettejs/core"
 import { useI18n } from "vue-i18n"
 import BaseDataTable from "@raclettejs/core/orchestrator/components/dataTable/BaseDataTable.vue"
 import { formatDistance } from "date-fns"
-import {
-  mapJsonValues,
-  parseAndNormalizeWorkbenchImportJson,
-  resolveWorkbenchImportSelection,
-} from "@app/lib/jsonTools"
+import { recordsFromStore } from "@app/lib/workbenchListTransfer"
+import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
+import useWorkbenchListImport from "@app/composables/useWorkbenchListImport"
 import ImportSelectionDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSelectionDialog.vue"
 import ImportSummaryDialog from "@raclettejs/core/orchestrator/components/dataImport/ImportSummaryDialog.vue"
-import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
+
 const showDeleted = ref(false)
 const { t } = useI18n()
 const { goToCreate, goToEditById } = useWorkbenchTableActions()
-const showImportDialog = ref(false)
-const showImportSummary = ref(false)
-
-const importableItems = ref<any[]>([])
-const importedItems = ref<any[]>([])
-const pendingImportById = ref<Record<string, any>>({})
 const headers = computed<{ title: string; key: keyof Tag }[]>(() => [
   {
     title: t("workbench.tagList.tableHeaders.title"),
@@ -132,7 +126,7 @@ const props = defineProps<{
   uuid: string
 }>()
 
-const { $data, $socket, $user } = usePluginApi("raclette__core")
+const { $data, $socket } = usePluginApi("raclette__core")
 
 const {
   data: tags,
@@ -155,7 +149,20 @@ const { execute: executeHardDelete } = await $data.tag.deleteHard({
 const { execute: executeRestore } = await $data.tag.updateRestore({
   options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-const tagTableRows = (relativeUpdatedAt: boolean) => {
+
+const {
+  showImportDialog,
+  showImportSummary,
+  importableItems,
+  importedItems,
+  handleFileUpload,
+  handleImportConfirm,
+  finalizeImport,
+} = useWorkbenchListImport({
+  onBulkCreate: (items) => executeBulkCreate(items),
+})
+
+const tagTableRows = () => {
   if (!tags.value) {
     return []
   }
@@ -163,15 +170,15 @@ const tagTableRows = (relativeUpdatedAt: boolean) => {
   return Object.values(tags.value as { [key: string]: Tag }).map((tag) => ({
     ...tag,
     tags: tag?.tags?.map((t) => tags.value?.[t]) ?? [],
-    ...(relativeUpdatedAt
-      ? { updatedAt: formatDistance(new Date(tag.updatedAt), new Date()) }
-      : {}),
+    updatedAt: formatDistance(new Date(tag.updatedAt), new Date()),
   }))
 }
 
-const parsedTags = computed(() => tagTableRows(true))
+const parsedTags = computed(() => tagTableRows())
 
-const exportableTags = computed(() => tagTableRows(false))
+const exportableTags = computed(() =>
+  recordsFromStore(tags.value as Record<string, Tag> | undefined),
+)
 
 const deleteTag = async (tag: Tag) => {
   if (showDeleted.value) {
@@ -180,51 +187,6 @@ const deleteTag = async (tag: Tag) => {
     await executeDelete({ _id: tag._id })
   }
 }
-// Import functions
-const handleFileUpload = (content: string | ArrayBuffer) => {
-  if (typeof content !== "string") {
-    return
-  }
-  try {
-    const { items, byId } = parseAndNormalizeWorkbenchImportJson(content)
-    importableItems.value = items
-    pendingImportById.value = byId
-    showImportDialog.value = true
-  } catch (error) {
-    console.error("Failed to prepare import:", error)
-  }
-}
-
-const handleImportConfirm = (selectedIds: string[]) => {
-  importedItems.value = resolveWorkbenchImportSelection(
-    pendingImportById.value,
-    selectedIds,
-  )
-  showImportSummary.value = true
-}
-
-const finalizeImport = async () => {
-  const mapping = {
-    owner: $user.value._id,
-    lastEditor: $user.value._id,
-    createdBy: $user.value._id,
-  }
-
-  const dataToImport = importedItems.value.reduce((acc, item) => {
-    const mappedItem = mapJsonValues(item, mapping)
-    acc[item._id] = mappedItem
-    return acc
-  }, {} as any)
-
-  await executeBulkCreate(Object.values(dataToImport))
-  // TODO: Add your actual import logic here
-  // e.g., call an API endpoint to save the imported compositions
-
-  // Reset states
-  pendingImportById.value = {}
-  importableItems.value = []
-  importedItems.value = []
-}
 const restore = async (_id: string) => {
   executeRestore({ _id })
 }

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

@@ -3,6 +3,8 @@
     <BaseDataTable
       :items="parsedUsers"
       :exportable-items="exportableUsers"
+      export-row-shape="full-records"
+      :export-show-data-scope-switch="false"
       :loading="usersLoading || tagsLoading"
       :headers="headers"
       :row-click-handler="handleRowClick"
@@ -74,6 +76,7 @@ import type { User } from "@raclettejs/core"
 import { formatDistance } from "date-fns"
 import { useI18n } from "vue-i18n"
 import BaseDataTable from "@raclettejs/core/orchestrator/components/dataTable/BaseDataTable.vue"
+import { recordsFromStore } from "@app/lib/workbenchListTransfer"
 import { useWorkbenchTableActions } from "@app/composables/useWorkbenchTableActions"
 const showDeleted = ref(false)
 
@@ -123,7 +126,7 @@ const { execute: executeHardDelete } = await $data.user.deleteHard({
 const { execute: executeRestore } = await $data.user.updateRestore({
   options: { cb: () => execute({ isDeleted: showDeleted.value }) },
 })
-const userTableRows = (relativeUpdatedAt: boolean) => {
+const userTableRows = () => {
   if (!users.value || !tags.value) {
     return []
   }
@@ -131,15 +134,15 @@ const userTableRows = (relativeUpdatedAt: boolean) => {
   return Object.values(users.value as { [key: string]: User }).map((user) => ({
     ...user,
     tags: user.tags.map((tag) => tags.value?.[tag]),
-    ...(relativeUpdatedAt
-      ? { updatedAt: formatDistance(new Date(user.updatedAt), new Date()) }
-      : {}),
+    updatedAt: formatDistance(new Date(user.updatedAt), new Date()),
   }))
 }
 
-const parsedUsers = computed(() => userTableRows(true))
+const parsedUsers = computed(() => userTableRows())
 
-const exportableUsers = computed(() => userTableRows(false))
+const exportableUsers = computed(() =>
+  recordsFromStore(users.value as Record<string, User> | undefined),
+)
 const deleteUser = async (user: User) => {
   if (showDeleted.value) {
     await executeHardDelete({ _id: user._id })

package/plugins/raclette__cache/backend/helpers/cacheEntryBuilder.ts

@@ -11,6 +11,8 @@ export type CacheEntrySource = {
   valuePreview?: string
   truncated: boolean
   valueParsed?: unknown
+  /** True when `valueParsed` was built from the full stored value (not the transport slice). */
+  valueParsedFromFullValue?: boolean
   ttl: number
   ttlLabel: string
 }
@@ -51,6 +53,7 @@ export const buildCacheEntrySource = (
   const sanitized = sanitizeCacheEntryFields(truncatedFields)
 
   let valueParsed = sanitized.valueParsed
+  let valueParsedFromFullValue = false
 
   if (attachFullParsed && truncatedFields.truncated) {
     const fullSanitized = sanitizeCacheEntryFields({
@@ -59,6 +62,7 @@ export const buildCacheEntrySource = (
     })
     if (fullSanitized.valueParsed !== undefined) {
       valueParsed = fullSanitized.valueParsed
+      valueParsedFromFullValue = true
     }
   }
 
@@ -69,6 +73,7 @@ export const buildCacheEntrySource = (
     valuePreview: sanitized.valuePreview,
     truncated: sanitized.truncated,
     valueParsed,
+    valueParsedFromFullValue: valueParsedFromFullValue || undefined,
     ttl,
     ttlLabel: formatTtlLabel(ttl),
   }

package/plugins/raclette__cache/frontend/utils/formatCacheEntryDisplay.ts

@@ -0,0 +1,191 @@
+/** Injected into repaired JSON so viewers know the payload is incomplete. */
+export const TRUNCATION_MARKER = "__raclette_truncated__"
+
+const TRUNCATION_NOTICE =
+  "Value was cut for transport; remainder omitted. Do not treat as complete source of truth."
+
+type CacheEntryDisplaySource = {
+  value: string
+  truncated: boolean
+  valueParsed?: unknown
+  valueParsedFromFullValue?: boolean
+}
+
+const prettyJson = (value: unknown): string => JSON.stringify(value, null, 2)
+
+const appendTruncationNotice = (body: string): string =>
+  `${body}\n\n/* ${TRUNCATION_NOTICE} */`
+
+/**
+ * Close open strings/arrays/objects after an abrupt cut so JSON.parse may succeed
+ * on a prefix of the original document.
+ */
+export const repairTruncatedJson = (raw: string): string => {
+  const text = raw.trimEnd()
+  if (!text.length) {
+    return text
+  }
+
+  try {
+    JSON.parse(text)
+    return text
+  } catch {
+    // continue with repair
+  }
+
+  const stack: ("{" | "[")[] = []
+  let inString = false
+  let escaped = false
+  let lastCompleteTopLevel = 0
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i]
+
+    if (inString) {
+      if (escaped) {
+        escaped = false
+      } else if (char === "\\") {
+        escaped = true
+      } else if (char === '"') {
+        inString = false
+      }
+      continue
+    }
+
+    if (char === '"') {
+      inString = true
+      continue
+    }
+
+    if (char === "{") {
+      stack.push("{")
+      continue
+    }
+
+    if (char === "[") {
+      stack.push("[")
+      continue
+    }
+
+    if (char === "}") {
+      if (stack.at(-1) === "{") {
+        stack.pop()
+        if (stack.length === 0) {
+          lastCompleteTopLevel = i + 1
+        }
+      }
+      continue
+    }
+
+    if (char === "]") {
+      if (stack.at(-1) === "[") {
+        stack.pop()
+        if (stack.length === 0) {
+          lastCompleteTopLevel = i + 1
+        }
+      }
+    }
+  }
+
+  let candidate = text
+  if (inString || stack.length > 0) {
+    if (lastCompleteTopLevel > 0) {
+      candidate = text.slice(0, lastCompleteTopLevel)
+    }
+  }
+
+  candidate = candidate.replace(/,\s*$/, "")
+
+  const openStack: ("{" | "[")[] = []
+  inString = false
+  escaped = false
+
+  for (let i = 0; i < candidate.length; i++) {
+    const char = candidate[i]
+    if (inString) {
+      if (escaped) escaped = false
+      else if (char === "\\") escaped = true
+      else if (char === '"') inString = false
+      continue
+    }
+    if (char === '"') {
+      inString = true
+      continue
+    }
+    if (char === "{") openStack.push("{")
+    else if (char === "[") openStack.push("[")
+    else if (char === "}" && openStack.at(-1) === "{") openStack.pop()
+    else if (char === "]" && openStack.at(-1) === "[") openStack.pop()
+  }
+
+  if (inString) {
+    const lastQuote = candidate.lastIndexOf('"')
+    candidate = lastQuote > 0 ? candidate.slice(0, lastQuote) : candidate
+    candidate = candidate.replace(/,\s*"[^"]*$/, "")
+    candidate = candidate.replace(/:\s*$/, "")
+  }
+
+  while (openStack.length > 0) {
+    const open = openStack.pop()
+    candidate += open === "{" ? "}" : "]"
+  }
+
+  candidate = candidate.replace(/,\s*([}\]])/g, "$1")
+
+  return candidate
+}
+
+const withTruncationMarker = (parsed: unknown): unknown => {
+  if (parsed !== null && typeof parsed === "object" && !Array.isArray(parsed)) {
+    return {
+      ...parsed,
+      [TRUNCATION_MARKER]: TRUNCATION_NOTICE,
+    }
+  }
+
+  return {
+    [TRUNCATION_MARKER]: TRUNCATION_NOTICE,
+    value: parsed,
+  }
+}
+
+/**
+ * Pretty-print a cache entry for <pre> display.
+ * Recovers structure from truncated JSON when possible and always signals truncation.
+ */
+export const formatCacheEntryDisplay = (entry: CacheEntryDisplaySource): string => {
+  if (!entry.truncated) {
+    if (entry.valueParsed !== undefined) {
+      return prettyJson(entry.valueParsed)
+    }
+    try {
+      return prettyJson(JSON.parse(entry.value))
+    } catch {
+      return entry.value
+    }
+  }
+
+  if (
+    entry.valueParsed !== undefined &&
+    entry.valueParsedFromFullValue
+  ) {
+    return prettyJson(entry.valueParsed)
+  }
+
+  if (entry.valueParsed !== undefined) {
+    return appendTruncationNotice(prettyJson(entry.valueParsed))
+  }
+
+  try {
+    return appendTruncationNotice(prettyJson(JSON.parse(entry.value)))
+  } catch {
+    const repaired = repairTruncatedJson(entry.value)
+    try {
+      return appendTruncationNotice(
+        prettyJson(withTruncationMarker(JSON.parse(repaired))),
+      )
+    } catch {
+      return `${entry.value}\n\n… [${TRUNCATION_NOTICE}]`
+    }
+  }
+}

package/plugins/raclette__cache/frontend/widgets/CacheListWidget.vue

@@ -257,7 +257,11 @@
         </v-card-subtitle>
         <v-card-text>
           <v-alert
-            v-if="selectedEntry.truncated"
+            v-if="
+              selectedEntry.truncated &&
+              !selectedEntry.valueParsedFromFullValue &&
+              selectedEntry.valueParsed === undefined
+            "
             type="warning"
             density="compact"
             class="tw:mb-3"
@@ -294,6 +298,7 @@ import {
   isScalarFallbackResult,
   type ValueTableHeader,
 } from "../utils/cacheValueTableRows"
+import { formatCacheEntryDisplay } from "../utils/formatCacheEntryDisplay"
 import { computed, onMounted, ref } from "vue"
 import { useI18n } from "vue-i18n"
 
@@ -305,6 +310,7 @@ type CacheEntry = {
   valuePreview?: string
   truncated: boolean
   valueParsed?: unknown
+  valueParsedFromFullValue?: boolean
   ttl: number
   ttlLabel: string
 }
@@ -440,7 +446,7 @@ const showValueTruncatedWarning = computed(() => {
   if (!isValueView.value || !entry?.truncated) {
     return false
   }
-  return entry.valueParsed === undefined
+  return !entry.valueParsedFromFullValue && entry.valueParsed === undefined
 })
 
 const valueTableDataName = computed(() => {
@@ -530,6 +536,7 @@ const toTableRow = (entry: Partial<CacheEntry> & { key?: string }): CacheEntry =
     valuePreview: entry.valuePreview,
     truncated: entry.truncated ?? false,
     valueParsed: entry.valueParsed,
+    valueParsedFromFullValue: entry.valueParsedFromFullValue,
     ttl: entry.ttl ?? -2,
     ttlLabel: entry.ttlLabel ?? "",
   }
@@ -638,12 +645,7 @@ const displayValue = (item: CacheEntry) => {
   return item.value
 }
 
-const formatDetailValue = (item: CacheEntry) => {
-  if (item.valueParsed !== undefined) {
-    return JSON.stringify(item.valueParsed, null, 2)
-  }
-  return item.value
-}
+const formatDetailValue = (item: CacheEntry) => formatCacheEntryDisplay(item)
 
 const formatValueTableCell = (value: string | undefined) => value ?? ""
 

package/services/frontend/src/app/composables/useWorkbenchListImport.ts

@@ -0,0 +1,74 @@
+import { ref } from "vue"
+import {
+  indexRecordsById,
+  parseWorkbenchListImport,
+  resolveSelectedRecords,
+  toBulkCreateBody,
+  type WorkbenchListRecord,
+} from "@app/lib/workbenchListTransfer"
+
+export interface UseWorkbenchListImportOptions {
+  onBulkCreate: (items: WorkbenchListRecord[]) => Promise<void>
+  /** Optional per-datatype tweak after server-field omission (e.g. interaction-link description). */
+  prepareRecord?: (record: WorkbenchListRecord) => WorkbenchListRecord
+}
+
+/**
+ * File upload → selection dialog → summary dialog → `createBulk`.
+ */
+export const useWorkbenchListImport = (
+  options: UseWorkbenchListImportOptions,
+) => {
+  const showImportDialog = ref(false)
+  const showImportSummary = ref(false)
+  const importableItems = ref<WorkbenchListRecord[]>([])
+  const importedItems = ref<WorkbenchListRecord[]>([])
+  const pendingImportById = ref<Record<string, WorkbenchListRecord>>({})
+
+  const resetImportState = () => {
+    pendingImportById.value = {}
+    importableItems.value = []
+    importedItems.value = []
+  }
+
+  const handleFileUpload = (content: string | ArrayBuffer) => {
+    if (typeof content !== "string") {
+      return
+    }
+    try {
+      const records = parseWorkbenchListImport(content)
+      importableItems.value = records
+      pendingImportById.value = indexRecordsById(records)
+      showImportDialog.value = true
+    } catch (error) {
+      console.error("Failed to prepare import:", error)
+    }
+  }
+
+  const handleImportConfirm = (selectedIds: string[]) => {
+    importedItems.value = resolveSelectedRecords(
+      pendingImportById.value,
+      selectedIds,
+    )
+    showImportSummary.value = true
+  }
+
+  const finalizeImport = async () => {
+    await options.onBulkCreate(
+      toBulkCreateBody(importedItems.value, options.prepareRecord),
+    )
+    resetImportState()
+  }
+
+  return {
+    showImportDialog,
+    showImportSummary,
+    importableItems,
+    importedItems,
+    handleFileUpload,
+    handleImportConfirm,
+    finalizeImport,
+  }
+}
+
+export default useWorkbenchListImport

package/services/frontend/src/app/lib/workbenchListTransfer.ts

@@ -0,0 +1,89 @@
+/**
+ * Workbench list JSON transfer format (export and import).
+ *
+ * ```json
+ * [
+ *   { "_id": "uuid", "title": "…", … }
+ * ]
+ * ```
+ *
+ * - Export: raw store records via `recordsFromStore`, matched to table selection in
+ *   `BaseDataTable` (`export-row-shape="full-records"`).
+ * - Import: same array shape; server-owned fields are omitted before `createBulk`.
+ */
+
+export type WorkbenchListRecord = Record<string, unknown>
+
+/** Fields present on store documents but not accepted by bulk-create APIs. */
+const BULK_CREATE_OMIT_KEYS = new Set([
+  "createdAt",
+  "updatedAt",
+  "isDeleted",
+  "author",
+  "lastEditor",
+  "owner",
+  "createdBy",
+])
+
+const isRecord = (value: unknown): value is WorkbenchListRecord =>
+  value != null && typeof value === "object" && !Array.isArray(value)
+
+/** Store map (`{ [_id]: T }`) → array for `exportable-items`. */
+export const recordsFromStore = <T extends WorkbenchListRecord>(
+  store: Record<string, T> | null | undefined,
+): T[] => Object.values(store ?? {}) as T[]
+
+/** Parse an exported workbench list JSON file. */
+export const parseWorkbenchListImport = (
+  content: string,
+): WorkbenchListRecord[] => {
+  let parsed: unknown
+  try {
+    parsed = JSON.parse(content)
+  } catch {
+    throw new Error("Invalid JSON file.")
+  }
+
+  if (!Array.isArray(parsed)) {
+    throw new Error("Import file must be a JSON array of records.")
+  }
+
+  const records = parsed.filter(isRecord)
+  if (!records.length) {
+    throw new Error("Import file must contain at least one record.")
+  }
+
+  for (const record of records) {
+    if (record._id == null || record._id === "") {
+      throw new Error("Every record must have an _id.")
+    }
+  }
+
+  return records
+}
+
+export const indexRecordsById = (
+  records: WorkbenchListRecord[],
+): Record<string, WorkbenchListRecord> =>
+  Object.fromEntries(records.map((record) => [String(record._id), record]))
+
+export const resolveSelectedRecords = (
+  byId: Record<string, WorkbenchListRecord>,
+  selectedIds: string[],
+): WorkbenchListRecord[] =>
+  selectedIds
+    .map((id) => byId[id])
+    .filter((record): record is WorkbenchListRecord => record != null)
+
+/** Drop server-owned fields before POSTing to `createBulk`. */
+export const toBulkCreateBody = (
+  records: WorkbenchListRecord[],
+  prepare?: (record: WorkbenchListRecord) => WorkbenchListRecord,
+): WorkbenchListRecord[] =>
+  records.map((record) => {
+    const body: WorkbenchListRecord = { ...record }
+    for (const key of BULK_CREATE_OMIT_KEYS) {
+      delete body[key]
+    }
+    return prepare ? prepare(body) : body
+  })

package/services/frontend/src/app/lib/jsonTools.ts

@@ -1,147 +0,0 @@
-/**
- * Parsed workbench list import: rows for {@link SelectionDialog} and a map by `_id` for confirm.
- */
-export interface WorkbenchImportNormalization {
-  items: Record<string, unknown>[]
-  byId: Record<string, Record<string, unknown>>
-}
-
-/**
- * Parses JSON from a table export (array of records with `_id`) into dialog state.
- * Rejects non-arrays so imports match the current export format only.
- */
-export const parseAndNormalizeWorkbenchImportJson = (
-  content: string,
-): WorkbenchImportNormalization => {
-  let parsed: unknown
-  try {
-    parsed = JSON.parse(content)
-  } catch {
-    throw new Error("Invalid JSON file.")
-  }
-
-  if (!Array.isArray(parsed)) {
-    throw new Error(
-      "Imported JSON must be an array of records (export from the data table).",
-    )
-  }
-
-  const byId: Record<string, Record<string, unknown>> = {}
-  const items: Record<string, unknown>[] = []
-
-  for (const entry of parsed) {
-    if (!entry || typeof entry !== "object" || Array.isArray(entry)) {
-      continue
-    }
-    const row = entry as Record<string, unknown>
-    const id = row._id
-    if (id === undefined || id === null || id === "") {
-      continue
-    }
-    const sid = String(id)
-    byId[sid] = row
-    items.push(row)
-  }
-
-  if (!items.length) {
-    throw new Error(
-      "No importable records found. Each entry must be an object with an _id.",
-    )
-  }
-
-  return { items, byId }
-}
-
-/** Resolve selected `_id`s using the `byId` map from {@link parseAndNormalizeWorkbenchImportJson}. */
-export const resolveWorkbenchImportSelection = <
-  T extends Record<string, unknown>,
->(
-  byId: Record<string, T>,
-  selectedIds: string[],
-): T[] =>
-  selectedIds
-    .map((id) => byId[id])
-    .filter((item): item is T => item != null)
-
-/**
- * Downloads a JSON object as a .json file
- * @param {Object|Array} data - The data to be downloaded as JSON
- * @param {string} filename - The name of the file (without .json extension)
- * @throws {Error} If data cannot be serialized to JSON
- */
-export const downloadJson = (data, filename = "download") => {
-  try {
-    // Convert data to JSON string with pretty formatting
-    const jsonString = JSON.stringify(data, null, 2)
-
-    // Create blob from JSON string
-    const blob = new Blob([jsonString], { type: "application/json" })
-
-    // Create download link
-    const url = URL.createObjectURL(blob)
-    const link = document.createElement("a")
-
-    // Ensure filename has .json extension
-    const normalizedFilename = filename.endsWith(".json")
-      ? filename
-      : `${filename}.json`
-
-    link.href = url
-    link.download = normalizedFilename
-
-    // Trigger download
-    document.body.appendChild(link)
-    link.click()
-
-    // Cleanup
-    document.body.removeChild(link)
-    URL.revokeObjectURL(url)
-  } catch (error) {
-    console.error("Failed to download JSON:", error)
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`Unable to download JSON file: ${message}`)
-  }
-}
-/**
- * Recursively maps values in a JSON object based on a mapping configuration
- * @param {Object|Array} data - The source JSON data to transform
- * @param {Object} mapping - Mapping object where keys are attribute names and values are replacement values
- * @returns {Object|Array} New object with mapped values
- * @throws {Error} If data cannot be processed
- *
- * @example
- * const data = { owner: 'user123', name: 'Project A', lastEditor: 'user123' };
- * const mapping = { owner: 'user456', lastEditor: 'user789' };
- * const result = mapJsonValues(data, mapping);
- * // Result: { owner: 'user456', name: 'Project A', lastEditor: 'user789' }
- */
-export const mapJsonValues = (data, mapping = {}) => {
-  if (!data || typeof data !== "object") {
-    return data
-  }
-
-  // Handle arrays
-  if (Array.isArray(data)) {
-    return data.map((item) => mapJsonValues(item, mapping))
-  }
-
-  // Handle objects
-  const result = {}
-
-  for (const [key, value] of Object.entries(data)) {
-    // If this key exists in mapping, use the mapped value
-    if (key in mapping) {
-      result[key] = mapping[key]
-    }
-    // If value is an object or array, recursively process it
-    else if (value && typeof value === "object") {
-      result[key] = mapJsonValues(value, mapping)
-    }
-    // Otherwise keep the original value
-    else {
-      result[key] = value
-    }
-  }
-
-  return result
-}