Compare commits

...

3 Commits

Author SHA1 Message Date
lebaudantoine f6c9ca9214 wip extract hardcoded version of visio.numerique.gouv.fr 2025-06-03 15:22:08 +02:00
lebaudantoine c91fac7bdd wip extract hardcoded URL 2025-06-03 15:22:08 +02:00
Emmanuel Pelletier ca98507642 add a way to load a custom css file to ease up UI customization 2025-06-02 16:45:39 +02:00
16 changed files with 80 additions and 44 deletions
+1
View File
@@ -42,6 +42,7 @@ def get_frontend_configuration(request):
"available_modes": settings.RECORDING_WORKER_CLASSES.keys(),
"expiration_days": settings.RECORDING_EXPIRATION_DAYS,
},
"custom_css": "/custom.css",
}
frontend_configuration.update(settings.FRONTEND_CONFIGURATION)
return Response(frontend_configuration)
+3
View File
@@ -319,6 +319,9 @@ class Base(Configuration):
"feedback": values.DictValue(
{}, environ_name="FRONTEND_FEEDBACK", environ_prefix=None
),
"transcript": values.DictValue(
{}, environ_name="FRONTEND_TRANSCRIPT", environ_prefix=None
)
}
# Mail
+7
View File
@@ -10,12 +10,19 @@ export interface ApiConfig {
}
support?: {
id: string
help_article_transcript: string
help_article_recording: string
help_article_more_tools: string
}
feedback: {
url: string
}
transcript: {
form_beta_users: string
}
silence_livekit_debug_logs?: boolean
is_silent_login_enabled?: boolean
custom_css?: string
recording?: {
is_enabled?: boolean
available_modes?: RecordingMode[]
@@ -3,6 +3,7 @@ import { useConfig } from '@/api/useConfig'
import { useAnalytics } from '@/features/analytics/hooks/useAnalytics'
import { useSupport } from '@/features/support/hooks/useSupport'
import { useSyncUserPreferencesWithBackend } from '@/features/auth'
import { useEffect } from 'react'
export const AppInitialization = () => {
const { data } = useConfig()
@@ -12,11 +13,22 @@ export const AppInitialization = () => {
analytics = {},
support = {},
silence_livekit_debug_logs = false,
custom_css = '',
} = data || {}
useAnalytics(analytics)
useSupport(support)
useEffect(() => {
if (custom_css) {
const link = document.createElement('link')
link.href = custom_css
link.id = 'visio-custom-css'
link.rel = 'stylesheet'
document.head.appendChild(link)
}
}, [custom_css])
silenceLiveKitLogs(silence_livekit_debug_logs)
return null
@@ -10,8 +10,7 @@ export const NotFoundScreen = () => {
<Screen layout="centered">
<CenteredContent title={t('notFound.heading')} withBackButton>
<Text centered>
{t('notFound.body')}{' '}
<Bold>https://visio.numerique.gouv.fr/xxx-yyyy-zzz.</Bold>
{t('notFound.body')} <Bold>{window.origin}/xxx-yyyy-zzz.</Bold>
</Text>
</CenteredContent>
</Screen>
@@ -8,7 +8,7 @@ import { Button, LinkButton } from '@/primitives'
import { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import { BETA_USERS_FORM_URL } from '@/utils/constants'
import { useConfig } from '@/api/useConfig'
const Heading = styled('h2', {
base: {
@@ -171,6 +171,8 @@ export const IntroSlider = () => {
const { t } = useTranslation('home', { keyPrefix: 'introSlider' })
const NUMBER_SLIDES = SLIDES.length
const { data } = useConfig()
return (
<Container>
<div
@@ -203,7 +205,7 @@ export const IntroSlider = () => {
<Body>{t(`${slide.key}.body`)}</Body>
{slide.isAvailableInBeta && (
<LinkButton
href={BETA_USERS_FORM_URL}
href={data?.transcript.form_beta_users}
target="_blank"
tooltip={t('beta.tooltip')}
variant={'primary'}
@@ -23,7 +23,7 @@ export const JoinMeetingDialog = () => {
name="roomId"
label={t('joinInputLabel')}
description={t('joinInputExample', {
example: 'https://visio.numerique.gouv.fr/azer-tyu-qsdf',
example: window.origin + '/azer-tyu-qsdf',
})}
validate={(value) => {
return !isRoomValid(value.trim()) ? (
@@ -14,7 +14,6 @@ import { useEffect, useMemo, useState } from 'react'
import { ConnectionState, RoomEvent } from 'livekit-client'
import { useTranslation } from 'react-i18next'
import { RecordingStatus, recordingStore } from '@/stores/recording'
import { CRISP_HELP_ARTICLE_RECORDING } from '@/utils/constants'
import {
NotificationType,
@@ -24,8 +23,10 @@ import {
import posthog from 'posthog-js'
import { useSnapshot } from 'valtio/index'
import { Spinner } from '@/primitives/Spinner'
import { useConfig } from '@/api/useConfig'
export const ScreenRecordingSidePanel = () => {
const { data } = useConfig()
const [isLoading, setIsLoading] = useState(false)
const recordingSnap = useSnapshot(recordingStore)
const { t } = useTranslation('rooms', { keyPrefix: 'screenRecording' })
@@ -199,9 +200,11 @@ export const ScreenRecordingSidePanel = () => {
})}
>
{t('start.body')} <br />{' '}
<A href={CRISP_HELP_ARTICLE_RECORDING} target="_blank">
{t('start.linkMore')}
</A>
{data?.support?.help_article_recording && (
<A href={data.support.help_article_recording} target="_blank">
{t('start.linkMore')}
</A>
)}
</Text>
<Button
isDisabled={isDisabled}
@@ -16,10 +16,6 @@ import { useEffect, useMemo, useState } from 'react'
import { ConnectionState, RoomEvent } from 'livekit-client'
import { useTranslation } from 'react-i18next'
import { RecordingStatus, recordingStore } from '@/stores/recording'
import {
BETA_USERS_FORM_URL,
CRISP_HELP_ARTICLE_TRANSCRIPT,
} from '@/utils/constants'
import { FeatureFlags } from '@/features/analytics/enums'
import {
NotificationType,
@@ -29,8 +25,11 @@ import {
import posthog from 'posthog-js'
import { useSnapshot } from 'valtio/index'
import { Spinner } from '@/primitives/Spinner'
import { useConfig } from '@/api/useConfig'
export const TranscriptSidePanel = () => {
const { data } = useConfig()
const [isLoading, setIsLoading] = useState(false)
const { t } = useTranslation('rooms', { keyPrefix: 'transcript' })
@@ -161,9 +160,14 @@ export const TranscriptSidePanel = () => {
>
{t('notAdminOrOwner.body')}
<br />
<A href={CRISP_HELP_ARTICLE_TRANSCRIPT} target="_blank">
{t('notAdminOrOwner.linkMore')}
</A>
{data?.support?.help_article_transcript && (
<A
href={data.support.help_article_transcript}
target="_blank"
>
{t('notAdminOrOwner.linkMore')}
</A>
)}
</Text>
</>
) : (
@@ -180,14 +184,19 @@ export const TranscriptSidePanel = () => {
})}
>
{t('beta.body')}{' '}
<A href={CRISP_HELP_ARTICLE_TRANSCRIPT} target="_blank">
{t('start.linkMore')}
</A>
{data?.support?.help_article_transcript && (
<A
href={data.support.help_article_transcript}
target="_blank"
>
{t('start.linkMore')}
</A>
)}
</Text>
<LinkButton
size="sm"
variant="tertiary"
href={BETA_USERS_FORM_URL}
href={data?.transcript.form_beta_users}
target="_blank"
>
{t('beta.button')}
@@ -263,9 +272,14 @@ export const TranscriptSidePanel = () => {
})}
>
{t('start.body')} <br />{' '}
<A href={CRISP_HELP_ARTICLE_TRANSCRIPT} target="_blank">
{t('start.linkMore')}
</A>
{data?.support?.help_article_transcript && (
<A
href={data.support.help_article_transcript}
target="_blank"
>
{t('start.linkMore')}
</A>
)}
</Text>
<Button
isDisabled={isDisabled}
@@ -2,7 +2,6 @@ import { A, Div, Text } from '@/primitives'
import { css } from '@/styled-system/css'
import { Button as RACButton } from 'react-aria-components'
import { useTranslation } from 'react-i18next'
import { CRISP_HELP_ARTICLE_MORE_TOOLS } from '@/utils/constants'
import { ReactNode } from 'react'
import { RiFileTextFill, RiLiveFill } from '@remixicon/react'
import { SubPanelId, useSidePanel } from '../hooks/useSidePanel'
@@ -15,6 +14,7 @@ import {
useIsRecordingActive,
} from '@/features/recording'
import { FeatureFlags } from '@/features/analytics/enums'
import { useConfig } from '@/api/useConfig'
export interface ToolsButtonProps {
icon: ReactNode
@@ -113,6 +113,7 @@ const ToolButton = ({
}
export const Tools = () => {
const { data } = useConfig()
const { openTranscript, openScreenRecording, activeSubPanelId } =
useSidePanel()
const { t } = useTranslation('rooms', { keyPrefix: 'moreTools' })
@@ -160,10 +161,14 @@ export const Tools = () => {
margin="md"
>
{t('body')}{' '}
<A href={CRISP_HELP_ARTICLE_MORE_TOOLS} target="_blank">
{t('moreLink')}
</A>
.
{data?.support?.help_article_more_tools && (
<>
<A href={data?.support?.help_article_more_tools} target="_blank">
{t('moreLink')}
</A>
.
</>
)}
</Text>
{isTranscriptEnabled && (
<ToolButton
+1 -1
View File
@@ -192,7 +192,7 @@
"disclaimer": "Die Nachrichten sind nur für Teilnehmer zum Zeitpunkt des Sendens sichtbar. Alle Nachrichten werden am Ende des Anrufs gelöscht."
},
"moreTools": {
"body": "Greifen Sie auf weitere Tools in Visio zu, um Ihre Meetings zu verbessern,",
"body": "Greifen Sie auf weitere Tools in Visio zu, um Ihre Meetings zu verbessern.",
"moreLink": "mehr erfahren",
"tools": {
"transcript": {
+1 -1
View File
@@ -192,7 +192,7 @@
"disclaimer": "The messages are visible to participants only at the time they are sent. All messages are deleted at the end of the call."
},
"moreTools": {
"body": "Access more tools in Visio to enhance your meetings,",
"body": "Access more tools in Visio to enhance your meetings.",
"moreLink": "learn more",
"tools": {
"transcript": {
+1 -1
View File
@@ -192,7 +192,7 @@
"disclaimer": "Les messages sont visibles par les participants uniquement au moment de\nleur envoi. Tous les messages sont supprimés à la fin de l'appel."
},
"moreTools": {
"body": "Accèder à d'avantage d'outils dans Visio pour améliorer vos réunions,",
"body": "Accèder à d'avantage d'outils dans Visio pour améliorer vos réunions.",
"moreLink": "en savoir plus",
"tools": {
"transcript": {
+1 -1
View File
@@ -192,7 +192,7 @@
"disclaimer": "De berichten zijn alleen voor de deelnemers zichtbaar op het moment dat ze worden verzonden. Alle berichten worden verwijderd aan het einde van het gesprek."
},
"moreTools": {
"body": "Toegang tot meer tools in Visio om je vergaderingen te verbeteren,",
"body": "Toegang tot meer tools in Visio om je vergaderingen te verbeteren.",
"moreLink": "lees meer",
"tools": {
"transcript": {
-11
View File
@@ -1,11 +0,0 @@
export const BETA_USERS_FORM_URL =
'https://grist.numerique.gouv.fr/o/docs/forms/3fFfvJoTBEQ6ZiMi8zsQwX/17' as const
export const CRISP_HELP_ARTICLE_MORE_TOOLS =
'https://lasuite.crisp.help/fr/article/visio-tools-bvxj23' as const
export const CRISP_HELP_ARTICLE_TRANSCRIPT =
'https://lasuite.crisp.help/fr/article/visio-transcript-1sjq43x' as const
export const CRISP_HELP_ARTICLE_RECORDING =
'https://lasuite.crisp.help/fr/article/visio-enregistrement-wgc8o0' as const
@@ -54,7 +54,8 @@ backend:
LIVEKIT_API_URL: https://livekit.127.0.0.1.nip.io/
ALLOW_UNREGISTERED_ROOMS: False
FRONTEND_SILENCE_LIVEKIT_DEBUG: False
FRONTEND_SUPPORT: "{'id': '58ea6697-8eba-4492-bc59-ad6562585041'}"
FRONTEND_SUPPORT: "{'id': '58ea6697-8eba-4492-bc59-ad6562585041', 'help_article_transcript': 'https://lasuite.crisp.help/fr/article/visio-transcript-1sjq43x', 'help_article_recording': 'https://lasuite.crisp.help/fr/article/visio-enregistrement-wgc8o0', 'help_article_more_tools': 'https://lasuite.crisp.help/fr/article/visio-tools-bvxj23'}"
FRONTEND_TRANSCRIPT: "{'form_beta_users': 'https://grist.numerique.gouv.fr/o/docs/forms/3fFfvJoTBEQ6ZiMi8zsQwX/17'}"
FRONTEND_FEEDBACK: "{'url': 'https://grist.numerique.gouv.fr/o/docs/cbMv4G7pLY3Z/USER-RESEARCH-or-LA-SUITE/f/26'}"
AWS_S3_ENDPOINT_URL: http://minio.meet.svc.cluster.local:9000
AWS_S3_ACCESS_KEY_ID: meet