@translationstudio/translationstudio-strapi-extension 4.1.1 → 4.3.0

package/dist/Types.d.ts

@@ -143,6 +143,9 @@ export interface ImportPayload {
         keep?: TranslatedDocumentReplaceFields;
     }[];
 }
+export type HistoryDataMap = {
+    [id: string]: HistoryItem[];
+};
 export interface HistoryItem {
     'time-intranslation': number;
     'project-name': string;
@@ -152,6 +155,7 @@ export interface HistoryItem {
     'time-updated': number;
     'element-name': string;
     'time-requested': number;
+    'id': string;
 }
 export interface ContentType {
     uid: string;
@@ -167,7 +171,7 @@ export interface Entry {
     [key: string]: any;
 }
 export interface BulkTranslationMenuProps {
-    historyData: HistoryItem[];
+    historyData: HistoryDataMap;
     isLoadingHistory: boolean;
     onTranslationComplete?: () => void;
 }

package/dist/_chunks/{App-5ldte7Ku.js → App-C2A-alX9.js}

@@ -5,7 +5,7 @@ const admin = require("@strapi/strapi/admin");
 const reactRouterDom = require("react-router-dom");
 const designSystem = require("@strapi/design-system");
 const react = require("react");
-const index = require("./index-DkASHLO0.js");
+const index = require("./index-Dgpsawos.js");
 const apiService = {
   async loadLicense(get) {
     try {

package/dist/_chunks/{App-DQUxEmfa.mjs → App-CUYIBOWI.mjs}

@@ -3,7 +3,7 @@ import { getFetchClient, Page } from "@strapi/strapi/admin";
 import { Routes, Route } from "react-router-dom";
 import { Main, Box, Alert, Grid, Typography, TextInput, Switch, Button } from "@strapi/design-system";
 import { useState, useCallback, useEffect } from "react";
-import { T as TranslationstudioLogo } from "./index-DF5d8Feh.mjs";
+import { T as TranslationstudioLogo } from "./index-Csx0xlBL.mjs";
 const apiService = {
   async loadLicense(get) {
     try {

package/dist/_chunks/{HistoryPage-Cwm3HJc9.mjs → HistoryPage-AhmPF4m4.mjs}

@@ -1,8 +1,9 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { Box, Typography, TextInput, Table, Thead, Tr, Tbody, Td, Badge, Th, Button, Radio, Checkbox, DatePicker, ProgressBar, Alert, Main, Grid, Flex } from "@strapi/design-system";
+import { Modal, Typography, Button, Box, Alert, TextInput, Table, Thead, Tr, Th, Tbody, Td, Badge, SimpleMenu, IconButton, MenuItem, Radio, Checkbox, DatePicker, ProgressBar, Main, Grid, Flex } from "@strapi/design-system";
 import { useState, useEffect, useMemo } from "react";
 import { getFetchClient } from "@strapi/strapi/admin";
-import { g as groupHistoryData, f as formatDate, h as handleHistoryResponse, a as getThemeColors, u as useThemeMode, b as getStoredEmail, c as getSubmitLabel, s as setStoredEmail, v as validateDueDate, d as createEntryUid, e as determineEntryName, i as createTranslationPayload, j as createSuccessMessage, k as createErrorMessage, l as createGeneralErrorMessage, T as TranslationstudioLogo } from "./index-DF5d8Feh.mjs";
+import { g as getThemeColors, a as groupHistoryData, G as GetStatusColor, b as GetStatusText, f as formatDate, h as handleHistoryResponse, u as useThemeMode, c as getStoredEmail, d as getSubmitLabel, s as setStoredEmail, v as validateDueDate, e as createEntryUid, i as determineEntryName, j as createTranslationPayload, k as createSuccessMessage, l as createErrorMessage, m as createGeneralErrorMessage, n as getElementStatus, T as TranslationstudioLogo } from "./index-Csx0xlBL.mjs";
+import { Trash, More, Bell } from "@strapi/icons";
 const getSearchableText = (item) => {
   return `${item["project-name"]} ${item["element-name"]} ${item["element-uid"]} ${item.targetLanguages.join(" ")} ${item.combinedStatus.text}`.toLowerCase();
 };
@@ -12,19 +13,33 @@ const filterBySearchTerm = (items, searchTerm, getSearchableText2) => {
   return items.filter((item) => getSearchableText2(item).includes(lowerSearchTerm));
 };
 const getSortValue = (item, sortField) => {
-  if (sortField === "status") {
-    return item.combinedStatus.text.toLowerCase();
-  }
-  if (sortField === "target-language") {
-    return item.targetLanguages.join(", ").toLowerCase();
+  switch (sortField) {
+    case "project-name":
+    case "element-uid":
+      return item["element-uid"] ?? "";
+    case "status":
+      return item["status"] ?? "";
+    case "element-name":
+      return item["element-name"];
+    case "target-language":
+      return item["targetLanguage"] ?? "";
+    case "time-imported":
+      return item.timeUpdated ?? 0;
+    default:
+      return "";
   }
-  return item[sortField].toString().toLowerCase();
+};
+const compareValues = function(a, b) {
+  if (typeof a === "number" && typeof b === "number")
+    return a - b;
+  else
+    return a.localeCompare(b);
 };
 const sortItems = (items, sortState) => {
   return [...items].sort((a, b) => {
     const aValue = getSortValue(a, sortState.field);
     const bValue = getSortValue(b, sortState.field);
-    const result = aValue.localeCompare(bValue);
+    const result = compareValues(aValue, bValue);
     return sortState.direction === "asc" ? result : -result;
   });
 };
@@ -48,6 +63,30 @@ const useDebounce = (value, delay) => {
   }, [value, delay]);
   return debouncedValue;
 };
+function DeleteHistoryEntryRequest({ item, onDeleted, onClose }) {
+  return /* @__PURE__ */ jsx(Modal.Root, { open: true, onOpenChange: () => onClose(), children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
+    /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: "Delete translation history information" }) }),
+    /* @__PURE__ */ jsxs(Modal.Body, { children: [
+      /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(Typography, { variant: "beta", children: "Really delete this enty?" }) }),
+      /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(Typography, { children: "This cannot be undone. You can always translate the entry again." }) }),
+      /* @__PURE__ */ jsx("p", { children: " " }),
+      /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsxs(Typography, { children: [
+        "Name: ",
+        item["element-name"],
+        /* @__PURE__ */ jsx("br", {}),
+        "Status: ",
+        item.status,
+        /* @__PURE__ */ jsx("br", {}),
+        "Language: ",
+        item.targetLanguage
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Modal.Footer, { children: [
+      /* @__PURE__ */ jsx(Button, { onClick: onClose, variant: "tertiary", children: "Cancel" }),
+      /* @__PURE__ */ jsx(Button, { onClick: onDeleted, startIcon: /* @__PURE__ */ jsx(Trash, {}), children: "Delete" })
+    ] })
+  ] }) });
+}
 const DEBOUNCE_DELAY = 500;
 const LoadingState = () => /* @__PURE__ */ jsx(Box, { padding: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "beta", children: "Loading history..." }) });
 const EmptyState = ({ hasSearchTerm }) => /* @__PURE__ */ jsx(Box, { padding: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: "#666" }, children: hasSearchTerm ? "No matching translation history found." : "No translation history available." }) });
@@ -85,7 +124,9 @@ const SortableHeader = ({
 const HistoryTable = ({
   data,
   sortState,
-  onSort
+  onSort,
+  onDelete,
+  secondaryColor
 }) => /* @__PURE__ */ jsx(
   Box,
   {
@@ -94,35 +135,63 @@ const HistoryTable = ({
     },
     children: /* @__PURE__ */ jsxs(Table, { colCount: 6, rowCount: data.length + 1, children: [
       /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
-        /* @__PURE__ */ jsx(SortableHeader, { field: "project-name", currentSort: sortState, onSort, children: "Content Type" }),
         /* @__PURE__ */ jsx(SortableHeader, { field: "element-name", currentSort: sortState, onSort, children: "Entry" }),
-        /* @__PURE__ */ jsx(SortableHeader, { field: "element-uid", currentSort: sortState, onSort, children: "ID" }),
+        /* @__PURE__ */ jsx(SortableHeader, { field: "project-name", currentSort: sortState, onSort, children: "Content Type" }),
         /* @__PURE__ */ jsx(SortableHeader, { field: "status", currentSort: sortState, onSort, children: "Status" }),
         /* @__PURE__ */ jsx(SortableHeader, { field: "target-language", currentSort: sortState, onSort, children: "Target Language" }),
-        /* @__PURE__ */ jsx(SortableHeader, { field: "time-imported", currentSort: sortState, onSort, children: "Date" })
+        /* @__PURE__ */ jsx(SortableHeader, { field: "time-imported", currentSort: sortState, onSort, children: "Date" }),
+        /* @__PURE__ */ jsx(Th, {})
       ] }) }),
-      /* @__PURE__ */ jsx(Tbody, { children: data.map((item, index) => /* @__PURE__ */ jsx(HistoryRow, { item }, `${item["element-uid"]}-${index}`)) })
+      /* @__PURE__ */ jsx(Tbody, { children: data.map((item, index) => /* @__PURE__ */ jsx(
+        HistoryRow,
+        {
+          item,
+          onDelete,
+          secondaryColor
+        },
+        `${item["element-uid"]}-${index}`
+      )) })
     ] })
   }
 );
-const HistoryRow = ({ item }) => /* @__PURE__ */ jsxs(Tr, { children: [
-  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: item["project-name"] }) }),
-  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: item["element-name"] }) }),
-  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { fontFamily: "monospace", fontSize: "12px" }, children: item["element-uid"] }) }),
-  /* @__PURE__ */ jsx(Td, { children: item.combinedStatus.text && /* @__PURE__ */ jsx(Badge, { variant: item.combinedStatus.variant, children: item.combinedStatus.text }) }),
-  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: item.targetLanguages.map((lang) => lang.toUpperCase()).join(", ") }) }),
-  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: formatDate(item["time-imported"]) }) })
+const getContentType = function(input) {
+  const left = input.indexOf(".");
+  const right = input.lastIndexOf("#");
+  if (left === -1 || left > right || right === -1)
+    return "-";
+  return input.substring(left + 1, right);
+};
+const getElementId = function(input) {
+  const right = input.lastIndexOf("#");
+  if (right === -1)
+    return "-";
+  return input.substring(right + 1);
+};
+const HistoryRow = ({ item, onDelete, secondaryColor }) => /* @__PURE__ */ jsxs(Tr, { children: [
+  /* @__PURE__ */ jsxs(Td, { children: [
+    /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: item["element-name"] }) }),
+    /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { fontFamily: "monospace", fontSize: "12px", color: secondaryColor }, children: getElementId(item["element-uid"]) })
+  ] }),
+  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: getContentType(item["element-uid"]) }) }),
+  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Badge, { variant: GetStatusColor(item.status), children: GetStatusText(item.status) }) }),
+  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: item.targetLanguage.toUpperCase() }) }),
+  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: formatDate(item.timeUpdated) }) }),
+  /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(SimpleMenu, { label: "Actions", tag: IconButton, icon: /* @__PURE__ */ jsx(More, {}), children: /* @__PURE__ */ jsx(MenuItem, { startIcon: /* @__PURE__ */ jsx(Bell, {}), variant: "danger", onSelect: () => onDelete(item), children: "Delete history entry" }) }) })
 ] });
 const HistoryMenu = () => {
   const [historyData, setHistoryData] = useState([]);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
+  const [errorMessage, setErrorMessage] = useState("");
+  const [succcessMessage, setSucccessMessage] = useState("");
   const [searchTerm, setSearchTerm] = useState("");
+  const [deleteItem, setDeleteItem] = useState(null);
   const [sortState, setSortState] = useState({
-    field: "project-name",
-    direction: "asc"
+    field: "time-imported",
+    direction: "desc"
   });
-  const { get } = getFetchClient();
+  const { get, post } = getFetchClient();
+  const themeColors = getThemeColors();
   const debouncedSearchTerm = useDebounce(searchTerm, DEBOUNCE_DELAY);
   useEffect(() => {
     const fetchHistory = async () => {
@@ -133,8 +202,10 @@ const HistoryMenu = () => {
         const result = handleHistoryResponse(response.data);
         if (result.isError) {
           setError(result.errorMessage || "Failed to fetch translation history.");
-        } else {
-          setHistoryData(result.historyData);
+        } else if (result.historyData && Array.isArray(result.historyData) && result.historyData.length > 0) {
+          const res = result.historyData;
+          res.sort((a, b) => a["time-updated"] - b["time-updated"]);
+          setHistoryData(res);
         }
       } catch (error2) {
         console.error("Failed to fetch history:", error2);
@@ -163,11 +234,49 @@ const HistoryMenu = () => {
   if (error) {
     return /* @__PURE__ */ jsx(Box, { padding: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "beta", textColor: "danger600", children: error }) });
   }
+  const removeHistoryEntry = function(item) {
+    if (!item || historyData.length === 0)
+      return;
+    if (historyData.length === 1) {
+      setHistoryData([]);
+      return;
+    }
+    let index = -1;
+    for (let i = 0; i < historyData.length && index === -1; i++) {
+      if (historyData[i].id === item.id)
+        index = i;
+    }
+    if (index === -1)
+      return;
+    historyData.splice(index, 1);
+    setHistoryData([...historyData]);
+  };
+  const onDeleteHistoyInfo = function(elem) {
+    if (!errorMessage)
+      setErrorMessage("");
+    if (!succcessMessage)
+      setSucccessMessage("");
+    if (!deleteItem)
+      return;
+    post("/translationstudio/history", {
+      uid: deleteItem.id
+    }).then((res) => {
+      if (res.status !== 204)
+        throw new Error("Could not delete entry");
+      removeHistoryEntry(deleteItem);
+      setSucccessMessage("Successfully removed history entry.");
+    }).catch(() => setErrorMessage("Could not delete history entry " + deleteItem["element-name"])).finally(() => setDeleteItem(null));
+  };
   const hasData = processedData.length > 0;
   const hasSearchTerm = Boolean(debouncedSearchTerm.trim());
   return /* @__PURE__ */ jsx(Box, { paddingTop: 4, paddingBottom: 4, style: { width: "100%" }, children: !hasData && !hasSearchTerm ? /* @__PURE__ */ jsx(EmptyState, { hasSearchTerm: false }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     historyData.length > 10 && /* @__PURE__ */ jsx(SearchInput, { value: searchTerm, onChange: handleSearchChange }),
-    hasData ? /* @__PURE__ */ jsx(HistoryTable, { data: processedData, sortState, onSort: handleSort }) : /* @__PURE__ */ jsx(EmptyState, { hasSearchTerm: true })
+    errorMessage && /* @__PURE__ */ jsx(Alert, { title: errorMessage, variant: "danger", style: { marginBottom: "2em" }, children: errorMessage }),
+    succcessMessage && /* @__PURE__ */ jsx(Alert, { title: succcessMessage, variant: "success", style: { marginBottom: "2em" }, children: succcessMessage }),
+    hasData ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      deleteItem && /* @__PURE__ */ jsx(DeleteHistoryEntryRequest, { item: deleteItem, onClose: () => setDeleteItem(null), onDeleted: onDeleteHistoyInfo }),
+      /* @__PURE__ */ jsx(HistoryTable, { data: processedData, sortState, onSort: handleSort, onDelete: setDeleteItem, secondaryColor: themeColors.secondaryText })
+    ] }) : /* @__PURE__ */ jsx(EmptyState, { hasSearchTerm: true })
   ] }) });
 };
 const LoadingSpinner = () => /* @__PURE__ */ jsxs(Box, { paddingBottom: 4, style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
@@ -213,7 +322,7 @@ const LanguageSelector = ({
           tag: "label",
           paddingBottom: 2,
           style: { color: themeColors.primaryText },
-          children: "Languages / Connectors"
+          children: "Translation Options"
         }
       ),
       languages.map((lang) => /* @__PURE__ */ jsx(Radio.Item, { value: lang.name, children: lang.name }, lang.id))
@@ -539,6 +648,7 @@ const BulkTranslationPanel = ({
                   children: /* @__PURE__ */ jsx("path", { d: "M2,21L23,12L2,3V10L17,12L2,14V21Z", fill: "currentColor" })
                 }
               ),
+              style: { height: "auto" },
               children: getSubmitLabel(selectedEntries.length, isUrgent, isMachineTranslation)
             }
           )
@@ -572,65 +682,6 @@ const getEntryTitle = (entry) => {
 const getEntryId = (entry) => {
   return entry.documentId || entry.id;
 };
-const getTranslationStatus = (entryId, historyData) => {
-  if (!Array.isArray(historyData) || historyData.length === 0) {
-    return "";
-  }
-  const matchingItems = historyData.filter((h) => h["element-uid"].includes(entryId));
-  if (matchingItems.length === 0) {
-    return "not_translated";
-  }
-  const hasInTranslation = matchingItems.some((item) => {
-    const timeInTranslation = item["time-intranslation"] || 0;
-    const timeImported = item["time-imported"] || 0;
-    return timeInTranslation > timeImported;
-  });
-  if (hasInTranslation) {
-    return "in_translation";
-  }
-  const hasTranslated = matchingItems.some((item) => {
-    const timeImported = item["time-imported"] || 0;
-    return timeImported > 0;
-  });
-  return hasTranslated ? "translated" : "not_translated";
-};
-const getTargetLanguages = (entryId, historyData) => {
-  if (!Array.isArray(historyData) || historyData.length === 0) return [];
-  const matchingItems = historyData.filter((h) => h["element-uid"].includes(entryId));
-  const languages = [...new Set(matchingItems.map((item) => item["target-language"]))];
-  return languages.sort();
-};
-const getTranslationDate = (entryId, historyData) => {
-  if (!Array.isArray(historyData) || historyData.length === 0) return "";
-  const matchingItems = historyData.filter((h) => h["element-uid"].includes(entryId));
-  if (matchingItems.length === 0) return "";
-  const latestImportTime = Math.max(
-    ...matchingItems.map((item) => item["time-imported"] || 0)
-  );
-  return latestImportTime > 0 ? formatDate(latestImportTime) : "";
-};
-const getStatusBadgeVariant = (status) => {
-  switch (status) {
-    case "translated":
-      return "success";
-    case "in_translation":
-      return "secondary";
-    default:
-      return "neutral";
-  }
-};
-const getStatusDisplayText = (status) => {
-  switch (status) {
-    case "translated":
-      return "Translated";
-    case "in_translation":
-      return "In Translation";
-    case "not_translated":
-      return "Not translated";
-    default:
-      return "n.a.";
-  }
-};
 const ContentTypesList = ({
   contentTypes,
   isLoading,
@@ -740,60 +791,13 @@ const EntriesTable = ({
         maxHeight: "fit-content",
         backgroundColor: themeColors.cardBackground
       },
-      children: /* @__PURE__ */ jsxs(Table, { colCount: 6, rowCount: entries.length + 1, children: [
+      children: /* @__PURE__ */ jsxs(Table, { colCount: 5, children: [
         /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
-          /* @__PURE__ */ jsx(Th, { style: { width: "50px" }, children: /* @__PURE__ */ jsx(
-            Checkbox,
-            {
-              checked: checkedType,
-              onCheckedChange: onSelectAll
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "sigma",
-              fontWeight: "bold",
-              style: { color: themeColors.primaryText },
-              children: "Title"
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "sigma",
-              fontWeight: "bold",
-              style: { color: themeColors.primaryText },
-              children: "ID"
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "sigma",
-              fontWeight: "bold",
-              style: { color: themeColors.primaryText },
-              children: "Status"
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "sigma",
-              fontWeight: "bold",
-              style: { color: themeColors.primaryText },
-              children: "Target Language"
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "sigma",
-              fontWeight: "bold",
-              style: { color: themeColors.primaryText },
-              children: "Date"
-            }
-          ) })
+          /* @__PURE__ */ jsx(Th, { style: { width: "50px" }, children: /* @__PURE__ */ jsx(Checkbox, { checked: checkedType, onCheckedChange: onSelectAll }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", style: { color: themeColors.primaryText }, children: "Title" }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", style: { color: themeColors.primaryText }, children: "Translated" }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", style: { color: themeColors.primaryText }, children: "In translation" }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", fontWeight: "bold", style: { color: themeColors.primaryText }, children: "Queued" }) })
         ] }) }),
         /* @__PURE__ */ jsx(Tbody, { children: entries.map((entry) => /* @__PURE__ */ jsx(
           EntryRow,
@@ -811,6 +815,15 @@ const EntriesTable = ({
     }
   );
 };
+const getLangQueued = function(list) {
+  return list.filter((e) => getElementStatus(e) === "queued").map((e) => e["target-language"]).sort().join(", ");
+};
+const getLangInTranslation = function(list) {
+  return list.filter((e) => getElementStatus(e) === "intranslation").map((e) => e["target-language"]).sort().join(", ");
+};
+const getLangTranslated = function(list) {
+  return list.filter((e) => getElementStatus(e) === "translated").map((e) => e["target-language"]).sort().join(", ");
+};
 const EntryRow = ({
   entry,
   isSelected,
@@ -820,9 +833,7 @@ const EntryRow = ({
   themeColors
 }) => {
   const entryId = getEntryId(entry);
-  const status = getTranslationStatus(entryId, historyData);
-  const targetLanguages = getTargetLanguages(entryId, historyData);
-  const date = getTranslationDate(entryId, historyData);
+  const history = historyData[entryId] ?? [];
   return /* @__PURE__ */ jsxs(Tr, { children: [
     /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(
       Checkbox,
@@ -831,18 +842,14 @@ const EntryRow = ({
         onCheckedChange: (checked) => onEntrySelection(entryId, checked)
       }
     ) }),
-    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: getEntryTitle(entry) }) }),
-    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(
-      Typography,
-      {
-        variant: "omega",
-        style: { fontFamily: "monospace", fontSize: "12px", color: themeColors.secondaryText },
-        children: entryId
-      }
-    ) }),
-    /* @__PURE__ */ jsx(Td, { children: isLoadingHistory ? /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.mutedText }, children: "Loading..." }) : /* @__PURE__ */ jsx(Badge, { variant: getStatusBadgeVariant(status), children: getStatusDisplayText(status) }) }),
-    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: targetLanguages.map((lang) => lang.toUpperCase()).join(", ") || "-" }) }),
-    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: date }) })
+    /* @__PURE__ */ jsxs(Td, { children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: getEntryTitle(entry) }),
+      /* @__PURE__ */ jsx("br", {}),
+      /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { fontFamily: "monospace", fontSize: "12px", color: themeColors.secondaryText }, children: entryId })
+    ] }),
+    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: getLangTranslated(history) }) }),
+    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: getLangInTranslation(history) }) }),
+    /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { variant: "omega", style: { color: themeColors.primaryText }, children: getLangQueued(history) }) })
   ] });
 };
 const fetchContentEntriesData = async function(selectedContentType) {
@@ -976,7 +983,7 @@ const BulkTranslationMenu = ({
       }
     ),
     /* @__PURE__ */ jsx(Box, { style: { width: "400px", flexShrink: 0, display: "flex", flexDirection: "column" }, children: selectedEntries.size > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(Typography, { variant: "omega", paddingBottom: 3, style: { fontWeight: "bold" }, children: "Translation Settings" }),
+      /* @__PURE__ */ jsx(Typography, { variant: "omega", paddingBottom: 3, style: { fontWeight: "bold" }, children: "Translation Options" }),
       /* @__PURE__ */ jsx(Box, { style: { borderRadius: "4px", overflow: "hidden" }, children: /* @__PURE__ */ jsx(
         BulkTranslationPanel,
         {
@@ -988,8 +995,21 @@ const BulkTranslationMenu = ({
     ] }) })
   ] }) });
 };
+const processHistoryData = function(list) {
+  const map = {};
+  for (const elem of list) {
+    const id = elem["element-uid"].split("#");
+    if (id.length !== 2)
+      continue;
+    if (!map[id[0]])
+      map[id[0]] = [elem];
+    else
+      map[id[0]].push(elem);
+  }
+  return map;
+};
 const HistoryPage = () => {
-  const [historyData, setHistoryData] = useState([]);
+  const [historyData, setHistoryData] = useState({});
   const [isLoadingHistory, setIsLoadingHistory] = useState(true);
   const [activeTab, setActiveTab] = useState("history");
   const { get } = getFetchClient();
@@ -998,13 +1018,13 @@ const HistoryPage = () => {
       try {
         const response = await get("/translationstudio/history");
         const result = handleHistoryResponse(response.data);
-        if (result.isError) {
-        } else {
-          setHistoryData(result.historyData);
-        }
+        if (result.isError)
+          throw new Error("Cold not fetch data");
+        if (result.historyData && Array.isArray(result.historyData))
+          setHistoryData(processHistoryData(result.historyData));
       } catch (error) {
         console.error("Failed to fetch history:", error);
-        setHistoryData([]);
+        setHistoryData({});
       } finally {
         setIsLoadingHistory(false);
       }
@@ -1016,13 +1036,12 @@ const HistoryPage = () => {
     try {
       const response = await get("/translationstudio/history");
       const result = handleHistoryResponse(response.data);
-      if (result.isError) {
-        setHistoryData([]);
-      } else {
-        setHistoryData(result.historyData);
-      }
+      if (result.isError)
+        setHistoryData({});
+      else if (result.historyData && Array.isArray(result.historyData))
+        setHistoryData(processHistoryData(result.historyData));
     } catch (error) {
-      setHistoryData([]);
+      setHistoryData({});
     } finally {
       setIsLoadingHistory(false);
     }