diff --git a/app/(dashboard)/dashboard/_components/ParticipantsTable/ParticipantsTable.tsx b/app/(dashboard)/dashboard/_components/ParticipantsTable/ParticipantsTable.tsx index c85b554a..4edf398f 100644 --- a/app/(dashboard)/dashboard/_components/ParticipantsTable/ParticipantsTable.tsx +++ b/app/(dashboard)/dashboard/_components/ParticipantsTable/ParticipantsTable.tsx @@ -10,7 +10,7 @@ import { DeleteAllParticipantsButton } from '~/app/(dashboard)/dashboard/partici import AddParticipantButton from '~/app/(dashboard)/dashboard/participants/_components/AddParticipantButton'; import { useState } from 'react'; import { DeleteParticipantsDialog } from '~/app/(dashboard)/dashboard/participants/_components/DeleteParticipantsDialog'; - +import { ExportParticipantUrlSection } from '~/app/(dashboard)/dashboard/participants/_components/ExportParticipantUrlSection'; export const ParticipantsTable = ({ initialData, }: { @@ -43,6 +43,7 @@ export const ParticipantsTable = ({ + {isLoading &&
Loading...
} { + const { data: protocolData, isLoading: isLoadingProtocols } = + api.protocol.get.all.useQuery(); + const [protocols, setProtocols] = useState([]); + const [participants, setParticipants] = useState([]); + + const [selectedProtocol, setSelectedProtocol] = useState(); + + const { data: participantData, isLoading: isLoadingParticipants } = + api.participant.get.all.useQuery(); + + useEffect(() => { + if (protocolData) { + setProtocols(protocolData); + } + }, [protocolData]); + + useEffect(() => { + if (participantData) { + setParticipants(participantData); + } + }, [participantData]); + + return ( +
+

Generate Participation URLs

+

+ Generate a CSV of participation URLs for all participants by protocol. + These URLs can be shared with participants to allow them to participate + in your study. +

+
+ {/* Protocol selection */} + + + +
+
+ ); +};