(frontend) display recording expiration status in frontend

Add recording expiration information to frontend interface, showing number
of days until expiration or indicating permanent status. For expired
recordings, display the date since which content has been unavailable.
Improves transparency about content lifecycle.
This commit is contained in:
lebaudantoine
2025-04-23 17:28:39 +02:00
parent 34c14cc516
commit 3636bfa703
7 changed files with 49 additions and 3 deletions

View File

@@ -16,6 +16,7 @@ export interface ApiConfig {
recording?: { recording?: {
is_enabled?: boolean is_enabled?: boolean
available_modes?: RecordingMode[] available_modes?: RecordingMode[]
expiration_days?: number
} }
} }

View File

@@ -9,6 +9,8 @@ export type RecordingApi = {
key: string key: string
mode: RecordingMode mode: RecordingMode
status: RecordingStatus status: RecordingStatus
is_expired: boolean
expired_at: string
} }
export const fetchRecording = ({ recordingId }: { recordingId?: string }) => { export const fetchRecording = ({ recordingId }: { recordingId?: string }) => {

View File

@@ -13,9 +13,11 @@ import { ErrorScreen } from '@/components/ErrorScreen'
import { LoadingScreen } from '@/components/LoadingScreen' import { LoadingScreen } from '@/components/LoadingScreen'
import { fetchRecording } from '../api/fetchRecording' import { fetchRecording } from '../api/fetchRecording'
import { RecordingStatus } from '@/features/recording' import { RecordingStatus } from '@/features/recording'
import { useConfig } from '@/api/useConfig'
export const RecordingDownload = () => { export const RecordingDownload = () => {
const { t } = useTranslation('recording') const { t } = useTranslation('recording')
const { data: configData } = useConfig()
const { recordingId } = useParams() const { recordingId } = useParams()
const { isLoggedIn, isLoading: isAuthLoading } = useUser() const { isLoggedIn, isLoading: isAuthLoading } = useUser()
@@ -50,6 +52,17 @@ export const RecordingDownload = () => {
return <ErrorScreen title={t('unsaved.title')} body={t('unsaved.body')} /> return <ErrorScreen title={t('unsaved.title')} body={t('unsaved.body')} />
} }
if (data.is_expired) {
return (
<ErrorScreen
title={t('expired.title')}
body={t('expired.body', {
date: formatDate(data?.expired_at, 'YYYY-MM-DD HH:mm'),
})}
/>
)
}
return ( return (
<UserAware> <UserAware>
<Screen layout="centered" footer={false}> <Screen layout="centered" footer={false}>
@@ -74,6 +87,16 @@ export const RecordingDownload = () => {
}), }),
}} }}
/> />
<span>
{configData?.recording?.expiration_days && (
<>
{' '}
{t('success.expiration', {
expiration_days: configData?.recording?.expiration_days,
})}
</>
)}
</span>
</Text> </Text>
<LinkButton <LinkButton
href={mediaUrl(data.key)} href={mediaUrl(data.key)}

View File

@@ -3,6 +3,10 @@
"title": "", "title": "",
"body": "" "body": ""
}, },
"expired": {
"title": "",
"body": ""
},
"authentication": { "authentication": {
"title": "", "title": "",
"body": "" "body": ""
@@ -14,6 +18,7 @@
"success": { "success": {
"title": "", "title": "",
"body": "", "body": "",
"expiration": "",
"button": "" "button": ""
} }
} }

View File

@@ -1,7 +1,11 @@
{ {
"error": { "error": {
"title": "Recording unavailable", "title": "Recording unavailable",
"body": "This recording could not be found or was deleted after its 7-day validity period." "body": "This recording could not be found or was deleted."
},
"expired": {
"title": "Recording expired",
"body": "This recording was deleted on {{date}}."
}, },
"authentication": { "authentication": {
"title": "Authentication required", "title": "Authentication required",
@@ -14,6 +18,7 @@
"success": { "success": {
"title": "Your recording is ready!", "title": "Your recording is ready!",
"body": "Recording of the meeting <b>{{room}}</b> from {{created_at}}.", "body": "Recording of the meeting <b>{{room}}</b> from {{created_at}}.",
"expiration": "Attention, this recording will expire after {{expiration_days}} day(s).",
"button": "Download" "button": "Download"
} }
} }

View File

@@ -1,7 +1,11 @@
{ {
"error": { "error": {
"title": "Enregistrement indisponible", "title": "Enregistrement indisponible",
"body": "Cet enregistrement est introuvable ou a été supprimé après sa période de validité de 7 jours." "body": "Cet enregistrement est introuvable ou a été supprimé."
},
"expired": {
"title": "Enregistrement expiré",
"body": "Cet enregistrement a été supprimé le {{date}}."
}, },
"authentication": { "authentication": {
"title": "Authentification requise", "title": "Authentification requise",
@@ -14,6 +18,7 @@
"success": { "success": {
"title": "Votre enregistrement est prêt !", "title": "Votre enregistrement est prêt !",
"body": "Enregistrement de la réunion <b>{{room}}</b> du {{created_at}}.", "body": "Enregistrement de la réunion <b>{{room}}</b> du {{created_at}}.",
"expiration": "Attention cet enregistrement expirera au bout de {{expiration_days}} jour(s).",
"button": "Télécharger" "button": "Télécharger"
} }
} }

View File

@@ -1,7 +1,11 @@
{ {
"error": { "error": {
"title": "Opname niet beschikbaar", "title": "Opname niet beschikbaar",
"body": "Deze opname is niet gevonden of is verwijderd na de geldigheidsperiode van 7 dagen." "body": "Deze opname is niet gevonden of is verwijderd."
},
"expired": {
"title": "Opname verlopen",
"body": "Deze opname is verwijderd op {{date}}."
}, },
"authentication": { "authentication": {
"title": "Authenticatie vereist", "title": "Authenticatie vereist",
@@ -14,6 +18,7 @@
"success": { "success": {
"title": "Je opname is klaar!", "title": "Je opname is klaar!",
"body": "Opname van de vergadering <b>{{room}}</b> op {{created_at}}.", "body": "Opname van de vergadering <b>{{room}}</b> op {{created_at}}.",
"expiration": "Let op, deze opname verloopt na {{expiration_days}} dag(en).",
"button": "Downloaden" "button": "Downloaden"
} }
} }