diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.html b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.html index 26c4499f..715b2e31 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.html +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.html @@ -52,17 +52,16 @@ @if (isPanelOpened) {
- - @if (recordingList.length === 0) { + + @if (recordingList.length === 0 && recordingStatus === recStatusEnum.STOPPED) { +
- } - - @if (recordingList.length === 0 && recordingStatus === recStatusEnum.STOPPED) { +

{{ @@ -97,9 +96,17 @@ } - @if (recordingStatus === recStatusEnum.FAILED) { + @if (showStartStopRecordingButton && recordingStatus === recStatusEnum.FAILED && recordingError) {
- {{ recordingError }} + diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss index 6459900a..312d3d7e 100644 --- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss +++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss @@ -401,6 +401,46 @@ font-weight: 600; } + .recording-error { + display: flex; + align-items: flex-start; + gap: 12px; + background: rgba(244, 67, 54, 0.08); + border: 1px solid var(--ov-error-color); + border-radius: 8px; + padding: 12px 16px; + margin: 16px 0; + color: var(--ov-error-color); + font-size: 15px; + box-shadow: 0 2px 8px 0 rgba(244,67,54,0.04); + + .error-icon { + font-size: 28px; + color: var(--ov-error-color); + flex-shrink: 0; + margin-top: 2px; + width: 100%; + height: 100%; + } + + .error-content { + display: flex; + flex-direction: column; + gap: 2px; + } + + .error-title { + font-weight: 600; + font-size: 15px; + margin-bottom: 2px; + } + + .error-message { + font-size: 14px; + opacity: 0.85; + } + } + .disable-recording-btn { background-color: var(--ov-secondary-action-color) !important; color: var(--ov-text-surface-color) !important;