From f64f6a6c3d0f4a8e0f838886296007301cf8b6ba Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Thu, 23 Nov 2023 19:34:37 +0300
Subject: [PATCH] Fix minor UI issues

---
 .../frontend/src/components/Common/Modal.tsx  |  4 +--
 .../frontend/src/dialogs/DlgDeleteCst.tsx     | 25 +++++++++++++------
 .../frontend/src/pages/RSFormPage/RSTabs.tsx  |  7 ++++--
 .../pages/RSFormPage/elements/RSItemsMenu.tsx |  2 ++
 rsconcept/frontend/src/utils/constants.ts     |  3 +++
 5 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/rsconcept/frontend/src/components/Common/Modal.tsx b/rsconcept/frontend/src/components/Common/Modal.tsx
index 64e24f5f..bb17ab67 100644
--- a/rsconcept/frontend/src/components/Common/Modal.tsx
+++ b/rsconcept/frontend/src/components/Common/Modal.tsx
@@ -40,10 +40,10 @@ function Modal({
     <div className='fixed top-0 left-0 w-full h-full z-navigation clr-modal-backdrop' />
     <div 
       ref={ref}
-      className='fixed bottom-1/2 left-1/2 translate-y-1/2 -translate-x-1/2 px-6 py-3 flex flex-col justify-start w-fit max-w-[calc(100vw-2rem)] h-fit z-modal clr-app border shadow-md'
+      className='fixed bottom-1/2 left-1/2 translate-y-1/2 -translate-x-1/2 px-6 py-3 flex flex-col justify-start w-fit max-w-[calc(100vw-2rem)] overflow-x-auto h-fit z-modal clr-app border shadow-md'
     >
       { title && <h1 className='pb-3 text-xl select-none'>{title}</h1> }
-      <div className='max-h-[calc(100vh-8rem)]'>
+      <div className='max-h-[calc(100vh-8rem)] overflow-auto'>
         {children}
       </div>
       <div className='flex justify-center w-full gap-4 pt-3 mt-2 border-t-2 z-modal-controls'>
diff --git a/rsconcept/frontend/src/dialogs/DlgDeleteCst.tsx b/rsconcept/frontend/src/dialogs/DlgDeleteCst.tsx
index c0988b24..6e56e380 100644
--- a/rsconcept/frontend/src/dialogs/DlgDeleteCst.tsx
+++ b/rsconcept/frontend/src/dialogs/DlgDeleteCst.tsx
@@ -3,6 +3,7 @@ import { useMemo, useState } from 'react';
 import Checkbox from '../components/Common/Checkbox';
 import Modal, { ModalProps } from '../components/Common/Modal';
 import { useRSForm } from '../context/RSFormContext';
+import { prefixes } from '../utils/constants';
 import { labelConstituenta } from '../utils/labels';
 
 interface DlgDeleteCstProps
@@ -37,17 +38,25 @@ function DlgDeleteCst({ hideWindow, selected, onDelete }: DlgDeleteCstProps) {
     <div className='max-w-[60vw] min-w-[20rem]'>
       <p>Выбраны к удалению: <b>{selected.length}</b></p>
       <div className='px-3 border h-[9rem] mt-1 overflow-y-auto whitespace-nowrap'>
-        {selected.map(id => {
-          const cst = schema!.items.find(cst => cst.id === id);
-          return (cst && <p>{labelConstituenta(cst)}</p>);
-        })}
+      {selected.map(
+      (id) => {
+        const cst = schema!.items.find(cst => cst.id === id);
+        return (cst && 
+        <p key={`${prefixes.cst_delete_list}${cst.id}`}>
+          {labelConstituenta(cst)}
+        </p>);
+      })}
       </div>
       <p className='mt-4'>Зависимые конституенты: <b>{expansion.length}</b></p>
       <div className='mt-1 mb-3 px-3 border h-[9rem] overflow-y-auto whitespace-nowrap'>
-        {expansion.map(id => {
-          const cst = schema!.items.find(cst => cst.id === id);
-          return (cst && <p>{labelConstituenta(cst)}</p>);
-        })}
+      {expansion.map(
+      (id) => {
+        const cst = schema!.items.find(cst => cst.id === id);
+        return (cst &&
+        <p key={`${prefixes.cst_dependant_list}${cst.id}`}>
+          {labelConstituenta(cst)}
+        </p>);
+      })}
       </div>
       <Checkbox
         label='Удалить зависимые конституенты'
diff --git a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
index 68c59cfb..9664ef3d 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
@@ -195,10 +195,12 @@ function RSTabs() {
     cstDelete(data, () => {
       const deletedNames = deleted.map(id => schema.items.find(cst => cst.id === id)?.alias).join(', ');
       toast.success(`Конституенты удалены: ${deletedNames}`);
+
       if (deleted.length === schema.items.length) {
         navigateTab(RSTabID.CST_LIST);
-      }
-      if (activeIndex) {
+      } else if (activeIndex === -1) {
+        navigateTab(activeTab);
+      } else {
         while (activeIndex < schema.items.length && deleted.find(id => id === schema.items[activeIndex].id)) {
           ++activeIndex;
         }
@@ -210,6 +212,7 @@ function RSTabs() {
         }
         navigateTab(activeTab, schema.items[activeIndex].id);
       }
+      
       if (afterDelete) afterDelete(deleted);
     });
   }, [afterDelete, cstDelete, schema, activeID, activeTab, navigateTab]);
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/RSItemsMenu.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/RSItemsMenu.tsx
index 52071dc0..9892b1a9 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/RSItemsMenu.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/RSItemsMenu.tsx
@@ -9,6 +9,7 @@ import { ArrowDownIcon, ArrowDropdownIcon, ArrowUpIcon, CloneIcon, DiamondIcon,
 import { useRSForm } from '../../../context/RSFormContext';
 import useDropdown from '../../../hooks/useDropdown';
 import { CstType } from '../../../models/rsform';
+import { prefixes } from '../../../utils/constants';
 import { labelCstType } from '../../../utils/labels';
 import { getCstTypePrefix, getCstTypeShortcut } from '../../../utils/misc';
 
@@ -79,6 +80,7 @@ function RSItemsMenu({
         const type = typeStr as CstType;
         return (
         <DropdownButton
+          key={`${prefixes.csttype_list}${typeStr}`}
           onClick={() => onCreate(type)}
           tooltip={getCstTypeShortcut(type)}
         >
diff --git a/rsconcept/frontend/src/utils/constants.ts b/rsconcept/frontend/src/utils/constants.ts
index 09374c7c..6fc2ccec 100644
--- a/rsconcept/frontend/src/utils/constants.ts
+++ b/rsconcept/frontend/src/utils/constants.ts
@@ -74,6 +74,9 @@ export const prefixes = {
   cst_status_list: 'cst-status-list-',
   cst_match_mode_list: 'cst-match-mode-list-',
   cst_source_list: 'cst-source-list-',
+  cst_delete_list: 'cst-delete-list-',
+  cst_dependant_list: 'cst-dependant-list-',
+  csttype_list: 'csttype-',
   library_filters_list: 'library-filters-list-',
   topic_list: 'topic-list-',
   library_list: 'library-list-',