metis-desk/modules/companies/src/web/dashboard/create/ui/dashboard-quick-create.tsx

77 lines
2.7 KiB
TypeScript

import { FormDialog } from "@repo/rdx-ui/components/form-dialog";
import { SelectWithAction } from "@repo/rdx-ui/components/select-with-action";
import { Button } from "@repo/shadcn-ui/components/button";
import { useTranslation } from "react-i18next";
import { CompanyEditorDialog } from "../../../companies/shared/ui/company-editor-dialog";
import { CompanyForm } from "../../../companies/shared/ui/company-form";
import { BlockState } from "../../shared";
import { useDashboardQuickCreateController } from "../controllers";
import type { DashboardQuickCreateProps } from "../types";
export function DashboardQuickCreate(props: DashboardQuickCreateProps) {
const { kind, onClose, onNavigate } = props;
const { selectedCompany, setSelectedCompany, addingCompany, setAddingCompany, companies, saved } =
useDashboardQuickCreateController(props);
const { t } = useTranslation("companies");
return (
<>
<FormDialog
cancelLabel={t("cancel")}
formActions={kind !== "asset" && kind !== "resource"}
onOpenChange={(open) => {
if (!open) {
onClose();
}
}}
open
title={t(`dashboard.create.${kind}`)}
>
{kind === "company" && <CompanyForm onSaved={saved} showTitle={false} />}
{(kind === "asset" || kind === "resource") && (
<BlockState empty={false} emptyText="" query={companies}>
<SelectWithAction
action={{ label: t("newCompany"), onClick: () => setAddingCompany(true) }}
id="dashboard-create-company"
label={t("companyLabel")}
onValueChange={setSelectedCompany}
options={
companies.data?.companies
.filter((item) => item.active)
.map((item) => ({ value: item.id, label: item.name })) ?? []
}
placeholder={t("dashboard.chooseCompany")}
value={selectedCompany}
/>
<p className="text-sm text-muted-foreground">{t("dashboard.chooseCompany")}</p>
<Button
disabled={!selectedCompany}
onClick={() =>
onNavigate({
area: "company",
id: selectedCompany,
section: kind === "asset" ? "inventory" : "resources",
create: true,
})
}
>
{t("dashboard.continue")}
</Button>
</BlockState>
)}
</FormDialog>
{addingCompany && (
<CompanyEditorDialog
onCreated={(id) => {
setSelectedCompany(id);
setAddingCompany(false);
}}
onOpenChange={setAddingCompany}
open
/>
)}
</>
);
}