Implement permissions on participants page

This commit is contained in:
2024-11-20 23:35:44 -05:00
parent f90b6d54c0
commit 1715f6eeb8

View File

@@ -20,6 +20,7 @@ import {
SelectTrigger, SelectTrigger,
SelectValue SelectValue
} from "~/components/ui/select"; } from "~/components/ui/select";
import { usePermissions } from "~/hooks/usePermissions";
interface Study { interface Study {
id: number; id: number;
@@ -38,6 +39,7 @@ export default function Participants() {
const [selectedStudyId, setSelectedStudyId] = useState<number | null>(null); const [selectedStudyId, setSelectedStudyId] = useState<number | null>(null);
const [participantName, setParticipantName] = useState(""); const [participantName, setParticipantName] = useState("");
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const { hasPermission } = usePermissions();
useEffect(() => { useEffect(() => {
fetchStudies(); fetchStudies();
@@ -195,6 +197,7 @@ export default function Participants() {
Participant ID: {participant.id} Participant ID: {participant.id}
</CardDescription> </CardDescription>
</div> </div>
{hasPermission('DELETE_PARTICIPANT') && (
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
@@ -203,6 +206,7 @@ export default function Participants() {
> >
<Trash2Icon className="w-4 h-4" /> <Trash2Icon className="w-4 h-4" />
</Button> </Button>
)}
</div> </div>
</CardHeader> </CardHeader>
<CardFooter className="text-sm text-muted-foreground"> <CardFooter className="text-sm text-muted-foreground">