diff --git a/app/assets/locales/en.json b/app/assets/locales/en.json index 802f8d24fd..fa76c8fdb0 100644 --- a/app/assets/locales/en.json +++ b/app/assets/locales/en.json @@ -185,6 +185,15 @@ "protected": "Protected", "public": "Public", "public_protected": "Public/Protected", + "formats_help": "Shows the available playback types (for example, Presentation or Video). Clicking a format opens the BigBlueButton recording in a new tab.", + "visibility_help": { + "title": "Recording visibility options", + "public_protected": "Public/Protected - The recording is available on the Public Recordings page that can be reached from the Room Join page. The link can only be viewed from within Greenlight", + "public": "Public - The recording is available on the Public Recordings page that can be reached from the Room Join page. The link can be shared with anyone", + "protected": "Protected - The recording must be viewed from within Greenlight", + "published": "Published - The recording is accessible to anyone with the link", + "unpublished": "Unpublished - The recording is not accessible to anyone" + }, "length_in_minutes": "{{recording.length}} min.", "processing_recording": "Processing recording, this may take several minutes...", "copy_recording_urls": "Copy Recording Url(s)", diff --git a/app/assets/locales/fr.json b/app/assets/locales/fr.json index b2a996448b..109e943223 100644 --- a/app/assets/locales/fr.json +++ b/app/assets/locales/fr.json @@ -180,11 +180,20 @@ "users": "Utilisateurs", "visibility": "État", "formats": "Lecture", + "formats_help": "Affiche les types de lecture disponibles (par exemple Présentation ou Vidéo). Cliquer sur un format ouvre l'enregistrement BigBlueButton dans un nouvel onglet.", "published": "Publiée", "unpublished": "Non publiée", "protected": "Protégé", "public": "Public", "public_protected": "Public/Protégé", + "visibility_help": { + "title": "Options de visibilité de l'enregistrement", + "public_protected": "Public/Protégé - L'enregistrement est disponible sur la page des enregistrements publics accessible depuis la page Rejoindre la salle. Le lien ne peut être consulté que depuis Greenlight", + "public": "Public - L'enregistrement est disponible sur la page des enregistrements publics accessible depuis la page Rejoindre la salle. Le lien peut être partagé avec n'importe qui", + "protected": "Protégé - L'enregistrement doit être consulté depuis Greenlight", + "published": "Publiée - L'enregistrement est accessible à toute personne disposant du lien", + "unpublished": "Non publiée - L'enregistrement n'est accessible à personne" + }, "length_in_minutes": "{{recording.length}} min.", "processing_recording": "L'enregistrement est en cours de traitement, cela peu prendre quelques minutes...", "copy_recording_urls": "Copier l'URL de l'enregistrement", diff --git a/app/javascript/components/recordings/RecordingsList.jsx b/app/javascript/components/recordings/RecordingsList.jsx index c43e08658c..e247080d37 100644 --- a/app/javascript/components/recordings/RecordingsList.jsx +++ b/app/javascript/components/recordings/RecordingsList.jsx @@ -19,7 +19,10 @@ import PropTypes from 'prop-types'; import { Badge, Card, Stack, Table, } from 'react-bootstrap'; +import OverlayTrigger from 'react-bootstrap/OverlayTrigger'; +import Tooltip from 'react-bootstrap/Tooltip'; import { useTranslation } from 'react-i18next'; +import { QuestionMarkCircleIcon } from '@heroicons/react/24/outline'; import SortBy from '../shared_components/search/SortBy'; import RecordingsListRowPlaceHolder from './RecordingsListRowPlaceHolder'; import NoSearchResults from '../shared_components/search/NoSearchResults'; @@ -33,6 +36,25 @@ export default function RecordingsList({ }) { const { t } = useTranslation(); + const visibilityTooltip = ( + +
{t('recording.visibility_help.title')}
+ +
+ ); + + const formatsTooltip = ( + + {t('recording.formats_help')} + + ); + if (!isLoading && recordings?.data?.length === 0 && !searchInput && recordingsProcessing === 0) { return ; } @@ -68,17 +90,44 @@ export default function RecordingsList({ {t('recording.name')} {t('recording.length')} {t('recording.users')} - {t('recording.visibility')} - {t('recording.formats')} + + + {t('recording.visibility')} + + + + + + + + + {t('recording.formats')} + + + + + { - (isLoading && [...Array(numPlaceholders)].map((val, idx) => ( + isLoading && Array.from({ length: numPlaceholders }).map((_, idx) => ( // eslint-disable-next-line react/no-array-index-key - ))) + )) } { (recordings?.data?.length > 0 && recordings?.data?.map((recording, idx) => (