From 3e34414b858b78b5e1ccaaaa3699277b96db5fbe Mon Sep 17 00:00:00 2001
From: Ivan <8611739+IRBorisov@users.noreply.github.com>
Date: Thu, 12 Sep 2024 14:48:08 +0300
Subject: [PATCH] R: Replace disabled buttons with indicators

---
 .../frontend/src/components/ui/Indicator.tsx  | 34 +++++++++++++++++++
 .../pages/OssPage/EditorOssGraph/NodeCore.tsx | 10 ++----
 .../EditorConstituenta/FormConstituenta.tsx   | 10 +++---
 3 files changed, 41 insertions(+), 13 deletions(-)
 create mode 100644 rsconcept/frontend/src/components/ui/Indicator.tsx

diff --git a/rsconcept/frontend/src/components/ui/Indicator.tsx b/rsconcept/frontend/src/components/ui/Indicator.tsx
new file mode 100644
index 00000000..c445f996
--- /dev/null
+++ b/rsconcept/frontend/src/components/ui/Indicator.tsx
@@ -0,0 +1,34 @@
+import clsx from 'clsx';
+
+import { globals } from '@/utils/constants';
+
+import { CProps } from '../props';
+
+interface IndicatorProps extends CProps.Titled, CProps.Styling {
+  icon: React.ReactNode;
+  noPadding?: boolean;
+}
+
+function Indicator({ icon, title, titleHtml, hideTitle, noPadding, className, ...restProps }: IndicatorProps) {
+  return (
+    <div
+      className={clsx(
+        'clr-btn-clear',
+        'outline-none',
+        {
+          'px-1 py-1': !noPadding
+        },
+        className
+      )}
+      data-tooltip-id={!!title || !!titleHtml ? globals.tooltip : undefined}
+      data-tooltip-html={titleHtml}
+      data-tooltip-content={title}
+      data-tooltip-hidden={hideTitle}
+      {...restProps}
+    >
+      {icon}
+    </div>
+  );
+}
+
+export default Indicator;
diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/NodeCore.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/NodeCore.tsx
index cbf1747e..59749c1f 100644
--- a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/NodeCore.tsx
+++ b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/NodeCore.tsx
@@ -2,7 +2,7 @@
 
 import { IconConsolidation, IconRSForm } from '@/components/Icons';
 import TooltipOperation from '@/components/info/TooltipOperation';
-import MiniButton from '@/components/ui/MiniButton.tsx';
+import Indicator from '@/components/ui/Indicator';
 import Overlay from '@/components/ui/Overlay';
 import { OssNodeInternal } from '@/models/miscellaneous';
 import { OperationType } from '@/models/oss';
@@ -25,19 +25,15 @@ function NodeCore({ node }: NodeCoreProps) {
   return (
     <>
       <Overlay position='top-0 right-0' className='flex flex-col gap-1 p-[2px]'>
-        <MiniButton
-          disabled
-          noHover
+        <Indicator
           noPadding
           title={hasFile ? 'Связанная КС' : 'Нет связанной КС'}
           icon={<IconRSForm className={hasFile ? 'clr-text-green' : 'clr-text-red'} size='12px' />}
           hideTitle={!controller.showTooltip}
         />
         {node.data.operation.is_consolidation ? (
-          <MiniButton
-            disabled
+          <Indicator
             noPadding
-            noHover
             titleHtml='<b>Внимание!</b><br />Ромбовидный синтез</br/>Возможны дубликаты конституент'
             icon={<IconConsolidation className='clr-text-primary' size='12px' />}
             hideTitle={!controller.showTooltip}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
index 2321fbe9..469b56f4 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/FormConstituenta.tsx
@@ -7,7 +7,7 @@ import { toast } from 'react-toastify';
 
 import { IconChild, IconPredecessor, IconSave } from '@/components/Icons';
 import RefsInput from '@/components/RefsInput';
-import MiniButton from '@/components/ui/MiniButton';
+import Indicator from '@/components/ui/Indicator';
 import Overlay from '@/components/ui/Overlay';
 import SubmitButton from '@/components/ui/SubmitButton';
 import TextArea from '@/components/ui/TextArea';
@@ -165,7 +165,7 @@ function FormConstituenta({
             dense
             noResize
             noBorder
-            disabled={true}
+            disabled
             label='Типизация'
             value={typification}
             colors='clr-app clr-text-default'
@@ -250,16 +250,14 @@ function FormConstituenta({
                 />
                 <Overlay position='top-[0.1rem] left-[0.4rem]' className='cc-icons'>
                   {state.is_inherited_parent && !state.is_inherited ? (
-                    <MiniButton
+                    <Indicator
                       icon={<IconPredecessor size='1.25rem' className='clr-text-primary' />}
-                      disabled
                       titleHtml='Внимание!</br> Конституента имеет потомков<br/> в операционной схеме синтеза'
                     />
                   ) : null}
                   {state.is_inherited ? (
-                    <MiniButton
+                    <Indicator
                       icon={<IconChild size='1.25rem' className='clr-text-primary' />}
-                      disabled
                       titleHtml='Внимание!</br> Конституента является наследником<br/>'
                     />
                   ) : null}