+
0 ? 100 : 0}%`,
+ opacity: 0.7,
+ }}
+ />
+
+
+
+
+
+ Assignee
+ Policy Count
+
+
+
+
+
+ value.split(" ")[0]}
+ fontSize={12}
+ stroke="hsl(var(--muted-foreground))"
+ />
+ }
+ />
+
+
+
+
+
+
+
+
+
+
+ {Object.entries(chartConfig).map(([key, config]) => (
+
+ ))}
+
+
+ );
}
diff --git a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/components/policy-status-chart.tsx b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/components/policy-status-chart.tsx
index d897e4d803..17445aa6ed 100644
--- a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/components/policy-status-chart.tsx
+++ b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/components/policy-status-chart.tsx
@@ -4,259 +4,257 @@ import * as React from "react";
import { Pie, PieChart, Label, Tooltip, ResponsiveContainer } from "recharts";
import {
- Card,
- CardContent,
- CardHeader,
- CardFooter,
- CardTitle,
+ Card,
+ CardContent,
+ CardHeader,
+ CardFooter,
+ CardTitle,
} from "@comp/ui/card";
import {
- type ChartConfig,
- ChartContainer,
- ChartTooltip,
- ChartTooltipContent,
+ type ChartConfig,
+ ChartContainer,
+ ChartTooltip,
+ ChartTooltipContent,
} from "@comp/ui/chart";
import { useI18n } from "@/locales/client";
import { Badge } from "@comp/ui/badge";
import {
- PieChart as PieChartIcon,
- BarChart as ChartIcon,
- Info,
+ PieChart as PieChartIcon,
+ BarChart as ChartIcon,
+ Info,
} from "lucide-react";
interface PolicyOverviewData {
- totalPolicies: number;
- publishedPolicies: number;
- draftPolicies: number;
- archivedPolicies: number;
- needsReviewPolicies: number;
+ totalPolicies: number;
+ publishedPolicies: number;
+ draftPolicies: number;
+ archivedPolicies: number;
+ needsReviewPolicies: number;
}
interface PolicyStatusChartProps {
- data?: PolicyOverviewData | null;
+ data?: PolicyOverviewData | null;
}
const CHART_COLORS = {
- published: "hsl(var(--chart-positive))", // green
- draft: "hsl(var(--chart-neutral))", // yellow
- archived: "hsl(var(--chart-warning))", // gray
- needs_review: "hsl(var(--chart-destructive))", // red
+ published: "hsl(var(--chart-positive))", // green
+ draft: "hsl(var(--chart-neutral))", // yellow
+ archived: "hsl(var(--chart-warning))", // gray
+ needs_review: "hsl(var(--chart-destructive))", // red
};
// Custom tooltip component for the pie chart
const StatusTooltip = ({ active, payload }: any) => {
- if (active && payload && payload.length) {
- const data = payload[0].payload;
- return (
-
-
{data.name}
-
- Count: {data.value}
-
-
- );
- }
- return null;
+ if (active && payload && payload.length) {
+ const data = payload[0].payload;
+ return (
+
+
{data.name}
+
+ Count: {data.value}
+
+
+ );
+ }
+ return null;
};
export function PolicyStatusChart({ data }: PolicyStatusChartProps) {
- const t = useI18n();
+ const t = useI18n();
- if (!data) {
- return (
-
-
-
-
-
- {t("policies.dashboard.policy_status") || "Policy Status"}
-
-
- Overview
-
-
-
-
-
-
- No policy data available
-
-
- );
- }
+ if (!data) {
+ return (
+
+
+
+
+ {t("policies.dashboard.policy_status") || "Policy Status"}
+
+
+ Overview
+
+
+
+
+
+
+
+
+
+ No policy data available
+
+
+ );
+ }
- const chartData = React.useMemo(() => {
- const items = [
- {
- name: t("policies.status.published"),
- value: data.publishedPolicies,
- fill: CHART_COLORS.published,
- },
- {
- name: t("policies.status.draft"),
- value: data.draftPolicies,
- fill: CHART_COLORS.draft,
- },
- {
- name: t("policies.status.archived"),
- value: data.archivedPolicies,
- fill: CHART_COLORS.archived,
- },
- {
- name: t("policies.status.needs_review"),
- value: data.needsReviewPolicies,
- fill: CHART_COLORS.needs_review,
- },
- ];
+ const chartData = React.useMemo(() => {
+ const items = [
+ {
+ name: t("policies.status.published"),
+ value: data.publishedPolicies,
+ fill: CHART_COLORS.published,
+ },
+ {
+ name: t("policies.status.draft"),
+ value: data.draftPolicies,
+ fill: CHART_COLORS.draft,
+ },
+ {
+ name: t("policies.status.archived"),
+ value: data.archivedPolicies,
+ fill: CHART_COLORS.archived,
+ },
+ {
+ name: t("policies.status.needs_review"),
+ value: data.needsReviewPolicies,
+ fill: CHART_COLORS.needs_review,
+ },
+ ];
- return items.filter((item) => item.value);
- }, [data, t]);
+ return items.filter((item) => item.value);
+ }, [data, t]);
- const chartConfig = {
- value: {
- label: "Count",
- },
- } satisfies ChartConfig;
+ const chartConfig = {
+ value: {
+ label: "Count",
+ },
+ } satisfies ChartConfig;
- // Calculate most common status
- const mostCommonStatus = React.useMemo(() => {
- if (!chartData.length) return null;
- return chartData.reduce((prev, current) =>
- prev.value > current.value ? prev : current,
- );
- }, [chartData]);
+ // Calculate most common status
+ const mostCommonStatus = React.useMemo(() => {
+ if (!chartData.length) return null;
+ return chartData.reduce((prev, current) =>
+ prev.value > current.value ? prev : current,
+ );
+ }, [chartData]);
- return (
-
-
-
-
-
- {t("policies.dashboard.policy_status") || "Policy Status"}
-
+ return (
+
+
+
+
+ {t("policies.dashboard.policy_status") || "Policy Status"}
+
- {data.totalPolicies > 0 && mostCommonStatus && (
-
- Most: {mostCommonStatus.name}
-
- )}
-
+ {data.totalPolicies > 0 && mostCommonStatus && (
+
+ Most: {mostCommonStatus.name}
+
+ )}
+
- {chartData.map((entry) => (
-
-
-
- {entry.name}
-
- ({entry.value})
-
-
-
- ))}
-
- );
+
+
+
+
+
+ } />
+
+
+
+
+
+
+
+ {chartData.map((entry) => (
+
+
+
+ {entry.name}
+
+ ({entry.value})
+
+
+
+ ))}
+
+
+ );
}
diff --git a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/page.tsx b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/page.tsx
index bdedb621b6..a8d606f717 100644
--- a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/page.tsx
+++ b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/policies/(overview)/page.tsx
@@ -10,170 +10,170 @@ import Loading from "./loading";
import { headers } from "next/headers";
export default async function PoliciesOverview({
- params,
+ params,
}: {
- params: Promise<{ locale: string }>;
+ params: Promise<{ locale: string }>;
}) {
- const { locale } = await params;
- setStaticParamsLocale(locale);
-
- const overview = await getPoliciesOverview();
-
- return (
-
}>
-
-
- );
+ const { locale } = await params;
+ setStaticParamsLocale(locale);
+
+ const overview = await getPoliciesOverview();
+
+ return (
+
}>
+
+
+ );
}
const getPoliciesOverview = async () => {
- const session = await auth.api.getSession({
- headers: await headers(),
- });
-
- if (!session?.session?.activeOrganizationId) {
- return null;
- }
-
- const organizationId = session.session.activeOrganizationId;
-
- return await db.$transaction(async (tx) => {
- const [
- totalPolicies,
- publishedPolicies,
- draftPolicies,
- archivedPolicies,
- needsReviewPolicies,
- policiesByAssignee,
- policiesByAssigneeStatus,
- ] = await Promise.all([
- tx.policy.count({
- where: {
- organizationId,
- },
- }),
- tx.policy.count({
- where: {
- organizationId,
- status: "published",
- isArchived: false,
- },
- }),
- tx.policy.count({
- where: {
- organizationId,
- status: "draft",
- isArchived: false,
- },
- }),
- tx.policy.count({
- where: {
- organizationId,
- isArchived: true,
- },
- }),
- tx.policy.count({
- where: {
- organizationId,
- status: "needs_review",
- isArchived: false,
- },
- }),
- tx.policy.groupBy({
- by: ["assigneeId"],
- _count: true,
- where: {
- organizationId,
- assigneeId: { not: null },
- },
- }),
- tx.policy.findMany({
- where: {
- organizationId,
- assigneeId: { not: null },
- },
- select: {
- status: true,
- isArchived: true,
- assignee: {
- select: {
- id: true,
- user: {
- select: {
- name: true,
- },
- },
- },
- },
- },
- }),
- ]);
-
- // Transform the data for easier consumption by the chart component
- // First group by owner
- const policyDataByOwner = new Map();
-
- for (const policy of policiesByAssigneeStatus) {
- if (!policy.assignee) continue;
-
- const assigneeId = policy.assignee.id;
- if (!policyDataByOwner.has(assigneeId)) {
- policyDataByOwner.set(assigneeId, {
- id: assigneeId,
- name: policy.assignee.user.name || "Unknown",
- total: 0,
- published: 0,
- draft: 0,
- archived: 0,
- needs_review: 0,
- });
- }
-
- const assigneeData = policyDataByOwner.get(assigneeId);
- assigneeData.total += 1;
-
- // Handle archived policies separately
- if (policy.isArchived) {
- assigneeData.archived += 1;
- continue;
- }
-
- // Handle each status type explicitly
- const status = policy.status;
- if (status === "published") assigneeData.published += 1;
- else if (status === "draft") assigneeData.draft += 1;
- else if (status === "needs_review") assigneeData.needs_review += 1;
- }
-
- const assigneeData = Array.from(policyDataByOwner.values());
-
- return {
- totalPolicies,
- publishedPolicies,
- draftPolicies,
- archivedPolicies,
- needsReviewPolicies,
- policiesByAssignee,
- assigneeData,
- };
- });
+ const session = await auth.api.getSession({
+ headers: await headers(),
+ });
+
+ if (!session?.session?.activeOrganizationId) {
+ return null;
+ }
+
+ const organizationId = session.session.activeOrganizationId;
+
+ return await db.$transaction(async (tx) => {
+ const [
+ totalPolicies,
+ publishedPolicies,
+ draftPolicies,
+ archivedPolicies,
+ needsReviewPolicies,
+ policiesByAssignee,
+ policiesByAssigneeStatus,
+ ] = await Promise.all([
+ tx.policy.count({
+ where: {
+ organizationId,
+ },
+ }),
+ tx.policy.count({
+ where: {
+ organizationId,
+ status: "published",
+ isArchived: false,
+ },
+ }),
+ tx.policy.count({
+ where: {
+ organizationId,
+ status: "draft",
+ isArchived: false,
+ },
+ }),
+ tx.policy.count({
+ where: {
+ organizationId,
+ isArchived: true,
+ },
+ }),
+ tx.policy.count({
+ where: {
+ organizationId,
+ status: "needs_review",
+ isArchived: false,
+ },
+ }),
+ tx.policy.groupBy({
+ by: ["assigneeId"],
+ _count: true,
+ where: {
+ organizationId,
+ assigneeId: { not: null },
+ },
+ }),
+ tx.policy.findMany({
+ where: {
+ organizationId,
+ assigneeId: { not: null },
+ },
+ select: {
+ status: true,
+ isArchived: true,
+ assignee: {
+ select: {
+ id: true,
+ user: {
+ select: {
+ name: true,
+ },
+ },
+ },
+ },
+ },
+ }),
+ ]);
+
+ // Transform the data for easier consumption by the chart component
+ // First group by owner
+ const policyDataByOwner = new Map();
+
+ for (const policy of policiesByAssigneeStatus) {
+ if (!policy.assignee) continue;
+
+ const assigneeId = policy.assignee.id;
+ if (!policyDataByOwner.has(assigneeId)) {
+ policyDataByOwner.set(assigneeId, {
+ id: assigneeId,
+ name: policy.assignee.user.name || "Unknown",
+ total: 0,
+ published: 0,
+ draft: 0,
+ archived: 0,
+ needs_review: 0,
+ });
+ }
+
+ const assigneeData = policyDataByOwner.get(assigneeId);
+ assigneeData.total += 1;
+
+ // Handle archived policies separately
+ if (policy.isArchived) {
+ assigneeData.archived += 1;
+ continue;
+ }
+
+ // Handle each status type explicitly
+ const status = policy.status;
+ if (status === "published") assigneeData.published += 1;
+ else if (status === "draft") assigneeData.draft += 1;
+ else if (status === "needs_review") assigneeData.needs_review += 1;
+ }
+
+ const assigneeData = Array.from(policyDataByOwner.values());
+
+ return {
+ totalPolicies,
+ publishedPolicies,
+ draftPolicies,
+ archivedPolicies,
+ needsReviewPolicies,
+ policiesByAssignee,
+ assigneeData,
+ };
+ });
};
export async function generateMetadata({
- params,
+ params,
}: {
- params: Promise<{ locale: string }>;
+ params: Promise<{ locale: string }>;
}): Promise
{
- const { locale } = await params;
- setStaticParamsLocale(locale);
- const t = await getI18n();
+ const { locale } = await params;
+ setStaticParamsLocale(locale);
+ const t = await getI18n();
- return {
- title: t("sidebar.policies"),
- };
+ return {
+ title: t("sidebar.policies"),
+ };
}
diff --git a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/risk/(overview)/RisksTable.tsx b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/risk/(overview)/RisksTable.tsx
index c8d9a89b2f..c221559319 100644
--- a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/risk/(overview)/RisksTable.tsx
+++ b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/risk/(overview)/RisksTable.tsx
@@ -7,77 +7,67 @@ import { useDataTable } from "@/hooks/use-data-table";
import { useI18n } from "@/locales/client";
import { useSession } from "@/utils/auth-client";
import type { Member, Risk, User } from "@comp/db/types";
-import { Button } from "@comp/ui/button";
-import { Input } from "@comp/ui/input";
import { ColumnDef } from "@tanstack/react-table";
-import { Plus } from "lucide-react";
import { useQueryState } from "nuqs";
import { useMemo } from "react";
import { columns as getColumns } from "./components/table/RiskColumns";
+import { DataTableToolbar } from "@/components/data-table/data-table-toolbar";
// Define the expected structure of a risk with User as assignee
export type RiskRow = Risk & { assignee: User | null };
export const RisksTable = ({
- risks,
- assignees,
+ risks,
+ assignees,
}: {
- risks: RiskRow[];
- assignees: (Member & { user: User })[];
+ risks: RiskRow[];
+ assignees: (Member & { user: User })[];
}) => {
- const t = useI18n();
- const session = useSession();
- const orgId = session?.data?.session?.activeOrganizationId;
- const [_, setOpen] = useQueryState("create-risk-sheet");
+ const t = useI18n();
+ const session = useSession();
+ const orgId = session?.data?.session?.activeOrganizationId;
+ const [_, setOpen] = useQueryState("create-risk-sheet");
- // Define columns for risks table
- const columns = useMemo[]>(
- () => getColumns(orgId ?? ""),
- [orgId],
- );
+ // Define columns for risks table
+ const columns = useMemo[]>(
+ () => getColumns(orgId ?? ""),
+ [orgId],
+ );
- // Set up the risks table
- const table = useDataTable({
- data: risks,
- columns,
- pageCount: Math.ceil(risks.length / 10),
- getRowId: (row) => row.id,
- initialState: {
- sorting: [{ id: "title", desc: false }],
- pagination: {
- pageSize: 10,
- pageIndex: 0,
- },
- },
- });
+ // Set up the risks table
+ const table = useDataTable({
+ data: risks,
+ columns,
+ pageCount: Math.ceil(risks.length / 10),
+ getRowId: (row) => row.id,
+ initialState: {
+ pagination: {
+ pageSize: 10,
+ pageIndex: 0,
+ },
+ },
+ });
- const [searchTerm, setSearchTerm] = useQueryState("search", {
- defaultValue: "",
- });
+ const [searchTerm, setSearchTerm] = useQueryState("search", {
+ defaultValue: "",
+ });
- return (
- <>
-
-
setSearchTerm(e.target.value)}
- className="max-w-sm"
- />
-
-
-
-
-
-
-
-
- {row.original.assignee.name?.charAt(0) || "?"}
-
-
-
{row.original.assignee.name}
-
+
+
+
+ {row.original.assignee.name?.charAt(0) || "?"}
+
+
+
{row.original.assignee.name}
+
-
-
-
- );
+ return (
+
+
+
+
+ );
}
export async function generateMetadata({
- params,
+ params,
}: {
- params: Promise<{ locale: string }>;
+ params: Promise<{ locale: string }>;
}): Promise {
- const { locale } = await params;
- setStaticParamsLocale(locale);
- const t = await getI18n();
+ const { locale } = await params;
+ setStaticParamsLocale(locale);
+ const t = await getI18n();
- return {
- title: t("sidebar.settings"),
- };
+ return {
+ title: t("sidebar.settings"),
+ };
}
const organizationDetails = cache(async () => {
- const session = await auth.api.getSession({
- headers: await headers(),
- });
-
- if (!session?.session.activeOrganizationId) {
- return null;
- }
-
- const organization = await db.organization.findUnique({
- where: { id: session?.session.activeOrganizationId },
- select: {
- name: true,
- id: true,
- },
- });
-
- return organization;
+ const session = await auth.api.getSession({
+ headers: await headers(),
+ });
+
+ if (!session?.session.activeOrganizationId) {
+ return null;
+ }
+
+ const organization = await db.organization.findUnique({
+ where: { id: session?.session.activeOrganizationId },
+ select: {
+ name: true,
+ id: true,
+ },
+ });
+
+ return organization;
});
diff --git a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/vendors/(overview)/components/VendorColumns.tsx b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/vendors/(overview)/components/VendorColumns.tsx
index 9532d28329..62e3b1611f 100644
--- a/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/vendors/(overview)/components/VendorColumns.tsx
+++ b/apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/vendors/(overview)/components/VendorColumns.tsx
@@ -5,73 +5,103 @@ import type { ColumnDef } from "@tanstack/react-table";
import Link from "next/link";
import type { VendorRegisterTableRow } from "./VendorsTable";
import { UserIcon } from "lucide-react";
+import { DataTableColumnHeader } from "@/components/data-table/data-table-column-header";
-export const columns = (orgId: string): ColumnDef[] => [
- {
- header: "Vendor",
- accessorKey: "name",
- cell: ({ row }) => {
- return (
-
- {row.original.name}
-
- );
- },
- sortingFn: (a, b) => {
- return a.original.name.localeCompare(b.original.name);
- },
- enableSorting: true,
- },
- {
- header: "Status",
- accessorKey: "status",
- cell: ({ row }) => {
- return ;
- },
- },
- {
- header: "Category",
- accessorKey: "category",
- cell: ({ row }) => {
- return (
-
- {row.original.category}
-
- );
- },
- },
- {
- header: "Assignee",
- accessorKey: "assignee",
- cell: ({ row }) => {
- // Handle null assignee
- if (!row.original.assignee) {
- return (
-
- );
- }
+export const columns: ColumnDef[] = [
+ {
+ id: "name",
+ accessorKey: "name",
+ header: ({ column }) => {
+ return ;
+ },
+ cell: ({ row }) => {
+ return (
+
+ {row.original.name}
+
+ );
+ },
+ meta: {
+ label: "Vendor Name",
+ placeholder: "Search for vendor name...",
+ variant: "text",
+ },
+ enableColumnFilter: true,
+ },
+ {
+ id: "status",
+ accessorKey: "status",
+ header: ({ column }) => {
+ return ;
+ },
+ cell: ({ row }) => {
+ return ;
+ },
+ meta: {
+ label: "Status",
+ placeholder: "Search by status...",
+ variant: "select",
+ },
+ },
+ {
+ id: "category",
+ accessorKey: "category",
+ header: ({ column }) => {
+ return ;
+ },
+ cell: ({ row }) => {
+ return (
+
+ {row.original.category}
+
+ );
+ },
+ meta: {
+ label: "Category",
+ placeholder: "Search by category...",
+ variant: "select",
+ },
+ },
+ {
+ id: "assignee",
+ accessorKey: "assignee",
+ header: ({ column }) => {
+ return ;
+ },
+ cell: ({ row }) => {
+ // Handle null assignee
+ if (!row.original.assignee) {
+ return (
+
+ );
+ }
- return (
-
-
-
-
- {row.original.assignee.user.name?.charAt(0) || "?"}
-
-
-
- {row.original.assignee.user.name}
-
-
+
+
+
+ {row.original.assignee.user.name?.charAt(0) || "?"}
+
+
+
+ {row.original.assignee.user.name}
+
+
-
setSearchTerm(e.target.value)}
- className="max-w-sm"
- />
-
-
-
-
-
-
-
-
-
- Task Details
-
-
-
-
-
-
-
-
+
+
+
+
+ Task Details
+
+
+
+
+
+
+
+
-
-
{status.replace("_", " ")}
-
+
+
{status.replace("_", " ")}
+
-
-
{status.replace("_", " ")}
-
+
+
{status.replace("_", " ")}
+
{t("settings.general.org_name_tip")}
diff --git a/apps/app/src/components/forms/policies/UpdatePolicyOverview.tsx b/apps/app/src/components/forms/policies/UpdatePolicyOverview.tsx
index 8d0e782086..f3e834af91 100644
--- a/apps/app/src/components/forms/policies/UpdatePolicyOverview.tsx
+++ b/apps/app/src/components/forms/policies/UpdatePolicyOverview.tsx
@@ -2,35 +2,35 @@
import { updatePolicyFormAction } from "@/actions/policies/update-policy-form-action";
import { updatePolicyFormSchema } from "@/actions/schema";
-import { SelectAssignee } from "@/app/[locale]/(app)/(dashboard)/[orgId]/components/SelectAssignee";
+import { SelectAssignee } from "@/components/SelectAssignee";
import { StatusPolicies, type StatusType } from "@/components/status-policies";
import { useI18n } from "@/locales/client";
import {
- Departments,
- Frequency,
- Member,
- User,
- type Policy,
- type PolicyStatus,
+ Departments,
+ Frequency,
+ Member,
+ User,
+ type Policy,
+ type PolicyStatus,
} from "@comp/db/types";
import { Button } from "@comp/ui/button";
import { Calendar } from "@comp/ui/calendar";
import { cn } from "@comp/ui/cn";
import {
- Form,
- FormControl,
- FormField,
- FormItem,
- FormLabel,
- FormMessage,
+ Form,
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
} from "@comp/ui/form";
import { Popover, PopoverContent, PopoverTrigger } from "@comp/ui/popover";
import {
- Select,
- SelectContent,
- SelectItem,
- SelectTrigger,
- SelectValue,
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
} from "@comp/ui/select";
import { Switch } from "@comp/ui/switch";
import { zodResolver } from "@hookform/resolvers/zod";
@@ -42,270 +42,270 @@ import { toast } from "sonner";
import type { z } from "zod";
const policyStatuses: PolicyStatus[] = [
- "draft",
- "published",
- "needs_review",
+ "draft",
+ "published",
+ "needs_review",
] as const;
export function UpdatePolicyOverview({
- policy,
- assignees,
+ policy,
+ assignees,
}: {
- policy: Policy;
- assignees: (Member & { user: User })[];
+ policy: Policy;
+ assignees: (Member & { user: User })[];
}) {
- const t = useI18n();
+ const t = useI18n();
- const updatePolicyForm = useAction(updatePolicyFormAction, {
- onSuccess: () => {
- toast.success(t("policies.overview.form.update_policy_success"));
- },
- onError: () => {
- toast.error(t("policies.overview.form.update_policy_error"));
- },
- });
+ const updatePolicyForm = useAction(updatePolicyFormAction, {
+ onSuccess: () => {
+ toast.success(t("policies.overview.form.update_policy_success"));
+ },
+ onError: () => {
+ toast.error(t("policies.overview.form.update_policy_error"));
+ },
+ });
- const calculateReviewDate = (): Date => {
- if (!policy.reviewDate) {
- return new Date();
- }
- return new Date(policy.reviewDate);
- };
+ const calculateReviewDate = (): Date => {
+ if (!policy.reviewDate) {
+ return new Date();
+ }
+ return new Date(policy.reviewDate);
+ };
- const reviewDate = calculateReviewDate();
+ const reviewDate = calculateReviewDate();
- const form = useForm>({
- resolver: zodResolver(updatePolicyFormSchema),
- defaultValues: {
- id: policy.id,
- status: policy.status,
- assigneeId: policy.assigneeId ?? "",
- department: policy.department ?? Departments.admin,
- review_frequency: policy.frequency ?? Frequency.monthly,
- review_date: reviewDate,
- isRequiredToSign: policy.isRequiredToSign ? "required" : "not_required",
- },
- });
+ const form = useForm>({
+ resolver: zodResolver(updatePolicyFormSchema),
+ defaultValues: {
+ id: policy.id,
+ status: policy.status,
+ assigneeId: policy.assigneeId ?? "",
+ department: policy.department ?? Departments.admin,
+ review_frequency: policy.frequency ?? Frequency.monthly,
+ review_date: reviewDate,
+ isRequiredToSign: policy.isRequiredToSign ? "required" : "not_required",
+ },
+ });
- const onSubmit = (data: z.infer) => {
- updatePolicyForm.execute({
- id: data.id,
- status: data.status as PolicyStatus,
- assigneeId: data.assigneeId,
- department: data.department,
- review_frequency: data.review_frequency,
- review_date: data.review_date,
- isRequiredToSign: data.isRequiredToSign,
- });
- };
+ const onSubmit = (data: z.infer) => {
+ updatePolicyForm.execute({
+ id: data.id,
+ status: data.status as PolicyStatus,
+ assigneeId: data.assigneeId,
+ department: data.department,
+ review_frequency: data.review_frequency,
+ review_date: data.review_date,
+ isRequiredToSign: data.isRequiredToSign,
+ });
+ };
- return (
-
+
+ );
}
diff --git a/apps/app/src/components/forms/risks/create-risk-form.tsx b/apps/app/src/components/forms/risks/create-risk-form.tsx
index a4161c59d4..0fd02322ee 100644
--- a/apps/app/src/components/forms/risks/create-risk-form.tsx
+++ b/apps/app/src/components/forms/risks/create-risk-form.tsx
@@ -2,32 +2,32 @@
import { createRiskAction } from "@/actions/risk/create-risk-action";
import { createRiskSchema } from "@/actions/schema";
-import { SelectAssignee } from "@/app/[locale]/(app)/(dashboard)/[orgId]/components/SelectAssignee";
+import { SelectAssignee } from "@/components/SelectAssignee";
import { useI18n } from "@/locales/client";
import type { Member, RiskStatus, User } from "@comp/db/types";
import { Departments, RiskCategory } from "@comp/db/types";
import {
- Accordion,
- AccordionContent,
- AccordionItem,
- AccordionTrigger,
+ Accordion,
+ AccordionContent,
+ AccordionItem,
+ AccordionTrigger,
} from "@comp/ui/accordion";
import { Button } from "@comp/ui/button";
import {
- Form,
- FormControl,
- FormField,
- FormItem,
- FormLabel,
- FormMessage,
+ Form,
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
} from "@comp/ui/form";
import { Input } from "@comp/ui/input";
import {
- Select,
- SelectContent,
- SelectItem,
- SelectTrigger,
- SelectValue,
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
} from "@comp/ui/select";
import { Textarea } from "@comp/ui/textarea";
import { zodResolver } from "@hookform/resolvers/zod";
@@ -39,240 +39,240 @@ import { toast } from "sonner";
import type { z } from "zod";
export function CreateRisk({
- assignees,
+ assignees,
}: { assignees: (Member & { user: User })[] }) {
- const t = useI18n();
+ const t = useI18n();
- // Get the same query parameters as the table
- const [search] = useQueryState("search");
- const [page] = useQueryState("page", {
- defaultValue: 1,
- parse: Number.parseInt,
- });
- const [pageSize] = useQueryState("pageSize", {
- defaultValue: 10,
- parse: Number,
- });
- const [status] = useQueryState("status", {
- defaultValue: null,
- parse: (value) => value as RiskStatus | null,
- });
- const [department] = useQueryState("department", {
- defaultValue: null,
- parse: (value) => value as Departments | null,
- });
- const [assigneeId] = useQueryState("assigneeId", {
- defaultValue: null,
- parse: (value) => value,
- });
+ // Get the same query parameters as the table
+ const [search] = useQueryState("search");
+ const [page] = useQueryState("page", {
+ defaultValue: 1,
+ parse: Number.parseInt,
+ });
+ const [pageSize] = useQueryState("pageSize", {
+ defaultValue: 10,
+ parse: Number,
+ });
+ const [status] = useQueryState("status", {
+ defaultValue: null,
+ parse: (value) => value as RiskStatus | null,
+ });
+ const [department] = useQueryState("department", {
+ defaultValue: null,
+ parse: (value) => value as Departments | null,
+ });
+ const [assigneeId] = useQueryState("assigneeId", {
+ defaultValue: null,
+ parse: (value) => value,
+ });
- const [_, setCreateRiskSheet] = useQueryState("create-risk-sheet");
+ const [_, setCreateRiskSheet] = useQueryState("create-risk-sheet");
- const createRisk = useAction(createRiskAction, {
- onSuccess: async () => {
- toast.success(t("risk.form.create_risk_success"));
- setCreateRiskSheet(null);
- },
- onError: () => {
- toast.error(t("risk.form.create_risk_error"));
- },
- });
+ const createRisk = useAction(createRiskAction, {
+ onSuccess: async () => {
+ toast.success(t("risk.form.create_risk_success"));
+ setCreateRiskSheet(null);
+ },
+ onError: () => {
+ toast.error(t("risk.form.create_risk_error"));
+ },
+ });
- const form = useForm>({
- resolver: zodResolver(createRiskSchema),
- defaultValues: {
- title: "",
- description: "",
- category: RiskCategory.operations,
- department: Departments.admin,
- assigneeId: null,
- },
- });
+ const form = useForm>({
+ resolver: zodResolver(createRiskSchema),
+ defaultValues: {
+ title: "",
+ description: "",
+ category: RiskCategory.operations,
+ department: Departments.admin,
+ assigneeId: null,
+ },
+ });
- const onSubmit = (data: z.infer) => {
- createRisk.execute(data);
- };
+ const onSubmit = (data: z.infer) => {
+ createRisk.execute(data);
+ };
- return (
-
+
+ );
}
diff --git a/apps/app/src/components/forms/risks/risk-overview.tsx b/apps/app/src/components/forms/risks/risk-overview.tsx
index 22df4d0d7f..d0f2bc3302 100644
--- a/apps/app/src/components/forms/risks/risk-overview.tsx
+++ b/apps/app/src/components/forms/risks/risk-overview.tsx
@@ -2,33 +2,32 @@
import { updateRiskAction } from "@/actions/risk/update-risk-action";
import { updateRiskSchema } from "@/actions/schema";
-import { SelectAssignee } from "@/app/[locale]/(app)/(dashboard)/[orgId]/components/SelectAssignee";
-import { SelectUser } from "@/components/select-user";
+import { SelectAssignee } from "@/components/SelectAssignee";
import { STATUS_TYPES, Status, type StatusType } from "@/components/status";
import { useI18n } from "@/locales/client";
import {
- Departments,
- Member,
- type Risk,
- RiskCategory,
- RiskStatus,
- type User,
+ Departments,
+ Member,
+ type Risk,
+ RiskCategory,
+ RiskStatus,
+ type User,
} from "@comp/db/types";
import { Button } from "@comp/ui/button";
import {
- Form,
- FormControl,
- FormField,
- FormItem,
- FormLabel,
- FormMessage,
+ Form,
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
} from "@comp/ui/form";
import {
- Select,
- SelectContent,
- SelectItem,
- SelectTrigger,
- SelectValue,
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
} from "@comp/ui/select";
import { zodResolver } from "@hookform/resolvers/zod";
import { Loader2 } from "lucide-react";
@@ -39,192 +38,192 @@ import { toast } from "sonner";
import type { z } from "zod";
export function UpdateRiskOverview({
- risk,
- assignees,
+ risk,
+ assignees,
}: {
- risk: Risk;
- assignees: (Member & { user: User })[];
+ risk: Risk;
+ assignees: (Member & { user: User })[];
}) {
- const t = useI18n();
+ const t = useI18n();
- const updateRisk = useAction(updateRiskAction, {
- onSuccess: () => {
- toast.success(t("risk.form.update_risk_success"));
- },
- onError: () => {
- toast.error(t("risk.form.update_risk_error"));
- },
- });
+ const updateRisk = useAction(updateRiskAction, {
+ onSuccess: () => {
+ toast.success(t("risk.form.update_risk_success"));
+ },
+ onError: () => {
+ toast.error(t("risk.form.update_risk_error"));
+ },
+ });
- const form = useForm>({
- resolver: zodResolver(updateRiskSchema),
- defaultValues: {
- id: risk.id,
- title: risk.title ?? "",
- description: risk.description ?? "",
- assigneeId: risk.assigneeId ?? null,
- category: risk.category ?? RiskCategory.operations,
- department: risk.department ?? Departments.admin,
- status: risk.status ?? RiskStatus.open,
- },
- });
+ const form = useForm>({
+ resolver: zodResolver(updateRiskSchema),
+ defaultValues: {
+ id: risk.id,
+ title: risk.title ?? "",
+ description: risk.description ?? "",
+ assigneeId: risk.assigneeId ?? null,
+ category: risk.category ?? RiskCategory.operations,
+ department: risk.department ?? Departments.admin,
+ status: risk.status ?? RiskStatus.open,
+ },
+ });
- const onSubmit = (data: z.infer) => {
- updateRisk.execute({
- id: data.id,
- title: data.title,
- description: data.description,
- assigneeId: data.assigneeId,
- category: data.category,
- department: data.department,
- status: data.status,
- });
- };
+ const onSubmit = (data: z.infer) => {
+ updateRisk.execute({
+ id: data.id,
+ title: data.title,
+ description: data.description,
+ assigneeId: data.assigneeId,
+ category: data.category,
+ department: data.department,
+ status: data.status,
+ });
+ };
- console.log(form.formState.defaultValues);
+ console.log(form.formState.defaultValues);
- return (
-
+
+ );
}
diff --git a/packages/ui/src/components/card.tsx b/packages/ui/src/components/card.tsx
index f16f6d2e24..c9c755d9db 100644
--- a/packages/ui/src/components/card.tsx
+++ b/packages/ui/src/components/card.tsx
@@ -66,7 +66,7 @@ const CardFooter = React.forwardRef<
>(({ className, ...props }, ref) => (
));