fix: type error and other fixes

apps/edr-freight-web/backoffice/src/pages/fleet/FleetCrudPages.tsx

@@ -1,49 +1,49 @@
-import { FormEvent, ReactNode, useMemo, useState } from 'react';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import { Edit, Eye, Plus, Search, Trash2 } from 'lucide-react';
+import { FormEvent, ReactNode, useMemo, useState } from 'react';
 
 import { api } from '@/services/api';
 import {
-  ActionIcon,
-  Badge as MantineBadge,
-  Box,
-  Button as MantineButton,
-  Group,
-  Modal,
-  NumberInput,
-  Pagination,
-  Paper,
-  ScrollArea,
-  Select as MantineSelect,
-  SimpleGrid,
-  Stack,
-  Table as MantineTable,
-  Text,
-  TextInput,
-  Title,
+    ActionIcon,
+    Box,
+    Group,
+    Badge as MantineBadge,
+    Button as MantineButton,
+    Select as MantineSelect,
+    Table as MantineTable,
+    Modal,
+    NumberInput,
+    Pagination,
+    Paper,
+    ScrollArea,
+    SimpleGrid,
+    Stack,
+    Text,
+    TextInput,
+    Title,
 } from '@mantine/core';
 
+import { DeliverCargoDialog } from '@/components/cargoes/DeliverCargoDialog';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
+    Dialog,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
 } from '@/components/ui/dialog';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@edr/ui-common';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
 import { useToast } from '@/hooks/use-toast';
 import type { Cargo } from '@/services/cargoService';
-import { DeliverCargoDialog } from '@/components/cargoes/DeliverCargoDialog';
 import type { Container } from '@/services/containerService';
 import type { Locomotive } from '@/services/locomotives.service';
 import type { Train } from '@/services/trains.service';
-import type { Wagon } from '@/services/wagon.service';
 import type { WagonType } from '@/services/wagon-types.service';
+import type { Wagon } from '@/services/wagon.service';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@edr/ui-common';
 
 type FormValue = string | number | boolean | string[];
 
@@ -331,7 +331,7 @@ function FleetCrudPage<T extends { id: string }>({
               <TableRow key={item.id}>
                 {columns.map((column) => (
                   <TableCell key={String(column.key)}>
-                    {column.render ? column.render(item) : String((item as Record<string, unknown>)[column.key] ?? '-')}
+                    {column.render ? column.render(item) : String((item as Record<string, unknown>)[String(column.key)] ?? '-')}
                   </TableCell>
                 ))}
                 <TableCell>
@@ -410,7 +410,7 @@ function FleetCrudPage<T extends { id: string }>({
                           ...current,
                           [field.key]: selectedValue,
                           ...(field.onValueChange?.(selectedValue, current) ?? {}),
-                        }))
+                        }) as Record<string, FormValue>)
                       }
                     >
                       <SelectTrigger id={field.key}>
@@ -480,12 +480,6 @@ function FleetCrudPage<T extends { id: string }>({
 
 const statusBadge = (status?: string) => <Badge variant="outline">{status ?? '-'}</Badge>;
 
-const activeBadge = (isActive?: boolean) => (
-  <Badge variant={isActive === false ? 'secondary' : 'outline'}>
-    {isActive === false ? 'Inactive' : 'Active'}
-  </Badge>
-);
-
 const optionLabel = (options: { value: string; label: string }[], value?: string | null) =>
   options.find((option) => option.value === value)?.label ?? value ?? '-';
 

apps/edr-freight-web/backoffice/src/pages/fleet/FleetResourcePage.tsx

@@ -1,19 +1,10 @@
 import type { ColumnDef } from "@edr/ui-common";
-import { Box, Button, Card, Group, Modal, Select, Stack, Text } from "@mantine/core";
+import { Box, Button, Card, Container, Group, Modal, Select, Stack, Text, Title } from "@mantine/core";
 import { useMutation, useQuery } from "@tanstack/react-query";
 
 import { api } from "@/services/api";
-import {
-  Archive,
-  Circle,
-  CircleCheck,
-  CircleSlash,
-  Layers,
-  Link2,
-  Plus,
-  Wrench,
-  type LucideIcon,
-} from "lucide-react";
+import Breadcrumbs from "@/components/ui/Breadcrumbs";
+import { Plus } from "lucide-react";
 import { useEffect, useMemo, useState } from "react";
 import { Navigate, useLocation } from "react-router-dom";
 
@@ -23,37 +14,20 @@ import FleetRecordActions from "@/components/fleet/FleetRecordActions";
 import FleetToolbar from "@/components/fleet/FleetToolbar";
 import { formatFleetCell, registerFleetOptionLabels } from "@/components/fleet/fleetFormat";
 import { useFleetViewMode } from "@/components/fleet/useFleetViewMode";
-import { KpiStrip, PageContainer, PageHeader } from "@/components/page";
 import { ruleEngineTable } from "@/components/ruleEngine/ruleEngineStyles";
 import { useToast } from "@/hooks/use-toast";
 import {
-  FLEET_SELECT_NONE,
-  getFleetResource,
-  getFleetSlugFromPath,
-  type FleetFormFieldDef,
-  type FleetResourceSlug,
+    FLEET_SELECT_NONE,
+    getFleetResource,
+    getFleetSlugFromPath,
+    type FleetFormFieldDef,
+    type FleetResourceSlug,
 } from "@/pages/fleet/config/resources";
 import type { FleetListFilters, FleetRecord } from "@/services/fleet/fleet.service";
 import { DataTable, DataTableFooter, usePagination } from "@edr/ui-common";
 
 const DEFAULT_SLUG: FleetResourceSlug = "locomotives";
 
-const FLEET_STATUS_META: Record<
-  string,
-  { label: string; icon: LucideIcon; color: string }
-> = {
-  AVAILABLE: { label: "Available", icon: CircleCheck, color: "edr-green" },
-  ASSIGNED: { label: "Assigned", icon: Link2, color: "blue" },
-  MAINTENANCE: { label: "Maintenance", icon: Wrench, color: "yellow" },
-  OUT_OF_SERVICE: { label: "Out of service", icon: CircleSlash, color: "red" },
-  RETIRED: { label: "Retired", icon: Archive, color: "gray" },
-};
-
-const humanizeStatus = (status: string) => {
-  const text = status.replace(/_/g, " ").toLowerCase();
-  return text.charAt(0).toUpperCase() + text.slice(1);
-};
-
 const FleetResourcePage = () => {
   const location = useLocation();
   const slug = getFleetSlugFromPath(location.pathname) ?? DEFAULT_SLUG;
@@ -113,6 +87,9 @@ const FleetResourcePage = () => {
   const { data: yards = [], isLoading: yardsLoading } = useQuery(
     api.routes.yards.queryOptions(),
   );
+  const { data: drivers = [] } = useQuery(
+    api.fleet.list.queryOptions({ input: { slug: "drivers" } }),
+  );
 
   useEffect(() => {
     setPagination((prev) => ({ pageIndex: 0, pageSize: prev.pageSize }));
@@ -301,39 +278,6 @@ const FleetResourcePage = () => {
 
   const tableStatus = isLoading ? "loading" : isError ? "error" : "success";
 
-  const kpiItems = useMemo(() => {
-    const items = [
-      {
-        label: `Total ${config?.label.toLowerCase() ?? ""}`,
-        value: allRows.length,
-        icon: Layers,
-        color: "edr-green",
-      },
-    ];
-    if (hasStatusColumn) {
-      const counts = new Map<string, number>();
-      for (const row of allRows) {
-        const status = String(
-          (row as unknown as Record<string, unknown>).status ?? "",
-        );
-        if (status) counts.set(status, (counts.get(status) ?? 0) + 1);
-      }
-      const top = [...counts.entries()]
-        .sort((a, b) => b[1] - a[1])
-        .slice(0, 4);
-      for (const [status, count] of top) {
-        const meta = FLEET_STATUS_META[status];
-        items.push({
-          label: meta?.label ?? humanizeStatus(status),
-          value: count,
-          icon: meta?.icon ?? Circle,
-          color: meta?.color ?? "gray",
-        });
-      }
-    }
-    return items.slice(0, 5);
-  }, [allRows, hasStatusColumn, config?.label]);
-
   if (!config) {
     return <Navigate to="/dashboard/locomotives" replace />;
   }
@@ -376,7 +320,7 @@ const FleetResourcePage = () => {
   const handleAssignDriver = async () => {
     if (!assigningDriver || !("id" in assigningDriver) || !selectedDriver) return;
     try {
-      const selectedDriverRecord = (drivers as Array<Record<string, unknown>>).find(
+      const selectedDriverRecord = (drivers as unknown as Array<Record<string, unknown>>).find(
         (d) => String(d.id) === selectedDriver
       );
       if (!selectedDriverRecord) return;
@@ -384,6 +328,7 @@ const FleetResourcePage = () => {
       const driverName = `${selectedDriverRecord.firstName} ${selectedDriverRecord.lastName}`;
 
       await update.mutateAsync({
+        slug,
         id: String(assigningDriver.id),
         data: {
           assignedDriverId: selectedDriver,
@@ -608,7 +553,7 @@ const FleetResourcePage = () => {
             clearable
             value={selectedDriver}
             onChange={(value) => setSelectedDriver(value || "")}
-            data={(drivers as Array<Record<string, unknown>>).map((driver) => ({
+            data={(drivers as unknown as Array<Record<string, unknown>>).map((driver) => ({
               value: String(driver.id || ""),
               label: `${driver.firstName} ${driver.lastName} (${driver.licenseNumber})`,
             }))}