From 22ef6b1886119c6e527745cc24201ef8718b9c50 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Tue, 14 May 2024 19:16:04 +0300
Subject: [PATCH] UI topics list refactoring
---
TODO.txt | 2 +-
.../src/components/info/InfoTopic.tsx | 5 ++-
.../src/components/man/HelpCstAttributes.tsx | 2 +-
.../src/components/ui/DataTable/TableBody.tsx | 2 +-
...icsListDropdown.tsx => TopicsDropdown.tsx} | 36 ++++++-------------
.../src/pages/ManualsPage/TopicsList.tsx | 8 ++---
.../src/pages/ManualsPage/TopicsStatic.tsx | 33 +++++++++++++++++
.../{TopicsListStatic.tsx => TopicsTree.tsx} | 27 ++++++--------
rsconcept/frontend/src/styling/styles.css | 2 +-
9 files changed, 66 insertions(+), 51 deletions(-)
rename rsconcept/frontend/src/pages/ManualsPage/{TopicsListDropdown.tsx => TopicsDropdown.tsx} (59%)
create mode 100644 rsconcept/frontend/src/pages/ManualsPage/TopicsStatic.tsx
rename rsconcept/frontend/src/pages/ManualsPage/{TopicsListStatic.tsx => TopicsTree.tsx} (61%)
diff --git a/TODO.txt b/TODO.txt
index eed0b9e0..5da26944 100644
--- a/TODO.txt
+++ b/TODO.txt
@@ -19,7 +19,7 @@ For more specific TODOs see comments in code
- User notifications on edit - consider spam prevention and change aggregation
- Static analyzer for RSForm
- Content based search in Library
-- User profile: Settings
+- User profile: Settings + settings persistency
- Export PDF (Items list, Graph)
- ARIA (accessibility considerations) - for now machine reading not supported
diff --git a/rsconcept/frontend/src/components/info/InfoTopic.tsx b/rsconcept/frontend/src/components/info/InfoTopic.tsx
index d05d5e59..27d2de57 100644
--- a/rsconcept/frontend/src/components/info/InfoTopic.tsx
+++ b/rsconcept/frontend/src/components/info/InfoTopic.tsx
@@ -1,6 +1,7 @@
import { HelpTopic } from '@/models/miscellaneous';
import HelpAPI from '../man/HelpAPI';
+import HelpConcept from '../man/HelpConcept';
import HelpConceptRelations from '../man/HelpConceptRelations';
import HelpConceptSystem from '../man/HelpConceptSystem';
import HelpCstAttributes from '../man/HelpCstAttributes';
@@ -42,10 +43,12 @@ function InfoTopic({ topic }: InfoTopicProps) {
if (topic === HelpTopic.CST_STATUS) return ;
if (topic === HelpTopic.CST_CLASS) return ;
- if (topic === HelpTopic.RSLANG) return ;
+ if (topic === HelpTopic.CONCEPTUAL) return ;
if (topic === HelpTopic.CC_SYSTEM) return ;
if (topic === HelpTopic.CC_CONSTITUENTA) return ;
if (topic === HelpTopic.CC_RELATIONS) return ;
+
+ if (topic === HelpTopic.RSLANG) return ;
if (topic === HelpTopic.RSL_TYPES) return ;
if (topic === HelpTopic.RSL_CORRECT) return ;
if (topic === HelpTopic.RSL_INTERPRET) return ;
diff --git a/rsconcept/frontend/src/components/man/HelpCstAttributes.tsx b/rsconcept/frontend/src/components/man/HelpCstAttributes.tsx
index 0ce39a66..b4725f34 100644
--- a/rsconcept/frontend/src/components/man/HelpCstAttributes.tsx
+++ b/rsconcept/frontend/src/components/man/HelpCstAttributes.tsx
@@ -7,7 +7,7 @@ function HelpCstAttributes() {
// prettier-ignore
return (
-
Аттрибуты конституенты
+
Атрибуты конституенты
Термин может быть присвоен любой конституенте. Он используется в других Терминах и в Текстовых определениях
Формальное определение строится с помощью формального аппарата
Типизация вычисляется автоматически на основе Формального определения и отражает структуру элементов множества, задаваемого этим определением
diff --git a/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx b/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
index ca6fd9d7..f860fc3a 100644
--- a/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
+++ b/rsconcept/frontend/src/components/ui/DataTable/TableBody.tsx
@@ -71,7 +71,7 @@ function TableBody
({
void;
}
-function TopicsListDropDown({ activeTopic, onChangeTopic }: TopicsListDropDownProps) {
+function TopicsDropdown({ activeTopic, onChangeTopic }: TopicsDropdownProps) {
const menu = useDropdown();
- const { noNavigation } = useConceptOptions();
+ const { noNavigation, calculateHeight } = useConceptOptions();
const selectTheme = useCallback(
(topic: HelpTopic) => {
@@ -34,7 +34,7 @@ function TopicsListDropDown({ activeTopic, onChangeTopic }: TopicsListDropDownPr
: }
- className='w-[3rem] h-7'
+ className='w-[3rem] h-7 rounded-none'
onClick={menu.toggle}
/>
- {Object.values(HelpTopic).map((topic, index) => (
- selectTheme(topic)}
- >
- {labelHelpTopic(topic)}
-
- ))}
+
);
}
-export default TopicsListDropDown;
+export default TopicsDropdown;
diff --git a/rsconcept/frontend/src/pages/ManualsPage/TopicsList.tsx b/rsconcept/frontend/src/pages/ManualsPage/TopicsList.tsx
index 86e84334..5a3b1075 100644
--- a/rsconcept/frontend/src/pages/ManualsPage/TopicsList.tsx
+++ b/rsconcept/frontend/src/pages/ManualsPage/TopicsList.tsx
@@ -3,8 +3,8 @@
import useWindowSize from '@/hooks/useWindowSize';
import { HelpTopic } from '@/models/miscellaneous';
-import TopicsListDropDown from './TopicsListDropdown';
-import TopicsListStatic from './TopicsListStatic';
+import TopicsDropdown from './TopicsDropdown';
+import TopicsStatic from './TopicsStatic';
interface TopicsListProps {
activeTopic: HelpTopic;
@@ -15,9 +15,9 @@ function TopicsList({ activeTopic, onChangeTopic }: TopicsListProps) {
const size = useWindowSize();
if (!size.isSmall) {
- return ;
+ return ;
} else {
- return ;
+ return ;
}
}
diff --git a/rsconcept/frontend/src/pages/ManualsPage/TopicsStatic.tsx b/rsconcept/frontend/src/pages/ManualsPage/TopicsStatic.tsx
new file mode 100644
index 00000000..3ecb6a75
--- /dev/null
+++ b/rsconcept/frontend/src/pages/ManualsPage/TopicsStatic.tsx
@@ -0,0 +1,33 @@
+import clsx from 'clsx';
+
+import { useConceptOptions } from '@/context/OptionsContext';
+import { HelpTopic } from '@/models/miscellaneous';
+
+import TopicsTree from './TopicsTree';
+
+interface TopicsStaticProps {
+ activeTopic: HelpTopic;
+ onChangeTopic: (newTopic: HelpTopic) => void;
+}
+
+function TopicsStatic({ activeTopic, onChangeTopic }: TopicsStaticProps) {
+ const { calculateHeight } = useConceptOptions();
+ return (
+
+
+
+ );
+}
+
+export default TopicsStatic;
diff --git a/rsconcept/frontend/src/pages/ManualsPage/TopicsListStatic.tsx b/rsconcept/frontend/src/pages/ManualsPage/TopicsTree.tsx
similarity index 61%
rename from rsconcept/frontend/src/pages/ManualsPage/TopicsListStatic.tsx
rename to rsconcept/frontend/src/pages/ManualsPage/TopicsTree.tsx
index bf210084..fbaba992 100644
--- a/rsconcept/frontend/src/pages/ManualsPage/TopicsListStatic.tsx
+++ b/rsconcept/frontend/src/pages/ManualsPage/TopicsTree.tsx
@@ -1,33 +1,26 @@
+'use client';
+
import clsx from 'clsx';
+import { AnimatePresence } from 'framer-motion';
import { HelpTopic } from '@/models/miscellaneous';
import { prefixes } from '@/utils/constants';
import { describeHelpTopic, labelHelpTopic } from '@/utils/labels';
-interface TopicsListStaticProps {
+interface TopicsTreeProps {
activeTopic: HelpTopic;
onChangeTopic: (newTopic: HelpTopic) => void;
}
-function TopicsListStatic({ activeTopic, onChangeTopic }: TopicsListStaticProps) {
+function TopicsTree({ activeTopic, onChangeTopic }: TopicsTreeProps) {
return (
-
+
{Object.values(HelpTopic).map((topic, index) => (
))}
-
+
);
}
-export default TopicsListStatic;
+export default TopicsTree;
diff --git a/rsconcept/frontend/src/styling/styles.css b/rsconcept/frontend/src/styling/styles.css
index b3faf5d6..6b125921 100644
--- a/rsconcept/frontend/src/styling/styles.css
+++ b/rsconcept/frontend/src/styling/styles.css
@@ -231,7 +231,7 @@
@apply flex gap-1;
}
- .cc-table-row {
+ .cc-scroll-row {
scroll-snap-align: start;
scroll-snap-stop: always;
}