Portal/rsconcept/frontend/src/features/library/components/ToolbarItemAccess.tsx
2025-02-18 19:39:54 +03:00

77 lines
2.6 KiB
TypeScript

import { BadgeHelp, HelpTopic } from '@/features/help';
import { useRoleStore, UserRole } from '@/features/users';
import { Overlay } from '@/components/Container';
import { MiniButton } from '@/components/Control';
import { VisibilityIcon } from '@/components/DomainIcons';
import { IconImmutable, IconMutable } from '@/components/Icons';
import { Label } from '@/components/Input';
import { PARAMETER } from '@/utils/constants';
import { AccessPolicy } from '../backend/types';
import { useMutatingLibrary } from '../backend/useMutatingLibrary';
import { useSetAccessPolicy } from '../backend/useSetAccessPolicy';
import { ILibraryItemEditor } from './EditorLibraryItem';
import { SelectAccessPolicy } from './SelectAccessPolicy';
interface ToolbarItemAccessProps {
visible: boolean;
toggleVisible: () => void;
readOnly: boolean;
toggleReadOnly: () => void;
controller: ILibraryItemEditor;
}
export function ToolbarItemAccess({
visible,
toggleVisible,
readOnly,
toggleReadOnly,
controller
}: ToolbarItemAccessProps) {
const role = useRoleStore(state => state.role);
const isProcessing = useMutatingLibrary();
const policy = controller.schema.access_policy;
const { setAccessPolicy } = useSetAccessPolicy();
function handleSetAccessPolicy(newPolicy: AccessPolicy) {
void setAccessPolicy({ itemID: controller.schema.id, policy: newPolicy });
}
return (
<Overlay position='top-[4.5rem] right-0 w-[12rem] pr-2' className='flex' layer='z-bottom'>
<Label text='Доступ' className='self-center select-none' />
<div className='ml-auto cc-icons'>
<SelectAccessPolicy
disabled={role <= UserRole.EDITOR || isProcessing || controller.isAttachedToOSS}
value={policy}
onChange={handleSetAccessPolicy}
/>
<MiniButton
title={visible ? 'Библиотека: отображать' : 'Библиотека: скрывать'}
icon={<VisibilityIcon value={visible} />}
onClick={toggleVisible}
disabled={role === UserRole.READER || isProcessing}
/>
<MiniButton
title={readOnly ? 'Изменение: запрещено' : 'Изменение: разрешено'}
icon={
readOnly ? (
<IconImmutable size='1.25rem' className='text-sec-600' />
) : (
<IconMutable size='1.25rem' className='text-ok-600' />
)
}
onClick={toggleReadOnly}
disabled={role === UserRole.READER || isProcessing}
/>
<BadgeHelp topic={HelpTopic.ACCESS} className={PARAMETER.TOOLTIP_WIDTH} offset={4} />
</div>
</Overlay>
);
}