diff --git a/src/frontend/src/features/rooms/livekit/components/Info.tsx b/src/frontend/src/features/rooms/livekit/components/Info.tsx
index c4c13690..4501593a 100644
--- a/src/frontend/src/features/rooms/livekit/components/Info.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/Info.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from 'react-i18next'
-import { useEffect, useState } from 'react'
+import { useEffect, useMemo, useState } from 'react'
import { VStack } from '@/styled-system/jsx'
import { css } from '@/styled-system/css'
import { RiCheckLine, RiFileCopyLine } from '@remixicon/react'
@@ -26,6 +26,29 @@ export const Info = () => {
const telephony = useTelephony()
+ const isTelephonyReadyForUse = useMemo(() => {
+ return telephony?.enabled && data?.pin_code
+ }, [telephony?.enabled, data?.pin_code])
+
+ const clipboardContent = useMemo(() => {
+ if (isTelephonyReadyForUse) {
+ return [
+ t('roomInformation.clipboard.url', { roomUrl }),
+ t('roomInformation.clipboard.numberAndPin', {
+ phoneNumber: telephony?.internationalPhoneNumber,
+ pinCode: formatPinCode(data?.pin_code),
+ }),
+ ].join('\n')
+ }
+ return roomUrl
+ }, [
+ isTelephonyReadyForUse,
+ roomUrl,
+ telephony?.internationalPhoneNumber,
+ data?.pin_code,
+ t,
+ ])
+
return (
{
{roomUrl}
- {telephony?.enabled && data?.pin_code && (
+ {isTelephonyReadyForUse && (
<>
{t('roomInformation.phone.call')} (
@@ -73,7 +96,7 @@ export const Info = () => {
variant={isCopied ? 'success' : 'tertiaryText'}
aria-label={t('roomInformation.button.ariaLabel')}
onPress={() => {
- navigator.clipboard.writeText(roomUrl)
+ navigator.clipboard.writeText(clipboardContent)
setIsCopied(true)
}}
data-attr="copy-info-sidepannel"
diff --git a/src/frontend/src/locales/de/rooms.json b/src/frontend/src/locales/de/rooms.json
index 4db7930d..bebb687c 100644
--- a/src/frontend/src/locales/de/rooms.json
+++ b/src/frontend/src/locales/de/rooms.json
@@ -233,6 +233,10 @@
"phone": {
"call": "Rufen Sie an:",
"pinCode": "Code:"
+ },
+ "clipboard": {
+ "url": "Um an der Videokonferenz teilzunehmen, klicken Sie auf diesen Link: {{roomUrl}}",
+ "numberAndPin": "Um telefonisch teilzunehmen, wählen Sie {{phoneNumber}} und geben Sie diesen Code ein: {{pinCode}}"
}
}
},
diff --git a/src/frontend/src/locales/en/rooms.json b/src/frontend/src/locales/en/rooms.json
index 1b5c4c3e..9cc87c4e 100644
--- a/src/frontend/src/locales/en/rooms.json
+++ b/src/frontend/src/locales/en/rooms.json
@@ -233,6 +233,10 @@
"phone": {
"call": "Call:",
"pinCode": "Code:"
+ },
+ "clipboard": {
+ "url": "To join the video conference, click on this link: {{roomUrl}}",
+ "numberAndPin": "To join by phone, dial {{phoneNumber}} and enter this code: {{pinCode}}"
}
}
},
diff --git a/src/frontend/src/locales/fr/rooms.json b/src/frontend/src/locales/fr/rooms.json
index a3d5a077..8eb5bfea 100644
--- a/src/frontend/src/locales/fr/rooms.json
+++ b/src/frontend/src/locales/fr/rooms.json
@@ -233,6 +233,10 @@
"phone": {
"call": "Appelez le :",
"pinCode": "Code :"
+ },
+ "clipboard": {
+ "url": "Pour participer à la visioconférence, cliquez sur ce lien : {{roomUrl}}",
+ "numberAndPin": "Pour participer par téléphone, composez le {{phoneNumber}} et saisissez ce code : {{pinCode}}"
}
}
},
diff --git a/src/frontend/src/locales/nl/rooms.json b/src/frontend/src/locales/nl/rooms.json
index 56d9bc0a..3ed64b8a 100644
--- a/src/frontend/src/locales/nl/rooms.json
+++ b/src/frontend/src/locales/nl/rooms.json
@@ -233,6 +233,10 @@
"phone": {
"call": "Bel:",
"pinCode": "Code:"
+ },
+ "clipboard": {
+ "url": "Klik op deze link om deel te nemen aan de videoconferentie: {{roomUrl}}",
+ "numberAndPin": "Bel {{phoneNumber}} en voer deze code in om telefonisch deel te nemen: {{pinCode}}"
}
}
},