Add user role check for action column

Author: rickkoh

frontend/src/app/dashboard/_components/QuestionTable/data-table.tsx

@@ -21,14 +21,15 @@ import {
   TableRow,
 } from "@/components/ui/table";
 
-import { useState } from "react";
+import { useMemo, useState } from "react";
 
 import { DataTablePagination } from "./data-table-pagination";
 
 import DataTableToolbar from "./data-table-toolbar";
 
 import { Card } from "@/components/ui/card";
 import { QuestionTableProvider } from "@/contexts/QuestionTableContext";
+import { useUser } from "@/contexts/UserContext";
 
 interface DataTableProps<TData, TValue> {
   columns: ColumnDef<TData, TValue>[];
@@ -40,12 +41,22 @@ export function DataTable<TData, TValue>({
   columns,
   data,
 }: DataTableProps<TData, TValue>) {
+  const user = useUser();
+
+  const isAdmin = useMemo(() => {
+    return user?.roles.includes("admin");
+  }, [user]);
+
+  const filteredColumns = isAdmin
+    ? columns
+    : columns.filter((column) => column.id !== "Action");
+
   const [sorting, setSorting] = useState<SortingState>([]);
   const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([]);
 
   const table = useReactTable({
     data,
-    columns,
+    columns: filteredColumns,
     getCoreRowModel: getCoreRowModel(),
     getPaginationRowModel: getPaginationRowModel(),
     onSortingChange: setSorting,