Availability based on permissions

frontend/components/shortcodes-table.tsx

@@ -19,8 +19,11 @@ import { MoreHorizontal } from "lucide-react";
 import type IShortcode from "@/interfaces/IShortcode";
 import ShortcodeDialog from "@/components/shortcode-dialogue";
 import { useState } from "react";
+import IUser from "@/interfaces/IUser";
+import hasPermissions from "@/lib/hasPermissions";
 
 interface ShortcodeTableProps {
+	user: IUser;
 	shortcodes: IShortcode[];
 	onUpdate: (shortcode: IShortcode) => void;
 	onDelete: (id: string) => void;
@@ -32,6 +35,7 @@ export function ShortcodeTable({
 	onUpdate,
 	onDelete,
 	onAdd,
+	user,
 }: ShortcodeTableProps) {
 	const [shortcodeSelected, setUpdateDialog] = useState<IShortcode | null>(
 		null,
@@ -39,20 +43,22 @@ export function ShortcodeTable({
 	const [addDialog, setAddDialog] = useState<boolean>(false);
 	return (
 		<div>
-			<div className="mb-4">
-				<Button
-					onClick={() => {
-						setAddDialog(true);
-					}}
-				>
-					Ajouter
-				</Button>
-				<ShortcodeDialog
-					onSave={onAdd}
-					open={addDialog}
-					setOpen={() => setAddDialog(false)}
-				/>
-			</div>
+			{hasPermissions(user.roles, { shortcodes: ["insert"] }) && (
+				<div className="mb-4">
+					<Button
+						onClick={() => {
+							setAddDialog(true);
+						}}
+					>
+						Ajouter
+					</Button>
+					<ShortcodeDialog
+						onSave={onAdd}
+						open={addDialog}
+						setOpen={() => setAddDialog(false)}
+					/>
+				</div>
+			)}
 			<div className="rounded-md border">
 				<Table>
 					<TableHeader>
@@ -91,20 +97,30 @@ export function ShortcodeTable({
 											</Button>
 										</DropdownMenuTrigger>
 										<DropdownMenuContent align="end">
-											<DropdownMenuItem
-												onClick={() =>
-													setUpdateDialog(shortcode)
-												}
-											>
-												Mettre à jour
-											</DropdownMenuItem>
-											<DropdownMenuItem
-												onClick={() =>
-													onDelete(shortcode.code)
-												}
-											>
-												Supprimer
-											</DropdownMenuItem>
+											{hasPermissions(user.roles, {
+												shortcodes: ["update"],
+											}) && (
+												<DropdownMenuItem
+													onClick={() =>
+														setUpdateDialog(
+															shortcode,
+														)
+													}
+												>
+													Mettre à jour
+												</DropdownMenuItem>
+											)}
+											{hasPermissions(user.roles, {
+												shortcodes: ["delete"],
+											}) && (
+												<DropdownMenuItem
+													onClick={() =>
+														onDelete(shortcode.code)
+													}
+												>
+													Supprimer
+												</DropdownMenuItem>
+											)}
 										</DropdownMenuContent>
 									</DropdownMenu>
 								</TableCell>