You are connected as: {authenticatedUser.email}
- -+ + Back to homescreen + +
++ + Back to homescreen + +
++ Meet +
+Loading…
++ + Back to homescreen + +
++ {children} +
+ ) +} diff --git a/src/frontend/src/queries/keys.ts b/src/frontend/src/queries/keys.ts new file mode 100644 index 00000000..21bb39de --- /dev/null +++ b/src/frontend/src/queries/keys.ts @@ -0,0 +1,4 @@ +export const keys = { + user: 'user', + room: 'room', +} diff --git a/src/frontend/src/queries/useUser.tsx b/src/frontend/src/queries/useUser.tsx new file mode 100644 index 00000000..8262e06e --- /dev/null +++ b/src/frontend/src/queries/useUser.tsx @@ -0,0 +1,30 @@ +import { useQuery } from '@tanstack/react-query' +import { keys } from './keys' +import { fetchUser } from '@/api/fetchUser' + +export const useUser = () => { + const query = useQuery({ + queryKey: [keys.user], + queryFn: fetchUser, + refetchOnMount: false, + refetchOnWindowFocus: false, + refetchOnReconnect: false, + retryOnMount: false, + retry: (_, error) => { + return error.statusCode !== 401 + }, + }) + + let isLoggedIn + if (query.status === 'success' && query.data?.email !== null) { + isLoggedIn = true + } + if (query.status === 'error' && query.failureReason?.statusCode === 401) { + isLoggedIn = false + } + return { + ...query, + user: query.data, + isLoggedIn, + } +} diff --git a/src/frontend/src/routes/Conference.tsx b/src/frontend/src/routes/Conference.tsx new file mode 100644 index 00000000..4facd50f --- /dev/null +++ b/src/frontend/src/routes/Conference.tsx @@ -0,0 +1,81 @@ +import { fetchRoom } from '@/api/fetchRoom' +import { BoxScreen } from '@/layout/BoxScreen' +import { ErrorScreen } from '@/layout/ErrorScreen' +import { ForbiddenScreen } from '@/layout/ForbiddenScreen' +import { LoadingScreen } from '@/layout/LoadingScreen' +import { Screen } from '@/layout/Screen' +import { A } from '@/primitives/A' +import { H1 } from '@/primitives/H' +import { keys } from '@/queries/keys' +import { + LiveKitRoom, + VideoConference, + PreJoin, + LocalUserChoices, +} from '@livekit/components-react' +import { useQuery } from '@tanstack/react-query' +import { useState } from 'react' +import { Link, useLocation, useParams } from 'wouter' + +export const Conference = () => { + const { roomId } = useParams() + const [, navigate] = useLocation() + const { status, data } = useQuery({ + queryKey: [keys.room, roomId], + queryFn: ({ queryKey }) => fetchRoom(queryKey[1] as string), + }) + + const [userConfig, setUserConfig] = useState+ + Back to homescreen + +
+What do you want to do? You can either:
+ ++ + Login to create a conference call + +
+ ++ Or copy a URL in your + browser address bar to join an existing conference call +
+ + )} +Page not found
+