From 0134af6b57cccd80861fcdf0dd985026d281a0fc Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Sun, 27 Aug 2023 19:48:08 +0300
Subject: [PATCH 1/8] Fix RSLang editing

---
 .../src/components/RSInput/bracketMatching.ts |  8 ++++-
 .../src/components/RSInput/textEditing.ts     | 32 ++++++++-----------
 2 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/rsconcept/frontend/src/components/RSInput/bracketMatching.ts b/rsconcept/frontend/src/components/RSInput/bracketMatching.ts
index 1b26fff7..e9e9c0e7 100644
--- a/rsconcept/frontend/src/components/RSInput/bracketMatching.ts
+++ b/rsconcept/frontend/src/components/RSInput/bracketMatching.ts
@@ -21,5 +21,11 @@ const darkTheme = EditorView.baseTheme(bracketsDarkT);
 const lightTheme = EditorView.baseTheme(bracketsLightT);
 
 export function ccBracketMatching(darkMode: boolean) {
-  return [bracketMatching({ renderMatch: bracketRender }), darkMode ? darkTheme : lightTheme];
+  return [
+    bracketMatching({ 
+      renderMatch: bracketRender,
+      brackets:'{}[]()'
+    }),
+    darkMode ? darkTheme : lightTheme
+  ];
 }
\ No newline at end of file
diff --git a/rsconcept/frontend/src/components/RSInput/textEditing.ts b/rsconcept/frontend/src/components/RSInput/textEditing.ts
index 5f2d69d7..10209a4d 100644
--- a/rsconcept/frontend/src/components/RSInput/textEditing.ts
+++ b/rsconcept/frontend/src/components/RSInput/textEditing.ts
@@ -51,15 +51,19 @@ export class TextWrapper {
   }
 
   envelopeWith(left: string, right: string) {
+    const hasSelection = this.ref.view.state.selection.main.from !== this.ref.view.state.selection.main.to
+    const newSelection = hasSelection ? {
+      anchor: this.ref.view.state.selection.main.from,
+      head: this.ref.view.state.selection.main.to + left.length + right.length
+    } : {
+      anchor: this.ref.view.state.selection.main.to + left.length + right.length - 1,
+    }
     this.ref.view.dispatch({
       changes: [
         {from: this.ref.view.state.selection.main.from, insert: left}, 
         {from: this.ref.view.state.selection.main.to, insert: right}
       ],
-      selection: {
-        anchor: this.ref.view.state.selection.main.from,
-        head: this.ref.view.state.selection.main.to + left.length + right.length
-      }
+      selection: newSelection
     });
   }
 
@@ -89,11 +93,6 @@ export class TextWrapper {
       } else {
         this.envelopeWith('I{(σ, γ) | σ:∈X1; γ:=F1[σ]; P1[σ, γ]', '}');
       }
-      this.ref.view.dispatch({
-        selection: {
-          anchor: this.ref.view.state.selection.main.from + 2,
-        }
-      });
       return true;
     }
     case TokenID.NT_RECURSIVE_FULL: {
@@ -102,11 +101,6 @@ export class TextWrapper {
       } else {
         this.envelopeWith('R{ξ:=D1 | F1[ξ]≠∅ | ξ∪F1[ξ]', '}');
       }
-      this.ref.view.dispatch({
-        selection: {
-          anchor: this.ref.view.state.selection.main.from + 2,
-        }
-      });
       return true;
     }
     case TokenID.BIGPR: this.envelopeWith('Pr1(', ')'); return true;
@@ -128,11 +122,13 @@ export class TextWrapper {
     }
     case TokenID.PUNC_SL: {
       this.envelopeWith('[', ']');
-      this.ref.view.dispatch({
-        selection: {
-          anchor: hasSelection ? this.ref.view.state.selection.main.to: this.ref.view.state.selection.main.from + 1,
-        }
+      if (hasSelection) {
+        this.ref.view.dispatch({
+          selection: {
+            anchor: hasSelection ? this.ref.view.state.selection.main.to: this.ref.view.state.selection.main.from + 1,
+          }
       });
+      }
       return true;
     }
     case TokenID.BOOLEAN: {

From 0fb9ea932d64453eb06ba1a23d97bf9b95a5100e Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Sun, 27 Aug 2023 22:08:18 +0300
Subject: [PATCH 2/8] Refactor router and add unsaved changes prompt

---
 rsconcept/frontend/src/App.tsx                | 76 ++++++++++++++-----
 .../src/hooks/useModificationPrompt.ts        | 14 ++++
 rsconcept/frontend/src/main.tsx               |  3 -
 rsconcept/frontend/src/pages/HomePage.tsx     |  2 +-
 rsconcept/frontend/src/pages/NotFoundPage.tsx |  9 ++-
 .../pages/RSFormPage/EditorConstituenta.tsx   |  6 +-
 .../src/pages/RSFormPage/EditorRSForm.tsx     |  5 +-
 .../pages/UserProfilePage/EditorProfile.tsx   |  5 +-
 8 files changed, 88 insertions(+), 32 deletions(-)
 create mode 100644 rsconcept/frontend/src/hooks/useModificationPrompt.ts

diff --git a/rsconcept/frontend/src/App.tsx b/rsconcept/frontend/src/App.tsx
index ffa2af93..c9a5e206 100644
--- a/rsconcept/frontend/src/App.tsx
+++ b/rsconcept/frontend/src/App.tsx
@@ -1,4 +1,4 @@
-import { Route, Routes } from 'react-router-dom';
+import { createBrowserRouter, Outlet, RouterProvider } from 'react-router-dom';
 
 import Footer from './components/Footer';
 import Navigation from './components/Navigation/Navigation';
@@ -15,8 +15,8 @@ import RestorePasswordPage from './pages/RestorePasswordPage';
 import RSFormPage from './pages/RSFormPage';
 import UserProfilePage from './pages/UserProfilePage';
 
-function App () {
-  const { noNavigation, noFooter, viewportHeight, mainHeight } = useConceptTheme();  
+function Root() {
+  const { noNavigation, noFooter, viewportHeight, mainHeight } = useConceptTheme();
   return (
     <div className='antialiased clr-app'>
       <Navigation />
@@ -26,24 +26,9 @@ function App () {
         draggable={false}
         pauseOnFocusLoss={false}
       />
-      
       <div className='overflow-auto' style={{maxHeight: viewportHeight}}>
       <main className='h-full' style={{minHeight: mainHeight}}>
-        <Routes>
-          <Route path='/' element={ <HomePage/>} />
-
-          <Route path='login' element={ <LoginPage/>} />
-          <Route path='signup' element={<RegisterPage/>} />
-          <Route path='restore-password' element={ <RestorePasswordPage/>} />
-          <Route path='profile' element={<UserProfilePage/>} />
-
-          <Route path='manuals' element={<ManualsPage/>} />
-
-          <Route path='library' element={<LibraryPage/>} />
-          <Route path='rsforms/:id' element={ <RSFormPage/>} />
-          <Route path='rsform-create' element={ <CreateRSFormPage/>} />
-          <Route path='*' element={ <NotFoundPage/>} />
-        </Routes>
+        <Outlet />
       </main>
       {!noNavigation && !noFooter && <Footer />}
       </div>
@@ -51,4 +36,57 @@ function App () {
   );
 }
 
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: <Root />,
+    errorElement: <NotFoundPage />,
+    children: [
+      {
+        path: '',
+        element: <HomePage />,
+      },
+      {
+        path: 'login',
+        element: <LoginPage />,
+      },
+      {
+        path: 'signup',
+        element: <RegisterPage />,
+      },
+      {
+        path: 'restore-password',
+        element: <RestorePasswordPage />,
+      },
+      {
+        path: 'profile',
+        element: <UserProfilePage />,
+      },
+      {
+        path: 'manuals',
+        element: <ManualsPage />,
+      },
+
+      {
+        path: 'library',
+        element: <LibraryPage />,
+      },
+      {
+        path: 'rsforms/:id',
+        element: <RSFormPage />,
+      },
+      {
+        path: 'rsform-create',
+        element: <CreateRSFormPage />,
+      },
+    ]
+  },
+]);
+
+function App () {
+  return (
+    <RouterProvider router={router} />
+  );
+}
+
 export default App;
diff --git a/rsconcept/frontend/src/hooks/useModificationPrompt.ts b/rsconcept/frontend/src/hooks/useModificationPrompt.ts
new file mode 100644
index 00000000..81cd5d28
--- /dev/null
+++ b/rsconcept/frontend/src/hooks/useModificationPrompt.ts
@@ -0,0 +1,14 @@
+import { useState } from 'react';
+import { unstable_usePrompt } from 'react-router-dom';
+
+function usePromptUnsaved() {
+  const [isModified, setIsModified] = useState(false);
+  unstable_usePrompt({
+    when: isModified,
+    message: 'Изменения не сохранены. Вы уверены что хотите совершить переход?'
+  });
+
+  return {isModified, setIsModified};
+}
+
+export default usePromptUnsaved;
\ No newline at end of file
diff --git a/rsconcept/frontend/src/main.tsx b/rsconcept/frontend/src/main.tsx
index bd8722ca..1030cfd4 100644
--- a/rsconcept/frontend/src/main.tsx
+++ b/rsconcept/frontend/src/main.tsx
@@ -4,7 +4,6 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import { ErrorBoundary } from 'react-error-boundary';
 import { IntlProvider } from 'react-intl';
-import { BrowserRouter } from 'react-router-dom';
 
 import App from './App.tsx'
 import ErrorFallback from './components/ErrorFallback.tsx';
@@ -27,7 +26,6 @@ const logError = (error: Error, info: { componentStack: string }) => {
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
-  <BrowserRouter>
   <ErrorBoundary
     FallbackComponent={ErrorFallback}
     onReset={resetState}
@@ -47,6 +45,5 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
   </ThemeState>
   </IntlProvider>
   </ErrorBoundary>
-  </BrowserRouter>
   </React.StrictMode>,
 )
diff --git a/rsconcept/frontend/src/pages/HomePage.tsx b/rsconcept/frontend/src/pages/HomePage.tsx
index a1cb99a5..1184cdca 100644
--- a/rsconcept/frontend/src/pages/HomePage.tsx
+++ b/rsconcept/frontend/src/pages/HomePage.tsx
@@ -21,7 +21,7 @@ function HomePage() {
   }, [navigate, user])
 
   return (
-    <div className='flex flex-col items-center justify-center w-full py-2'>
+    <div className='flex flex-col items-center justify-center w-full px-4 py-2'>
       <p>Лендинг находится в разработке. Данная страница видна только пользователям с правами администратора.</p>
     </div>
   );
diff --git a/rsconcept/frontend/src/pages/NotFoundPage.tsx b/rsconcept/frontend/src/pages/NotFoundPage.tsx
index 27a23c8a..f8906642 100644
--- a/rsconcept/frontend/src/pages/NotFoundPage.tsx
+++ b/rsconcept/frontend/src/pages/NotFoundPage.tsx
@@ -1,8 +1,11 @@
+import TextURL from '../components/Common/TextURL';
+
 export function NotFoundPage() {
   return (
-    <div>
-      <h1 className='text-xl font-semibold'>Error 404 - Not Found</h1>
-      <p className='mt-2'>Данная страница не существует или запрашиваемый объект отсутствует в базы данных</p>
+    <div className='flex flex-col px-4 py-2'>
+      <h1 className='text-xl font-semibold'>Ошибка 404 - Страница не найдена</h1>
+      <p className='mt-2'>Данная страница не существует или запрашиваемый объект отсутствует в базе данных</p>
+      <TextURL href='/' text='Вернуться на Портал' />
     </div>
   );
 }
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
index abb37287..cea063aa 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
@@ -9,6 +9,7 @@ import TextArea from '../../components/Common/TextArea';
 import HelpConstituenta from '../../components/Help/HelpConstituenta';
 import { DumpBinIcon, HelpIcon, PenIcon, SaveIcon, SmallPlusIcon } from '../../components/Icons';
 import { useRSForm } from '../../context/RSFormContext';
+import useModificationPrompt from '../../hooks/useModificationPrompt';
 import { CstType, EditMode, ICstCreateData, ICstRenameData, ICstUpdateData, SyntaxTree } from '../../utils/models';
 import { getCstTypificationLabel } from '../../utils/staticUI';
 import EditorRSExpression from './EditorRSExpression';
@@ -33,7 +34,8 @@ function EditorConstituenta({ activeID, onShowAST, onCreateCst, onRenameCst, onO
     return schema?.items?.find((cst) => cst.id === activeID);
   }, [schema?.items, activeID]);
 
-  const [isModified, setIsModified] = useState(false);
+  const { isModified, setIsModified } = useModificationPrompt();
+  
   const [editMode, setEditMode] = useState(EditMode.TEXT);
 
   const [alias, setAlias] = useState('');
@@ -59,7 +61,7 @@ function EditorConstituenta({ activeID, onShowAST, onCreateCst, onRenameCst, onO
     );
   }, [activeCst, activeCst?.term, activeCst?.definition.formal,
     activeCst?.definition.text.raw, activeCst?.convention,
-    term, textDefinition, expression, convention]);
+    term, textDefinition, expression, convention, setIsModified]);
 
   useLayoutEffect(
   () => {
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
index a2682356..ef1d81aa 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSForm.tsx
@@ -13,6 +13,7 @@ import { CrownIcon, DownloadIcon, DumpBinIcon, HelpIcon, SaveIcon, ShareIcon } f
 import { useAuth } from '../../context/AuthContext';
 import { useRSForm } from '../../context/RSFormContext';
 import { useUsers } from '../../context/UsersContext';
+import useModificationPrompt from '../../hooks/useModificationPrompt';
 import { IRSFormCreateData, LibraryItemType } from '../../utils/models';
 
 interface EditorRSFormProps {
@@ -37,7 +38,7 @@ function EditorRSForm({ onDestroy, onClaim, onShare, onDownload }: EditorRSFormP
   const [common, setCommon] = useState(false);
   const [canonical, setCanonical] = useState(false);
 
-  const [isModified, setIsModified] = useState(true);
+  const { isModified, setIsModified } = useModificationPrompt();
 
   useLayoutEffect(() => {
     if (!schema) {
@@ -53,7 +54,7 @@ function EditorRSForm({ onDestroy, onClaim, onShare, onDownload }: EditorRSFormP
     );
   }, [schema, schema?.title, schema?.alias, schema?.comment,
       schema?.is_common, schema?.is_canonical,
-      title, alias, comment, common, canonical]);
+      title, alias, comment, common, canonical, setIsModified]);
 
   useLayoutEffect(() => {
     if (schema) {
diff --git a/rsconcept/frontend/src/pages/UserProfilePage/EditorProfile.tsx b/rsconcept/frontend/src/pages/UserProfilePage/EditorProfile.tsx
index 5e3cac26..14a15cea 100644
--- a/rsconcept/frontend/src/pages/UserProfilePage/EditorProfile.tsx
+++ b/rsconcept/frontend/src/pages/UserProfilePage/EditorProfile.tsx
@@ -4,6 +4,7 @@ import { toast } from 'react-toastify';
 import SubmitButton from '../../components/Common/SubmitButton';
 import TextInput from '../../components/Common/TextInput';
 import { useUserProfile } from '../../context/UserProfileContext';
+import useModificationPrompt from '../../hooks/useModificationPrompt';
 import { IUserUpdateData } from '../../utils/models';
 
 function EditorProfile() {
@@ -14,7 +15,7 @@ function EditorProfile() {
   const [first_name, setFirstName] = useState('');
   const [last_name, setLastName] = useState('');
 
-  const [isModified, setIsModified] = useState(true);
+  const { isModified, setIsModified } = useModificationPrompt();
 
   useLayoutEffect(() => {
     if (!user) {
@@ -26,7 +27,7 @@ function EditorProfile() {
       user.first_name !== first_name ||
       user.last_name !== last_name
     );
-  }, [user, user?.email, user?.first_name, user?.last_name, email, first_name, last_name]);
+  }, [user, user?.email, user?.first_name, user?.last_name, email, first_name, last_name, setIsModified]);
 
   useLayoutEffect(() => {
     if (user) {

From 5fda409929b67237ab25312dbc28d86c66dfe8b9 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Sun, 27 Aug 2023 22:14:42 +0300
Subject: [PATCH 3/8] Use createRoot to enable React18 features

---
 rsconcept/frontend/src/main.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/rsconcept/frontend/src/main.tsx b/rsconcept/frontend/src/main.tsx
index 1030cfd4..55db8e0c 100644
--- a/rsconcept/frontend/src/main.tsx
+++ b/rsconcept/frontend/src/main.tsx
@@ -1,7 +1,7 @@
 import './index.css'
 
 import React from 'react'
-import ReactDOM from 'react-dom/client'
+import { createRoot } from 'react-dom/client'
 import { ErrorBoundary } from 'react-error-boundary';
 import { IntlProvider } from 'react-intl';
 
@@ -24,7 +24,7 @@ const logError = (error: Error, info: { componentStack: string }) => {
   console.log('Component stack: ' + info.componentStack)
 };
 
-ReactDOM.createRoot(document.getElementById('root')!).render(
+createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
   <ErrorBoundary
     FallbackComponent={ErrorFallback}

From 7da327c1312dc3e18d1bdebf9cc18038a8d66c5e Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Sun, 27 Aug 2023 23:04:57 +0300
Subject: [PATCH 4/8] Embed youtube video

---
 .../src/components/Common/EmbedYoutube.tsx    | 31 +++++++++++++
 .../src/components/Help/HelpRSLang.tsx        | 44 ++++++++++++++-----
 rsconcept/frontend/src/hooks/useWindowSize.ts | 31 +++++++++++++
 rsconcept/frontend/src/utils/constants.ts     |  4 ++
 4 files changed, 100 insertions(+), 10 deletions(-)
 create mode 100644 rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
 create mode 100644 rsconcept/frontend/src/hooks/useWindowSize.ts

diff --git a/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx b/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
new file mode 100644
index 00000000..bbb4da35
--- /dev/null
+++ b/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
@@ -0,0 +1,31 @@
+interface EmbedYoutubeProps {
+  videoID: string
+  pxHeight: number
+  pxWidth?: number
+}
+
+function EmbedYoutube({ videoID, pxHeight, pxWidth }: EmbedYoutubeProps) {
+  if (!pxWidth) {
+    pxWidth = pxHeight * 16 / 9;
+    console.log(pxWidth);
+  }
+  return (
+    <div 
+      className='relative'
+      style={{height: 0, paddingBottom: `${pxHeight}px`, paddingLeft: `${pxWidth}px`}}
+    >
+      <iframe
+        className='absolute top-0 left-0 clr-border'
+        style={{minHeight: `${pxHeight}px`, minWidth: `${pxWidth}px`}}
+        width={`${pxWidth}px`}
+        height={`${pxHeight}px`}
+        src={`https://www.youtube.com/embed/${videoID}`}
+        allow='accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture'
+        allowFullScreen
+        title='Встроенное видео Youtube'
+      />
+    </div>
+  );
+}
+
+export default EmbedYoutube;
diff --git a/rsconcept/frontend/src/components/Help/HelpRSLang.tsx b/rsconcept/frontend/src/components/Help/HelpRSLang.tsx
index 3daac446..dfe749cf 100644
--- a/rsconcept/frontend/src/components/Help/HelpRSLang.tsx
+++ b/rsconcept/frontend/src/components/Help/HelpRSLang.tsx
@@ -1,16 +1,40 @@
-import { urls } from '../../utils/constants';
+import { useMemo } from 'react';
+
+import useWindowSize from '../../hooks/useWindowSize';
+import { urls, youtube } from '../../utils/constants';
+import EmbedYoutube from '../Common/EmbedYoutube';
+
+const OPT_VIDEO_H = 1080
 
 function HelpRSLang() {
+  const windowSize = useWindowSize();
+
+  const videoHeight = useMemo(
+  () => {
+    const viewH = windowSize.height ?? 0;
+    const viewW = windowSize.width ?? 0;
+    return Math.min(OPT_VIDEO_H, viewH - 370, Math.floor((viewW - 250)*9/16));
+  }, [windowSize]);
+
   return (
-    <div>
-      <h1>Язык родов структур</h1>
-      <p>Формальная запись (<u>экспликация</u>) концептуальных схем осуществляется с помощью языка родов структур. Данный математический аппарат основан на аксиоматической теории множеств Цермелло-Френкеля и аппарате родов структур Н.Бурбаки.</p>
-      <p>Для ознакомления с основами родов структур можно использовать следующие материалы:</p>
-      <ul>
-        <li>1. <a className='underline' href={urls.intro_video}>Краткое введение в мат. аппарат</a></li>
-        <li>2. <a className='underline' href={urls.full_course}>Видео лекций по мат. аппарату для 4 курса (второй семестр 2022-23 год)</a></li>
-        <li>3. <a className='underline' href={urls.ponomarev}>Учебник И. Н. Пономарева</a></li>
-      </ul>
+    <div className='flex flex-col w-full gap-4'>
+      <div>
+        <h1>Язык родов структур</h1>
+        <p>Формальная запись (<u>экспликация</u>) концептуальных схем осуществляется с помощью языка родов структур.</p>
+        <p>Данный математический аппарат основан на аксиоматической теории множеств Цермелло-Френкеля и аппарате родов структур Н.Бурбаки.</p>
+        <p>Для ознакомления с основами родов структур можно использовать следующие материалы:</p>
+        <ul>
+          <li>1. <a className='underline' href={urls.intro_video}>Краткое введение в мат. аппарат</a></li>
+          <li>2. <a className='underline' href={urls.full_course}>Видео лекций по мат. аппарату для 4 курса (второй семестр 2022-23 год)</a></li>
+          <li>3. <a className='underline' href={urls.ponomarev}>Учебник И. Н. Пономарева</a></li>
+        </ul>
+      </div>
+      <div className='justify-center hidden w-full md:flex fleex-col'>
+        <EmbedYoutube
+          videoID={youtube.intro}
+          pxHeight={videoHeight}
+        />
+      </div>
     </div>
   );
 }
diff --git a/rsconcept/frontend/src/hooks/useWindowSize.ts b/rsconcept/frontend/src/hooks/useWindowSize.ts
new file mode 100644
index 00000000..0bf2e8de
--- /dev/null
+++ b/rsconcept/frontend/src/hooks/useWindowSize.ts
@@ -0,0 +1,31 @@
+import { useEffect, useState } from 'react';
+
+function useWindowSize() {
+  const isClient = typeof window === "object";
+
+  function getSize() {
+    return {
+      width: isClient ? window.innerWidth : undefined,
+      height: isClient ? window.innerHeight : undefined
+    };
+  }
+
+  const [windowSize, setWindowSize] = useState(getSize);
+
+  useEffect(
+  () => {
+    if (!isClient) {
+      return;
+    }
+    function handleResize() {
+      setWindowSize(getSize());
+    }
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return windowSize;
+}
+
+export default useWindowSize;
\ No newline at end of file
diff --git a/rsconcept/frontend/src/utils/constants.ts b/rsconcept/frontend/src/utils/constants.ts
index 933b6e94..226cf559 100644
--- a/rsconcept/frontend/src/utils/constants.ts
+++ b/rsconcept/frontend/src/utils/constants.ts
@@ -13,6 +13,10 @@ const dev = {
 export const config = process.env.NODE_ENV === 'production' ? prod : dev;
 export const TIMEOUT_UI_REFRESH = 100;
 
+export const youtube = {
+  intro: '0Ty9mu9sOJo'
+};
+
 export const urls = {
   concept: 'https://www.acconcept.ru/',
   exteor32: 'https://drive.google.com/open?id=1IHlMMwaYlAUBRSxU1RU_hXM5mFU9-oyK&usp=drive_fs',

From cac74272f290de697b7b259f566384e1e4416602 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Sun, 27 Aug 2023 23:09:34 +0300
Subject: [PATCH 5/8] Update ThemeContext.tsx

---
 rsconcept/frontend/src/context/ThemeContext.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/rsconcept/frontend/src/context/ThemeContext.tsx b/rsconcept/frontend/src/context/ThemeContext.tsx
index ad14c34a..4947a99f 100644
--- a/rsconcept/frontend/src/context/ThemeContext.tsx
+++ b/rsconcept/frontend/src/context/ThemeContext.tsx
@@ -58,7 +58,7 @@ export const ThemeState = ({ children }: ThemeStateProps) => {
   const mainHeight = useMemo(
   () => {
     return !noNavigation ? 
-      'calc(100vh - 8.6rem)'
+      'calc(100vh - 8rem)'
     : '100vh'; 
   }, [noNavigation]);
 

From 91c318f36a44182a175bb49e70c35e2b3ed39f6f Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Mon, 28 Aug 2023 00:03:31 +0300
Subject: [PATCH 6/8] Cleanup logging

---
 rsconcept/frontend/src/components/BackendError.tsx        | 2 +-
 rsconcept/frontend/src/components/Common/EmbedYoutube.tsx | 1 -
 rsconcept/frontend/src/components/ErrorFallback.tsx       | 2 +-
 rsconcept/frontend/src/hooks/useCheckExpression.ts        | 1 -
 4 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/rsconcept/frontend/src/components/BackendError.tsx b/rsconcept/frontend/src/components/BackendError.tsx
index 771f66a0..02e7d911 100644
--- a/rsconcept/frontend/src/components/BackendError.tsx
+++ b/rsconcept/frontend/src/components/BackendError.tsx
@@ -9,7 +9,7 @@ interface BackendErrorProps {
 }
 
 function DescribeError(error: ErrorInfo) {
-  console.log(error);
+  reportError(error);
   if (!error) {
     return <p>Ошибки отсутствуют</p>;
   } else if (typeof error === 'string') {
diff --git a/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx b/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
index bbb4da35..37264450 100644
--- a/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
+++ b/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
@@ -7,7 +7,6 @@ interface EmbedYoutubeProps {
 function EmbedYoutube({ videoID, pxHeight, pxWidth }: EmbedYoutubeProps) {
   if (!pxWidth) {
     pxWidth = pxHeight * 16 / 9;
-    console.log(pxWidth);
   }
   return (
     <div 
diff --git a/rsconcept/frontend/src/components/ErrorFallback.tsx b/rsconcept/frontend/src/components/ErrorFallback.tsx
index 80a600ad..83ffdd23 100644
--- a/rsconcept/frontend/src/components/ErrorFallback.tsx
+++ b/rsconcept/frontend/src/components/ErrorFallback.tsx
@@ -3,7 +3,7 @@ import { type FallbackProps } from 'react-error-boundary';
 import Button from './Common/Button';
 
 function ErrorFallback({ error, resetErrorBoundary }: FallbackProps) {
-  console.log(error);
+  reportError(error);
   return (
     <div className='flex flex-col items-center antialiased clr-app' role='alert'>
       <h1 className='text-lg font-semibold'>Something went wrong!</h1>
diff --git a/rsconcept/frontend/src/hooks/useCheckExpression.ts b/rsconcept/frontend/src/hooks/useCheckExpression.ts
index fcb7ba57..fc0f1fc9 100644
--- a/rsconcept/frontend/src/hooks/useCheckExpression.ts
+++ b/rsconcept/frontend/src/hooks/useCheckExpression.ts
@@ -9,7 +9,6 @@ import { getCstExpressionPrefix } from '../utils/staticUI';
 const LOGIC_TYPIIFCATION = 'LOGIC';
 
 function checkTypeConsistency(type: CstType, typification: string, args: IFunctionArg[]): boolean {
-  console.log(typification)
   switch (type) {
   case CstType.BASE:
   case CstType.CONSTANT:

From 329c2f943e5a7930381d67157a82cba719aa33e5 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Mon, 28 Aug 2023 10:50:07 +0300
Subject: [PATCH 7/8] Fix bug on deleting last cst

---
 .../frontend/src/pages/RSFormPage/EditorConstituenta.tsx    | 2 --
 rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx          | 6 ++++++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
index cea063aa..f832ec7b 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta.tsx
@@ -72,8 +72,6 @@ function EditorConstituenta({ activeID, onShowAST, onCreateCst, onRenameCst, onO
       setTextDefinition(activeCst.definition?.text?.raw ?? '');
       setExpression(activeCst.definition?.formal ?? '');
       setTypification(activeCst ? getCstTypificationLabel(activeCst) : 'N/A');
-    } else if (schema && schema?.items.length > 0) {
-      onOpenEdit(schema.items[0].id);
     }
   }, [activeCst, onOpenEdit, schema]);
 
diff --git a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
index ac2bb7b6..d25b1db3 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/RSTabs.tsx
@@ -163,6 +163,12 @@ function RSTabs() {
         while (activeIndex < schema.items.length && deleted.find(id => id === schema.items[activeIndex].id)) {
           ++activeIndex;
         }
+        if (activeIndex >= schema.items.length) {
+          activeIndex = schema.items.length - 1;
+          while (activeIndex >= 0 && deleted.find(id => id === schema.items[activeIndex].id)) {
+            --activeIndex;
+          }
+        }
         navigateTo(activeTab, schema.items[activeIndex].id);
       }
       if (afterDelete) afterDelete(deleted);

From aba28f7b3975b3478bc90b73a6059439dd18f6e0 Mon Sep 17 00:00:00 2001
From: IRBorisov <8611739+IRBorisov@users.noreply.github.com>
Date: Mon, 28 Aug 2023 10:50:10 +0300
Subject: [PATCH 8/8] Update backendAPI.ts

---
 rsconcept/frontend/src/utils/backendAPI.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/rsconcept/frontend/src/utils/backendAPI.ts b/rsconcept/frontend/src/utils/backendAPI.ts
index c40712bb..5b81e25a 100644
--- a/rsconcept/frontend/src/utils/backendAPI.ts
+++ b/rsconcept/frontend/src/utils/backendAPI.ts
@@ -117,7 +117,7 @@ export function getActiveUsers(request: FrontPull<IUserInfo[]>) {
 
 export function getLibrary(request: FrontPull<ILibraryItem[]>) {
   AxiosGet({
-    title: 'Available RSForms (Library) list',
+    title: 'Available LibraryItems list',
     endpoint: '/api/library/active',
     request: request
   });
@@ -138,7 +138,7 @@ export function postNewRSForm(request: FrontExchange<IRSFormCreateData, ILibrary
 
 export function postCloneLibraryItem(target: string, request: FrontExchange<IRSFormCreateData, IRSFormData>) {
   AxiosPost({
-    title: 'clone RSForm',
+    title: 'Clone RSForm',
     endpoint: `/api/library/${target}/clone`,
     request: request
   });
@@ -154,7 +154,7 @@ export function getRSFormDetails(target: string, request: FrontPull<IRSFormData>
 
 export function patchLibraryItem(target: string, request: FrontExchange<ILibraryUpdateData, ILibraryItem>) {
   AxiosPatch({
-    title: `RSForm id=${target}`,
+    title: `LibraryItem id=${target}`,
     endpoint: `/api/library/${target}`,
     request: request
   });
@@ -162,7 +162,7 @@ export function patchLibraryItem(target: string, request: FrontExchange<ILibrary
 
 export function deleteLibraryItem(target: string, request: FrontAction) {
   AxiosDelete({
-    title: `RSForm id=${target}`,
+    title: `LibraryItem id=${target}`,
     endpoint: `/api/library/${target}`,
     request: request
   });
@@ -170,7 +170,7 @@ export function deleteLibraryItem(target: string, request: FrontAction) {
 
 export function postClaimLibraryItem(target: string, request: FrontPull<ILibraryItem>) {
   AxiosPost({
-    title: `Claim on RSForm id=${target}`,
+    title: `Claim on LibrartyItem id=${target}`,
     endpoint: `/api/library/${target}/claim`,
     request: request
   });
@@ -178,7 +178,7 @@ export function postClaimLibraryItem(target: string, request: FrontPull<ILibrary
 
 export function postSubscribe(target: string, request: FrontAction) {
   AxiosPost({
-    title: `Claim on RSForm id=${target}`,
+    title: `Subscribe to LibrartyItem id=${target}`,
     endpoint: `/api/library/${target}/subscribe`,
     request: request
   });
@@ -186,7 +186,7 @@ export function postSubscribe(target: string, request: FrontAction) {
 
 export function deleteUnsubscribe(target: string, request: FrontAction) {
   AxiosDelete({
-    title: `Claim on RSForm id=${target}`,
+    title: `Unsubscribe from LibraryItem id=${target}`,
     endpoint: `/api/library/${target}/unsubscribe`,
     request: request
   });