Skip to content
Snippets Groups Projects
Unverified Commit 139897fc authored by Ahmad Farhat's avatar Ahmad Farhat Committed by GitHub
Browse files

Fix recordings processing to work with pagination (#5498)

parent f338b9be
No related branches found
No related tags found
No related merge requests found
......@@ -166,6 +166,7 @@
"recording": {
"recording": "Recording",
"recordings": "Recordings",
"processing": "Recordings Processing...",
"name": "Name",
"length": "Length",
"users": "Users",
......
......@@ -421,6 +421,14 @@ input.search-bar {
}
}
.badge-brand-outline {
font-size: 0.8rem;
border: 2px solid gainsboro;
color: var(--brand-color);
background-color: white !important;
box-shadow: var(--brand-color-light);
}
.setting-select {
button {
background: white !important;
......
// BigBlueButton open source conferencing system - http://www.bigbluebutton.org/.
//
// Copyright (c) 2022 BigBlueButton Inc. and by respective authors (see below).
//
// This program is free software; you can redistribute it and/or modify it under the
// terms of the GNU Lesser General Public License as published by the Free Software
// Foundation; either version 3.0 of the License, or (at your option) any later
// version.
//
// Greenlight is distributed in the hope that it will be useful, but WITHOUT ANY
// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
// PARTICULAR PURPOSE. See the GNU Lesser General Public License for more details.
//
// You should have received a copy of the GNU Lesser General Public License along
// with Greenlight; if not, see <http://www.gnu.org/licenses/>.
import { VideoCameraIcon } from '@heroicons/react/24/outline';
import React from 'react';
import { Stack } from 'react-bootstrap';
import { useTranslation } from 'react-i18next';
export default function ProcessingRecordingRow() {
const { t } = useTranslation();
return (
<tr id="room-recordings" className="align-middle text-muted border border-2">
<td className="text-dark border-end-0">
<Stack direction="horizontal" className="py-2">
<div className="recording-icon-circle rounded-circle me-3 d-flex align-items-center justify-content-center">
<VideoCameraIcon className="hi-s text-brand" />
</div>
{ t('recording.processing_recording') }
</Stack>
</td>
<td className="border-0" />
<td className="border-0" />
<td className="border-0" />
<td className="border-0" />
<td className="border-0" />
</tr>
);
}
......@@ -16,7 +16,9 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Card, Stack, Table } from 'react-bootstrap';
import {
Badge, Card, Stack, Table,
} from 'react-bootstrap';
import { useTranslation } from 'react-i18next';
import SortBy from '../shared_components/search/SortBy';
import RecordingsListRowPlaceHolder from './RecordingsListRowPlaceHolder';
......@@ -25,7 +27,6 @@ import RoomsRecordingRow from './room_recordings/RoomsRecordingRow';
import Pagination from '../shared_components/Pagination';
import EmptyRecordingsList from './EmptyRecordingsList';
import SearchBar from '../shared_components/search/SearchBar';
import ProcessingRecordingRow from './ProcessingRecordingRow';
export default function RecordingsList({
recordings, isLoading, setPage, searchInput, setSearchInput, recordingsProcessing, adminTable, numPlaceholders,
......@@ -42,6 +43,16 @@ export default function RecordingsList({
<div>
<SearchBar searchInput={searchInput} setSearchInput={setSearchInput} />
</div>
{ recordingsProcessing > 0 && (
<Badge className="ms-auto badge-brand-outline p-2">
<Stack direction="horizontal" gap={2}>
<Badge className="rounded-pill recordings-count-badge ms-2 text-brand">
{ recordingsProcessing }
</Badge>
<span> { t('recording.processing') } </span>
</Stack>
</Badge>
)}
</Stack>
{
(searchInput && recordings?.data.length === 0)
......@@ -63,7 +74,6 @@ export default function RecordingsList({
</tr>
</thead>
<tbody className="border-top-0">
{[...Array(recordingsProcessing)].map(() => <ProcessingRecordingRow />)}
{
(isLoading && [...Array(numPlaceholders)].map((val, idx) => (
// eslint-disable-next-line react/no-array-index-key
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment