Skip to content

Components

Benjamin Fontana edited this page Jun 21, 2024 · 5 revisions

CreateOrderForm

// todo

DataTable

Component imported from shadcn/ui - Data Table

The Datatable has been translated to js from TS.

To use it, you must use the ColumnBuilder to build the required headers.

import { ColumnBuilder } from "@/Builder/ColumnBuilder";

const builder = new ColumnBuilder();

const columnHeaders = [
    {
        accessor: "lastname",
        header: "Nom",
    },
    {
        accessor: "firstname",
        header: "Prénom",
    },
    {
        accessor: "phone_number",
        header: "Téléphone",
    },
    {
        accessor: "email",
        header: "Email",
    },
    {
        accessor: "orders_count",
        header: "Nb commandes",
    },
];

You can also change the cell format and content

import { ColumnBuilder } from "@/Builder/ColumnBuilder";
import { Badge } from "@/Components/ui/badge";

const builder = new ColumnBuilder();

const columnHeaders = [
    {
        accessor: "lastname",
        header: "Nom",
    },
    {
        accessor: "firstname",
        header: "Prénom",
    },
    {
        accessor: "phone_number",
        header: "Téléphone",
    },
    {
        accessor: "types",
        header: "Rôle",
        cell: (row) => (
            <div className="flex gap-2">
                {row.getValue().map((badge) => (
                    <Badge key={badge.key} variant={badge.key}>
                        {badge.name}
                    </Badge>
                ))}
            </div>
        ),
    },
    {
        accessor: "email",
        header: "Email",
    },
    {
        accessor: "orders_count",
        header: "Nb commandes",
    },
];

DeliveryguysBigCard

//todo

DeliveryguysCard

//todo

DeliveryItem

//todo

Dialog

//todo

Draggable

//todo

Icon

//todo

MultipleSelector

Component imported from shadcn/ui expansions - Multiple Selector

The component has been translated from TS to js/jsx

Navbar

//todo

NavIcon

//todo

OrderCard

//todo

SlidingText

//todo

TimePicker

//todo

Timetable

//todo