🌐(frontend) remove hardcoded DINUM-specific URLs from support forms

Replace instance-specific URLs with configurable values to make the application more generic and reusable for other deployments.
2025-06-02 22:16:24 +02:00
parent ba286724f3
commit c82168b6c0
12 changed files with 64 additions and 41 deletions
--- a/src/backend/meet/settings.py
+++ b/src/backend/meet/settings.py
@@ -330,6 +330,9 @@ class Base(Configuration):
        "use_proconnect_button": values.BooleanValue(
            False, environ_name="FRONTEND_USE_PROCONNECT_BUTTON", environ_prefix=None
        ),
+        "transcript": values.DictValue(
+            {}, environ_name="FRONTEND_TRANSCRIPT", environ_prefix=None
+        ),
    }

    # Mail
--- a/src/frontend/src/api/useConfig.ts
+++ b/src/frontend/src/api/useConfig.ts
@@ -10,10 +10,16 @@ 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_url?: string
--- a/src/frontend/src/features/home/components/IntroSlider.tsx
+++ b/src/frontend/src/features/home/components/IntroSlider.tsx
@@ -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'}
--- a/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx
+++ b/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx
@@ -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}
--- a/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx
+++ b/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx
@@ -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}
--- a/src/frontend/src/features/rooms/livekit/components/Tools.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/Tools.tsx
@@ -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
--- a/src/frontend/src/locales/de/rooms.json
+++ b/src/frontend/src/locales/de/rooms.json
@@ -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": {
--- a/src/frontend/src/locales/en/rooms.json
+++ b/src/frontend/src/locales/en/rooms.json
@@ -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": {
--- a/src/frontend/src/locales/fr/rooms.json
+++ b/src/frontend/src/locales/fr/rooms.json
@@ -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": {
--- a/src/frontend/src/locales/nl/rooms.json
+++ b/src/frontend/src/locales/nl/rooms.json
@@ -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": {
--- a/src/frontend/src/utils/constants.ts
+++ b/src/frontend/src/utils/constants.ts
@@ -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
--- a/src/helm/env.d/dev-keycloak/values.meet.yaml.gotmpl
+++ b/src/helm/env.d/dev-keycloak/values.meet.yaml.gotmpl
@@ -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