Update article content

nothing9537 · Nov 1, 2023 · fd688a0 · fd688a0
1 parent 7dde18e
commit fd688a0
Show file tree

Hide file tree

Showing 11 changed files with 251 additions and 182 deletions.
diff --git a/extractedTranslations/en/translation.json b/extractedTranslations/en/translation.json
@@ -46,6 +46,7 @@
   "desc-sort": "desc-sort",
   "design-variant": "design-variant",
   "edit": "edit",
+  "edit-page": "edit-page",
   "enter-pass": "enter-pass",
   "enter-password": "enter-password",
   "enter-username": "enter-username",

diff --git a/extractedTranslations/ru/translation.json b/extractedTranslations/ru/translation.json
@@ -46,6 +46,7 @@
   "desc-sort": "desc-sort",
   "design-variant": "design-variant",
   "edit": "edit",
+  "edit-page": "edit-page",
   "enter-pass": "enter-pass",
   "enter-password": "enter-password",
   "enter-username": "enter-username",

diff --git a/index.html b/index.html
@@ -11,6 +11,9 @@
 <body>
 	<div id="root"></div>
 	<script type="module" src="/src/index.tsx"></script>
+	<button form>
+
+	</button>
 </body>
 
 </html>
diff --git a/json-server/db.json b/json-server/db.json
diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -21,5 +21,6 @@
   "send": "Send",
   "close": "Close",
   "let-your-feedback": "Let your feedback!",
-  "thanks-for-rate": "Thanks for your rate!"
+  "thanks-for-rate": "Thanks for your rate!",
+  "edit-page": "Edit page of article with"
 }
diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json
@@ -21,5 +21,6 @@
   "send": "Отправить",
   "close": "Закрыть",
   "let-your-feedback": "Оставьте ваш отзыв!",
-  "thanks-for-rate": "Спасибо за оценку!"
+  "thanks-for-rate": "Спасибо за оценку!",
+  "edit-page": "Страница редактирования статьи с"
 }
diff --git a/src/app/providers/RouterProvider/ui/AppRouter.tsx b/src/app/providers/RouterProvider/ui/AppRouter.tsx
@@ -3,6 +3,10 @@ import { Route, Routes } from 'react-router-dom';
 import { getUserAuthData } from '@/entities/User';
 import { useAppSelector } from '@/shared/lib/hooks/useAppSelector';
 import { PageLoader } from '@/widgets/PageLoader';
+import { AppLoaderLayout } from '@/shared/layouts/AppLoaderLayout';
+import { classNames } from '@/shared/lib/classNames/classNames';
+import { ToggleFeatures } from '@/shared/lib/features';
+
 import { routeConfig } from '../config/routeConfig';
 import { RequireAuth } from './RequireAuth';
 import { RequireRole } from './RequireRole';
@@ -40,8 +44,20 @@ export const AppRouter: FC = memo(() => {
     );
   }), [authData]);
 
+  const PageLoadingSuspense = (
+    <ToggleFeatures
+      name="isAppRedesigned"
+      on={(
+        <div className={classNames('App_redesigned', {}, ['scroll'])} id="App">
+          <AppLoaderLayout />
+        </div>
+      )}
+      off={<PageLoader />}
+    />
+  );
+
   return (
-    <Suspense fallback={<PageLoader />}>
+    <Suspense fallback={PageLoadingSuspense}>
       <Routes>
         {routes}
       </Routes>

diff --git a/src/pages/ArticleEditPage/ui/ArticleEditPage/ArticleEditPage.tsx b/src/pages/ArticleEditPage/ui/ArticleEditPage/ArticleEditPage.tsx
@@ -1,19 +1,22 @@
 import { FC, memo } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useParams } from 'react-router-dom';
+import { useAppTranslation } from '@/shared/lib/hooks/useAppTranslation';
 import { classNames } from '@/shared/lib/classNames/classNames';
 import { PageWrapper } from '@/widgets/PageWrapper';
+
 import cls from './ArticleEditPage.module.scss';
 
 interface ArticleEditPageProps {
   className?: string;
 }
 
 const ArticleEditPage: FC<ArticleEditPageProps> = memo(({ className }) => {
-  const { t } = useTranslation();
+  const { t } = useAppTranslation('translation');
+  const { id } = useParams<{ id: string }>();
 
   return (
     <PageWrapper className={classNames(cls.ArticleEditPage, {}, [className])}>
-      {t('Article edit page')}
+      {`${t('edit-page')} id = ${id}`}
     </PageWrapper>
   );
 });

diff --git a/src/shared/layouts/MainLayout/some.css b/src/shared/layouts/MainLayout/some.css
@@ -0,0 +1,3 @@
+.foo {
+  /* margin: 1px; */
+}
diff --git a/src/shared/layouts/StickyContentLayout/StickyContentLayout.module.scss b/src/shared/layouts/StickyContentLayout/StickyContentLayout.module.scss
@@ -11,7 +11,7 @@
 
 .content {
   grid-area: content;
-  max-width: 1200px;
+  max-width: 1300px;
   justify-self: center;
   width: 100%;
   display: flex;

diff --git a/src/widgets/PageError/ui/PageError/PageError.tsx b/src/widgets/PageError/ui/PageError/PageError.tsx
@@ -1,11 +1,16 @@
 import { FC } from 'react';
 import { useTranslation } from 'react-i18next';
 import { classNames } from '@/shared/lib/classNames/classNames';
-import { Button } from '@/shared/ui/deprecated/Button';
+import { Button as ButtonDeprecated } from '@/shared/ui/deprecated/Button';
+import { Text as TextDeprecated, TextSize, TextTheme } from '@/shared/ui/deprecated/Text';
+import { ToggleFeatures } from '@/shared/lib/features';
+import { Button } from '@/shared/ui/redesigned/Button';
+import { Text } from '@/shared/ui/redesigned/Text';
+
 import cls from './PageError.module.scss';
 
 interface PageErrorProps {
-	className?: string;
+  className?: string;
 }
 
 export const PageError: FC<PageErrorProps> = ({ className }) => {
@@ -15,10 +20,24 @@ export const PageError: FC<PageErrorProps> = ({ className }) => {
 
   return (
     <div className={classNames(cls.PageError, {}, [className])}>
-      <h1>{t('error-message')}</h1>
-      <Button onClick={reloadPage}>
-        {t('error-message-update-page')}
-      </Button>
+      <ToggleFeatures
+        name="isAppRedesigned"
+        on={<Text size="l" title={t('error-message')} variant="error" />}
+        off={<TextDeprecated size={TextSize.L} theme={TextTheme.ERROR} title={t('error-message')} />}
+      />
+      <ToggleFeatures
+        name="isAppRedesigned"
+        on={(
+          <Button onClick={reloadPage}>
+            {t('error-message-update-page')}
+          </Button>
+        )}
+        off={(
+          <ButtonDeprecated onClick={reloadPage}>
+            {t('error-message-update-page')}
+          </ButtonDeprecated>
+        )}
+      />
     </div>
   );
 };