100 lines
2.9 KiB
TypeScript
100 lines
2.9 KiB
TypeScript
|
import { Button } from "@repo/shadcn-ui/components/button";
|
||
|
|
import {
|
||
|
|
EntityAction,
|
||
|
|
EntityListHeader,
|
||
|
|
EntityRowActions,
|
||
|
|
EntityTable,
|
||
|
|
} from "@repo/shadcn-ui/components/entity-list";
|
||
|
|
import { FormDialog } from "@repo/shadcn-ui/components/form-dialog";
|
||
|
|
import { useState } from "react";
|
||
|
|
import { useTranslation } from "react-i18next";
|
||
|
|
|
||
|
|
import type { CompanyDTO } from "../../common";
|
||
|
|
|
||
|
|
import { SiteForm } from "./site-form";
|
||
|
|
|
||
|
|
export function SiteSection({ company, csrfToken }: { company: CompanyDTO; csrfToken: string }) {
|
||
|
|
const { t, i18n } = useTranslation("companies");
|
||
|
|
const [createOpen, setCreateOpen] = useState(false);
|
||
|
|
const [selectedId, setSelectedId] = useState<string | undefined>();
|
||
|
|
const selected = company.sites.find((site) => site.id === selectedId);
|
||
|
|
return (
|
||
|
|
<div className="space-y-6">
|
||
|
|
<EntityListHeader
|
||
|
|
actions={<Button onClick={() => setCreateOpen(true)}>{t("newSite")}</Button>}
|
||
|
|
locale={i18n.language}
|
||
|
|
title={t("sites")}
|
||
|
|
/>
|
||
|
|
<EntityTable
|
||
|
|
columns={[
|
||
|
|
{
|
||
|
|
id: "name",
|
||
|
|
label: t("name"),
|
||
|
|
value: (site) => site.name,
|
||
|
|
hideable: false,
|
||
|
|
render: (site) => <span className="font-medium">{site.name}</span>,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: "address",
|
||
|
|
label: t("addressOptional"),
|
||
|
|
value: (site) => site.address,
|
||
|
|
render: (site) => (
|
||
|
|
<span className="whitespace-pre-wrap">{site.address ?? t("noAddress")}</span>
|
||
|
|
),
|
||
|
|
},
|
||
|
|
{
|
||
|
|
id: "actions",
|
||
|
|
label: t("actions"),
|
||
|
|
hideable: false,
|
||
|
|
render: (site) => (
|
||
|
|
<EntityRowActions label={t("actions")}>
|
||
|
|
<EntityAction onClick={() => setSelectedId(site.id)}>{t("edit")}</EntityAction>
|
||
|
|
</EntityRowActions>
|
||
|
|
),
|
||
|
|
},
|
||
|
|
]}
|
||
|
|
emptyMessage={t("noSites")}
|
||
|
|
items={company.sites}
|
||
|
|
locale={i18n.language}
|
||
|
|
title={t("sites")}
|
||
|
|
/>
|
||
|
|
<FormDialog
|
||
|
|
cancelLabel={t("cancel")}
|
||
|
|
formActions
|
||
|
|
onOpenChange={setCreateOpen}
|
||
|
|
open={createOpen}
|
||
|
|
title={t("newSite")}
|
||
|
|
>
|
||
|
|
<SiteForm
|
||
|
|
companyId={company.id}
|
||
|
|
csrfToken={csrfToken}
|
||
|
|
onSaved={() => setCreateOpen(false)}
|
||
|
|
showTitle={false}
|
||
|
|
/>
|
||
|
|
</FormDialog>
|
||
|
|
<FormDialog
|
||
|
|
cancelLabel={t("cancel")}
|
||
|
|
formActions
|
||
|
|
onOpenChange={(open) => {
|
||
|
|
if (!open) {
|
||
|
|
setSelectedId(undefined);
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
open={selected !== undefined}
|
||
|
|
title={t("editSite")}
|
||
|
|
>
|
||
|
|
{selected && (
|
||
|
|
<SiteForm
|
||
|
|
companyId={company.id}
|
||
|
|
csrfToken={csrfToken}
|
||
|
|
key={selected.id}
|
||
|
|
onSaved={() => setSelectedId(undefined)}
|
||
|
|
showTitle={false}
|
||
|
|
site={selected}
|
||
|
|
/>
|
||
|
|
)}
|
||
|
|
</FormDialog>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|