From cc587838a3128eced180121dabbbd7bae5e466c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez?= Date: Wed, 6 Mar 2024 18:41:07 +0100 Subject: [PATCH] edur - data table --- client/package.json | 4 +- client/src/components/ui/badge.tsx | 33 ++ client/src/components/ui/button.tsx | 49 ++ client/src/components/ui/radio-group.tsx | 4 +- client/src/components/ui/select.tsx | 151 +++++++ client/src/components/ui/table.tsx | 91 ++++ .../analysis-eudr/category-list/index.tsx | 2 +- .../supplier-list-table/index.tsx | 17 + .../table/column-header.tsx | 50 +++ .../supplier-list-table/table/columns.tsx | 108 +++++ .../supplier-list-table/table/index.tsx | 136 ++++++ .../supplier-list-table/table/mock-data.ts | 108 +++++ .../supplier-list-table/table/pagination.tsx | 94 ++++ .../suppliers-stacked-bar/component.tsx | 2 +- client/src/hooks/eudr/index.ts | 26 ++ client/src/pages/eudr/index.tsx | 4 +- client/yarn.lock | 417 +++++++++++++++++- 17 files changed, 1279 insertions(+), 17 deletions(-) create mode 100644 client/src/components/ui/badge.tsx create mode 100644 client/src/components/ui/button.tsx create mode 100644 client/src/components/ui/select.tsx create mode 100644 client/src/components/ui/table.tsx create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/index.tsx create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/table/column-header.tsx create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/table/columns.tsx create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/table/index.tsx create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/table/mock-data.ts create mode 100644 client/src/containers/analysis-eudr/supplier-list-table/table/pagination.tsx create mode 100644 client/src/hooks/eudr/index.ts diff --git a/client/package.json b/client/package.json index 61aca4c58..7fc759e1c 100644 --- a/client/package.json +++ b/client/package.json @@ -37,11 +37,13 @@ "@radix-ui/react-collapsible": "1.0.3", "@radix-ui/react-label": "2.0.2", "@radix-ui/react-radio-group": "1.1.3", + "@radix-ui/react-select": "2.0.0", + "@radix-ui/react-slot": "1.0.2", "@reduxjs/toolkit": "1.8.2", "@tailwindcss/forms": "0.4.0", "@tailwindcss/typography": "0.5.0", "@tanstack/react-query": "^4.2.1", - "@tanstack/react-table": "8.5.1", + "@tanstack/react-table": "8.13.2", "@tanstack/react-virtual": "3.0.1", "autoprefixer": "10.2.5", "axios": "1.3.4", diff --git a/client/src/components/ui/badge.tsx b/client/src/components/ui/badge.tsx new file mode 100644 index 000000000..e8e25c504 --- /dev/null +++ b/client/src/components/ui/badge.tsx @@ -0,0 +1,33 @@ +import * as React from 'react'; +import { cva, type VariantProps } from 'class-variance-authority'; + +import { cn } from '@/lib/utils'; + +const badgeVariants = cva( + 'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', + { + variants: { + variant: { + default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80', + secondary: + 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80', + destructive: + 'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80', + outline: 'text-foreground', + }, + }, + defaultVariants: { + variant: 'default', + }, + }, +); + +export interface BadgeProps + extends React.HTMLAttributes, + VariantProps {} + +function Badge({ className, variant, ...props }: BadgeProps) { + return
; +} + +export { Badge, badgeVariants }; diff --git a/client/src/components/ui/button.tsx b/client/src/components/ui/button.tsx new file mode 100644 index 000000000..0ecf8afbe --- /dev/null +++ b/client/src/components/ui/button.tsx @@ -0,0 +1,49 @@ +import * as React from 'react'; +import { Slot } from '@radix-ui/react-slot'; +import { cva, type VariantProps } from 'class-variance-authority'; + +import { cn } from '@/lib/utils'; + +const buttonVariants = cva( + 'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50', + { + variants: { + variant: { + default: 'bg-primary text-primary-foreground hover:bg-primary/90', + destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90', + outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground', + secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80', + ghost: 'hover:bg-accent hover:text-accent-foreground', + link: 'text-primary underline-offset-4 hover:underline', + }, + size: { + default: 'h-10 px-4 py-2', + sm: 'h-9 rounded-md px-3', + lg: 'h-11 rounded-md px-8', + icon: 'h-10 w-10', + }, + }, + defaultVariants: { + variant: 'default', + size: 'default', + }, + }, +); + +export interface ButtonProps + extends React.ButtonHTMLAttributes, + VariantProps { + asChild?: boolean; +} + +const Button = React.forwardRef( + ({ className, variant, size, asChild = false, ...props }, ref) => { + const Comp = asChild ? Slot : 'button'; + return ( + + ); + }, +); +Button.displayName = 'Button'; + +export { Button, buttonVariants }; diff --git a/client/src/components/ui/radio-group.tsx b/client/src/components/ui/radio-group.tsx index 1cf4b798e..d41776297 100644 --- a/client/src/components/ui/radio-group.tsx +++ b/client/src/components/ui/radio-group.tsx @@ -20,13 +20,13 @@ const RadioGroupItem = React.forwardRef< - + ); diff --git a/client/src/components/ui/select.tsx b/client/src/components/ui/select.tsx new file mode 100644 index 000000000..989cba607 --- /dev/null +++ b/client/src/components/ui/select.tsx @@ -0,0 +1,151 @@ +import * as React from 'react'; +import * as SelectPrimitive from '@radix-ui/react-select'; +import { Check, ChevronDown, ChevronUp } from 'lucide-react'; + +import { cn } from '@/lib/utils'; + +const Select = SelectPrimitive.Root; + +const SelectGroup = SelectPrimitive.Group; + +const SelectValue = SelectPrimitive.Value; + +const SelectTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + span]:line-clamp-1', + className, + )} + {...props} + > + {children} + + + + +)); +SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; + +const SelectScrollUpButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; + +const SelectScrollDownButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)); +SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName; + +const SelectContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, position = 'popper', ...props }, ref) => ( + + + + + {children} + + + + +)); +SelectContent.displayName = SelectPrimitive.Content.displayName; + +const SelectLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectLabel.displayName = SelectPrimitive.Label.displayName; + +const SelectItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + + + + + + {children} + +)); +SelectItem.displayName = SelectPrimitive.Item.displayName; + +const SelectSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SelectSeparator.displayName = SelectPrimitive.Separator.displayName; + +export { + Select, + SelectGroup, + SelectValue, + SelectTrigger, + SelectContent, + SelectLabel, + SelectItem, + SelectSeparator, + SelectScrollUpButton, + SelectScrollDownButton, +}; diff --git a/client/src/components/ui/table.tsx b/client/src/components/ui/table.tsx new file mode 100644 index 000000000..e538a0fb1 --- /dev/null +++ b/client/src/components/ui/table.tsx @@ -0,0 +1,91 @@ +import * as React from 'react'; + +import { cn } from '@/lib/utils'; + +const Table = React.forwardRef>( + ({ className, ...props }, ref) => ( +
+ + + ), +); +Table.displayName = 'Table'; + +const TableHeader = React.forwardRef< + HTMLTableSectionElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( + +)); +TableHeader.displayName = 'TableHeader'; + +const TableBody = React.forwardRef< + HTMLTableSectionElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( + +)); +TableBody.displayName = 'TableBody'; + +const TableFooter = React.forwardRef< + HTMLTableSectionElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( + tr]:last:border-b-0', className)} + {...props} + /> +)); +TableFooter.displayName = 'TableFooter'; + +const TableRow = React.forwardRef>( + ({ className, ...props }, ref) => ( + + ), +); +TableRow.displayName = 'TableRow'; + +const TableHead = React.forwardRef< + HTMLTableCellElement, + React.ThHTMLAttributes +>(({ className, ...props }, ref) => ( +
+)); +TableHead.displayName = 'TableHead'; + +const TableCell = React.forwardRef< + HTMLTableCellElement, + React.TdHTMLAttributes +>(({ className, ...props }, ref) => ( + +)); +TableCell.displayName = 'TableCell'; + +const TableCaption = React.forwardRef< + HTMLTableCaptionElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)); +TableCaption.displayName = 'TableCaption'; + +export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption }; diff --git a/client/src/containers/analysis-eudr/category-list/index.tsx b/client/src/containers/analysis-eudr/category-list/index.tsx index 64938748f..a245616f0 100644 --- a/client/src/containers/analysis-eudr/category-list/index.tsx +++ b/client/src/containers/analysis-eudr/category-list/index.tsx @@ -102,7 +102,7 @@ export const CategoryList = (): JSX.Element => { size="xs" variant="white" className={cn( - 'w-[98px] rounded-md border-none text-sm shadow-none transition-colors hover:shadow-none', + 'w-[98px] rounded-md border-none text-sm text-gray-500 shadow-none transition-colors hover:shadow-none', { 'bg-navy-400 text-white hover:bg-navy-600': categories[category.slug], }, diff --git a/client/src/containers/analysis-eudr/supplier-list-table/index.tsx b/client/src/containers/analysis-eudr/supplier-list-table/index.tsx new file mode 100644 index 000000000..b96015508 --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/index.tsx @@ -0,0 +1,17 @@ +import SuppliersListTable from './table'; + +const SupplierListTable = (): JSX.Element => { + return ( +
+
+ All commodities +

Suppliers List

+
+
+ +
+
+ ); +}; + +export default SupplierListTable; diff --git a/client/src/containers/analysis-eudr/supplier-list-table/table/column-header.tsx b/client/src/containers/analysis-eudr/supplier-list-table/table/column-header.tsx new file mode 100644 index 000000000..9b631fc4e --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/table/column-header.tsx @@ -0,0 +1,50 @@ +import { useCallback } from 'react'; +import { ChevronDown, ChevronUp, ChevronsUpDown } from 'lucide-react'; + +import { Button } from '@/components/ui/button'; +import { cn } from '@/lib/utils'; + +import type { Column } from '@tanstack/react-table'; + +interface DataTableColumnHeaderProps extends React.HTMLAttributes { + column: Column; + title: string; +} + +const ICON_CLASSES = 'h-[12px] w-[12px] text-gray-400'; + +export function DataTableColumnHeader({ + column, + title, + className, +}: DataTableColumnHeaderProps) { + const handleSorting = useCallback(() => { + column.toggleSorting(); + }, [column]); + + const sortingValue = column.getCanSort() ? column.getIsSorted() : null; + + if (!column.getCanSort()) { + return ( +
+ {title} +
+ ); + } + + return ( +
+ +
+ ); +} diff --git a/client/src/containers/analysis-eudr/supplier-list-table/table/columns.tsx b/client/src/containers/analysis-eudr/supplier-list-table/table/columns.tsx new file mode 100644 index 000000000..b338499dc --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/table/columns.tsx @@ -0,0 +1,108 @@ +'use client'; + +import Link from 'next/link'; + +import { DataTableColumnHeader } from './column-header'; + +import { Badge } from '@/components/ui/badge'; + +import type { Supplier } from '.'; +import type { ColumnDef } from '@tanstack/react-table'; + +export const columns: ColumnDef[] = [ + { + accessorKey: 'supplierName', + header: ({ column }) => , + cell: ({ row }) => { + return ( +
+ + {row.getValue('supplierName')} + +
+ ); + }, + enableSorting: true, + }, + { + accessorKey: 'companyId', + header: ({ column }) => , + enableSorting: false, + enableHiding: false, + }, + { + accessorKey: 'baseLineVolume', + header: ({ column }) => , + cell: ({ row }) => { + // todo: format number + return {row.getValue('baseLineVolume')}; + }, + }, + { + accessorKey: 'dfs', + header: ({ column }) => , + cell: ({ row }) => { + const dfs = row.getValue('dfs'); + return {`${Number.isNaN(dfs) ? '-' : `${dfs}%`}`}; + }, + }, + { + accessorKey: 'sda', + header: ({ column }) => , + cell: ({ row }) => { + const sda = row.getValue('sda'); + return {`${Number.isNaN(sda) ? '-' : `${sda}%`}`}; + }, + }, + { + accessorKey: 'ttp', + header: ({ column }) => , + cell: ({ row }) => { + const ttp = row.getValue('ttp'); + return {`${Number.isNaN(ttp) ? '-' : `${ttp}%`}`}; + }, + }, + { + accessorKey: 'materials', + header: ({ column }) => , + cell: ({ row }) => { + return ( +
+ {row.original.materials.map(({ name, id }) => ( + + {name} + + ))} +
+ ); + }, + enableSorting: false, + }, + { + accessorKey: 'origins', + header: ({ column }) => , + cell: ({ row }) => { + return ( +
+ {row.original.origins.map(({ name, id }) => ( + + {name} + + ))} +
+ ); + }, + enableSorting: false, + }, +]; + +export default columns; diff --git a/client/src/containers/analysis-eudr/supplier-list-table/table/index.tsx b/client/src/containers/analysis-eudr/supplier-list-table/table/index.tsx new file mode 100644 index 000000000..55793500f --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/table/index.tsx @@ -0,0 +1,136 @@ +import { + flexRender, + getCoreRowModel, + // getFacetedRowModel, + // getFacetedUniqueValues, + // getFilteredRowModel, + getPaginationRowModel, + getSortedRowModel, + useReactTable, +} from '@tanstack/react-table'; +import { useState } from 'react'; + +import columns from './columns'; +import { MOCK_DATA } from './mock-data'; +import { DataTablePagination, PAGINATION_SIZES } from './pagination'; + +import { + Table, + TableHeader, + TableHead, + TableRow, + TableBody, + TableCell, +} from '@/components/ui/table'; +import { useEUDRSuppliers } from '@/hooks/eudr'; + +import type { + // ColumnFiltersState, + SortingState, + // VisibilityState +} from '@tanstack/react-table'; + +export interface Supplier { + id: number; + supplierName: string; + companyId: string; + baseLineVolume: number; + dfs: number; + sda: number; + ttp: number; + materials: { + name: string; + id: string; + }[]; + origins: { + name: string; + id: string; + }[]; +} + +const SuppliersListTable = (): JSX.Element => { + // const [rowSelection, setRowSelection] = useState({}); + // const [columnVisibility, setColumnVisibility] = useState({}); + // const [columnFilters, setColumnFilters] = useState([]); + const [sorting, setSorting] = useState([]); + + const { data } = useEUDRSuppliers(undefined, { + enabled: false, + placeholderData: MOCK_DATA, + }); + + const table = useReactTable({ + data: data, + columns, + initialState: { + pagination: { + pageSize: PAGINATION_SIZES[0], + }, + }, + state: { + sorting, + // columnVisibility, + // rowSelection, + // columnFilters, + }, + enableRowSelection: true, + // onRowSelectionChange: setRowSelection, + onSortingChange: setSorting, + // onColumnFiltersChange: setColumnFilters, + // onColumnVisibilityChange: setColumnVisibility, + getCoreRowModel: getCoreRowModel(), + // getFilteredRowModel: getFilteredRowModel(), + getPaginationRowModel: getPaginationRowModel(), + getSortedRowModel: getSortedRowModel(), + // getFacetedRowModel: getFacetedRowModel(), + // getFacetedUniqueValues: getFacetedUniqueValues(), + }); + + return ( +
+ + + {table.getHeaderGroups().map((headerGroup) => ( + + {headerGroup.headers.map((header) => { + return ( + + {header.isPlaceholder + ? null + : flexRender(header.column.columnDef.header, header.getContext())} + + ); + })} + + ))} + + + {table.getRowModel().rows?.length ? ( + table.getRowModel().rows.map((row) => ( + + {row.getVisibleCells().map((cell) => ( + + {flexRender(cell.column.columnDef.cell, cell.getContext())} + + ))} + + )) + ) : ( + + + No results. + + + )} + +
+ +
+ ); +}; + +export default SuppliersListTable; diff --git a/client/src/containers/analysis-eudr/supplier-list-table/table/mock-data.ts b/client/src/containers/analysis-eudr/supplier-list-table/table/mock-data.ts new file mode 100644 index 000000000..6d2868458 --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/table/mock-data.ts @@ -0,0 +1,108 @@ +import type { Supplier } from '.'; + +export const MOCK_DATA: Supplier[] = [ + { + id: 2, + supplierName: 'Very long name of supplier Very long name of supplier', + companyId: '123', + baseLineVolume: 1000, + dfs: 100, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 1', id: '1' }, + { name: 'Material 2', id: '2' }, + ], + origins: [ + { name: 'Origin 1', id: '1' }, + { name: 'Origin 2', id: '2' }, + ], + }, + { + id: 4, + supplierName: 'Supplier 2', + companyId: '124', + baseLineVolume: 2000, + dfs: 200, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 3', id: '3' }, + { name: 'Material 4', id: '4' }, + { name: 'Material 4', id: '5' }, + { name: 'Material 4', id: '6' }, + ], + origins: [ + { name: 'Origin 3', id: '3' }, + { name: 'Origin 4', id: '4' }, + ], + }, + { + id: 8, + supplierName: 'Supplier 3', + companyId: '125', + baseLineVolume: 3000, + dfs: 300, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 5', id: '5' }, + { name: 'Material 6', id: '6' }, + ], + origins: [ + { name: 'Origin 5', id: '5' }, + { name: 'Origin 6', id: '6' }, + ], + }, + { + id: 67, + supplierName: 'Supplier 3', + companyId: '125', + baseLineVolume: 3000, + dfs: 300, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 5', id: '5' }, + { name: 'Material 6', id: '6' }, + ], + origins: [ + { name: 'Origin 5', id: '5' }, + { name: 'Origin 6', id: '6' }, + ], + }, + { + id: 33, + supplierName: 'Supplier 3', + companyId: '125', + baseLineVolume: 3000, + dfs: 300, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 5', id: '5' }, + { name: 'Material 6', id: '6' }, + ], + origins: [ + { name: 'Origin 5', id: '5' }, + { name: 'Origin 6', id: '6' }, + ], + }, + { + id: 9, + supplierName: 'Supplier 3', + companyId: '125', + baseLineVolume: 3000, + dfs: 300, + sda: 39.7, + ttp: 40.1, + materials: [ + { name: 'Material 5', id: '5' }, + { name: 'Material 6', id: '6' }, + ], + origins: [ + { name: 'Origin 5', id: '5' }, + { name: 'Origin 6', id: '6' }, + ], + }, +]; diff --git a/client/src/containers/analysis-eudr/supplier-list-table/table/pagination.tsx b/client/src/containers/analysis-eudr/supplier-list-table/table/pagination.tsx new file mode 100644 index 000000000..48b335b05 --- /dev/null +++ b/client/src/containers/analysis-eudr/supplier-list-table/table/pagination.tsx @@ -0,0 +1,94 @@ +import { ChevronLeftIcon, ChevronRightIcon, ChevronsLeft, ChevronsRight } from 'lucide-react'; + +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from '@/components/ui/select'; +import { Button } from '@/components/ui/button'; + +import type { Table } from '@tanstack/react-table'; + +export const PAGINATION_SIZES = [10, 20, 30, 40, 50]; + +interface DataTablePaginationProps { + table: Table; +} + +export function DataTablePagination({ table }: DataTablePaginationProps) { + return ( +
+
+
+

Rows per page

+ +
+
+ Page {table.getState().pagination.pageIndex * table.getState().pagination.pageSize + 1}- + {(table.getState().pagination.pageIndex + 1) * table.getState().pagination.pageSize > + table.getRowCount() + ? table.getRowCount() + : (table.getState().pagination.pageIndex + 1) * + table.getState().pagination.pageSize}{' '} + of {table.getRowCount()} +
+
+ + + + +
+
+
+ ); +} diff --git a/client/src/containers/analysis-eudr/suppliers-stacked-bar/component.tsx b/client/src/containers/analysis-eudr/suppliers-stacked-bar/component.tsx index 499c8dd51..a647e2367 100644 --- a/client/src/containers/analysis-eudr/suppliers-stacked-bar/component.tsx +++ b/client/src/containers/analysis-eudr/suppliers-stacked-bar/component.tsx @@ -92,7 +92,7 @@ const SuppliersStackedBar = () => {

Suppliers by category

-
View by:
+
View by:
( + params?: { producersIds: string[]; originsId: string[]; materialsId: string[] }, + options: UseQueryOptions = {}, +) => { + return useQuery( + ['eudr-suppliers', params], + () => + apiService + .request<{ data: Supplier[] }>({ + method: 'GET', + url: '/eudr/suppliers', + params, + }) + .then(({ data: responseData }) => responseData.data), + { + ...options, + }, + ); +}; diff --git a/client/src/pages/eudr/index.tsx b/client/src/pages/eudr/index.tsx index 1e29ec82d..3c7c4dd1f 100644 --- a/client/src/pages/eudr/index.tsx +++ b/client/src/pages/eudr/index.tsx @@ -10,6 +10,7 @@ import Map from 'components/map'; import LayerManager from 'components/map/layer-manager'; import SuppliersStackedBar from '@/containers/analysis-eudr/suppliers-stacked-bar'; import EUDRFilters from '@/containers/analysis-eudr/filters/component'; +import SupplierListTable from '@/containers/analysis-eudr/supplier-list-table'; import type { NextPageWithLayout } from 'pages/_app'; import type { ReactElement } from 'react'; @@ -44,8 +45,9 @@ const MapPage: NextPageWithLayout = () => {

EUDR complience Analysis

-
+
+
diff --git a/client/yarn.lock b/client/yarn.lock index 9bc7835d7..2a07a1280 100644 --- a/client/yarn.lock +++ b/client/yarn.lock @@ -551,6 +551,15 @@ __metadata: languageName: node linkType: hard +"@floating-ui/core@npm:^1.0.0": + version: 1.6.0 + resolution: "@floating-ui/core@npm:1.6.0" + dependencies: + "@floating-ui/utils": ^0.2.1 + checksum: 2e25c53b0c124c5c9577972f8ae21d081f2f7895e6695836a53074463e8c65b47722744d6d2b5a993164936da006a268bcfe87fe68fd24dc235b1cb86bed3127 + languageName: node + linkType: hard + "@floating-ui/dom@npm:^1.5.1": version: 1.5.3 resolution: "@floating-ui/dom@npm:1.5.3" @@ -561,6 +570,16 @@ __metadata: languageName: node linkType: hard +"@floating-ui/dom@npm:^1.6.1": + version: 1.6.3 + resolution: "@floating-ui/dom@npm:1.6.3" + dependencies: + "@floating-ui/core": ^1.0.0 + "@floating-ui/utils": ^0.2.0 + checksum: 81cbb18ece3afc37992f436e469e7fabab2e433248e46fff4302d12493a175b0c64310f8a971e6e1eda7218df28ace6b70237b0f3c22fe12a21bba05b5579555 + languageName: node + linkType: hard + "@floating-ui/react-dom@npm:2.0.2, @floating-ui/react-dom@npm:^2.0.2": version: 2.0.2 resolution: "@floating-ui/react-dom@npm:2.0.2" @@ -573,6 +592,18 @@ __metadata: languageName: node linkType: hard +"@floating-ui/react-dom@npm:^2.0.0": + version: 2.0.8 + resolution: "@floating-ui/react-dom@npm:2.0.8" + dependencies: + "@floating-ui/dom": ^1.6.1 + peerDependencies: + react: ">=16.8.0" + react-dom: ">=16.8.0" + checksum: 5da7f13a69281e38859a3203a608fe9de1d850b332b355c10c0c2427c7b7209a0374c10f6295b6577c1a70237af8b678340bd4cc0a4b1c66436a94755d81e526 + languageName: node + linkType: hard + "@floating-ui/react@npm:0.26.1": version: 0.26.1 resolution: "@floating-ui/react@npm:0.26.1" @@ -594,6 +625,13 @@ __metadata: languageName: node linkType: hard +"@floating-ui/utils@npm:^0.2.0, @floating-ui/utils@npm:^0.2.1": + version: 0.2.1 + resolution: "@floating-ui/utils@npm:0.2.1" + checksum: 9ed4380653c7c217cd6f66ae51f20fdce433730dbc77f95b5abfb5a808f5fdb029c6ae249b4e0490a816f2453aa6e586d9a873cd157fdba4690f65628efc6e06 + languageName: node + linkType: hard + "@gar/promisify@npm:^1.1.3": version: 1.1.3 resolution: "@gar/promisify@npm:1.1.3" @@ -1602,6 +1640,15 @@ __metadata: languageName: node linkType: hard +"@radix-ui/number@npm:1.0.1": + version: 1.0.1 + resolution: "@radix-ui/number@npm:1.0.1" + dependencies: + "@babel/runtime": ^7.13.10 + checksum: 621ea8b7d4195d1a65a9c0aee918e8335e7f198088eec91577512c89c2ba3a3bab4a767cfb872a2b9c3092a78ff41cad9a924845a939f6bb87fe9356241ea0ea + languageName: node + linkType: hard + "@radix-ui/primitive@npm:1.0.1": version: 1.0.1 resolution: "@radix-ui/primitive@npm:1.0.1" @@ -1611,6 +1658,26 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-arrow@npm:1.0.3": + version: 1.0.3 + resolution: "@radix-ui/react-arrow@npm:1.0.3" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/react-primitive": 1.0.3 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: 8cca086f0dbb33360e3c0142adf72f99fc96352d7086d6c2356dbb2ea5944cfb720a87d526fc48087741c602cd8162ca02b0af5e6fdf5f56d20fddb44db8b4c3 + languageName: node + linkType: hard + "@radix-ui/react-collapsible@npm:1.0.3": version: 1.0.3 resolution: "@radix-ui/react-collapsible@npm:1.0.3" @@ -1706,6 +1773,67 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-dismissable-layer@npm:1.0.5": + version: 1.0.5 + resolution: "@radix-ui/react-dismissable-layer@npm:1.0.5" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/primitive": 1.0.1 + "@radix-ui/react-compose-refs": 1.0.1 + "@radix-ui/react-primitive": 1.0.3 + "@radix-ui/react-use-callback-ref": 1.0.1 + "@radix-ui/react-use-escape-keydown": 1.0.3 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: e73cf4bd3763f4d55b1bea7486a9700384d7d94dc00b1d5a75e222b2f1e4f32bc667a206ca4ed3baaaf7424dce7a239afd0ba59a6f0d89c3462c4e6e8d029a04 + languageName: node + linkType: hard + +"@radix-ui/react-focus-guards@npm:1.0.1": + version: 1.0.1 + resolution: "@radix-ui/react-focus-guards@npm:1.0.1" + dependencies: + "@babel/runtime": ^7.13.10 + peerDependencies: + "@types/react": "*" + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 1f8ca8f83b884b3612788d0742f3f054e327856d90a39841a47897dbed95e114ee512362ae314177de226d05310047cabbf66b686ae86ad1b65b6b295be24ef7 + languageName: node + linkType: hard + +"@radix-ui/react-focus-scope@npm:1.0.4": + version: 1.0.4 + resolution: "@radix-ui/react-focus-scope@npm:1.0.4" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/react-compose-refs": 1.0.1 + "@radix-ui/react-primitive": 1.0.3 + "@radix-ui/react-use-callback-ref": 1.0.1 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: 3481db1a641513a572734f0bcb0e47fefeba7bccd6ec8dde19f520719c783ef0b05a55ef0d5292078ed051cc5eda46b698d5d768da02e26e836022f46b376fd1 + languageName: node + linkType: hard + "@radix-ui/react-id@npm:1.0.1": version: 1.0.1 resolution: "@radix-ui/react-id@npm:1.0.1" @@ -1742,6 +1870,55 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-popper@npm:1.1.3": + version: 1.1.3 + resolution: "@radix-ui/react-popper@npm:1.1.3" + dependencies: + "@babel/runtime": ^7.13.10 + "@floating-ui/react-dom": ^2.0.0 + "@radix-ui/react-arrow": 1.0.3 + "@radix-ui/react-compose-refs": 1.0.1 + "@radix-ui/react-context": 1.0.1 + "@radix-ui/react-primitive": 1.0.3 + "@radix-ui/react-use-callback-ref": 1.0.1 + "@radix-ui/react-use-layout-effect": 1.0.1 + "@radix-ui/react-use-rect": 1.0.1 + "@radix-ui/react-use-size": 1.0.1 + "@radix-ui/rect": 1.0.1 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: b18a15958623f9222b6ed3e24b9fbcc2ba67b8df5a5272412f261de1592b3f05002af1c8b94c065830c3c74267ce00cf6c1d70d4d507ec92ba639501f98aa348 + languageName: node + linkType: hard + +"@radix-ui/react-portal@npm:1.0.4": + version: 1.0.4 + resolution: "@radix-ui/react-portal@npm:1.0.4" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/react-primitive": 1.0.3 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: c4cf35e2f26a89703189d0eef3ceeeb706ae0832e98e558730a5e929ca7c72c7cb510413a24eca94c7732f8d659a1e81942bec7b90540cb73ce9e4885d040b64 + languageName: node + linkType: hard + "@radix-ui/react-presence@npm:1.0.1": version: 1.0.1 resolution: "@radix-ui/react-presence@npm:1.0.1" @@ -1840,6 +2017,46 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-select@npm:2.0.0": + version: 2.0.0 + resolution: "@radix-ui/react-select@npm:2.0.0" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/number": 1.0.1 + "@radix-ui/primitive": 1.0.1 + "@radix-ui/react-collection": 1.0.3 + "@radix-ui/react-compose-refs": 1.0.1 + "@radix-ui/react-context": 1.0.1 + "@radix-ui/react-direction": 1.0.1 + "@radix-ui/react-dismissable-layer": 1.0.5 + "@radix-ui/react-focus-guards": 1.0.1 + "@radix-ui/react-focus-scope": 1.0.4 + "@radix-ui/react-id": 1.0.1 + "@radix-ui/react-popper": 1.1.3 + "@radix-ui/react-portal": 1.0.4 + "@radix-ui/react-primitive": 1.0.3 + "@radix-ui/react-slot": 1.0.2 + "@radix-ui/react-use-callback-ref": 1.0.1 + "@radix-ui/react-use-controllable-state": 1.0.1 + "@radix-ui/react-use-layout-effect": 1.0.1 + "@radix-ui/react-use-previous": 1.0.1 + "@radix-ui/react-visually-hidden": 1.0.3 + aria-hidden: ^1.1.1 + react-remove-scroll: 2.5.5 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: 9ebf4a3e70fd5f583cf468e432ff04768b3442c44788eaf415e044f19c900b886e92eb46e19e138c4994d8a361f5e31f93d13b5bcf413469f21899bbe1112d1d + languageName: node + linkType: hard + "@radix-ui/react-slot@npm:1.0.2": version: 1.0.2 resolution: "@radix-ui/react-slot@npm:1.0.2" @@ -1887,6 +2104,22 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-use-escape-keydown@npm:1.0.3": + version: 1.0.3 + resolution: "@radix-ui/react-use-escape-keydown@npm:1.0.3" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/react-use-callback-ref": 1.0.1 + peerDependencies: + "@types/react": "*" + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: c6ed0d9ce780f67f924980eb305af1f6cce2a8acbaf043a58abe0aa3cc551d9aa76ccee14531df89bbee302ead7ecc7fce330886f82d4672c5eda52f357ef9b8 + languageName: node + linkType: hard + "@radix-ui/react-use-layout-effect@npm:1.0.1": version: 1.0.1 resolution: "@radix-ui/react-use-layout-effect@npm:1.0.1" @@ -1917,6 +2150,22 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-use-rect@npm:1.0.1": + version: 1.0.1 + resolution: "@radix-ui/react-use-rect@npm:1.0.1" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/rect": 1.0.1 + peerDependencies: + "@types/react": "*" + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 433f07e61e04eb222349825bb05f3591fca131313a1d03709565d6226d8660bd1d0423635553f95ee4fcc25c8f2050972d848808d753c388e2a9ae191ebf17f3 + languageName: node + linkType: hard + "@radix-ui/react-use-size@npm:1.0.1": version: 1.0.1 resolution: "@radix-ui/react-use-size@npm:1.0.1" @@ -1933,6 +2182,35 @@ __metadata: languageName: node linkType: hard +"@radix-ui/react-visually-hidden@npm:1.0.3": + version: 1.0.3 + resolution: "@radix-ui/react-visually-hidden@npm:1.0.3" + dependencies: + "@babel/runtime": ^7.13.10 + "@radix-ui/react-primitive": 1.0.3 + peerDependencies: + "@types/react": "*" + "@types/react-dom": "*" + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + "@types/react": + optional: true + "@types/react-dom": + optional: true + checksum: 2e9d0c8253f97e7d6ffb2e52a5cfd40ba719f813b39c3e2e42c496d54408abd09ef66b5aec4af9b8ab0553215e32452a5d0934597a49c51dd90dc39181ed0d57 + languageName: node + linkType: hard + +"@radix-ui/rect@npm:1.0.1": + version: 1.0.1 + resolution: "@radix-ui/rect@npm:1.0.1" + dependencies: + "@babel/runtime": ^7.13.10 + checksum: aeec13b234a946052512d05239067d2d63422f9ec70bf2fe7acfd6b9196693fc33fbaf43c2667c167f777d90a095c6604eb487e0bce79e230b6df0f6cacd6a55 + languageName: node + linkType: hard + "@reduxjs/toolkit@npm:1.8.2": version: 1.8.2 resolution: "@reduxjs/toolkit@npm:1.8.2" @@ -2051,15 +2329,15 @@ __metadata: languageName: node linkType: hard -"@tanstack/react-table@npm:8.5.1": - version: 8.5.1 - resolution: "@tanstack/react-table@npm:8.5.1" +"@tanstack/react-table@npm:8.13.2": + version: 8.13.2 + resolution: "@tanstack/react-table@npm:8.13.2" dependencies: - "@tanstack/table-core": 8.5.1 + "@tanstack/table-core": 8.13.2 peerDependencies: react: ">=16" react-dom: ">=16" - checksum: 4081d0ecd07924b4969c1de7d5a6e8262737d09b45ba649112da1506169f42f3d00d4566d0b69619d530af264e6f32da9ae27197377fb7dbb76934b51348ffcd + checksum: 5a5ae9cf124a19d5b5ba585359fc51e8999d5418df0bdd14acf8e8644355c540d54d7392041ceec514956d54189a1f7bf5a19ec9ae5a27fa93bd556a5b156a75 languageName: node linkType: hard @@ -2075,10 +2353,10 @@ __metadata: languageName: node linkType: hard -"@tanstack/table-core@npm:8.5.1": - version: 8.5.1 - resolution: "@tanstack/table-core@npm:8.5.1" - checksum: 8505861210325b041c1b8e97b2626d40fe64c5cae7b8edc36c1fc6d609128b4269582b2e67817b084232b301a88761f2b8286c1f65ada8d7a14b9cbba8e585db +"@tanstack/table-core@npm:8.13.2": + version: 8.13.2 + resolution: "@tanstack/table-core@npm:8.13.2" + checksum: 404cb5b1f0976d06c1a560ab895bb85af0846dd2d275a7ab47ca5bb599097b39530cd424259a40668ee6de204b6285fd122cd42b5e501c213a6d464ec45d1f9a languageName: node linkType: hard @@ -2996,6 +3274,15 @@ __metadata: languageName: node linkType: hard +"aria-hidden@npm:^1.1.1": + version: 1.2.3 + resolution: "aria-hidden@npm:1.2.3" + dependencies: + tslib: ^2.0.0 + checksum: 7d7d211629eef315e94ed3b064c6823d13617e609d3f9afab1c2ed86399bb8e90405f9bdd358a85506802766f3ecb468af985c67c846045a34b973bcc0289db9 + languageName: node + linkType: hard + "aria-query@npm:^5.1.3": version: 5.3.0 resolution: "aria-query@npm:5.3.0" @@ -4356,6 +4643,13 @@ __metadata: languageName: node linkType: hard +"detect-node-es@npm:^1.1.0": + version: 1.1.0 + resolution: "detect-node-es@npm:1.1.0" + checksum: e46307d7264644975b71c104b9f028ed1d3d34b83a15b8a22373640ce5ea630e5640b1078b8ea15f202b54641da71e4aa7597093bd4b91f113db520a26a37449 + languageName: node + linkType: hard + "didyoumean@npm:^1.2.2": version: 1.2.2 resolution: "didyoumean@npm:1.2.2" @@ -5801,6 +6095,13 @@ __metadata: languageName: node linkType: hard +"get-nonce@npm:^1.0.0": + version: 1.0.1 + resolution: "get-nonce@npm:1.0.1" + checksum: e2614e43b4694c78277bb61b0f04583d45786881289285c73770b07ded246a98be7e1f78b940c80cbe6f2b07f55f0b724e6db6fd6f1bcbd1e8bdac16521074ed + languageName: node + linkType: hard + "get-package-type@npm:^0.1.0": version: 0.1.0 resolution: "get-package-type@npm:0.1.0" @@ -6403,6 +6704,15 @@ __metadata: languageName: node linkType: hard +"invariant@npm:^2.2.4": + version: 2.2.4 + resolution: "invariant@npm:2.2.4" + dependencies: + loose-envify: ^1.0.0 + checksum: cc3182d793aad82a8d1f0af697b462939cb46066ec48bbf1707c150ad5fad6406137e91a262022c269702e01621f35ef60269f6c0d7fd178487959809acdfb14 + languageName: node + linkType: hard + "ip@npm:^2.0.0": version: 2.0.0 resolution: "ip@npm:2.0.0" @@ -7198,11 +7508,13 @@ __metadata: "@radix-ui/react-collapsible": 1.0.3 "@radix-ui/react-label": 2.0.2 "@radix-ui/react-radio-group": 1.1.3 + "@radix-ui/react-select": 2.0.0 + "@radix-ui/react-slot": 1.0.2 "@reduxjs/toolkit": 1.8.2 "@tailwindcss/forms": 0.4.0 "@tailwindcss/typography": 0.5.0 "@tanstack/react-query": ^4.2.1 - "@tanstack/react-table": 8.5.1 + "@tanstack/react-table": 8.13.2 "@tanstack/react-virtual": 3.0.1 "@types/chroma-js": 2.1.3 "@types/d3-format": 3.0.1 @@ -7471,7 +7783,7 @@ __metadata: languageName: node linkType: hard -"loose-envify@npm:^1.1.0, loose-envify@npm:^1.4.0": +"loose-envify@npm:^1.0.0, loose-envify@npm:^1.1.0, loose-envify@npm:^1.4.0": version: 1.4.0 resolution: "loose-envify@npm:1.4.0" dependencies: @@ -9257,6 +9569,41 @@ __metadata: languageName: node linkType: hard +"react-remove-scroll-bar@npm:^2.3.3": + version: 2.3.5 + resolution: "react-remove-scroll-bar@npm:2.3.5" + dependencies: + react-style-singleton: ^2.2.1 + tslib: ^2.0.0 + peerDependencies: + "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 0b6eee6d338085f0c766dc6d780100041a39377bc1a2a1b99a13444832b91885fc632b7521636a29d26710cf8bb0f9f4177123abe088a358597ac0f0e8e42f45 + languageName: node + linkType: hard + +"react-remove-scroll@npm:2.5.5": + version: 2.5.5 + resolution: "react-remove-scroll@npm:2.5.5" + dependencies: + react-remove-scroll-bar: ^2.3.3 + react-style-singleton: ^2.2.1 + tslib: ^2.1.0 + use-callback-ref: ^1.3.0 + use-sidecar: ^1.1.2 + peerDependencies: + "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 2c7fe9cbd766f5e54beb4bec2e2efb2de3583037b23fef8fa511ab426ed7f1ae992382db5acd8ab5bfb030a4b93a06a2ebca41377d6eeaf0e6791bb0a59616a4 + languageName: node + linkType: hard + "react-resize-detector@npm:^8.0.4": version: 8.1.0 resolution: "react-resize-detector@npm:8.1.0" @@ -9283,6 +9630,23 @@ __metadata: languageName: node linkType: hard +"react-style-singleton@npm:^2.2.1": + version: 2.2.1 + resolution: "react-style-singleton@npm:2.2.1" + dependencies: + get-nonce: ^1.0.0 + invariant: ^2.2.4 + tslib: ^2.0.0 + peerDependencies: + "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 7ee8ef3aab74c7ae1d70ff34a27643d11ba1a8d62d072c767827d9ff9a520905223e567002e0bf6c772929d8ea1c781a3ba0cc4a563e92b1e3dc2eaa817ecbe8 + languageName: node + linkType: hard + "react-transition-group@npm:2.9.0": version: 2.9.0 resolution: "react-transition-group@npm:2.9.0" @@ -11153,6 +11517,37 @@ __metadata: languageName: node linkType: hard +"use-callback-ref@npm:^1.3.0": + version: 1.3.1 + resolution: "use-callback-ref@npm:1.3.1" + dependencies: + tslib: ^2.0.0 + peerDependencies: + "@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 6a6a3a8bfe88f466eab982b8a92e5da560a7127b3b38815e89bc4d195d4b33aa9a53dba50d93e8138e7502bcc7e39efe9f2735a07a673212630990c73483e8e9 + languageName: node + linkType: hard + +"use-sidecar@npm:^1.1.2": + version: 1.1.2 + resolution: "use-sidecar@npm:1.1.2" + dependencies: + detect-node-es: ^1.1.0 + tslib: ^2.0.0 + peerDependencies: + "@types/react": ^16.9.0 || ^17.0.0 || ^18.0.0 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + "@types/react": + optional: true + checksum: 925d1922f9853e516eaad526b6fed1be38008073067274f0ecc3f56b17bb8ab63480140dd7c271f94150027c996cea4efe83d3e3525e8f3eda22055f6a39220b + languageName: node + linkType: hard + "use-sync-external-store@npm:^1.0.0, use-sync-external-store@npm:^1.2.0": version: 1.2.0 resolution: "use-sync-external-store@npm:1.2.0"