Refactor frontend structure and names

This commit is contained in:
IRBorisov 2023-07-28 00:03:37 +03:00
parent 9dd3155319
commit bee8ee7738
22 changed files with 81 additions and 79 deletions

View File

@ -3,15 +3,15 @@ import { Route, Routes } from 'react-router-dom';
import Footer from './components/Footer';
import Navigation from './components/Navigation/Navigation';
import ToasterThemed from './components/ToasterThemed';
import CreateRSFormPage from './pages/CreateRSFormPage';
import HomePage from './pages/HomePage';
import LibraryPage from './pages/LibraryPage';
import LoginPage from './pages/LoginPage';
import ManualsPage from './pages/ManualsPage';
import NotFoundPage from './pages/NotFoundPage';
import RegisterPage from './pages/RegisterPage';
import RestorePasswordPage from './pages/RestorePasswordPage';
import RSFormCreatePage from './pages/RSFormCreatePage';
import RSFormPage from './pages/RSFormPage';
import RSFormsPage from './pages/RSFormsPage';
import UserProfilePage from './pages/UserProfilePage';
function App () {
@ -35,9 +35,9 @@ function App () {
<Route path='manuals' element={<ManualsPage/>} />
<Route path='rsforms' element={<RSFormsPage/>} />
<Route path='library' element={<LibraryPage/>} />
<Route path='rsforms/:id' element={ <RSFormPage/>} />
<Route path='rsform-create' element={ <RSFormCreatePage/>} />
<Route path='rsform-create' element={ <CreateRSFormPage/>} />
<Route path='*' element={ <NotFoundPage/>} />
</Routes>
</main>

View File

@ -27,7 +27,7 @@ function UserDropdown({ hideDropdown }: UserDropdownProps) {
const navigateMyWork = () => {
hideDropdown();
navigate('/rsforms?filter=personal');
navigate('/library?filter=personal');
};
return (

View File

@ -13,7 +13,7 @@ import RequireAuth from '../components/RequireAuth';
import useNewRSForm from '../hooks/useNewRSForm';
import { IRSFormCreateData, IRSFormMeta } from '../utils/models';
function RSFormCreatePage() {
function CreateRSFormPage() {
const navigate = useNavigate();
const [title, setTitle] = useState('');
@ -95,4 +95,4 @@ function RSFormCreatePage() {
);
}
export default RSFormCreatePage;
export default CreateRSFormPage;

View File

@ -6,9 +6,9 @@ function HomePage() {
const navigate = useNavigate();
const { user } = useAuth();
if (user) {
navigate('/rsforms?filter=personal');
navigate('/library?filter=personal');
} else {
navigate('/rsforms?filter=common');
navigate('/library?filter=common');
}
return (

View File

@ -6,11 +6,11 @@ import DataTableThemed from '../../components/Common/DataTableThemed';
import { useUsers } from '../../context/UsersContext';
import { IRSFormMeta } from '../../utils/models'
interface RSFormsTableProps {
interface ViewLibraryProps {
schemas: IRSFormMeta[]
}
function RSFormsTable({ schemas }: RSFormsTableProps) {
function ViewLibrary({ schemas }: ViewLibraryProps) {
const navigate = useNavigate();
const intl = useIntl();
const { getUserLabel } = useUsers();
@ -81,4 +81,4 @@ function RSFormsTable({ schemas }: RSFormsTableProps) {
);
}
export default RSFormsTable;
export default ViewLibrary;

View File

@ -5,9 +5,9 @@ import BackendError from '../../components/BackendError'
import { Loader } from '../../components/Common/Loader'
import { useAuth } from '../../context/AuthContext';
import { FilterType, type RSFormsFilter, useRSForms } from '../../hooks/useRSForms'
import RSFormsTable from './RSFormsTable';
import ViewLibrary from './ViewLibrary';
function RSFormsPage() {
function LibraryPage() {
const search = useLocation().search;
const { user } = useAuth();
const { rsforms, error, loading, loadList } = useRSForms();
@ -26,9 +26,9 @@ function RSFormsPage() {
<div className='w-full'>
{ loading && <Loader /> }
{ error && <BackendError error={error} />}
{ !loading && rsforms && <RSFormsTable schemas={rsforms} /> }
{ !loading && rsforms && <ViewLibrary schemas={rsforms} /> }
</div>
);
}
export default RSFormsPage;
export default LibraryPage;

View File

@ -5,14 +5,14 @@ import Modal from '../../components/Common/Modal';
import { type CstType } from '../../utils/models';
import { CstTypeSelector, getCstTypeLabel } from '../../utils/staticUI';
interface CreateCstModalProps {
interface DlgCreateCstProps {
show: boolean
hideWindow: () => void
defaultType?: CstType
onCreate: (type: CstType) => void
}
function CreateCstModal({ show, hideWindow, defaultType, onCreate }: CreateCstModalProps) {
function DlgCreateCst({ show, hideWindow, defaultType, onCreate }: DlgCreateCstProps) {
const [validated, setValidated] = useState(false);
const [selectedType, setSelectedType] = useState<CstType | undefined>(undefined);
@ -48,4 +48,4 @@ function CreateCstModal({ show, hideWindow, defaultType, onCreate }: CreateCstMo
)
}
export default CreateCstModal;
export default DlgCreateCst;

View File

@ -7,12 +7,12 @@ import Modal from '../../components/Common/Modal';
import { useRSForm } from '../../context/RSFormContext';
import { IRSFormUploadData } from '../../utils/models';
interface UploadRSFormModalProps {
interface DlgUploadRSFormProps {
show: boolean
hideWindow: () => void
}
function UploadRSFormModal({ show, hideWindow }: UploadRSFormModalProps) {
function DlgUploadRSForm({ show, hideWindow }: DlgUploadRSFormProps) {
const { upload } = useRSForm();
const [loadMetadata, setLoadMetadata] = useState(false);
const [file, setFile] = useState<File | undefined>()
@ -60,4 +60,4 @@ function UploadRSFormModal({ show, hideWindow }: UploadRSFormModalProps) {
)
}
export default UploadRSFormModal;
export default DlgUploadRSForm;

View File

@ -9,12 +9,12 @@ import { DumpBinIcon, SaveIcon, SmallPlusIcon } from '../../components/Icons';
import { useRSForm } from '../../context/RSFormContext';
import { type CstType, EditMode, type ICstCreateData, ICstUpdateData } from '../../utils/models';
import { createAliasFor, getCstTypeLabel } from '../../utils/staticUI';
import ConstituentsSideList from './ConstituentsSideList';
import CreateCstModal from './CreateCstModal';
import ExpressionEditor from './ExpressionEditor';
import DlgCreateCst from './DlgCreateCst';
import EditorRSExpression from './EditorRSExpression';
import ViewSideConstituents from './elements/ViewSideConstituents';
import { RSTabsList } from './RSTabs';
function ConstituentEditor() {
function EditorConstituenta() {
const navigate = useNavigate();
const {
activeCst, activeID, schema, setActiveID, processing, isEditable,
@ -94,11 +94,13 @@ function ConstituentEditor() {
items: [{ id: activeID }]
}
const index = schema.items.findIndex((cst) => cst.id === activeID);
let newActive: number | undefined = undefined
if (index !== -1 && index + 1 < schema.items.length) {
setActiveID(schema.items[index + 1].id);
newActive = schema.items[index + 1].id;
}
cstDelete(data, () => toast.success('Конституента удалена'));
}, [activeID, schema, setActiveID, cstDelete]);
if (newActive) navigate(`/rsforms/${schema.id}?tab=${RSTabsList.CST_EDIT}&active=${newActive}`);
}, [activeID, schema, cstDelete, navigate]);
const handleAddNew = useCallback(
(type?: CstType) => {
@ -130,7 +132,7 @@ function ConstituentEditor() {
return (
<div className='flex items-start w-full gap-2'>
<CreateCstModal
<DlgCreateCst
show={showCstModal}
hideWindow={() => { setShowCstModal(false); }}
onCreate={handleAddNew}
@ -196,7 +198,7 @@ function ConstituentEditor() {
value={typification}
disabled
/>
<ExpressionEditor id='expression' label='Формальное выражение'
<EditorRSExpression id='expression' label='Формальное выражение'
placeholder='Родоструктурное выражение, задающее формальное определение'
value={expression}
disabled={!isEnabled}
@ -232,9 +234,9 @@ function ConstituentEditor() {
/>
</div>
</form>
<ConstituentsSideList expression={expression}/>
<ViewSideConstituents expression={expression}/>
</div>
);
}
export default ConstituentEditor;
export default EditorConstituenta;

View File

@ -9,13 +9,13 @@ import { useRSForm } from '../../context/RSFormContext';
import { useConceptTheme } from '../../context/ThemeContext';
import { CstType, type IConstituenta, type ICstCreateData, ICstMovetoData,inferStatus, ParsingStatus, ValueClass } from '../../utils/models'
import { createAliasFor, getCstTypePrefix, getCstTypeShortcut, getStatusInfo, getTypeLabel } from '../../utils/staticUI';
import CreateCstModal from './CreateCstModal';
import DlgCreateCst from './DlgCreateCst';
interface ConstituentsTableProps {
interface EditorItemsProps {
onOpenEdit: (cst: IConstituenta) => void
}
function ConstituentsTable({ onOpenEdit }: ConstituentsTableProps) {
function EditorItems({ onOpenEdit }: EditorItemsProps) {
const {
schema, isEditable,
cstCreate, cstDelete, cstMoveTo, resetAliases
@ -284,7 +284,7 @@ function ConstituentsTable({ onOpenEdit }: ConstituentsTableProps) {
);
return (<>
<CreateCstModal
<DlgCreateCst
show={showCstModal}
hideWindow={() => { setShowCstModal(false); }}
onCreate={handleAddNew}
@ -380,4 +380,4 @@ function ConstituentsTable({ onOpenEdit }: ConstituentsTableProps) {
</>);
}
export default ConstituentsTable;
export default EditorItems;

View File

@ -8,13 +8,13 @@ import { useRSForm } from '../../context/RSFormContext';
import useCheckExpression from '../../hooks/useCheckExpression';
import { TokenID } from '../../utils/enums';
import { CstType } from '../../utils/models';
import ParsingResult from './ParsingResult';
import RSLocalButton from './RSLocalButton';
import RSTokenButton from './RSTokenButton';
import StatusBar from './StatusBar';
import { getSymbolSubstitute, TextWrapper } from './textEditing';
import ParsingResult from './elements/ParsingResult';
import RSLocalButton from './elements/RSLocalButton';
import RSTokenButton from './elements/RSTokenButton';
import StatusBar from './elements/StatusBar';
import { getSymbolSubstitute, TextWrapper } from './elements/textEditing';
interface ExpressionEditorProps {
interface EditorRSExpressionProps {
id: string
label: string
isActive: boolean
@ -27,10 +27,10 @@ interface ExpressionEditorProps {
setValue: (expression: string) => void
}
function ExpressionEditor({
function EditorRSExpression({
id, label, disabled, isActive, placeholder, value, setValue,
toggleEditMode, setTypification, onChange
}: ExpressionEditorProps) {
}: EditorRSExpressionProps) {
const { schema, activeCst } = useRSForm();
const [isModified, setIsModified] = useState(false);
const { parseData, checkExpression, resetParse, loading } = useCheckExpression({ schema });
@ -231,4 +231,4 @@ function ExpressionEditor({
);
}
export default ExpressionEditor;
export default EditorRSExpression;

View File

@ -15,7 +15,7 @@ import { useUsers } from '../../context/UsersContext';
import { IRSFormCreateData } from '../../utils/models';
import { claimOwnershipProc, deleteRSFormProc, downloadRSFormProc, shareCurrentURLProc } from '../../utils/procedures';
function RSFormCard() {
function EditorRSForm() {
const navigate = useNavigate();
const intl = useIntl();
const { getUserLabel } = useUsers();
@ -153,4 +153,4 @@ function RSFormCard() {
);
}
export default RSFormCard;
export default EditorRSForm;

View File

@ -7,10 +7,10 @@ import { Loader } from '../../components/Common/Loader';
import { useRSForm } from '../../context/RSFormContext';
import useLocalStorage from '../../hooks/useLocalStorage';
import { type IConstituenta } from '../../utils/models';
import ConstituentEditor from './ConstituentEditor';
import ConstituentsTable from './ConstituentsTable';
import RSFormCard from './RSFormCard';
import RSFormStats from './RSFormStats';
import EditorConstituenta from './EditorConstituenta';
import EditorItems from './EditorItems';
import EditorRSForm from './EditorRSForm';
import RSFormStats from './elements/RSFormStats';
import RSTabsMenu from './RSTabsMenu';
export enum RSTabsList {
@ -96,16 +96,16 @@ function RSTabs() {
</TabList>
<TabPanel className='flex items-start w-full gap-2'>
<RSFormCard />
<EditorRSForm />
{schema.stats && <RSFormStats stats={schema.stats}/>}
</TabPanel>
<TabPanel className='w-full'>
<ConstituentsTable onOpenEdit={onEditCst} />
<EditorItems onOpenEdit={onEditCst} />
</TabPanel>
<TabPanel>
<ConstituentEditor />
<EditorConstituenta />
</TabPanel>
</Tabs>
}

View File

@ -11,7 +11,7 @@ import { useAuth } from '../../context/AuthContext';
import { useRSForm } from '../../context/RSFormContext';
import useDropdown from '../../hooks/useDropdown';
import { claimOwnershipProc, deleteRSFormProc, downloadRSFormProc, shareCurrentURLProc } from '../../utils/procedures';
import UploadRSFormModal from './UploadRSFormModal';
import DlgUploadRSForm from './DlgUploadRSForm';
function RSTabsMenu() {
const navigate = useNavigate();
@ -60,7 +60,7 @@ function RSTabsMenu() {
return (
<>
<UploadRSFormModal
<DlgUploadRSForm
show={showUploadModal}
hideWindow={() => { setShowUploadModal(false); }}
/>

View File

@ -1,5 +1,5 @@
import PrettyJson from '../../components/Common/PrettyJSON';
import { ExpressionParse } from '../../utils/models';
import PrettyJson from '../../../components/Common/PrettyJSON';
import { ExpressionParse } from '../../../utils/models';
interface ParsingResultProps {
data?: ExpressionParse

View File

@ -1,7 +1,7 @@
import Card from '../../components/Common/Card';
import Divider from '../../components/Common/Divider';
import LabeledText from '../../components/Common/LabeledText';
import { type IRSFormStats } from '../../utils/models';
import Card from '../../../components/Common/Card';
import Divider from '../../../components/Common/Divider';
import LabeledText from '../../../components/Common/LabeledText';
import { type IRSFormStats } from '../../../utils/models';
interface RSFormStatsProps {
stats: IRSFormStats

View File

@ -1,4 +1,4 @@
import { TokenID } from '../../utils/enums';
import { TokenID } from '../../../utils/enums';
interface RSLocalButtonProps {
text: string

View File

@ -1,5 +1,5 @@
import { TokenID } from '../../utils/enums';
import { getRSButtonData } from '../../utils/staticUI'
import { TokenID } from '../../../utils/enums';
import { getRSButtonData } from '../../../utils/staticUI'
interface RSTokenButtonProps {
id: TokenID

View File

@ -1,7 +1,7 @@
import { useMemo } from 'react';
import { ExpressionParse,ExpressionStatus, type IConstituenta, inferStatus, ParsingStatus } from '../../utils/models';
import { getStatusInfo } from '../../utils/staticUI';
import { ExpressionParse,ExpressionStatus, type IConstituenta, inferStatus, ParsingStatus } from '../../../utils/models';
import { getStatusInfo } from '../../../utils/staticUI';
interface StatusBarProps {
isModified?: boolean

View File

@ -1,17 +1,17 @@
import { useCallback, useEffect, useMemo, useState } from 'react';
import Checkbox from '../../components/Common/Checkbox';
import DataTableThemed from '../../components/Common/DataTableThemed';
import { useRSForm } from '../../context/RSFormContext';
import useLocalStorage from '../../hooks/useLocalStorage';
import { CstType, type IConstituenta, matchConstituenta } from '../../utils/models';
import { extractGlobals, getMockConstituenta } from '../../utils/staticUI';
import Checkbox from '../../../components/Common/Checkbox';
import DataTableThemed from '../../../components/Common/DataTableThemed';
import { useRSForm } from '../../../context/RSFormContext';
import useLocalStorage from '../../../hooks/useLocalStorage';
import { CstType, type IConstituenta, matchConstituenta } from '../../../utils/models';
import { extractGlobals, getMockConstituenta } from '../../../utils/staticUI';
interface ConstituentsSideListProps {
interface ViewSideConstituentsProps {
expression: string
}
function ConstituentsSideList({ expression }: ConstituentsSideListProps) {
function ViewSideConstituents({ expression }: ViewSideConstituentsProps) {
const { schema, setActiveID } = useRSForm();
const [filteredData, setFilteredData] = useState<IConstituenta[]>(schema?.items ?? []);
const [filterText, setFilterText] = useLocalStorage('side-filter-text', '')
@ -145,4 +145,4 @@ function ConstituentsSideList({ expression }: ConstituentsSideListProps) {
);
}
export default ConstituentsSideList;
export default ViewSideConstituents;

View File

@ -1,6 +1,6 @@
// Formatted text editing helpers
import { TokenID } from '../../utils/enums';
import { TokenID } from '../../../utils/enums';
export function getSymbolSubstitute(input: string): string | undefined {
switch (input) {

View File

@ -29,7 +29,7 @@ export function deleteRSFormProc(
}
destroy(() => {
toast.success('Схема удалена');
navigate('/rsforms?filter=personal');
navigate('/library?filter=personal');
});
}