diff --git a/src/frontend/src/components/ErrorScreen.tsx b/src/frontend/src/components/ErrorScreen.tsx index e33d89f9..2e349ed6 100644 --- a/src/frontend/src/components/ErrorScreen.tsx +++ b/src/frontend/src/components/ErrorScreen.tsx @@ -1,12 +1,25 @@ import { CenteredContent } from '@/layout/CenteredContent' import { Screen } from '@/layout/Screen' import { useTranslation } from 'react-i18next' +import { Center } from '@/styled-system/jsx' +import { Text } from '@/primitives' -export const ErrorScreen = () => { +export const ErrorScreen = ({ title, body }: { + title?: string + body?: string +}) => { const { t } = useTranslation() return ( - + + {!!body && ( +
+ + {body} + +
+ )} +
) } diff --git a/src/frontend/src/features/rooms/components/Conference.tsx b/src/frontend/src/features/rooms/components/Conference.tsx index 45eddf37..86fa1a96 100644 --- a/src/frontend/src/features/rooms/components/Conference.tsx +++ b/src/frontend/src/features/rooms/components/Conference.tsx @@ -1,5 +1,6 @@ import { useEffect, useMemo, useState } from 'react' import { useQuery } from '@tanstack/react-query' +import { useTranslation } from 'react-i18next' import { formatChatMessageLinks, LiveKitRoom, @@ -12,6 +13,7 @@ import { queryClient } from '@/api/queryClient' import { navigateTo } from '@/navigation/navigateTo' import { Screen } from '@/layout/Screen' import { QueryAware } from '@/components/QueryAware' +import { ErrorScreen } from '@/components/ErrorScreen' import { fetchRoom } from '../api/fetchRoom' import { ApiRoom } from '../api/ApiRoom' import { useCreateRoom } from '../api/createRoom' @@ -30,7 +32,7 @@ export const Conference = ({ }) => { const fetchKey = [keys.room, roomId, userConfig.username] - const { mutateAsync: createRoom, status: createStatus} = useCreateRoom({ + const { mutateAsync: createRoom, status: createStatus, isError: isCreateError} = useCreateRoom({ onSuccess: (data) => { queryClient.setQueryData(fetchKey, data) }, @@ -87,6 +89,12 @@ export const Conference = ({ } }, []) + const { t } = useTranslation('rooms') + if (isCreateError) { + // this error screen should be replaced by a proper waiting room for anonymous user. + return + } + return ( diff --git a/src/frontend/src/locales/de/rooms.json b/src/frontend/src/locales/de/rooms.json index 827035f3..6eeaeca4 100644 --- a/src/frontend/src/locales/de/rooms.json +++ b/src/frontend/src/locales/de/rooms.json @@ -16,5 +16,11 @@ "copy": "", "heading": "", "inputLabel": "" + }, + "error": { + "createRoom": { + "heading": "", + "body": "" + } } } diff --git a/src/frontend/src/locales/en/rooms.json b/src/frontend/src/locales/en/rooms.json index 00f3d6fe..b0dfccf1 100644 --- a/src/frontend/src/locales/en/rooms.json +++ b/src/frontend/src/locales/en/rooms.json @@ -16,5 +16,11 @@ "copy": "Copy", "heading": "Share the meeting link", "inputLabel": "Meeting link" + }, + "error": { + "createRoom": { + "heading": "Authentication Required", + "body": "This room has not been created yet. Please authenticate to create it or wait for an authenticated user to do so." + } } } diff --git a/src/frontend/src/locales/fr/rooms.json b/src/frontend/src/locales/fr/rooms.json index 524a57f2..dd0c94ed 100644 --- a/src/frontend/src/locales/fr/rooms.json +++ b/src/frontend/src/locales/fr/rooms.json @@ -16,5 +16,11 @@ "copy": "Copier le lien", "heading": "Partager le lien vers la réunion", "inputLabel": "Lien vers la réunion" + }, + "error": { + "createRoom": { + "heading": "Authentification requise", + "body": "Cette réunion n'a pas encore été créée. Veuillez vous authentifier pour la créer ou attendre qu'un utilisateur authentifié le fasse." + } } }