diff --git a/apps/logistics/src/App.tsx b/apps/logistics/src/App.tsx index 7a19d0def4c998c60e58ee21610ab8cbce840b53..6d9c3713390221348161696e223c81f776e2d2f3 100644 --- a/apps/logistics/src/App.tsx +++ b/apps/logistics/src/App.tsx @@ -9,11 +9,14 @@ function App() { name="Logistics" routes={routes} navigationBar={[ + <Nav.Link key="investigations" as={Link} to="/investigation"> + Investigations + </Nav.Link>, <Nav.Link key="addresses" as={Link} to="/"> - Addresses + My addresses </Nav.Link>, <Nav.Link key="parcels" as={Link} to="/parcels"> - Parcels + My parcels </Nav.Link>, ]} /> diff --git a/apps/logistics/src/components/investigation/shipment/parcel/parcelList.tsx b/apps/logistics/src/components/investigation/shipment/parcel/parcelList.tsx index d0a3a65a57a1ff6c1b6e98bbb23df0a6d53343ac..de324d23ccf6c7d0420a2df5a4d6ad02c2f89ea5 100644 --- a/apps/logistics/src/components/investigation/shipment/parcel/parcelList.tsx +++ b/apps/logistics/src/components/investigation/shipment/parcel/parcelList.tsx @@ -5,7 +5,7 @@ import { getCoreRowModel, getFilteredRowModel, getPaginationRowModel, - useReactTable + useReactTable, } from "@tanstack/react-table"; import dayjs from "dayjs"; import type { Parcel } from "dm-lib"; @@ -15,14 +15,14 @@ import { useNavigate } from "react-router-dom"; export function ParcelList({ shipmentId, - investigationId + investigationId, }: { shipmentId: string; investigationId: string; }) { const parcels = useParcelList({ shipmentId, - investigationId + investigationId, }); const columns: ColumnDef<Parcel>[] = [ @@ -32,42 +32,42 @@ export function ParcelList({ id: "open", header: "", footer: "", - enableColumnFilter: false + enableColumnFilter: false, }, { accessorKey: "name", header: "Name", footer: "Name" }, { accessorFn: (d) => dayjs(d.createdAt).format("DD/MM/YYYY HH:mm"), header: "Creation date", - footer: "Creation date" + footer: "Creation date", }, { accessorFn: (d) => (d.containsDangerousGoods ? "Yes" : "No"), cell: (info) => ( <span style={{ - color: info.getValue() === "Yes" ? "red" : "green" + color: info.getValue() === "Yes" ? "red" : "green", }} > {info.getValue() as string} </span> ), header: "Dangerous goods", - footer: "Dangerous goods" + footer: "Dangerous goods", }, { accessorFn: (d) => (d.returnAddress ? "Ship back" : "Destroy"), cell: (info) => ( <span style={{ - color: info.getValue() === "Ship back" ? "green" : "red" + color: info.getValue() === "Ship back" ? "green" : "red", }} > {info.getValue() as string} </span> ), header: "After experiment", - footer: "After experiment" - } + footer: "After experiment", + }, ]; const table = useReactTable<Parcel>({ @@ -75,7 +75,7 @@ export function ParcelList({ columns, getCoreRowModel: getCoreRowModel(), getFilteredRowModel: getFilteredRowModel(), - getPaginationRowModel: getPaginationRowModel() + getPaginationRowModel: getPaginationRowModel(), }); return <TanstackBootstrapTable table={table} />; diff --git a/apps/logistics/src/components/parcels/parcelsHome.tsx b/apps/logistics/src/components/parcels/parcelsHome.tsx index 5a1b75faf38bc592f0883d036c61ca9386aa5b97..85661f1bca2589a7b8f05e71aa209055b36caf92 100644 --- a/apps/logistics/src/components/parcels/parcelsHome.tsx +++ b/apps/logistics/src/components/parcels/parcelsHome.tsx @@ -1,6 +1,10 @@ import { faEye } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import type { ColumnDef } from "@tanstack/react-table"; +import type { + ColumnDef, + OnChangeFn, + PaginationState, +} from "@tanstack/react-table"; import { getCoreRowModel, getFilteredRowModel, @@ -8,11 +12,16 @@ import { useReactTable, } from "@tanstack/react-table"; import dayjs from "dayjs"; +import React, { Suspense } from "react"; import type { Parcel, Investigation, Instrument } from "dm-lib"; import { TanstackBootstrapTable, useParcelList, usePagination } from "dm-lib"; import { Button } from "react-bootstrap"; import { useNavigate } from "react-router-dom"; +/** + * Display the list of parcels of a user + * @returns + */ export function ParcelsHome() { const pagination = usePagination(); const parcels = useParcelList({ ...pagination.queryParams }); @@ -27,6 +36,8 @@ export function ParcelsHome() { enableColumnFilter: false, }, { accessorKey: "name", header: "Name", footer: "Name" }, + { accessorKey: "status", header: "Status", footer: "Status" }, + { accessorKey: "investigation", header: "A-Form", @@ -78,12 +89,36 @@ export function ParcelsHome() { }, ]; + const tablePagination = React.useMemo( + () => ({ + pageIndex: pagination.page, + pageSize: pagination.size, + }), + [pagination.page, pagination.size] + ); + + const onPaginationChange: OnChangeFn<PaginationState> = (updater) => { + if (typeof updater === "function") { + const state = updater(tablePagination); + pagination.handlePageChange(state.pageIndex); + pagination.handlePageSizeChange(state.pageSize); + } else { + const state = updater; + pagination.handlePageChange(state.pageIndex); + pagination.handlePageSizeChange(state.pageSize); + } + }; + const table = useReactTable<Parcel>({ data: parcels, columns, getCoreRowModel: getCoreRowModel(), getFilteredRowModel: getFilteredRowModel(), getPaginationRowModel: getPaginationRowModel(), + manualPagination: true, + state: { pagination: tablePagination }, + onPaginationChange, + pageCount: parcels[0]?.meta?.page?.totalPages || -1, }); return <TanstackBootstrapTable table={table} />; @@ -100,11 +135,15 @@ export function ParcelOpenBtn({ parcelId }: { parcelId: string }) { export function AFormLink({ investigation }: { investigation: Investigation }) { if (investigation) { - return (investigation.parameters.Id as string) + const label = (investigation.parameters.Id as string) ? investigation.parameters.Id : investigation.name; + return ( + <a href="https://smis.esrf.fr/misapps/SMISWebClient/protected/aform/manageAForm.do?action=view&expSessionVO.pk="> + {label} + </a> + ); } - return ""; } export function InstrumentLabel({ instrument }: { instrument: Instrument }) { diff --git a/packages/dm-lib/src/config/default.ts b/packages/dm-lib/src/config/default.ts index 1f8a2e52fe16eb4a6aeb6e9c349e56c76644b1ca..90bbe6ec2275cd06e51e2b241bb671b70aa4e831 100644 --- a/packages/dm-lib/src/config/default.ts +++ b/packages/dm-lib/src/config/default.ts @@ -36,5 +36,8 @@ export const DEFAULT: Config = { }, ], }, + userPortal: { + sessionLink: env.VITE_USERPORTAL_SESSION_LINK, + }, ui: UIDEFAULT, }; diff --git a/packages/dm-lib/src/config/definition/configtype.ts b/packages/dm-lib/src/config/definition/configtype.ts index a803a9c7ecd00ff3600816ca9a3df7faffc1060d..ddcddb6baef7df96d7e0e75a153224f4e93f43ed 100644 --- a/packages/dm-lib/src/config/definition/configtype.ts +++ b/packages/dm-lib/src/config/definition/configtype.ts @@ -12,10 +12,15 @@ export interface LoginForm { export interface UIConfig { loginForm: LoginForm; } + +export interface UserPortal { + sessionLink: string | undefined; +} export interface Config { icat_url: string | undefined; authentication: Authentication; ui: UIConfig; + userPortal: UserPortal; } export interface GenericAuthenticator {