Add indication for anonymous user and archive schema

rsconcept/frontend/src/pages/RSFormPage/RSTabsMenu.tsx

@@ -13,7 +13,7 @@ import {
   BiUpload
 } from 'react-icons/bi';
 import { FiEdit } from 'react-icons/fi';
-import { LuCrown, LuGlasses, LuReplace } from 'react-icons/lu';
+import { LuAlertCircle, LuAlertTriangle, LuCrown, LuGlasses, LuReplace } from 'react-icons/lu';
 import { VscLibrary } from 'react-icons/vsc';
 
 import Button from '@/components/ui/Button';
@@ -37,7 +37,7 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
   const controller = useRSEdit();
   const router = useConceptNavigation();
   const { user } = useAuth();
-  const { isOwned, isClaimable } = useRSForm();
+  const model = useRSForm();
 
   const { mode, setMode } = useAccessMode();
 
@@ -99,26 +99,34 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
     router.push('/library/create');
   }
 
+  function handleLogin() {
+    router.push('/login');
+  }
+
+  function handleGotoCurrent() {
+    router.push(`/rsforms/${model.schemaID}`);
+  }
+
   return (
     <div className='flex'>
       <div ref={schemaMenu.ref}>
         <Button
-          noBorder
           dense
+          noBorder
+          noOutline
           tabIndex={-1}
           title='Меню'
           hideTitle={schemaMenu.isOpen}
           icon={<BiMenu size='1.25rem' className='clr-text-controls' />}
           className='h-full pl-2'
-          style={{ outlineColor: 'transparent' }}
           onClick={schemaMenu.toggle}
         />
         <Dropdown isOpen={schemaMenu.isOpen}>
           <DropdownButton
-            disabled={(!user || !isClaimable) && !isOwned}
-            text={isOwned ? 'Вы — владелец' : 'Стать владельцем'}
-            icon={<LuCrown size='1rem' className={isOwned ? 'clr-text-success' : ''} />}
-            onClick={!isOwned && user && isClaimable ? handleClaimOwner : undefined}
+            disabled={(!user || !model.isClaimable) && !model.isOwned}
+            text={model.isOwned ? 'Вы — владелец' : 'Стать владельцем'}
+            icon={<LuCrown size='1rem' className={model.isOwned ? 'clr-text-success' : ''} />}
+            onClick={!model.isOwned && user && model.isClaimable ? handleClaimOwner : undefined}
           />
           <DropdownButton
             text='Поделиться'
@@ -163,16 +171,22 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
         </Dropdown>
       </div>
 
+      {!model.isArchive ? (
         <div ref={editMenu.ref}>
           <Button
             dense
             noBorder
+            noOutline
             tabIndex={-1}
             title={'Редактирование'}
             hideTitle={editMenu.isOpen}
             className='h-full'
-          style={{ outlineColor: 'transparent' }}
-          icon={<FiEdit size='1.25rem' className={controller.isMutable ? 'clr-text-success' : 'clr-text-warning'} />}
+            icon={
+              <FiEdit
+                size='1.25rem'
+                className={!user ? 'clr-text-controls' : controller.isMutable ? 'clr-text-success' : 'clr-text-warning'}
+              />
+            }
             onClick={editMenu.toggle}
           />
           <Dropdown isOpen={editMenu.isOpen}>
@@ -199,16 +213,31 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
             />
           </Dropdown>
         </div>
+      ) : null}
+      {model.isArchive ? (
+        <Button
+          dense
+          noBorder
+          noOutline
+          tabIndex={-1}
+          title={'Редактирование запрещено - Архив'}
+          hideTitle={accessMenu.isOpen}
+          className='h-full'
+          icon={<LuAlertCircle size='1.25rem' className='clr-text-primary' />}
+          onClick={handleGotoCurrent}
+        />
+      ) : null}
 
+      {user ? (
         <div ref={accessMenu.ref}>
           <Button
             dense
             noBorder
+            noOutline
             tabIndex={-1}
             title={`Режим ${labelAccessMode(mode)}`}
             hideTitle={accessMenu.isOpen}
             className='h-full pr-2'
-          style={{ outlineColor: 'transparent' }}
             icon={
               mode === UserAccessMode.ADMIN ? (
                 <BiMeteor size='1.25rem' className='clr-text-primary' />
@@ -228,10 +257,10 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
               onClick={() => handleChangeMode(UserAccessMode.READER)}
             />
             <DropdownButton
-            disabled={!isOwned}
+              disabled={!model.isOwned}
               text={labelAccessMode(UserAccessMode.OWNER)}
               title={describeAccessMode(UserAccessMode.OWNER)}
-            icon={<LuCrown size='1rem' className={isOwned ? 'clr-text-primary' : ''} />}
+              icon={<LuCrown size='1rem' className={model.isOwned ? 'clr-text-primary' : ''} />}
               onClick={() => handleChangeMode(UserAccessMode.OWNER)}
             />
             <DropdownButton
@@ -243,6 +272,20 @@ function RSTabsMenu({ onDestroy }: RSTabsMenuProps) {
             />
           </Dropdown>
         </div>
+      ) : null}
+      {!user ? (
+        <Button
+          dense
+          noBorder
+          noOutline
+          tabIndex={-1}
+          title={'Анонимный режим. Чтобы использовать все функции войдите в Портал'}
+          hideTitle={accessMenu.isOpen}
+          className='h-full pr-2'
+          icon={<LuAlertTriangle size='1.25rem' className='clr-text-warning' />}
+          onClick={handleLogin}
+        />
+      ) : null}
     </div>
   );
 }