From 101631a8be2cdb0b0e351b6dd4a8668b82f490c8 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Wed, 16 Aug 2023 10:46:22 +0300
Subject: [PATCH] Prevent text selections on control elements

---
 .../frontend/src/components/Common/Button.tsx |  2 +-
 .../src/components/Common/SubmitButton.tsx    |  2 +-
 rsconcept/frontend/src/components/Footer.tsx  |  2 +-
 .../src/components/Navigation/Navigation.tsx  |  2 +-
 .../src/pages/RSFormPage/EditorItems.tsx      |  2 +-
 .../src/pages/RSFormPage/EditorTermGraph.tsx  | 25 +++++++++++++++++--
 .../frontend/src/pages/RSFormPage/RSTabs.tsx  |  2 +-
 .../pages/RSFormPage/elements/StatusBar.tsx   |  2 +-
 .../elements/ViewSideConstituents.tsx         |  2 +-
 9 files changed, 31 insertions(+), 10 deletions(-)

diff --git a/rsconcept/frontend/src/components/Common/Button.tsx b/rsconcept/frontend/src/components/Common/Button.tsx
index 0e2f9524..c4458d47 100644
--- a/rsconcept/frontend/src/components/Common/Button.tsx
+++ b/rsconcept/frontend/src/components/Common/Button.tsx
@@ -27,7 +27,7 @@ function Button({
       disabled={disabled ?? loading}
       onClick={onClick}
       title={tooltip}
-      className={`inline-flex items-center gap-2 align-middle justify-center ${padding} ${borderClass} ${colorClass} ${widthClass} ${cursor}`}
+      className={`inline-flex items-center gap-2 align-middle justify-center select-none ${padding} ${borderClass} ${colorClass} ${widthClass} ${cursor}`}
       {...props}
     >
       {icon && <span>{icon}</span>}
diff --git a/rsconcept/frontend/src/components/Common/SubmitButton.tsx b/rsconcept/frontend/src/components/Common/SubmitButton.tsx
index 84ef8293..04b6b66f 100644
--- a/rsconcept/frontend/src/components/Common/SubmitButton.tsx
+++ b/rsconcept/frontend/src/components/Common/SubmitButton.tsx
@@ -8,7 +8,7 @@ interface SubmitButtonProps {
 function SubmitButton({ text = 'ОК', icon, disabled, loading = false }: SubmitButtonProps) {
   return (
     <button type='submit'
-      className={`px-4 py-2 inline-flex items-center gap-2 align-middle justify-center font-bold disabled:cursor-not-allowed border rounded clr-btn-primary ${loading ? ' cursor-progress' : ''}`}
+      className={`px-4 py-2 inline-flex items-center gap-2 align-middle justify-center font-bold select-none disabled:cursor-not-allowed border rounded clr-btn-primary ${loading ? ' cursor-progress' : ''}`}
       disabled={disabled ?? loading}
     >
       {icon && <span>{icon}</span>}
diff --git a/rsconcept/frontend/src/components/Footer.tsx b/rsconcept/frontend/src/components/Footer.tsx
index 9d829aba..60148088 100644
--- a/rsconcept/frontend/src/components/Footer.tsx
+++ b/rsconcept/frontend/src/components/Footer.tsx
@@ -10,7 +10,7 @@ function Footer() {
         <div className='px-4 underline whitespace-nowrap'>
           <Link to='/manuals' tabIndex={-1}>Справка</Link> <br/>
           <Link to='/library?filter=common' tabIndex={-1}>Библиотека КС</Link> <br/>
-          <a href={urls.gitrepo} className='flex'>
+          <a href={urls.gitrepo} className='flex' tabIndex={-1}>
             <GithubIcon />
             <span className='ml-1'>Репозиторий</span>
           </a>
diff --git a/rsconcept/frontend/src/components/Navigation/Navigation.tsx b/rsconcept/frontend/src/components/Navigation/Navigation.tsx
index 3ecf0f4f..b2aba4c1 100644
--- a/rsconcept/frontend/src/components/Navigation/Navigation.tsx
+++ b/rsconcept/frontend/src/components/Navigation/Navigation.tsx
@@ -35,7 +35,7 @@ function Navigation () {
       </button>}
       {!noNavigation &&
       <div className='pr-6 pl-2 py-2.5 h-[4rem] flex items-center justify-between border-b-2 clr-nav rounded-none'>
-        <div className='flex items-start justify-start '>
+        <div className='flex items-start justify-start select-none'>
           <Logo title='КонцептПортал' />
           <TopSearch />
         </div>
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
index 3713dd73..19fc76ce 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
@@ -247,7 +247,7 @@ function EditorItems({ onOpenEdit, onCreateCst, onDeleteCst }: EditorItemsProps)
   return (
     <div className='w-full'>
       <div
-        className={'flex justify-start w-full gap-1 px-2 py-1 border-y items-center h-[2.2rem] clr-app' +
+        className={'flex justify-start w-full gap-1 px-2 py-1 border-y items-center h-[2.2rem] select-none clr-app' +
           (!noNavigation ? ' sticky z-10 top-[0rem]' : ' sticky z-10 top-[0rem]')}
       >
         <div className='mr-3 whitespace-nowrap'>
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
index 5c34b2b4..dc64f2a7 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
@@ -212,6 +212,11 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) {
     focusOnSelect: false
   });
 
+  const allSelected: string[] = useMemo(
+    () => {
+      return [ ... selectedDismissed.map(id => String(id)), ... selections];
+    }, [selectedDismissed, selections]);
+
   const handleRecreate = useCallback(
   () => {
     graphRef.current?.resetControls();
@@ -239,6 +244,12 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) {
     if (onNodeClick) onNodeClick(node);
   }, [onNodeClick, selections, onOpenEdit]);
 
+  const handleCanvasClick = useCallback(
+  (event: MouseEvent) => {
+    setSelectedDismissed([]);
+    if (onCanvasClick) onCanvasClick(event);
+  }, [onCanvasClick]);
+
   function getOptions() {
     return {
       noHermits: noHermits,
@@ -301,7 +312,7 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) {
       initial={getOptions()}
       onConfirm={handleChangeOptions}
     />}
-    <div className='flex flex-col py-2 border-t border-r w-[14.7rem] pr-2 text-sm' style={{height: canvasHeight}}>
+    <div className='flex flex-col py-2 border-t border-r w-[14.7rem] pr-2 text-sm select-none' style={{height: canvasHeight}}>
       {hoverCst && 
       <div className='relative'>
         <InfoConstituenta 
@@ -309,6 +320,16 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) {
           className='absolute top-0 left-0 z-50 w-[25rem] min-h-[11rem] overflow-y-auto border h-fit clr-app px-3' 
         />
       </div>}
+      
+      <div className='mr-3 whitespace-nowrap'>
+        Выбраны
+        <span className='ml-2'>
+          <b>{allSelected.length}</b> из {schema?.stats?.count_all ?? 0}
+        </span>
+      </div>
+
+      <Divider margins='mt-3 mb-2' />
+
       <div className='flex items-center w-full gap-1'>
         <Button
           icon={<FilterCogIcon size={7} />}
@@ -421,7 +442,7 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) {
         selections={selections}
         actives={actives}
         onNodeClick={handleNodeClick}
-        onCanvasClick={onCanvasClick}
+        onCanvasClick={handleCanvasClick}
         onNodePointerOver={handleHoverIn}
         onNodePointerOut={handleHoverOut}
         cameraMode={ orbit ? 'orbit' : is3D ? 'rotate' : 'pan'}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
index 58ddc7c6..a6acdf50 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
@@ -223,7 +223,7 @@ function RSTabs() {
       defaultFocus={true}
       selectedTabClassName='font-bold'
     >
-      <TabList className='flex items-start w-fit clr-bg-pop'>
+      <TabList className='flex items-start select-none w-fit clr-bg-pop'>
         <RSTabsMenu 
           onDestroy={onDestroySchema}
           showCloneDialog={() => setShowClone(true)} 
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/StatusBar.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/StatusBar.tsx
index 6769fc69..f2b49c72 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/StatusBar.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/StatusBar.tsx
@@ -24,7 +24,7 @@ function StatusBar({ isModified, constituenta, parseData }: StatusBarProps) {
   const data = mapStatusInfo.get(status)!;
   return (
     <div title={data.tooltip}
-      className={`text-sm h-[1.6rem] w-[10rem] font-semibold inline-flex border items-center justify-center align-middle ${data.color}`}>
+      className={`text-sm h-[1.6rem] w-[10rem] font-semibold inline-flex border items-center select-none justify-center align-middle ${data.color}`}>
       Статус: [ {data.text} ]
     </div>
   )
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
index 00e5727c..5c215574 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
@@ -158,7 +158,7 @@ function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }:
         onChange={setFilterMatch}
       />
       <input type='text'
-        className='w-full px-2 bg-white outline-none hover:text-clip clr-bg-pop clr-border'
+        className='w-full px-2 bg-white outline-none select-none hover:text-clip clr-bg-pop clr-border'
         placeholder='наберите текст фильтра'
         value={filterText}
         onChange={event => setFilterText(event.target.value)}