From ada335ee21bbc9e94b5cb0393acd69c754f3d009 Mon Sep 17 00:00:00 2001 From: IRBorisov <8611739+IRBorisov@users.noreply.github.com> Date: Sat, 16 Dec 2023 19:20:26 +0300 Subject: [PATCH] Rework UI toolbars and icons --- README.md | 1 + rsconcept/frontend/package-lock.json | 9 + rsconcept/frontend/package.json | 1 + .../src/components/Common/ConceptSearch.tsx | 5 +- .../src/components/Common/ConceptTooltip.tsx | 3 +- .../src/components/Common/DropdownButton.tsx | 25 +- .../src/components/Common/FileInput.tsx | 4 +- .../frontend/src/components/Common/Modal.tsx | 4 +- .../src/components/Common/PageControls.tsx | 10 +- .../components/DataTable/PaginationTools.tsx | 11 +- .../src/components/DataTable/SortingIcon.tsx | 6 +- .../components/Help/ConstituentaTooltip.tsx | 2 +- .../src/components/Help/HelpButton.tsx | 5 +- .../src/components/Help/HelpLibrary.tsx | 6 +- rsconcept/frontend/src/components/Icons.tsx | 357 +----------------- .../src/components/Navigation/Logo.tsx | 2 +- .../src/components/Navigation/Navigation.tsx | 2 +- .../components/Navigation/ThemeSwitcher.tsx | 25 -- .../components/Navigation/UserDropdown.tsx | 18 +- .../components/Shared/InfoConstituenta.tsx | 2 +- .../src/context/AccessModeContext.tsx | 36 ++ .../frontend/src/context/RSFormContext.tsx | 26 +- .../DlgConstituentaTemplate/ArgumentsTab.tsx | 10 +- .../DlgEditWordForms/DlgEditWordForms.tsx | 19 +- .../DlgEditWordForms/WordFormsTable.tsx | 6 +- rsconcept/frontend/src/index.css | 4 + rsconcept/frontend/src/models/miscelanious.ts | 9 + .../frontend/src/pages/CreateRSFormPage.tsx | 4 +- .../src/pages/LibraryPage/ItemIcons.tsx | 6 +- .../src/pages/LibraryPage/PickerStrategy.tsx | 4 +- .../ConstituentaToolbar.tsx | 17 +- .../EditorConstituenta/EditorConstituenta.tsx | 15 +- .../EditorConstituenta/FormConstituenta.tsx | 32 +- .../EditorRSExpression/EditorRSExpression.tsx | 6 +- .../RSFormPage/EditorRSForm/EditorRSForm.tsx | 21 +- .../RSFormPage/EditorRSForm/FormRSForm.tsx | 26 +- .../RSFormPage/EditorRSForm/RSFormToolbar.tsx | 32 +- .../RSFormPage/EditorRSList/EditorRSList.tsx | 20 +- .../RSFormPage/EditorRSList/RSListToolbar.tsx | 35 +- .../pages/RSFormPage/EditorRSList/RSTable.tsx | 12 +- .../EditorTermGraph/EditorTermGraph.tsx | 5 +- .../EditorTermGraph/GraphToolbar.tsx | 18 +- .../src/pages/RSFormPage/RSFormPage.tsx | 5 +- .../frontend/src/pages/RSFormPage/RSTabs.tsx | 61 ++- .../src/pages/RSFormPage/RSTabsMenu.tsx | 206 +++++----- .../ViewConstituents/ConstituentsSearch.tsx | 10 +- .../ViewConstituents/ConstituentsTable.tsx | 8 - .../ViewConstituents/ViewConstituents.tsx | 2 +- rsconcept/frontend/src/pages/RegisterPage.tsx | 4 +- .../src/pages/UserProfilePage/UserTabs.tsx | 4 +- rsconcept/frontend/src/utils/labels.ts | 29 +- 51 files changed, 503 insertions(+), 687 deletions(-) delete mode 100644 rsconcept/frontend/src/components/Navigation/ThemeSwitcher.tsx create mode 100644 rsconcept/frontend/src/context/AccessModeContext.tsx diff --git a/README.md b/README.md index d80e5085..9ce3c227 100644 --- a/README.md +++ b/README.md @@ -13,6 +13,7 @@ This readme file is used mostly to document project dependencies 
   - axios
   - clsx
+  - react-icons
   - react-router-dom 
   - react-toastify
   - react-loader-spinner
diff --git a/rsconcept/frontend/package-lock.json b/rsconcept/frontend/package-lock.json
index b2d53616..5f6f6df1 100644
--- a/rsconcept/frontend/package-lock.json
+++ b/rsconcept/frontend/package-lock.json
@@ -18,6 +18,7 @@
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-error-boundary": "^4.0.11",
+        "react-icons": "^4.12.0",
         "react-intl": "^6.5.5",
         "react-loader-spinner": "^5.4.5",
         "react-pdf": "^7.6.0",
@@ -8389,6 +8390,14 @@
         "react": ">=16.13.1"
       }
     },
+    "node_modules/react-icons": {
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.12.0.tgz",
+      "integrity": "sha512-IBaDuHiShdZqmfc/TwHu6+d6k2ltNCf3AszxNmjJc1KUfXdEeRJOKyNvLmAHaarhzGmTSVygNdyu8/opXv2gaw==",
+      "peerDependencies": {
+        "react": "*"
+      }
+    },
     "node_modules/react-intl": {
       "version": "6.5.5",
       "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-6.5.5.tgz",
diff --git a/rsconcept/frontend/package.json b/rsconcept/frontend/package.json
index 5c6874c5..c04f5207 100644
--- a/rsconcept/frontend/package.json
+++ b/rsconcept/frontend/package.json
@@ -22,6 +22,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-error-boundary": "^4.0.11",
+    "react-icons": "^4.12.0",
     "react-intl": "^6.5.5",
     "react-loader-spinner": "^5.4.5",
     "react-pdf": "^7.6.0",
diff --git a/rsconcept/frontend/src/components/Common/ConceptSearch.tsx b/rsconcept/frontend/src/components/Common/ConceptSearch.tsx
index bb6a03ba..e205f99f 100644
--- a/rsconcept/frontend/src/components/Common/ConceptSearch.tsx
+++ b/rsconcept/frontend/src/components/Common/ConceptSearch.tsx
@@ -1,4 +1,5 @@
-import { MagnifyingGlassIcon } from '../Icons';
+import { BiSearchAlt2 } from 'react-icons/bi';
+
 import Overlay from './Overlay';
 import TextInput from './TextInput';
 
@@ -16,7 +17,7 @@ function ConceptSearch({ value, onChange, noBorder, dimensions }: ConceptSearchP
       position='top-[-0.125rem] left-3 translate-y-1/2'
       className='pointer-events-none clr-text-controls'
     >
-      
+      
     
      void
   disabled?: boolean
-  children: React.ReactNode
+
+  children?: React.ReactNode
 }
 
-function DropdownButton({ tooltip, onClick, disabled, children }: DropdownButtonProps) {
+function DropdownButton({
+  text, icon, children,
+  tooltip, className,
+  disabled,
+  onClick
+}: DropdownButtonProps) {
   return (
   );
 }
 
diff --git a/rsconcept/frontend/src/components/Common/FileInput.tsx b/rsconcept/frontend/src/components/Common/FileInput.tsx
index 1bb725c5..b4670175 100644
--- a/rsconcept/frontend/src/components/Common/FileInput.tsx
+++ b/rsconcept/frontend/src/components/Common/FileInput.tsx
@@ -2,8 +2,8 @@
 
 import clsx from 'clsx';
 import { useRef, useState } from 'react';
+import { BiUpload } from 'react-icons/bi';
 
-import { UploadIcon } from '../Icons';
 import Button from './Button';
 import Label from './Label';
 
@@ -55,7 +55,7 @@ function FileInput({
     />
     
     
     
Страница {pageNumber} из {pageCount}

     
     
   );
 }
diff --git a/rsconcept/frontend/src/components/DataTable/PaginationTools.tsx b/rsconcept/frontend/src/components/DataTable/PaginationTools.tsx
index 9b87752c..8490acb8 100644
--- a/rsconcept/frontend/src/components/DataTable/PaginationTools.tsx
+++ b/rsconcept/frontend/src/components/DataTable/PaginationTools.tsx
@@ -3,11 +3,10 @@
 import { Table } from '@tanstack/react-table';
 import clsx from 'clsx';
 import { useCallback } from 'react';
+import { BiChevronLeft, BiChevronRight, BiFirstPage, BiLastPage } from 'react-icons/bi';
 
 import { prefixes } from '@/utils/constants';
 
-import { GotoFirstIcon, GotoLastIcon, GotoNextIcon, GotoPrevIcon } from '../Icons';
-
 interface PaginationToolsProps {
   table: Table
   paginationOptions: number[]
@@ -47,14 +46,14 @@ function PaginationTools({ table, paginationOptions, onChangePaginationOp
         onClick={() => table.setPageIndex(0)}
         disabled={!table.getCanPreviousPage()}
       >
-        
+        
       
       
       ({ table, paginationOptions, onChangePaginationOp
         onClick={() => table.nextPage()}
         disabled={!table.getCanNextPage()}
       >
-        
+