import { useTranslation } from "react-i18next";
import { useParams } from "react-router-dom";

import { Column } from "@/common/components/Matrix/Column";
import { AssetGroupModel } from "@/contracts/client.schemas";

import { Matrix } from "../../../common/components/Matrix/Matrix";

export const AssetGroupListPage = () => {
	const { organizationId } = useParams();
	const { t } = useTranslation("translation");
	if (!organizationId) {
		throw new Error("Organization id is required");
	}

	const columns: Column<AssetGroupModel>[] = [
		{
			name: "name",
			title: "Name",
		},
		{
			name: "hasPBX",
			title: "Has PBX",
			convert: (value) => {
				return value ? t("Yes") : t("No");
			},
		},
	];

	return (
		<Matrix
			columns={columns}
			title="Asset Groups"
			baseUrl="/api/asset-groups"
			getModelTitle={(model) => model.name}
			notificationMethodPrefix="ASSET-GROUPS"
			filters={{ organizationId }}
			canCreate={true}
			canView={true}
			canRemove={true}
		/>
	);
};
