mirror of https://github.com/sualko/cloud_bbb
feat: show access mode in table
parent
4203ee3987
commit
256c505f43
|
@ -5,7 +5,7 @@ import { SortArrow } from './SortArrow';
|
|||
import { api, Room, Restriction, Access } from '../Common/Api';
|
||||
import NewRoomForm from './NewRoomForm';
|
||||
|
||||
export type SortKey = 'name' | 'welcome' | 'maxParticipants' | 'record';
|
||||
export type SortKey = 'name' | 'welcome' | 'maxParticipants' | 'record' | 'access';
|
||||
|
||||
enum SortOrder { DESC = -1, ASC = 1 }
|
||||
|
||||
|
@ -14,6 +14,7 @@ function sortRooms(key: SortKey, orderBy: SortOrder) {
|
|||
switch (key) {
|
||||
case 'name':
|
||||
case 'welcome':
|
||||
case 'access':
|
||||
return a[key].localeCompare(b[key]) * orderBy;
|
||||
case 'maxParticipants':
|
||||
return (a.maxParticipants - b.maxParticipants) * orderBy;
|
||||
|
@ -136,6 +137,9 @@ const App: React.FC<Props> = () => {
|
|||
{t('bbb', 'Name')} <SortArrow name='name' value={orderBy} direction={sortOrder} />
|
||||
</th>
|
||||
<th />
|
||||
<th onClick={() => onOrderBy('access')} className="bbb-shrink">
|
||||
{t('bbb', 'Access')} <SortArrow name='access' value={orderBy} direction={sortOrder} />
|
||||
</th>
|
||||
<th onClick={() => onOrderBy('maxParticipants')} className="bbb-shrink">
|
||||
{t('bbb', 'Max')} <SortArrow name='maxParticipants' value={orderBy} direction={sortOrder} />
|
||||
</th>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { CopyToClipboard } from 'react-copy-to-clipboard';
|
||||
import { api, Recording, Room, Restriction } from '../Common/Api';
|
||||
import { api, Recording, Room, Restriction, Access } from '../Common/Api';
|
||||
import EditRoom from './EditRoom';
|
||||
import RecordingRow from './RecordingRow';
|
||||
import EditableValue from './EditableValue';
|
||||
|
@ -34,8 +34,6 @@ const RecordingsNumber: React.FC<RecordingsNumberProps> = ({ recordings, showRec
|
|||
return <span>0</span>;
|
||||
};
|
||||
|
||||
|
||||
|
||||
const RoomRow: React.FC<Props> = (props) => {
|
||||
const [recordings, setRecordings] = useState<Recording[] | null>(null);
|
||||
const [showRecordings, setShowRecordings] = useState<boolean>(false);
|
||||
|
@ -155,6 +153,23 @@ const RoomRow: React.FC<Props> = (props) => {
|
|||
);
|
||||
}
|
||||
|
||||
function accessToIcon(access: string) {
|
||||
switch(access) {
|
||||
case Access.Public:
|
||||
return <span className="icon icon-visible icon-link" />;
|
||||
case Access.Password:
|
||||
return <span className="icon icon-visible icon-password" />;
|
||||
case Access.Internal:
|
||||
return <span className="icon icon-visible icon-group" />;
|
||||
case Access.InternalRestricted:
|
||||
return <span className="icon icon-visible icon-user" />;
|
||||
case Access.WaitingRoom:
|
||||
return <span className="icon icon-visible icon-timezone" />;
|
||||
}
|
||||
|
||||
return <span></span>;
|
||||
}
|
||||
|
||||
function edit(field: string, type: 'text' | 'number' = 'text', options?) {
|
||||
return <EditableValue field={field} value={room[field]} setValue={updateRoom} type={type} options={options} />;
|
||||
}
|
||||
|
@ -189,6 +204,9 @@ const RoomRow: React.FC<Props> = (props) => {
|
|||
{room.userId !== OC.currentUser && <img src={avatarUrl} alt="Avatar" className="bbb-avatar" />}
|
||||
{(room.userId === OC.currentUser && room.shared) && <span className="icon icon-shared icon-visible"/>}
|
||||
</td>
|
||||
<td>
|
||||
{accessToIcon(room.access)}
|
||||
</td>
|
||||
<td className="max-participants bbb-shrink">
|
||||
{edit('maxParticipants', 'number', {min: minParticipantsLimit, max: maxParticipantsLimit < 0 ? undefined : maxParticipantsLimit})}
|
||||
</td>
|
||||
|
|
Loading…
Reference in New Issue