From 29fdb70509ead0b9aa84b277472e4fbc5c4ba311 Mon Sep 17 00:00:00 2001 From: vchikalkin Date: Tue, 2 Jul 2024 17:38:19 +0300 Subject: [PATCH] add Errors tab move calculation content to file --- apps/web/Components/Calculation/index.ts | 4 -- apps/web/Components/Calculation/index.tsx | 77 +++++++++++++++++++++ apps/web/Components/Common/Notification.tsx | 2 +- apps/web/pages/index.jsx | 58 +--------------- apps/web/pages/unlimited.jsx | 25 +++---- 5 files changed, 90 insertions(+), 76 deletions(-) delete mode 100644 apps/web/Components/Calculation/index.ts create mode 100644 apps/web/Components/Calculation/index.tsx diff --git a/apps/web/Components/Calculation/index.ts b/apps/web/Components/Calculation/index.ts deleted file mode 100644 index 8b8b747..0000000 --- a/apps/web/Components/Calculation/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export * from './Form'; -export * from './Layout'; -export * from './Output'; -export * from './Settings'; diff --git a/apps/web/Components/Calculation/index.tsx b/apps/web/Components/Calculation/index.tsx new file mode 100644 index 0000000..ec00893 --- /dev/null +++ b/apps/web/Components/Calculation/index.tsx @@ -0,0 +1,77 @@ +import { Form } from './Form'; +import { Layout } from './Layout'; +import { Output } from './Output'; +import Validation from './Output/Validation'; +import { Settings } from './Settings'; +import { Notification } from '@/Components/Common'; +import { NavigationBar, Tabs } from '@/Components/Layout/Navigation'; +import { NavigationProvider } from '@/context/navigation'; +import { Media } from '@/styles/media'; +import { getPageTitle } from '@/utils/page'; +import Head from 'next/head'; +import { + BarChartOutlined, + CalculatorOutlined, + ProfileOutlined, + WarningOutlined, +} from 'ui/elements/icons'; + +const defaultIconStyle = { fontSize: '1.2rem' }; + +export const tabs = [ + { + Component: Settings, + icon: , + key: 'settings', + title: 'Интерес/Расчет', + }, + { + Component: Form, + icon: , + key: 'form', + title: 'Параметры', + }, + { + Component: Output, + icon: , + key: 'output', + title: 'Результаты', + }, + { + Component: Validation.Component, + icon: , + key: Validation.id, + title: Validation.title, + }, +]; + +type ContentProps = { + readonly initHooks: () => void; + readonly title: string; +}; + +export function Content({ initHooks, title }: ContentProps) { + initHooks(); + + return ( + <> + + {getPageTitle(title)} + + + + + + + + + + + {tabs.map(({ Component, key }) => ( + + ))} + + + + ); +} diff --git a/apps/web/Components/Common/Notification.tsx b/apps/web/Components/Common/Notification.tsx index 5b7a859..01c76c3 100644 --- a/apps/web/Components/Common/Notification.tsx +++ b/apps/web/Components/Common/Notification.tsx @@ -8,7 +8,7 @@ import { message as antdMessage, notification as antdNotification } from 'ui/ele export let message: Readonly; export let notification: Readonly; -export function Notification({ children }: { readonly children: ReactNode }) { +export function Notification({ children }: { readonly children?: ReactNode }) { const [messageApi, messageContextHolder] = antdMessage.useMessage({ duration: 1.2, maxCount: 3, diff --git a/apps/web/pages/index.jsx b/apps/web/pages/index.jsx index cbb46ac..3eccaf2 100644 --- a/apps/web/pages/index.jsx +++ b/apps/web/pages/index.jsx @@ -1,65 +1,9 @@ import initializeApollo from '@/apollo/client'; -import * as Calculation from '@/Components/Calculation'; -import { Notification } from '@/Components/Common'; +import { Content } from '@/Components/Calculation'; import { Error } from '@/Components/Common/Error'; -import { NavigationBar, Tabs } from '@/Components/Layout/Navigation'; -import { NavigationProvider } from '@/context/navigation'; import * as hooks from '@/process/hooks'; -import { Media } from '@/styles/media'; -import { getPageTitle } from '@/utils/page'; import { makeGetUserType } from '@/utils/user'; import { dehydrate, QueryClient } from '@tanstack/react-query'; -import Head from 'next/head'; -import { AreaChartOutlined, CalculatorOutlined, ProfileOutlined } from 'ui/elements/icons'; - -const defaultIconStyle = { fontSize: '1.2rem' }; - -export const tabs = [ - { - Component: Calculation.Settings, - icon: , - key: 'settings', - title: 'Интерес/Расчет', - }, - { - Component: Calculation.Form, - icon: , - key: 'form', - title: 'Параметры', - }, - { - Component: Calculation.Output, - icon: , - key: 'output', - title: 'Результаты', - }, -]; - -export function Content({ initHooks, title }) { - initHooks(); - - return ( - <> - - {getPageTitle(title)} - - - - - - - - - - - {tabs.map(({ Component, key }) => ( - - ))} - - - - ); -} export default function Page(props) { if (props.statusCode !== 200) return ; diff --git a/apps/web/pages/unlimited.jsx b/apps/web/pages/unlimited.jsx index 6fe8d12..bc2f55f 100644 --- a/apps/web/pages/unlimited.jsx +++ b/apps/web/pages/unlimited.jsx @@ -1,7 +1,6 @@ -import { Content } from '.'; import initializeApollo from '@/apollo/client'; +import { Content } from '@/Components/Calculation'; import { Error } from '@/Components/Common/Error'; -import { NavigationProvider } from '@/context/navigation'; import * as hooks from '@/process/hooks'; import { makeGetUserType } from '@/utils/user'; import { dehydrate, QueryClient } from '@tanstack/react-query'; @@ -10,18 +9,16 @@ export default function Page(props) { if (props.statusCode !== 200) return ; return ( - - { - hooks.useSentryScope(); - hooks.useMainData(); - hooks.useGetUsers(); - hooks.useInsuranceData(); - hooks.useReactions(); - }} - /> - + { + hooks.useSentryScope(); + hooks.useMainData(); + hooks.useGetUsers(); + hooks.useInsuranceData(); + hooks.useReactions(); + }} + /> ); }