@haiiro/docuflow 0.0.13 → 0.0.16

package/src/front-components/docflow-tasks.front-component.tsx

@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { defineFrontComponent } from 'twenty-sdk/define';
 import { AppPath, enqueueSnackbar, openSidePanelPage } from 'twenty-sdk/front-component';
 import {
@@ -37,7 +37,6 @@ import { type DocflowTask, type WorkspaceMember } from 'src/front/types';
 import {
   DataTable,
   DocflowRoot,
-  formatTotal,
   ListToolbar,
   Message,
   pluralize,
@@ -56,8 +55,9 @@ import {
   useRowSelection,
 } from 'src/front/ui/components';
 import { FormFieldsBuilder } from 'src/front/ui/form-fields-builder';
-import { BulkChangeDialog, Button, type MenuAction, MenuButton, StatusChip, ViewTabs } from 'src/front/ui/kit';
+import { BulkChangeDialog, Button, type MenuAction, MenuButton, QuickViews, StatusChip } from 'src/front/ui/kit';
 
+import { TableSkeleton } from 'src/front/ui/skeleton';
 import { UrgentTaskCards } from 'src/front/ui/task-cards';
 import { TaskWorkPanel } from 'src/front/ui/task-work-panel';
 import {
@@ -273,6 +273,7 @@ const DocflowTasks = () => {
   const [filters, setFilters] = useState<TaskFilters>(DEFAULT_FILTERS);
   const [sort, setSort] = useState<TableSort>(DEFAULT_SORT);
   const [panel, setPanel] = useState<Panel>({ kind: 'closed' });
+  const [knownTitles, setKnownTitles] = useState<Record<string, string>>({});
   const [pages, setPages] = useState(1);
   const [hiddenColumns, setHiddenColumns] = useHiddenColumns(['createdAt']);
   const [bulkDialog, setBulkDialog] = useState<BulkDialog>();
@@ -427,11 +428,33 @@ const DocflowTasks = () => {
 
   const selectedIds = selection.selectedIds;
   const openSelectedCount = selectedTasks.filter((task) => task.status !== TASK_DONE_STATUS).length;
+  const openTask =
+    panel.kind === 'task'
+      ? (tasks.find(({ id }) => id === panel.taskId) ?? urgentTasks.find(({ id }) => id === panel.taskId))
+      : undefined;
+  // A completed task leaves the "Открытые" list while its panel stays open:
+  // the panel keeps the title it was opened with.
+  const openTaskTitle = openTask?.title?.trim() ?? '';
+
+  useEffect(() => {
+    if (openTask !== undefined && openTaskTitle.length > 0) {
+      setKnownTitles((current) =>
+        current[openTask.id] === openTaskTitle ? current : { ...current, [openTask.id]: openTaskTitle },
+      );
+    }
+  }, [openTask?.id, openTaskTitle]);
+
+  const panelTitle =
+    panel.kind === 'create'
+      ? 'Новое задание'
+      : panel.kind === 'task'
+        ? openTaskTitle || knownTitles[panel.taskId] || 'Без названия'
+        : undefined;
 
   return (
     <DocflowRoot>
       <SplitView
-        panelTitle={panel.kind === 'create' ? 'Новое задание' : 'Задание'}
+        panelTitle={panelTitle}
         onClosePanel={() => setPanel({ kind: 'closed' })}
         panel={
           panel.kind === 'create' ? (
@@ -444,7 +467,13 @@ const DocflowTasks = () => {
               }}
             />
           ) : panel.kind === 'task' ? (
-            <TaskWorkPanel key={panel.taskId} taskId={panel.taskId} withChat onChanged={() => void reloadAll()} />
+            <TaskWorkPanel
+              key={panel.taskId}
+              taskId={panel.taskId}
+              withChat
+              showTitle={false}
+              onChanged={() => void reloadAll()}
+            />
           ) : undefined
         }
       >
@@ -506,20 +535,12 @@ const DocflowTasks = () => {
             ],
           }}
           views={
-            <ViewTabs
+            <QuickViews
               value={view}
               onChange={changeView}
               options={VIEWS.map((option) => ({ ...option, count: counts?.[option.value] }))}
             />
           }
-          total={
-            data === undefined
-              ? undefined
-              : formatTotal(tasks.length + urgentTasks.length, (data.totalCount ?? tasks.length) + urgentTasks.length, TASK_NOUN)
-          }
-          columns={{ columns: COLUMNS, hiddenKeys: hiddenColumns, onChange: setHiddenColumns }}
-          onRefresh={() => void reloadAll()}
-          isRefreshing={loading}
           onCreate={() => setPanel({ kind: 'create' })}
         />
         {hasCards && (
@@ -536,7 +557,7 @@ const DocflowTasks = () => {
             <Message tone="danger">{getErrorMessage(error, 'Не удалось загрузить задания')}</Message>
           </div>
         )}
-        {loading && data === undefined && <Message>Загрузка…</Message>}
+        {loading && data === undefined && <TableSkeleton />}
         {!loading && error === undefined && tasks.length === 0 && (
           <Message>{urgentTasks.length > 0 ? 'Остальных заданий нет: все срочные — в карточках выше.' : 'Заданий нет.'}</Message>
         )}
@@ -550,6 +571,7 @@ const DocflowTasks = () => {
             <DataTable
               columns={COLUMNS}
               hiddenColumnKeys={hiddenColumns}
+              onHiddenColumnsChange={setHiddenColumns}
               sort={sort}
               onSortChange={(next) => {
                 setSort(next);