Merge branch 'dev' of github.com:Tria-plc/emaui into Refactor

Resolved by unifying on the lib/data AdvancedTable (PR #10) as the canonical
table component: kept its API plus teammate i18n/feature work, kept the
folder-per-table structure (index.tsx + columns.tsx + actions.tsx) across all
27 tables, removed the parallel lib/table implementation, and fixed
pre-existing compile breaks in ExamDetailPage/QuestionAssigner/RecordResultModal.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

apps/backoffice/src/app/features/item/components/ItemTable/actions.tsx

@@ -1,17 +1,28 @@
+import { ActionIcon, Group, Tooltip } from '@mantine/core';
 import { IconTrash } from '@tabler/icons-react';
-import type { AdvancedTableAction } from '@ema-platform/ui';
+import type { AdvancedColumn } from '@ema-platform/ui';
 import type { Item } from '../../api/item-api';
 
-export function itemColumnActions(handlers: {
+export function itemActionsColumn(handlers: {
   onDelete: (item: Item) => void;
-}): AdvancedTableAction<Item>[] {
-  return [
-    {
-      key: 'delete',
-      label: 'Delete',
-      color: 'red',
-      icon: <IconTrash size={16} />,
-      onClick: handlers.onDelete,
-    },
-  ];
+}): AdvancedColumn<Item> {
+  return {
+    header: '',
+    label: 'Actions',
+    align: 'right',
+    cell: ({ row }) => (
+      <Group gap="xs" wrap="nowrap" justify="flex-end">
+        <Tooltip label="Delete">
+          <ActionIcon
+            color="red"
+            variant="subtle"
+            aria-label="Delete"
+            onClick={() => handlers.onDelete(row.original)}
+          >
+            <IconTrash size={16} />
+          </ActionIcon>
+        </Tooltip>
+      </Group>
+    ),
+  };
 }

apps/backoffice/src/app/features/item/components/ItemTable/columns.tsx

@@ -1,5 +1,5 @@
 import { Badge } from '@mantine/core';
-import type { AdvancedTableColumn } from '@ema-platform/ui';
+import type { AdvancedColumn } from '@ema-platform/ui';
 import type { Item } from '../../api/item-api';
 
 const STATUS_COLORS: Record<Item['status'], string> = {
@@ -8,16 +8,18 @@ const STATUS_COLORS: Record<Item['status'], string> = {
   ARCHIVED: 'orange',
 };
 
-export const itemColumns: AdvancedTableColumn<Item>[] = [
-  { key: 'name', header: 'Name' },
-  {
-    key: 'status',
-    header: 'Status',
-    render: (item) => <Badge color={STATUS_COLORS[item.status]}>{item.status}</Badge>,
-  },
-  {
-    key: 'createdAt',
-    header: 'Created',
-    render: (item) => new Date(item.createdAt).toLocaleDateString(),
-  },
-];
+export function itemColumns(showDate: (date: string) => string): AdvancedColumn<Item>[] {
+  return [
+    { header: 'Name', accessorKey: 'name' },
+    {
+      header: 'Status',
+      cell: ({ row }) => (
+        <Badge color={STATUS_COLORS[row.original.status]}>{row.original.status}</Badge>
+      ),
+    },
+    {
+      header: 'Created',
+      cell: ({ row }) => showDate(row.original.createdAt),
+    },
+  ];
+}

apps/backoffice/src/app/features/item/components/ItemTable/index.tsx

@@ -1,30 +1,39 @@
 import { useGetItemsQuery, useDeleteItemMutation, type Item } from '../../api/item-api';
-import { AdvancedTable, notify } from '@ema-platform/ui';
+import { AdvancedTable, notify, useErrorHandler, useServerTable } from '@ema-platform/ui';
+import { useDateDisplayer } from '@ema-platform/shared';
 import { itemColumns } from './columns';
-import { itemColumnActions } from './actions';
+import { itemActionsColumn } from './actions';
 
 export function ItemTable() {
   const { data, isLoading, refetch } = useGetItemsQuery({});
   const [deleteItem] = useDeleteItemMutation();
+  const { handleError } = useErrorHandler();
+  const showDate = useDateDisplayer();
+  const table = useServerTable();
 
   const handleDelete = async (item: Item) => {
     try {
       await deleteItem(item.id).unwrap();
       notify.success('Item deleted');
-    } catch {
-      notify.error('Failed to delete item');
+    } catch (e) {
+      handleError(e);
     }
   };
 
+  const paged = table.paginate(data?.data ?? []);
+
   return (
-    <AdvancedTable
-      columns={itemColumns}
-      data={data?.data ?? []}
-      rowKey={(item) => item.id}
-      actions={itemColumnActions({ onDelete: handleDelete })}
-      loading={isLoading}
-      onRefresh={refetch}
-      emptyTitle="No items found"
+    <AdvancedTable<Item>
+      tableName="Items"
+      columns={[...itemColumns(showDate), itemActionsColumn({ onDelete: handleDelete })]}
+      data={paged.rows}
+      itemCount={paged.itemCount}
+      pageIndex={paged.pageIndex}
+      onPageChange={table.setPageIndex}
+      pageSize={table.pageSize}
+      isLoading={isLoading}
+      refresh={refetch}
+      emptyText="No items found"
     />
   );
 }