@dxs-ts/eveli-ide 0.0.430 → 0.0.432

package/build/eveli-task-composer-v2/{EveliTaskDetails.d.ts → EveliTaskDashboard.d.ts}

@@ -1,4 +1,4 @@
 import { default as React } from 'react';
-export declare const EveliTaskDetails: React.FC<{
+export declare const EveliTaskDashboard: React.FC<{
     taskId: string;
 }>;

package/build/eveli-task-composer-v2/index.d.ts

@@ -1 +1 @@
-export * from './EveliTaskDetails';
+export * from './EveliTaskDashboard';

package/build/eveli-task-composer-v2-messages/CustomerMessagesEdit.d.ts

@@ -4,4 +4,4 @@ export interface CustomerMessagesEditProps {
     task: TaskApi.Task;
 }
 export declare const CustomerMessagesEdit: React.FC<CustomerMessagesEditProps>;
-export declare const useUtilityClasses: () => Record<"container" | "messageRow" | "senderInfo" | "frontdeskAvatar" | "customerAvatar" | "frontdeskMessageBody" | "customerMessageBody" | "messageBoxLabel" | "messagesContainer" | "inputBox", string>;
+export declare const useUtilityClasses: () => Record<"container" | "messageRow" | "messageBoxLabel" | "messagesContainer" | "senderInfo" | "inputBox" | "frontdeskAvatar" | "customerAvatar" | "frontdeskMessageBody" | "customerMessageBody", string>;

package/build/eveli-task-composer-v2-messages/{CustomerMessagesReadOnly.d.ts → EveliCustomerMessagesReadOnly.d.ts}

@@ -1,9 +1,9 @@
 import { default as React } from 'react';
 import { TaskCardStyleDefinition } from '../eveli-task-composer-v2/cardThemeConfig';
 import { TaskApi } from '../api-task';
-export interface CustomerMessagesReadOnlyProps {
+export interface EveliCustomerMessagesReadOnlyProps {
     style: TaskCardStyleDefinition;
     task: TaskApi.Task;
 }
-export declare const CustomerMessagesReadOnly: React.FC<CustomerMessagesReadOnlyProps>;
+export declare const EveliCustomerMessagesReadOnly: React.FC<EveliCustomerMessagesReadOnlyProps>;
 export declare const useUtilityClasses: () => Record<"container" | "messageRow" | "senderInfo" | "frontdeskAvatar" | "customerAvatar" | "frontdeskMessageBody" | "customerMessageBody", string>;

package/build/eveli-task-composer-v2-messages/index.d.ts

@@ -1,2 +1,2 @@
-export * from './CustomerMessagesReadOnly';
 export * from './EditCustomerMessagesDialog';
+export * from './EveliCustomerMessagesReadOnly';

package/build/{eveli-task-composer-v2/TaskNotes.d.ts → eveli-task-composer-v2-notes/EveliTaskNotes.d.ts}

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { TaskApi } from '../api-task';
-import { TaskCardStyleDefinition } from './cardThemeConfig';
-export declare const TaskNotes: React.FC<{
+import { TaskCardStyleDefinition } from '../eveli-task-composer-v2/cardThemeConfig';
+export declare const EveliTaskNotes: React.FC<{
     task: TaskApi.Task;
     style: TaskCardStyleDefinition;
 }>;

package/build/eveli-task-composer-v2-notes/index.d.ts

@@ -0,0 +1 @@
+export * from './EveliTaskNotes';

package/build/{eveli-task-composer-v2/TaskRoles.d.ts → eveli-task-composer-v2-roles/EveliTaskRoles.d.ts}

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { TaskApi } from '../api-task';
-export interface TaskRolesProps {
+export interface EveliTaskRolesProps {
     task: TaskApi.Task;
 }
-export declare const TaskRoles: React.FC<TaskRolesProps>;
+export declare const EveliTaskRoles: React.FC<EveliTaskRolesProps>;
 export declare const useUtilityClasses: () => Record<"root", string>;

package/build/eveli-task-composer-v2-roles/index.d.ts

@@ -0,0 +1 @@
+export * from './EveliTaskRoles';

package/build/index.js

@@ -57044,7 +57044,7 @@ function UK(e) {
     })
   };
 }
-const DS = { tag: "eveli-ide-0.0.430", built: "22/07/2025" }, wx = we("worker/rest/api/version.GET")({
+const DS = { tag: "eveli-ide-0.0.432", built: "22/07/2025" }, wx = we("worker/rest/api/version.GET")({
   hook: $K
 });
 function $K(e) {
@@ -69955,49 +69955,8 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
   /* @__PURE__ */ i(Vi, { value: e, label: "Card Style", onChange: (a) => {
     t(a.target.value);
   }, children: Object.entries(jre).map(([a, r]) => /* @__PURE__ */ i(lt, { value: a, children: r }, a)) })
-] }), eie = (e) => e ? (e instanceof Date ? Pe.fromJSDate(e) : Pe.fromISO(e)).setLocale("fi").toLocaleString(Pe.DATE_SHORT) : "--", tie = ({ task: e, style: t }) => {
-  var s;
-  const n = aie(), a = ((s = e.comments) == null ? void 0 : s.filter((o) => !o.external)) || [];
-  if (!a || a.length === 0)
-    return /* @__PURE__ */ i(W, { children: "No notes" });
-  const r = (o, l) => o.length <= l ? o : o.slice(0, l) + "…";
-  return /* @__PURE__ */ E(nie, { className: n.notesContainer, children: [
-    a.slice(0, 3).map((o) => /* @__PURE__ */ i(R, { children: /* @__PURE__ */ E(W, { children: [
-      /* @__PURE__ */ E(R, { display: "flex", alignItems: "center", children: [
-        /* @__PURE__ */ i(Pf, { sx: { fontSize: "7pt", mr: 1, color: "primary.main" } }),
-        /* @__PURE__ */ i(F, { component: "div", sx: { ...t.bodyTypography }, className: n.noteBody, children: `${r(o.commentText, 200)}` })
-      ] }),
-      /* @__PURE__ */ i(rt, {}),
-      /* @__PURE__ */ i(R, { display: "flex", alignItems: "center", justifyContent: "flex-end", children: /* @__PURE__ */ i(F, { component: "div", sx: { ...t.bodyTypographySmall }, className: n.noteAuthor, children: `${o.userName} noted on ${eie(o.created)}` }) })
-    ] }) }, o.id)),
-    a.length > 3 && /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography }, children: [
-      "...",
-      a.length - 3,
-      " more..."
-    ] })
-  ] });
-}, HN = "TaskNotes", nie = fe("div", {
-  name: HN,
-  slot: "Notes",
-  overridesResolver: (e, t) => [
-    t.notesContainer
-  ]
-})(({ theme: e }) => ({
-  "& .TaskNotes-noteBody": {
-    fontWeight: 400,
-    marginLeft: 1
-  },
-  "& .TaskNotes-noteAuthor": {
-    textAlign: "right",
-    color: e.palette.text.disabled
-  }
-})), aie = () => He({
-  notesContainer: ["notesContainer"],
-  noteBody: ["noteBody"],
-  noteAuthor: ["noteAuthor"],
-  noteBackground: ["noteBackground"]
-}, (n) => Ue(HN, n), {}), rie = ({ task: e }) => {
-  const t = iie();
+] }), eie = ({ task: e }) => {
+  const t = tie();
   if (!e.assignedUser || typeof name != "string")
     return /* @__PURE__ */ i(Ek, { children: /* @__PURE__ */ i(F, { children: "--" }) });
   const n = e.assignedUser.substring(0, e.assignedUser.indexOf(" ")), a = e.assignedUser.substring(e.assignedUser.indexOf(" ") + 1), r = n.substring(0, 1), s = a.substring(0, 1);
@@ -70011,8 +69970,8 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
       /* @__PURE__ */ i(F, { variant: "caption", children: "user@gmail.com" })
     ] })
   ] });
-}, VN = "TaskAssigneeClassName", Ek = fe("div", {
-  name: VN,
+}, HN = "TaskAssigneeClassName", Ek = fe("div", {
+  name: HN,
   slot: "Root",
   overridesResolver: (e, t) => [
     t.root
@@ -70028,37 +69987,15 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
     width: "35px",
     boxShadow: "0 4px 12px rgba(0, 0, 0, 0.2)"
   }
-})), iie = () => He({
-  root: ["root"]
-}, (n) => Ue(VN, n), {}), sie = ({ task: e }) => {
-  const t = oie();
-  return !e.assignedRoles || e.assignedRoles.length === 0 ? /* @__PURE__ */ i(yk, { children: /* @__PURE__ */ i(F, { children: "--" }) }) : /* @__PURE__ */ i(yk, { className: t.root, children: e.assignedRoles.map((n, a) => /* @__PURE__ */ i(Qt, { label: n, variant: "filled" }, a)) });
-}, zN = "TaskRolesRootClassName", yk = fe("div", {
-  name: zN,
-  slot: "Root",
-  overridesResolver: (e, t) => [
-    t.root
-  ]
-})(({ theme: e }) => ({
-  display: "flex",
-  alignItems: "center",
-  flexWrap: "wrap",
-  marginBottom: e.spacing(1),
-  gap: e.spacing(1),
-  "& .MuiChip-root": {
-    backgroundColor: e.palette.info.dark,
-    color: e.palette.background.default,
-    boxShadow: "0 4px 12px rgba(0, 0, 0, 0.2)"
-  }
-})), oie = () => He({
+})), tie = () => He({
   root: ["root"]
-}, (n) => Ue(zN, n), {}), lie = ({ task: e, style: t }) => {
-  const { getOneFeedback: n } = ei(), [a, r] = C.useState(), s = uie();
+}, (n) => Ue(HN, n), {}), nie = ({ task: e, style: t }) => {
+  const { getOneFeedback: n } = ei(), [a, r] = C.useState(), s = rie();
   return C.useEffect(() => {
     n(e.taskRef).then((o) => {
       r(o), console.log("Setting feedback:", o);
     });
-  }, [e.taskRef]), !a || !a.content ? /* @__PURE__ */ i(F, { sx: { ...t.bodyTypography }, children: "No feedback" }) : /* @__PURE__ */ E(cie, { className: s.root, children: [
+  }, [e.taskRef]), !a || !a.content ? /* @__PURE__ */ i(F, { sx: { ...t.bodyTypography }, children: "No feedback" }) : /* @__PURE__ */ E(aie, { className: s.root, children: [
     /* @__PURE__ */ E(R, { display: "flex", flexDirection: "row", justifyContent: "space-between", children: [
       /* @__PURE__ */ E(R, { flexDirection: "column", alignItems: "center", children: [
         /* @__PURE__ */ i(F, { className: s.feedbackCategories, sx: { ...t.bodyTypography }, children: a.content.main }),
@@ -70079,8 +70016,8 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
       a.content.question
     ] })
   ] });
-}, GN = "CustomerFeedback", cie = fe("div", {
-  name: GN,
+}, VN = "CustomerFeedback", aie = fe("div", {
+  name: VN,
   slot: "Message",
   overridesResolver: (e, t) => [
     t.root
@@ -70105,20 +70042,20 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
   "& .CustomerFeedback-feedbackCategories": {
     fontWeight: 500
   }
-})), uie = () => He({
+})), rie = () => He({
   root: ["root"],
   publishedNotifier: ["publishedNotifier"],
   feedbackCategories: ["feedbackCategories"]
-}, (n) => Ue(GN, n), {}), die = ({ task: e, style: t }) => {
-  const n = fie();
-  return /* @__PURE__ */ i(pie, { className: n.root, style: t, children: /* @__PURE__ */ E(R, { className: n.file, children: [
+}, (n) => Ue(VN, n), {}), iie = ({ task: e, style: t }) => {
+  const n = oie();
+  return /* @__PURE__ */ i(sie, { className: n.root, style: t, children: /* @__PURE__ */ E(R, { className: n.file, children: [
     /* @__PURE__ */ i($O, { className: n.fileIcon }),
     /* @__PURE__ */ i(F, { sx: { ...t }, children: "file-name.jpg" }),
     /* @__PURE__ */ i(R, { flexGrow: 1 }),
     /* @__PURE__ */ i(_e, { color: "error", children: /* @__PURE__ */ i(zc, { className: n.deleteIcon }) })
   ] }) });
-}, WN = "TaskFiles", pie = fe("div", {
-  name: WN,
+}, zN = "TaskFiles", sie = fe("div", {
+  name: zN,
   slot: "Root",
   overridesResolver: (e, t) => [
     t.root
@@ -70148,111 +70085,402 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
   "& .TaskFiles-deleteIcon": {
     color: e.palette.error.main
   }
-})), fie = () => He({
+})), oie = () => He({
   root: ["root"],
   file: ["file"],
   fileIcon: ["fileIcon"],
   deleteIcon: ["deleteIcon"]
-}, (n) => Ue(WN, n), {}), mie = ({ task: e, style: t }) => {
-  var l;
-  const n = gie(), a = ((l = e.comments) == null ? void 0 : l.filter((c) => c.external).sort((c, u) => Pe.fromISO(u.created).toMillis() - Pe.fromISO(c.created).toMillis())) || [], r = a.slice(0, 3), s = (c) => {
-    try {
-      return Pe.fromISO(c).setLocale("fi").toLocaleString(Pe.DATETIME_SHORT);
-    } catch {
-      return c;
-    }
-  }, o = (c, u) => c.length <= u ? c : c.slice(0, u) + "…";
-  return /* @__PURE__ */ E(hie, { className: n.container, children: [
-    r.length === 0 && /* @__PURE__ */ i(F, { sx: { ...t }, children: "No messages" }),
-    r.slice(0, 3).map((c) => /* @__PURE__ */ E(R, { className: n.messageRow, children: [
-      /* @__PURE__ */ i(Hn, { className: c.source === "FRONTDESK" ? n.frontdeskAvatar : n.customerAvatar }),
-      /* @__PURE__ */ E(R, { className: c.source === "FRONTDESK" ? n.frontdeskMessageBody : n.customerMessageBody, children: [
-        /* @__PURE__ */ E(F, { className: n.senderInfo, sx: { ...t.bodyTypography }, children: [
-          c.userName,
-          " wrote on ",
-          s(c.created)
-        ] }),
-        /* @__PURE__ */ i(F, { style: { ...t.bodyTypography, overflow: "hidden", whiteSpace: "normal" }, children: o(c.commentText, 200) })
-      ] })
-    ] }, c.id)),
-    a.length > 3 && /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography }, children: [
-      "...",
-      a.length - 3,
-      " more..."
+}, (n) => Ue(zN, n), {}), GN = ({ task: e }) => {
+  if (e.keyWords)
+    return /* @__PURE__ */ i(R, { gap: 1, display: "flex", mt: 1, children: e.keyWords.map((t) => /* @__PURE__ */ i(Qt, { label: t, variant: "filled", color: "primary", sx: {
+      boxShadow: "0 4px 12px rgba(0, 0, 0, 0.2)"
+    } }, t)) });
+}, lie = ({ task: e, open: t, onClose: n }) => {
+  var s;
+  const a = uie(), r = ie();
+  return /* @__PURE__ */ E(cie, { className: a.editDialog, open: t, onClose: n, maxWidth: "md", slots: { transition: Uk }, children: [
+    /* @__PURE__ */ E(Ce, { children: [
+      r.formatMessage({ id: "task.edit" }),
+      r.formatMessage({ id: "eveli.textSeparatorColon" }),
+      e.taskRef ?? "no task reference id"
+    ] }),
+    /* @__PURE__ */ i(ke, { children: /* @__PURE__ */ E(oe, { container: !0, display: "flex", alignItems: "center", children: [
+      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.dueDate" }) }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 7, lg: 7, xl: 7 }, children: /* @__PURE__ */ i($l, { value: (s = e.dueDate) == null ? void 0 : s.toISOString() }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.customerName" }) }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { value: e.clientIdentificator }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.subject" }) }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { value: e.subject }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.additionalInfo" }) }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { rows: 3, multiline: !0, value: e.additionalInfo }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.metaData" }) }) }),
+      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i(GN, { task: e }) })
+    ] }) }),
+    /* @__PURE__ */ E(Ae, { children: [
+      /* @__PURE__ */ i(K, { variant: "outlined", onClick: n, children: r.formatMessage({ id: "button.cancel" }) }),
+      /* @__PURE__ */ i(K, { onClick: n, children: r.formatMessage({ id: "button.save" }) })
     ] })
   ] });
-}, jN = "CustomerMessagesReadOnly", hie = fe("div", {
+}, $l = fe(Fe)(({ theme: e }) => ({
+  width: "100%",
+  "& .MuiInputBase-input": {
+    height: "2.5rem",
+    padding: "0 12px"
+  }
+})), WN = "EditTaskDialog", cie = fe(Se, {
+  name: WN,
+  slot: "EditDialog",
+  overridesResolver: (e, t) => [
+    t.editDialog
+  ]
+})(({ theme: e }) => ({})), uie = () => He({
+  editDialog: ["editDialog"]
+}, (n) => Ue(WN, n), {});
+function die(e) {
+  if (!e.dueDate)
+    return;
+  const t = Pe.local().startOf("day"), n = Pe.fromJSDate(e.dueDate).startOf("day"), a = Math.floor(t.diff(n, "days").days);
+  return e.status === "COMPLETED" || e.status === "REJECTED" ? {
+    isOverdue: a > 0,
+    days: Math.abs(a),
+    status: a > 0 ? "completedOverdue" : "completedOnTime"
+  } : a > 0 ? {
+    isOverdue: !0,
+    days: a,
+    status: "overdue"
+  } : a === 0 ? {
+    isOverdue: !1,
+    days: 0,
+    status: "dueToday"
+  } : {
+    isOverdue: !1,
+    days: Math.abs(a),
+    status: "upcomingDue"
+  };
+}
+const pie = ({ ...e }) => {
+  const t = fie(), n = die(e.task);
+  if (n)
+    switch (n == null ? void 0 : n.status) {
+      case "upcomingDue":
+        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
+          /* @__PURE__ */ i(al, {}),
+          /* @__PURE__ */ E(F, { textAlign: "center", sx: { ...e.style.bodyTypographySmall }, children: [
+            n.days,
+            " day(s) left to complete task"
+          ] })
+        ] });
+      case "dueToday":
+        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
+          /* @__PURE__ */ i(al, {}),
+          /* @__PURE__ */ i(F, { textAlign: "center", sx: { ...e.style.bodyTypographySmall ?? void 0 }, children: "Task is due today!" })
+        ] });
+      case "completedOverdue":
+        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
+          /* @__PURE__ */ i(al, {}),
+          /* @__PURE__ */ E(F, { sx: { ...e.style.bodyTypographySmall }, children: [
+            "Task was closed ",
+            n.days,
+            " day(s) overdue"
+          ] })
+        ] });
+      case "overdue":
+        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
+          /* @__PURE__ */ i(al, {}),
+          /* @__PURE__ */ E(F, { sx: { ...e.style.bodyTypographySmall }, children: [
+            "Task is ",
+            n.days,
+            " day(s) overdue"
+          ] })
+        ] });
+      default:
+        return /* @__PURE__ */ i(W, {});
+    }
+}, jN = "TaskOverrdueWarningClassName", Hl = fe("div", {
   name: jN,
-  slot: "Message",
+  slot: "Priority",
   overridesResolver: (e, t) => [
-    t.container
+    t.root
   ]
-})(({ theme: e }) => ({
+})(({ theme: e, ownerState: t }) => ({
   display: "flex",
-  flexDirection: "column",
-  gap: e.spacing(2),
-  "& .CustomerMessagesReadOnly-messageRow": {
-    display: "flex",
-    alignItems: "center"
-  },
-  "& .CustomerMessagesReadOnly-senderInfo": {
-    fontWeight: "bold !important"
-    //TODO figure out a better way with cardThemeConfig
-  },
-  "& .CustomerMessagesReadOnly-frontdeskAvatar": {
-    border: `1px solid ${$n("#caf0f8", 0.1)}`,
-    backgroundColor: "#caf0f8",
-    marginRight: e.spacing(1),
-    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
-  },
-  "& .CustomerMessagesReadOnly-customerAvatar": {
-    border: `1px solid ${$n("#ecf39e", 0.1)}`,
-    backgroundColor: "#ecf39e",
-    marginRight: e.spacing(1),
-    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
-  },
-  "& .CustomerMessagesReadOnly-frontdeskMessageBody": {
-    flexGrow: 1,
-    backgroundColor: "#caf0f8",
-    borderRadius: "20px",
-    padding: e.spacing(1),
-    border: `1px solid ${$n("#caf0f8", 0.1)}`,
-    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
-  },
-  "& .CustomerMessagesReadOnly-customerMessageBody": {
-    flexGrow: 1,
-    backgroundColor: "#ecf39e",
-    borderRadius: "20px",
-    padding: e.spacing(1),
-    border: `1px solid ${$n("#ecf39e", 0.1)}`,
-    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
-  },
+  alignItems: "center",
+  backgroundColor: vt(Vl(e, t.status), 0.1),
+  padding: e.spacing(0.5),
+  borderRadius: e.spacing(1),
+  border: `1px solid ${Vl(e, t.status)}`,
+  color: Vl(e, t.status),
   "& .MuiSvgIcon-root": {
-    fontSize: "10pt",
-    marginRight: e.spacing(1),
-    marginLeft: e.spacing(1)
+    color: Vl(e, t.status),
+    fontSize: "medium"
   }
-})), gie = () => He({
-  container: ["container"],
-  messageRow: ["messageRow"],
-  senderInfo: ["senderInfo"],
-  frontdeskAvatar: ["frontdeskAvatar"],
-  customerAvatar: ["customerAvatar"],
-  frontdeskMessageBody: ["frontdeskMessageBody"],
-  customerMessageBody: ["customerMessageBody"]
-}, (n) => Ue(jN, n), {}), bie = ({ task: e }) => {
-  var c;
-  const t = Tie(), n = ie(), [a, r] = C.useState(""), s = ((c = e.comments) == null ? void 0 : c.filter((u) => u.external).sort((u, d) => Pe.fromISO(d.created).toMillis() - Pe.fromISO(u.created).toMillis())) || [], o = (u) => {
-    try {
-      return Pe.fromISO(u).setLocale("fi").toLocaleString(Pe.DATETIME_SHORT);
-    } catch {
-      return u;
-    }
-  };
-  function l(u) {
-    r(u), console.log("message:", u);
+})), Vl = (e, t) => {
+  switch (t) {
+    case "overdue":
+      return e.palette.error.main;
+    case "dueToday":
+      return "#e85d04";
+    case "upcomingDue":
+      return e.palette.info.main;
+    case "completedOverdue":
+      return e.palette.warning.main;
+    case "completedOnTime":
+      return e.palette.success.main;
+    default:
+      return e.palette.background.paper;
   }
-  return /* @__PURE__ */ E(Eie, { className: t.container, children: [
+}, fie = () => He({
+  root: ["root"]
+}, (n) => Ue(jN, n), {}), mie = ({ style: e }) => {
+  const t = gie(), [n, a] = tt("LOW"), r = [
+    { level: "LOW", color: "#45a048" },
+    { level: "MEDIUM", color: "#2196f3" },
+    { level: "HIGH", color: "#f44336" }
+  ];
+  return /* @__PURE__ */ i(hie, { className: t.root, style: e, children: /* @__PURE__ */ E(Rt, { direction: "column", width: "100%", children: [
+    /* @__PURE__ */ E(F, { fontWeight: 500, mb: 1, sx: { ...e.bodyTypography, fontWeight: 500 }, children: [
+      "Priority: ",
+      n
+    ] }),
+    /* @__PURE__ */ i(vf, { fullWidth: !0, className: t.prioritySelect, disableElevation: !0, children: r.map(({ level: s, color: o }) => {
+      const l = n === s;
+      return /* @__PURE__ */ i(
+        K,
+        {
+          variant: l ? "contained" : "outlined",
+          onClick: () => a(s),
+          sx: {
+            backgroundColor: l ? o : "transparent",
+            borderColor: l ? o : "#ccc",
+            color: l ? "#FFFFFF" : "rgba(0, 0, 0, 0.38)",
+            ...e.bodyTypographySmall,
+            "&:hover": {
+              backgroundColor: l ? o : "rgba(0, 0, 0, 0.04)",
+              borderColor: l ? o : "#ccc"
+            }
+          },
+          children: s
+        },
+        s
+      );
+    }) })
+  ] }) });
+}, qN = "TaskPriority", hie = fe("div", {
+  name: qN,
+  slot: "Root",
+  overridesResolver: (e, t) => [
+    t.root
+  ]
+})(({ theme: e, style: t }) => ({
+  display: "flex",
+  alignItems: "center",
+  "& .TaskPriority-prioritySelect": {
+    "& .MuiButton-root": {
+      textTransform: "none",
+      fontWeight: 500,
+      borderColor: "#ccc",
+      width: "100%",
+      padding: e.spacing(0.5, 2),
+      minHeight: 32
+    },
+    "& .MuiButton-root:first-of-type": {
+      borderTopLeftRadius: e.spacing(1),
+      borderBottomLeftRadius: e.spacing(1)
+    },
+    "& .MuiButton-root:last-of-type": {
+      borderTopRightRadius: e.spacing(1),
+      borderBottomRightRadius: e.spacing(1)
+    }
+  }
+})), gie = () => He({
+  root: ["root"],
+  prioritySelect: ["prioritySelect"]
+}, (n) => Ue(qN, n), {}), bie = ({ status: e, style: t }) => {
+  const n = KN(), a = () => {
+    switch (e) {
+      case "NEW":
+        return 25;
+      case "OPEN":
+        return 50;
+      case "COMPLETED":
+      case "REJECTED":
+        return 100;
+      default:
+        return 0;
+    }
+  }, r = () => {
+    switch (e) {
+      case "NEW":
+        return "#ffeb3b";
+      // Purpley
+      case "OPEN":
+        return "#2196f3";
+      // Blue
+      case "COMPLETED":
+        return "#4caf50";
+      // Green
+      case "REJECTED":
+        return "#f44336";
+      // Red
+      default:
+        return "#ccc";
+    }
+  }, s = a(), o = r();
+  return /* @__PURE__ */ E(R, { className: n.progressBar, children: [
+    /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography, fontWeight: 500, mb: 1 }, children: [
+      "Status: ",
+      e
+    ] }),
+    /* @__PURE__ */ i(R, { className: n.backgroundTrack, children: /* @__PURE__ */ i(
+      R,
+      {
+        sx: {
+          height: "100%",
+          width: `${s}%`,
+          backgroundColor: o,
+          transition: "width 0.3s ease-in-out"
+        }
+      }
+    ) }),
+    /* @__PURE__ */ E(F, { className: n.progressDesc, children: [
+      s,
+      "% complete"
+    ] })
+  ] });
+}, Eie = ({ style: e }) => {
+  const t = KN(), [n, a] = C.useState("NEW"), r = (s) => {
+    a(s.target.value);
+  };
+  return /* @__PURE__ */ E(yie, { className: t.root, children: [
+    /* @__PURE__ */ i(bie, { status: n, style: e }),
+    /* @__PURE__ */ E(
+      Vi,
+      {
+        value: n,
+        onChange: r,
+        size: "small",
+        sx: {
+          minWidth: 120,
+          maxWidth: 150,
+          alignSelf: "center"
+        },
+        children: [
+          /* @__PURE__ */ i(lt, { value: "NEW", children: "NEW" }),
+          /* @__PURE__ */ i(lt, { value: "OPEN", children: "OPEN" }),
+          /* @__PURE__ */ i(lt, { value: "COMPLETED", children: "COMPLETED" }),
+          /* @__PURE__ */ i(lt, { value: "REJECTED", children: "REJECTED" })
+        ]
+      }
+    )
+  ] });
+}, YN = "TaskStatus", yie = fe("div", {
+  name: YN,
+  slot: "Root",
+  overridesResolver: (e, t) => [
+    t.root
+  ]
+})(({ theme: e }) => ({
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  "& .TaskStatus-progressBar": {
+    width: "60%"
+  },
+  "& .TaskStatus-backgroundTrack": {
+    width: "100%",
+    height: e.spacing(2),
+    backgroundColor: "#eee",
+    borderRadius: e.spacing(3),
+    overflow: "hidden",
+    boxShadow: "inset 0 1px 3px rgba(0,0,0,0.2)"
+  },
+  "& .TaskStatus-progressDesc": {
+    marginTop: e.spacing(0.5),
+    textAlign: "right",
+    ...e.typography.caption
+  }
+})), KN = () => He({
+  root: ["root"],
+  progressBar: ["progressBar"],
+  backgroundTrack: ["backgroundTrack"],
+  progressIndicator: ["progressIndicator"],
+  progressDesc: ["progressDesc"]
+}, (n) => Ue(YN, n), {}), Tie = (e) => e ? (e instanceof Date ? Pe.fromJSDate(e) : Pe.fromISO(e)).setLocale("fi").toLocaleString(Pe.DATE_SHORT) : "--", vie = ({ task: e, style: t }) => {
+  var s;
+  const n = kie(), a = ((s = e.comments) == null ? void 0 : s.filter((o) => !o.external)) || [];
+  if (!a || a.length === 0)
+    return /* @__PURE__ */ i(W, { children: "No notes" });
+  const r = (o, l) => o.length <= l ? o : o.slice(0, l) + "…";
+  return /* @__PURE__ */ E(Sie, { className: n.notesContainer, children: [
+    a.slice(0, 3).map((o) => /* @__PURE__ */ i(R, { children: /* @__PURE__ */ E(W, { children: [
+      /* @__PURE__ */ E(R, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ i(Pf, { sx: { fontSize: "7pt", mr: 1, color: "primary.main" } }),
+        /* @__PURE__ */ i(F, { component: "div", sx: { ...t.bodyTypography }, className: n.noteBody, children: `${r(o.commentText, 200)}` })
+      ] }),
+      /* @__PURE__ */ i(rt, {}),
+      /* @__PURE__ */ i(R, { display: "flex", alignItems: "center", justifyContent: "flex-end", children: /* @__PURE__ */ i(F, { component: "div", sx: { ...t.bodyTypographySmall }, className: n.noteAuthor, children: `${o.userName} noted on ${Tie(o.created)}` }) })
+    ] }) }, o.id)),
+    a.length > 3 && /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography }, children: [
+      "...",
+      a.length - 3,
+      " more..."
+    ] })
+  ] });
+}, XN = "TaskNotes", Sie = fe("div", {
+  name: XN,
+  slot: "Notes",
+  overridesResolver: (e, t) => [
+    t.notesContainer
+  ]
+})(({ theme: e }) => ({
+  "& .TaskNotes-noteBody": {
+    fontWeight: 400,
+    marginLeft: 1
+  },
+  "& .TaskNotes-noteAuthor": {
+    textAlign: "right",
+    color: e.palette.text.disabled
+  }
+})), kie = () => He({
+  notesContainer: ["notesContainer"],
+  noteBody: ["noteBody"],
+  noteAuthor: ["noteAuthor"],
+  noteBackground: ["noteBackground"]
+}, (n) => Ue(XN, n), {}), wie = ({ task: e }) => {
+  const t = Cie();
+  return !e.assignedRoles || e.assignedRoles.length === 0 ? /* @__PURE__ */ i(yk, { children: /* @__PURE__ */ i(F, { children: "--" }) }) : /* @__PURE__ */ i(yk, { className: t.root, children: e.assignedRoles.map((n, a) => /* @__PURE__ */ i(Qt, { label: n, variant: "filled" }, a)) });
+}, ZN = "TaskRolesRootClassName", yk = fe("div", {
+  name: ZN,
+  slot: "Root",
+  overridesResolver: (e, t) => [
+    t.root
+  ]
+})(({ theme: e }) => ({
+  display: "flex",
+  alignItems: "center",
+  flexWrap: "wrap",
+  marginBottom: e.spacing(1),
+  gap: e.spacing(1),
+  "& .MuiChip-root": {
+    backgroundColor: e.palette.info.dark,
+    color: e.palette.background.default,
+    boxShadow: "0 4px 12px rgba(0, 0, 0, 0.2)"
+  }
+})), Cie = () => He({
+  root: ["root"]
+}, (n) => Ue(ZN, n), {}), Aie = ({ task: e }) => {
+  var c;
+  const t = xie(), n = ie(), [a, r] = C.useState(""), s = ((c = e.comments) == null ? void 0 : c.filter((u) => u.external).sort((u, d) => Pe.fromISO(d.created).toMillis() - Pe.fromISO(u.created).toMillis())) || [], o = (u) => {
+    try {
+      return Pe.fromISO(u).setLocale("fi").toLocaleString(Pe.DATETIME_SHORT);
+    } catch {
+      return u;
+    }
+  };
+  function l(u) {
+    r(u), console.log("message:", u);
+  }
+  return /* @__PURE__ */ E(_ie, { className: t.container, children: [
     /* @__PURE__ */ i(R, { className: t.messagesContainer, children: s.length === 0 ? /* @__PURE__ */ i(bo, { severity: "info", children: "No messages yet" }) : s.map((u) => /* @__PURE__ */ E(R, { className: t.messageRow, children: [
       /* @__PURE__ */ i(Hn, { className: u.source === "FRONTDESK" ? t.frontdeskAvatar : t.customerAvatar }),
       /* @__PURE__ */ E(R, { className: u.source === "FRONTDESK" ? t.frontdeskMessageBody : t.customerMessageBody, children: [
@@ -70271,7 +70499,7 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
         /* @__PURE__ */ i(F, { className: t.messageBoxLabel, children: n.formatMessage({ id: "task.customerMessages.newMessageTitle", defaultMessage: "Write a new message" }) })
       ] }),
       /* @__PURE__ */ i(
-        yie,
+        Iie,
         {
           value: a,
           fullWidth: !0,
@@ -70283,8 +70511,8 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
       )
     ] })
   ] });
-}, qN = "CustomerMessagesEdit", Eie = fe("div", {
-  name: qN,
+}, QN = "CustomerMessagesEdit", _ie = fe("div", {
+  name: QN,
   slot: "Message",
   overridesResolver: (e, t) => [
     t.container
@@ -70357,13 +70585,13 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
     marginRight: e.spacing(1),
     marginLeft: e.spacing(1)
   }
-})), yie = fe(Fe)(({ theme: e }) => ({
+})), Iie = fe(Fe)(({ theme: e }) => ({
   width: "100%",
   "& .MuiInputBase-input": {
     height: "2.5rem",
     padding: "0 12px"
   }
-})), Tie = () => He({
+})), xie = () => He({
   container: ["container"],
   messageRow: ["messageRow"],
   messageBoxLabel: ["messageBoxLabel"],
@@ -70374,22 +70602,22 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
   customerAvatar: ["customerAvatar"],
   frontdeskMessageBody: ["frontdeskMessageBody"],
   customerMessageBody: ["customerMessageBody"]
-}, (n) => Ue(qN, n), {}), vie = ({ task: e, open: t, onClose: n }) => {
-  const a = kie(), r = ie();
-  return /* @__PURE__ */ E(Sie, { className: a.editCustomerMessages, open: t, onClose: n, fullWidth: !0, maxWidth: "lg", slots: { transition: Uk }, children: [
+}, (n) => Ue(QN, n), {}), Nie = ({ task: e, open: t, onClose: n }) => {
+  const a = Die(), r = ie();
+  return /* @__PURE__ */ E(Rie, { className: a.editCustomerMessages, open: t, onClose: n, fullWidth: !0, maxWidth: "lg", slots: { transition: Uk }, children: [
     /* @__PURE__ */ E(Ce, { children: [
       r.formatMessage({ id: "task.customerMessages" }),
       r.formatMessage({ id: "eveli.textSeparatorColon" }),
       e.taskRef ?? "no task reference id"
     ] }),
-    /* @__PURE__ */ i(ke, { children: /* @__PURE__ */ i(bie, { task: e }) }),
+    /* @__PURE__ */ i(ke, { children: /* @__PURE__ */ i(Aie, { task: e }) }),
     /* @__PURE__ */ E(Ae, { children: [
       /* @__PURE__ */ i(K, { variant: "outlined", onClick: n, children: r.formatMessage({ id: "button.cancel" }) }),
       /* @__PURE__ */ i(K, { children: r.formatMessage({ id: "button.sendMessage", defaultMessage: "Send message now" }) })
     ] })
   ] });
-}, YN = "EditCustomerMessagesDialog", Sie = fe(Se, {
-  name: YN,
+}, JN = "EditCustomerMessagesDialog", Rie = fe(Se, {
+  name: JN,
   slot: "Messages",
   overridesResolver: (e, t) => [
     t.EditCustomerMessages
@@ -70402,324 +70630,96 @@ const Wre = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3
     padding: 0,
     overflow: "hidden"
   }
-})), kie = () => He({
+})), Die = () => He({
   editCustomerMessages: ["editCustomerMessages"]
-}, (n) => Ue(YN, n), {}), KN = ({ task: e }) => {
-  if (e.keyWords)
-    return /* @__PURE__ */ i(R, { gap: 1, display: "flex", mt: 1, children: e.keyWords.map((t) => /* @__PURE__ */ i(Qt, { label: t, variant: "filled", color: "primary", sx: {
-      boxShadow: "0 4px 12px rgba(0, 0, 0, 0.2)"
-    } }, t)) });
-}, wie = ({ task: e, open: t, onClose: n }) => {
-  var s;
-  const a = Aie(), r = ie();
-  return /* @__PURE__ */ E(Cie, { className: a.editDialog, open: t, onClose: n, maxWidth: "md", slots: { transition: Uk }, children: [
-    /* @__PURE__ */ E(Ce, { children: [
-      r.formatMessage({ id: "task.edit" }),
-      r.formatMessage({ id: "eveli.textSeparatorColon" }),
-      e.taskRef ?? "no task reference id"
-    ] }),
-    /* @__PURE__ */ i(ke, { children: /* @__PURE__ */ E(oe, { container: !0, display: "flex", alignItems: "center", children: [
-      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.dueDate" }) }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 7, lg: 7, xl: 7 }, children: /* @__PURE__ */ i($l, { value: (s = e.dueDate) == null ? void 0 : s.toISOString() }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.customerName" }) }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { value: e.clientIdentificator }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.subject" }) }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { value: e.subject }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.additionalInfo" }) }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i($l, { rows: 3, multiline: !0, value: e.additionalInfo }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 3, lg: 3, xl: 3 }, children: /* @__PURE__ */ i(F, { fontWeight: "bold", children: r.formatMessage({ id: "task.metaData" }) }) }),
-      /* @__PURE__ */ i(oe, { size: { md: 9, lg: 9, xl: 9 }, children: /* @__PURE__ */ i(KN, { task: e }) })
-    ] }) }),
-    /* @__PURE__ */ E(Ae, { children: [
-      /* @__PURE__ */ i(K, { variant: "outlined", onClick: n, children: r.formatMessage({ id: "button.cancel" }) }),
-      /* @__PURE__ */ i(K, { onClick: n, children: r.formatMessage({ id: "button.save" }) })
-    ] })
-  ] });
-}, $l = fe(Fe)(({ theme: e }) => ({
-  width: "100%",
-  "& .MuiInputBase-input": {
-    height: "2.5rem",
-    padding: "0 12px"
-  }
-})), XN = "EditTaskDialog", Cie = fe(Se, {
-  name: XN,
-  slot: "EditDialog",
-  overridesResolver: (e, t) => [
-    t.editDialog
-  ]
-})(({ theme: e }) => ({})), Aie = () => He({
-  editDialog: ["editDialog"]
-}, (n) => Ue(XN, n), {});
-function _ie(e) {
-  if (!e.dueDate)
-    return;
-  const t = Pe.local().startOf("day"), n = Pe.fromJSDate(e.dueDate).startOf("day"), a = Math.floor(t.diff(n, "days").days);
-  return e.status === "COMPLETED" || e.status === "REJECTED" ? {
-    isOverdue: a > 0,
-    days: Math.abs(a),
-    status: a > 0 ? "completedOverdue" : "completedOnTime"
-  } : a > 0 ? {
-    isOverdue: !0,
-    days: a,
-    status: "overdue"
-  } : a === 0 ? {
-    isOverdue: !1,
-    days: 0,
-    status: "dueToday"
-  } : {
-    isOverdue: !1,
-    days: Math.abs(a),
-    status: "upcomingDue"
-  };
-}
-const Iie = ({ ...e }) => {
-  const t = xie(), n = _ie(e.task);
-  if (n)
-    switch (n == null ? void 0 : n.status) {
-      case "upcomingDue":
-        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
-          /* @__PURE__ */ i(al, {}),
-          /* @__PURE__ */ E(F, { textAlign: "center", sx: { ...e.style.bodyTypographySmall }, children: [
-            n.days,
-            " day(s) left to complete task"
-          ] })
-        ] });
-      case "dueToday":
-        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
-          /* @__PURE__ */ i(al, {}),
-          /* @__PURE__ */ i(F, { textAlign: "center", sx: { ...e.style.bodyTypographySmall ?? void 0 }, children: "Task is due today!" })
-        ] });
-      case "completedOverdue":
-        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
-          /* @__PURE__ */ i(al, {}),
-          /* @__PURE__ */ E(F, { sx: { ...e.style.bodyTypographySmall }, children: [
-            "Task was closed ",
-            n.days,
-            " day(s) overdue"
-          ] })
-        ] });
-      case "overdue":
-        return /* @__PURE__ */ E(Hl, { className: t.root, ownerState: { ...e, status: n.status }, children: [
-          /* @__PURE__ */ i(al, {}),
-          /* @__PURE__ */ E(F, { sx: { ...e.style.bodyTypographySmall }, children: [
-            "Task is ",
-            n.days,
-            " day(s) overdue"
-          ] })
-        ] });
-      default:
-        return /* @__PURE__ */ i(W, {});
-    }
-}, ZN = "TaskOverrdueWarningClassName", Hl = fe("div", {
-  name: ZN,
-  slot: "Priority",
-  overridesResolver: (e, t) => [
-    t.root
-  ]
-})(({ theme: e, ownerState: t }) => ({
-  display: "flex",
-  alignItems: "center",
-  backgroundColor: vt(Vl(e, t.status), 0.1),
-  padding: e.spacing(0.5),
-  borderRadius: e.spacing(1),
-  border: `1px solid ${Vl(e, t.status)}`,
-  color: Vl(e, t.status),
-  "& .MuiSvgIcon-root": {
-    color: Vl(e, t.status),
-    fontSize: "medium"
-  }
-})), Vl = (e, t) => {
-  switch (t) {
-    case "overdue":
-      return e.palette.error.main;
-    case "dueToday":
-      return "#e85d04";
-    case "upcomingDue":
-      return e.palette.info.main;
-    case "completedOverdue":
-      return e.palette.warning.main;
-    case "completedOnTime":
-      return e.palette.success.main;
-    default:
-      return e.palette.background.paper;
-  }
-}, xie = () => He({
-  root: ["root"]
-}, (n) => Ue(ZN, n), {}), Nie = ({ style: e }) => {
-  const t = Die(), [n, a] = tt("LOW"), r = [
-    { level: "LOW", color: "#45a048" },
-    { level: "MEDIUM", color: "#2196f3" },
-    { level: "HIGH", color: "#f44336" }
-  ];
-  return /* @__PURE__ */ i(Rie, { className: t.root, style: e, children: /* @__PURE__ */ E(Rt, { direction: "column", width: "100%", children: [
-    /* @__PURE__ */ E(F, { fontWeight: 500, mb: 1, sx: { ...e.bodyTypography, fontWeight: 500 }, children: [
-      "Priority: ",
-      n
-    ] }),
-    /* @__PURE__ */ i(vf, { fullWidth: !0, className: t.prioritySelect, disableElevation: !0, children: r.map(({ level: s, color: o }) => {
-      const l = n === s;
-      return /* @__PURE__ */ i(
-        K,
-        {
-          variant: l ? "contained" : "outlined",
-          onClick: () => a(s),
-          sx: {
-            backgroundColor: l ? o : "transparent",
-            borderColor: l ? o : "#ccc",
-            color: l ? "#FFFFFF" : "rgba(0, 0, 0, 0.38)",
-            ...e.bodyTypographySmall,
-            "&:hover": {
-              backgroundColor: l ? o : "rgba(0, 0, 0, 0.04)",
-              borderColor: l ? o : "#ccc"
-            }
-          },
-          children: s
-        },
-        s
-      );
-    }) })
-  ] }) });
-}, QN = "TaskPriority", Rie = fe("div", {
-  name: QN,
-  slot: "Root",
-  overridesResolver: (e, t) => [
-    t.root
-  ]
-})(({ theme: e, style: t }) => ({
-  display: "flex",
-  alignItems: "center",
-  "& .TaskPriority-prioritySelect": {
-    "& .MuiButton-root": {
-      textTransform: "none",
-      fontWeight: 500,
-      borderColor: "#ccc",
-      width: "100%",
-      padding: e.spacing(0.5, 2),
-      minHeight: 32
-    },
-    "& .MuiButton-root:first-of-type": {
-      borderTopLeftRadius: e.spacing(1),
-      borderBottomLeftRadius: e.spacing(1)
-    },
-    "& .MuiButton-root:last-of-type": {
-      borderTopRightRadius: e.spacing(1),
-      borderBottomRightRadius: e.spacing(1)
-    }
-  }
-})), Die = () => He({
-  root: ["root"],
-  prioritySelect: ["prioritySelect"]
-}, (n) => Ue(QN, n), {}), Oie = ({ status: e, style: t }) => {
-  const n = eR(), a = () => {
-    switch (e) {
-      case "NEW":
-        return 25;
-      case "OPEN":
-        return 50;
-      case "COMPLETED":
-      case "REJECTED":
-        return 100;
-      default:
-        return 0;
-    }
-  }, r = () => {
-    switch (e) {
-      case "NEW":
-        return "#ffeb3b";
-      // Purpley
-      case "OPEN":
-        return "#2196f3";
-      // Blue
-      case "COMPLETED":
-        return "#4caf50";
-      // Green
-      case "REJECTED":
-        return "#f44336";
-      // Red
-      default:
-        return "#ccc";
+}, (n) => Ue(JN, n), {}), Oie = ({ task: e, style: t }) => {
+  var l;
+  const n = Fie(), a = ((l = e.comments) == null ? void 0 : l.filter((c) => c.external).sort((c, u) => Pe.fromISO(u.created).toMillis() - Pe.fromISO(c.created).toMillis())) || [], r = a.slice(0, 3), s = (c) => {
+    try {
+      return Pe.fromISO(c).setLocale("fi").toLocaleString(Pe.DATETIME_SHORT);
+    } catch {
+      return c;
     }
-  }, s = a(), o = r();
-  return /* @__PURE__ */ E(R, { className: n.progressBar, children: [
-    /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography, fontWeight: 500, mb: 1 }, children: [
-      "Status: ",
-      e
-    ] }),
-    /* @__PURE__ */ i(R, { className: n.backgroundTrack, children: /* @__PURE__ */ i(
-      R,
-      {
-        sx: {
-          height: "100%",
-          width: `${s}%`,
-          backgroundColor: o,
-          transition: "width 0.3s ease-in-out"
-        }
-      }
-    ) }),
-    /* @__PURE__ */ E(F, { className: n.progressDesc, children: [
-      s,
-      "% complete"
+  }, o = (c, u) => c.length <= u ? c : c.slice(0, u) + "…";
+  return /* @__PURE__ */ E(Lie, { className: n.container, children: [
+    r.length === 0 && /* @__PURE__ */ i(F, { sx: { ...t }, children: "No messages" }),
+    r.slice(0, 3).map((c) => /* @__PURE__ */ E(R, { className: n.messageRow, children: [
+      /* @__PURE__ */ i(Hn, { className: c.source === "FRONTDESK" ? n.frontdeskAvatar : n.customerAvatar }),
+      /* @__PURE__ */ E(R, { className: c.source === "FRONTDESK" ? n.frontdeskMessageBody : n.customerMessageBody, children: [
+        /* @__PURE__ */ E(F, { className: n.senderInfo, sx: { ...t.bodyTypography }, children: [
+          c.userName,
+          " wrote on ",
+          s(c.created)
+        ] }),
+        /* @__PURE__ */ i(F, { style: { ...t.bodyTypography, overflow: "hidden", whiteSpace: "normal" }, children: o(c.commentText, 200) })
+      ] })
+    ] }, c.id)),
+    a.length > 3 && /* @__PURE__ */ E(F, { sx: { ...t.bodyTypography }, children: [
+      "...",
+      a.length - 3,
+      " more..."
     ] })
   ] });
-}, Lie = ({ style: e }) => {
-  const t = eR(), [n, a] = C.useState("NEW"), r = (s) => {
-    a(s.target.value);
-  };
-  return /* @__PURE__ */ E(Fie, { className: t.root, children: [
-    /* @__PURE__ */ i(Oie, { status: n, style: e }),
-    /* @__PURE__ */ E(
-      Vi,
-      {
-        value: n,
-        onChange: r,
-        size: "small",
-        sx: {
-          minWidth: 120,
-          maxWidth: 150,
-          alignSelf: "center"
-        },
-        children: [
-          /* @__PURE__ */ i(lt, { value: "NEW", children: "NEW" }),
-          /* @__PURE__ */ i(lt, { value: "OPEN", children: "OPEN" }),
-          /* @__PURE__ */ i(lt, { value: "COMPLETED", children: "COMPLETED" }),
-          /* @__PURE__ */ i(lt, { value: "REJECTED", children: "REJECTED" })
-        ]
-      }
-    )
-  ] });
-}, JN = "TaskStatus", Fie = fe("div", {
-  name: JN,
-  slot: "Root",
+}, eR = "EveliCustomerMessagesReadOnly", Lie = fe("div", {
+  name: eR,
+  slot: "Message",
   overridesResolver: (e, t) => [
-    t.root
+    t.container
   ]
 })(({ theme: e }) => ({
   display: "flex",
-  justifyContent: "space-between",
-  alignItems: "center",
-  "& .TaskStatus-progressBar": {
-    width: "60%"
+  flexDirection: "column",
+  gap: e.spacing(2),
+  "& .EveliCustomerMessagesReadOnly-messageRow": {
+    display: "flex",
+    alignItems: "center"
   },
-  "& .TaskStatus-backgroundTrack": {
-    width: "100%",
-    height: e.spacing(2),
-    backgroundColor: "#eee",
-    borderRadius: e.spacing(3),
-    overflow: "hidden",
-    boxShadow: "inset 0 1px 3px rgba(0,0,0,0.2)"
+  "& .EveliCustomerMessagesReadOnly-senderInfo": {
+    fontWeight: "bold !important"
+    //TODO figure out a better way with cardThemeConfig
   },
-  "& .TaskStatus-progressDesc": {
-    marginTop: e.spacing(0.5),
-    textAlign: "right",
-    ...e.typography.caption
+  "& .EveliCustomerMessagesReadOnly-frontdeskAvatar": {
+    border: `1px solid ${$n("#caf0f8", 0.1)}`,
+    backgroundColor: "#caf0f8",
+    marginRight: e.spacing(1),
+    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
+  },
+  "& .EveliCustomerMessagesReadOnly-customerAvatar": {
+    border: `1px solid ${$n("#ecf39e", 0.1)}`,
+    backgroundColor: "#ecf39e",
+    marginRight: e.spacing(1),
+    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
+  },
+  "& .EveliCustomerMessagesReadOnly-frontdeskMessageBody": {
+    flexGrow: 1,
+    backgroundColor: "#caf0f8",
+    borderRadius: "20px",
+    padding: e.spacing(1),
+    border: `1px solid ${$n("#caf0f8", 0.1)}`,
+    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
+  },
+  "& .EveliCustomerMessagesReadOnly-customerMessageBody": {
+    flexGrow: 1,
+    backgroundColor: "#ecf39e",
+    borderRadius: "20px",
+    padding: e.spacing(1),
+    border: `1px solid ${$n("#ecf39e", 0.1)}`,
+    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)"
+  },
+  "& .MuiSvgIcon-root": {
+    fontSize: "10pt",
+    marginRight: e.spacing(1),
+    marginLeft: e.spacing(1)
   }
-})), eR = () => He({
-  root: ["root"],
-  progressBar: ["progressBar"],
-  backgroundTrack: ["backgroundTrack"],
-  progressIndicator: ["progressIndicator"],
-  progressDesc: ["progressDesc"]
-}, (n) => Ue(JN, n), {}), Mie = (e) => {
+})), Fie = () => He({
+  container: ["container"],
+  messageRow: ["messageRow"],
+  senderInfo: ["senderInfo"],
+  frontdeskAvatar: ["frontdeskAvatar"],
+  customerAvatar: ["customerAvatar"],
+  frontdeskMessageBody: ["frontdeskMessageBody"],
+  customerMessageBody: ["customerMessageBody"]
+}, (n) => Ue(eR, n), {}), Mie = (e) => {
   const [t, n] = C.useState(), { getTask: a } = ve("worker/rest/api/tasks/$taskId.GET", {}), [r, s] = C.useState(!1), [o, l] = C.useState({}), [c, u] = C.useState(), [d, p] = C.useState("default"), m = BN(r)[d], h = (k) => {
     l((w) => ({
       ...w,
@@ -70758,7 +70758,7 @@ const Iie = ({ ...e }) => {
             Sa,
             {
               id: "task_main",
-              editDialog: c === "task_main" && /* @__PURE__ */ i(wie, { task: t, open: !0, onClose: v }),
+              editDialog: c === "task_main" && /* @__PURE__ */ i(lie, { task: t, open: !0, onClose: v }),
               onDoubleClick: () => A("task_main"),
               isMenu: !0,
               title: `Task: ${t.taskRef}`,
@@ -70775,14 +70775,14 @@ const Iie = ({ ...e }) => {
                     style: m,
                     value: /* @__PURE__ */ E(R, { display: "flex", justifyContent: "space-between", children: [
                       b(t.dueDate),
-                      /* @__PURE__ */ i(Iie, { task: t, style: m })
+                      /* @__PURE__ */ i(pie, { task: t, style: m })
                     ] })
                   }
                 ),
                 /* @__PURE__ */ i(ka, { label: "Customer name", value: t.clientIdentificator ? t.clientIdentificator : "NONE", style: m }),
                 /* @__PURE__ */ i(ka, { label: "Subject", value: t.subject, style: m }),
                 /* @__PURE__ */ i(ka, { label: "Info", value: t.additionalInfo, style: m }),
-                /* @__PURE__ */ i(KN, { task: t }),
+                /* @__PURE__ */ i(GN, { task: t }),
                 /* @__PURE__ */ i(Se, { open: !1 })
               ]
             }
@@ -70822,9 +70822,9 @@ const Iie = ({ ...e }) => {
               flashy: g("status-priority"),
               onToggleFlashy: () => h("status-priority"),
               children: /* @__PURE__ */ E(Rt, { direction: "column", height: "100%", children: [
-                /* @__PURE__ */ i(Lie, { style: m }),
+                /* @__PURE__ */ i(Eie, { style: m }),
                 /* @__PURE__ */ i(rt, { sx: { my: 1 } }),
-                /* @__PURE__ */ i(Nie, { style: m })
+                /* @__PURE__ */ i(mie, { style: m })
               ] })
             }
           ) }),
@@ -70839,9 +70839,9 @@ const Iie = ({ ...e }) => {
               flashy: g("assignees-roles"),
               onToggleFlashy: () => h("assignees-roles"),
               children: [
-                /* @__PURE__ */ i(Ul, { label: "Roles", value: /* @__PURE__ */ i(sie, { task: t }), style: m }),
+                /* @__PURE__ */ i(Ul, { label: "Roles", value: /* @__PURE__ */ i(wie, { task: t }), style: m }),
                 /* @__PURE__ */ i(rt, { sx: { my: 1 } }),
-                /* @__PURE__ */ i(Ul, { label: "Assigned to", value: /* @__PURE__ */ i(rie, { task: t }), style: m })
+                /* @__PURE__ */ i(Ul, { label: "Assigned to", value: /* @__PURE__ */ i(eie, { task: t }), style: m })
               ]
             }
           ) }),
@@ -70850,14 +70850,14 @@ const Iie = ({ ...e }) => {
             {
               id: "customer_messages",
               title: "Customer messages",
-              editDialog: c === "customer_messages" && /* @__PURE__ */ i(vie, { task: t, open: !0, onClose: v }),
+              editDialog: c === "customer_messages" && /* @__PURE__ */ i(Nie, { task: t, open: !0, onClose: v }),
               onDoubleClick: () => A("customer_messages"),
               isMenu: !0,
               startAdornmentIcon: /* @__PURE__ */ i(Wa, { icon: MO }),
               styleVariant: d,
               flashy: g("customer_messages"),
               onToggleFlashy: () => h("customer_messages"),
-              children: /* @__PURE__ */ i(Rt, { direction: "column", children: /* @__PURE__ */ i(mie, { task: t, style: m }) })
+              children: /* @__PURE__ */ i(Rt, { direction: "column", children: /* @__PURE__ */ i(Oie, { task: t, style: m }) })
             }
           ) }),
           /* @__PURE__ */ i(oe, { size: r ? _t.singleCol : _t[d], children: /* @__PURE__ */ i(
@@ -70870,7 +70870,7 @@ const Iie = ({ ...e }) => {
               styleVariant: d,
               flashy: g("files"),
               onToggleFlashy: () => h("files"),
-              children: /* @__PURE__ */ i(die, { task: t, style: m })
+              children: /* @__PURE__ */ i(iie, { task: t, style: m })
             }
           ) }),
           /* @__PURE__ */ i(oe, { size: r ? _t.singleCol : _t[d], children: /* @__PURE__ */ i(
@@ -70883,7 +70883,7 @@ const Iie = ({ ...e }) => {
               styleVariant: d,
               flashy: g("feedback"),
               onToggleFlashy: () => h("feedback"),
-              children: /* @__PURE__ */ i(lie, { task: t, style: m })
+              children: /* @__PURE__ */ i(nie, { task: t, style: m })
             }
           ) }),
           /* @__PURE__ */ i(oe, { size: r ? _t.singleCol : _t[d], children: /* @__PURE__ */ i(
@@ -70896,7 +70896,7 @@ const Iie = ({ ...e }) => {
               styleVariant: d,
               flashy: g("notes"),
               onToggleFlashy: () => h("notes"),
-              children: /* @__PURE__ */ i(tie, { task: t, style: m })
+              children: /* @__PURE__ */ i(vie, { task: t, style: m })
             }
           ) }),
           /* @__PURE__ */ i(oe, { size: r ? _t.singleCol : _t[d], children: /* @__PURE__ */ E(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxs-ts/eveli-ide",
-  "version": "0.0.430",
+  "version": "0.0.432",
   "homepage": "https://github.com/digiexpress-io/digiexpress-parent",
   "main": "build/index.js",
   "types": "build/index.d.ts",