import {
	ChecklistOutlined,
	HolidayVillageOutlined,
	HouseOutlined,
	PeopleOutlined,
	TokenOutlined,
	Warning,
} from "@mui/icons-material";
import { useNavigate } from "react-router-dom";

import { Card } from "@/common/components/card/Card";
import { useDialogStore } from "@/contexts/dialog/lib/useDialogStore";
import { OrganizationModel } from "@/contracts/client.schemas";
import {
	SELECT_ASSET_GROUP_DIALOG_KEY,
	SelectAssetGroupDialog,
} from "@/widgets/SelectAssetGroupDialog";

export const OrganizationCardPage = () => {
	const navigate = useNavigate();
	const { push } = useDialogStore();

	const defaultValue: OrganizationModel = {
		id: "",
		name: "",
		description: "",
	};

	return (
		<Card
			baseUrl="/api/organizations"
			defaultValue={defaultValue}
			fields={[
				{
					name: "name",
					readOnly: true,
					title: "Name",
				},
			]}
			canEdit={false}
			canRemove={false}
			viewTitle="Organization"
			extraActions={[
				{
					title: "Assets",
					icon: <HouseOutlined />,
					action: async (x) => {
						navigate("./assets", { relative: "path" });
						return x;
					},
				},
				{
					title: "Asset Groups",
					icon: <HolidayVillageOutlined />,
					action: async (x) => {
						navigate("./asset-groups", { relative: "path" });
						return x;
					},
				},
				{
					title: "Members",
					icon: <PeopleOutlined />,
					action: async (x) => {
						navigate("./members", { relative: "path" });
						return x;
					},
				},
				{
					title: "API Tokens",
					variant: "outlined",
					icon: <TokenOutlined />,
					action: async (x) => {
						navigate("./tokens", { relative: "path" });
						return x;
					},
				},
				{
					title: "alarmDescription",
					icon: <Warning />,
					action: async (x) => {
						navigate("./alarm-description", { relative: "path" });
						return x;
					},
				},
				{
					title: "checkLists",
					icon: <ChecklistOutlined />,
					action: async (x) => {
						navigate("./check-list-templates", {
							relative: "path",
						});
						return x;
					},
				},
				{
					title: "generateDemoEvent",
					icon: <ChecklistOutlined />,
					action: async (x) => {
						push({
							key: SELECT_ASSET_GROUP_DIALOG_KEY,
							content: (
								<SelectAssetGroupDialog organizationId={x.id} />
							),
						});
						return x;
					},
				},
			]}
			getModelTitle={(x) => x.name}
			notificationMethodPrefix="ORGANIZATIONS"
		/>
	);
};
