From 36971313c083940159e10abbba07e47f0817c24b Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Thu, 11 Jul 2024 13:17:48 -0600 Subject: [PATCH 01/11] updated side panel button --- src/locales/en/translation.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index b03d2ca..b25f6fe 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -225,7 +225,7 @@ "copy": "Copy", "country": "Country", "customizeRelaySettings": "Storage Settings", - "nft-dashboard": "Dashboard", + "nft-dashboard": "Relay Dashboard", "medical-dashboard": "Medical Dashboard", "dataDisplay": "Data display", "dataTables": "Storage Stats", From 75d2afd09659f38bc517b28ff5e726b07dfc6fb7 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Thu, 11 Jul 2024 13:18:12 -0600 Subject: [PATCH 02/11] content: change table name --- src/components/tables/Tables/Tables.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/tables/Tables/Tables.tsx b/src/components/tables/Tables/Tables.tsx index 382ff0b..d25e2a3 100644 --- a/src/components/tables/Tables/Tables.tsx +++ b/src/components/tables/Tables/Tables.tsx @@ -11,8 +11,9 @@ export const Tables: React.FC = () => { <> From 7957efccfb874fd21868a22b4c4787a55fe58631 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Thu, 11 Jul 2024 13:18:34 -0600 Subject: [PATCH 03/11] style: table border radius --- src/components/tables/Tables/Tables.styles.ts | 26 ++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/src/components/tables/Tables/Tables.styles.ts b/src/components/tables/Tables/Tables.styles.ts index 989f903..2d298ab 100644 --- a/src/components/tables/Tables/Tables.styles.ts +++ b/src/components/tables/Tables/Tables.styles.ts @@ -1,10 +1,34 @@ import styled from 'styled-components'; import { BaseCard as CommonCard } from '@app/components/common/BaseCard/BaseCard'; - +const borderRad = '.5rem'; export const TablesWrapper = styled.div` margin-top: 1.875rem; `; export const Card = styled(CommonCard)` margin-bottom: 2rem; + .table-mobile > div.ant-card-head-title { + padding-bottom: 0.3rem !important; + } + .ant-card-head-title { + padding-bottom: 0rem !important; + } + + div.ant-table.ant-table-bordered, + div.ant-table-container, + .ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table { + border-radius: ${borderRad}; + } + .ant-table-container table > thead > tr:first-child th:first-child { + border-top-left-radius: ${borderRad}; + } + .ant-table-container table > thead > tr:first-child th:last-child { + border-top-right-radius: ${borderRad}; + } + .ant-table-container table > tbody > tr:last-child td:last-child { + border-bottom-right-radius: ${borderRad}; + } + .ant-table-container table > tbody > tr:last-child td:first-child { + border-bottom-left-radius: ${borderRad}; + } `; From e68a36e2056238108b8d6d5f3fbc9ae05a438429 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Thu, 11 Jul 2024 12:31:56 -0700 Subject: [PATCH 04/11] style: adjust table spacing --- src/components/tables/Tables/Tables.styles.ts | 3 +++ src/components/tables/editableTable/EditableTable.tsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/tables/Tables/Tables.styles.ts b/src/components/tables/Tables/Tables.styles.ts index 2d298ab..03e61b1 100644 --- a/src/components/tables/Tables/Tables.styles.ts +++ b/src/components/tables/Tables/Tables.styles.ts @@ -13,6 +13,9 @@ export const Card = styled(CommonCard)` .ant-card-head-title { padding-bottom: 0rem !important; } + .ant-table-tbody > tr > td { + padding: 0.8rem; + } div.ant-table.ant-table-bordered, div.ant-table-container, diff --git a/src/components/tables/editableTable/EditableTable.tsx b/src/components/tables/editableTable/EditableTable.tsx index f00d903..487e2c7 100644 --- a/src/components/tables/editableTable/EditableTable.tsx +++ b/src/components/tables/editableTable/EditableTable.tsx @@ -116,7 +116,7 @@ const EditableTable: React.FC = () => { { title: t('tables.actions'), dataIndex: 'actions', - width: '15%', + width: '10%', render: (_: string, record: any) => ( showModal(record.kindNumber)}> From 3c3f847d3f00b1dc7e5c623a32b818b2127930d2 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sat, 13 Jul 2024 18:32:10 -0700 Subject: [PATCH 05/11] fix: graph selection issues --- .../BarAnimationDelayChart/BarAnimationDelayChart.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx b/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx index 7cb53fc..35ad4e2 100644 --- a/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx +++ b/src/components/charts/BarAnimationDelayChart/BarAnimationDelayChart.tsx @@ -5,6 +5,7 @@ import { BaseChart } from '@app/components/common/charts/BaseChart'; import { useAppSelector } from '@app/hooks/reduxHooks'; import { themeObject } from '@app/styles/themes/themeVariables'; import useBarChartData from '@app/hooks/useBarChartData'; +import { useResponsive } from '@app/hooks/useResponsive'; // Helper function to get the last six months from the current date const getLastSixMonths = () => { @@ -39,6 +40,7 @@ const getLastSixMonths = () => { export const BarAnimationDelayChart: React.FC = () => { const { t } = useTranslation(); const theme = useAppSelector((state) => state.theme.theme); + const { isDesktop } = useResponsive(); const { data, isLoading } = useBarChartData(); @@ -126,8 +128,9 @@ export const BarAnimationDelayChart: React.FC = () => { type: 'bar', data: data1, color: themeObject[theme].chartColor2, + legendHoverLink: isDesktop ? true : false, emphasis: { - focus: 'series', + disable: true, }, barGap: '-10%', // Slightly overlap bars barCategoryGap: '30%', @@ -139,8 +142,9 @@ export const BarAnimationDelayChart: React.FC = () => { data: data2, color: themeObject[theme].chartColor3, emphasis: { - focus: 'series', + disable: true, }, + legendHoverLink: isDesktop ? true : false, barGap: '-10%', // Slightly overlap bars barCategoryGap: '30%', animationDelay: (idx: number) => idx * 10 + 100, From bb1a0d6aa8fdaef046d9dd225a8583fbdfeeca20 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sat, 13 Jul 2024 19:53:37 -0700 Subject: [PATCH 06/11] fix: header scrolling issues --- src/components/common/Overlay/Overlay.tsx | 13 ++++++++----- src/components/header/Header.styles.ts | 3 ++- src/components/header/layouts/MobileHeader.tsx | 2 +- .../layouts/main/MainHeader/MainHeader.styles.ts | 4 ++++ .../layouts/main/MainLayout/MainLayout.styles.ts | 5 ++--- .../layouts/main/MainLayout/MainLayout.tsx | 11 +++++++++++ .../main/sider/MainSider/MainSider.styles.ts | 3 +-- src/styles/GlobalStyle.ts | 3 +++ 8 files changed, 32 insertions(+), 12 deletions(-) diff --git a/src/components/common/Overlay/Overlay.tsx b/src/components/common/Overlay/Overlay.tsx index 610d88c..5f89a21 100644 --- a/src/components/common/Overlay/Overlay.tsx +++ b/src/components/common/Overlay/Overlay.tsx @@ -5,16 +5,19 @@ interface OverlayProps { } export const Overlay = styled.div` - position: absolute; + position: fixed; z-index: 1; - height: 0; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + pointer-events: none; // Ensure it does not interfere with other elements when not visible ${(props) => props.show && css` - z-index: 2; + z-index: 101; backdrop-filter: blur(6px); - width: 100vw; - height: 100vh; + pointer-events: auto; // Enable interaction when visible `} `; diff --git a/src/components/header/Header.styles.ts b/src/components/header/Header.styles.ts index 6ee49aa..35bb4d3 100644 --- a/src/components/header/Header.styles.ts +++ b/src/components/header/Header.styles.ts @@ -44,7 +44,7 @@ export const DropdownCollapse = styled(BaseCollapse)` `; export const BurgerCol = styled(BaseCol)` - z-index: 999; + z-index: 105; display: flex; `; @@ -57,6 +57,7 @@ export const MobileBurger = styled(BurgerIcon)` ${(props) => props.isCross && css` + z-index: 105; color: var(--text-secondary-color); `}; `; diff --git a/src/components/header/layouts/MobileHeader.tsx b/src/components/header/layouts/MobileHeader.tsx index c197ad5..fbaf25f 100644 --- a/src/components/header/layouts/MobileHeader.tsx +++ b/src/components/header/layouts/MobileHeader.tsx @@ -26,7 +26,7 @@ const handleTouchStart = (event: React.TouchEvent) => { export const MobileHeader: React.FC = ({ toggleSider, isSiderOpened }) => { return ( - + diff --git a/src/components/layouts/main/MainHeader/MainHeader.styles.ts b/src/components/layouts/main/MainHeader/MainHeader.styles.ts index b1d88d3..41908ac 100644 --- a/src/components/layouts/main/MainHeader/MainHeader.styles.ts +++ b/src/components/layouts/main/MainHeader/MainHeader.styles.ts @@ -9,6 +9,10 @@ interface Header { export const Header = styled(BaseLayout.Header)
` line-height: 1.5; + z-index: 100; + position: sticky; + position: -webkit-sticky; + top: 0; @media only screen and ${media.md} { display: block; diff --git a/src/components/layouts/main/MainLayout/MainLayout.styles.ts b/src/components/layouts/main/MainLayout/MainLayout.styles.ts index 62ff6bb..4cba9d2 100644 --- a/src/components/layouts/main/MainLayout/MainLayout.styles.ts +++ b/src/components/layouts/main/MainLayout/MainLayout.styles.ts @@ -2,11 +2,10 @@ import styled from 'styled-components'; import { media } from '@app/styles/themes/constants'; import { BaseLayout } from '@app/components/common/BaseLayout/BaseLayout'; -export const LayoutMaster = styled(BaseLayout)` - height: 100vh; -`; +export const LayoutMaster = styled(BaseLayout)``; export const LayoutMain = styled(BaseLayout)` + height: fit-content; @media only screen and ${media.md} { margin-left: 80px; } diff --git a/src/components/layouts/main/MainLayout/MainLayout.tsx b/src/components/layouts/main/MainLayout/MainLayout.tsx index f2c5c30..5f5b594 100644 --- a/src/components/layouts/main/MainLayout/MainLayout.tsx +++ b/src/components/layouts/main/MainLayout/MainLayout.tsx @@ -43,6 +43,17 @@ const MainLayout: React.FC = () => { const duration_in_minutes = 60; // 60 minutes useIdleTimer(duration_in_minutes * 60 * 1000, handleIdle); + useEffect(() => { + if (!siderCollapsed) { + document.body.classList.add('no-scroll'); + } else { + document.body.classList.remove('no-scroll'); + } + + return () => { + document.body.classList.remove('no-scroll'); + }; + }, [siderCollapsed]); return ( diff --git a/src/components/layouts/main/sider/MainSider/MainSider.styles.ts b/src/components/layouts/main/sider/MainSider/MainSider.styles.ts index 0040bf1..063ab5a 100644 --- a/src/components/layouts/main/sider/MainSider/MainSider.styles.ts +++ b/src/components/layouts/main/sider/MainSider/MainSider.styles.ts @@ -9,7 +9,7 @@ export const Sider = styled(BaseLayout.Sider)` position: fixed; overflow: visible; right: 0; - z-index: 5; + z-index: 102; min-height: 100vh; max-height: 100vh; @@ -27,7 +27,6 @@ export const Sider = styled(BaseLayout.Sider)` export const CollapseButton = styled(BaseButton)<{ $isCollapsed: boolean }>` background: var(--collapse-background-color); - border: 1px solid var(--border-color); transition: all 0.2s ease; position: absolute; diff --git a/src/styles/GlobalStyle.ts b/src/styles/GlobalStyle.ts index db27d79..e69658e 100644 --- a/src/styles/GlobalStyle.ts +++ b/src/styles/GlobalStyle.ts @@ -37,6 +37,9 @@ export default createGlobalStyle` display: none; } } + body.no-scroll { + overflow: hidden; +} .range-picker { & .ant-picker-panels { From 809de8bccd2c3f107a21a055634cc65f0761e3da Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sun, 14 Jul 2024 08:27:40 -0700 Subject: [PATCH 07/11] fix: height issues --- src/components/layouts/main/MainLayout/MainLayout.styles.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/layouts/main/MainLayout/MainLayout.styles.ts b/src/components/layouts/main/MainLayout/MainLayout.styles.ts index 4cba9d2..5d2e2ee 100644 --- a/src/components/layouts/main/MainLayout/MainLayout.styles.ts +++ b/src/components/layouts/main/MainLayout/MainLayout.styles.ts @@ -2,7 +2,9 @@ import styled from 'styled-components'; import { media } from '@app/styles/themes/constants'; import { BaseLayout } from '@app/components/common/BaseLayout/BaseLayout'; -export const LayoutMaster = styled(BaseLayout)``; +export const LayoutMaster = styled(BaseLayout)` +height: 100vh; +`; export const LayoutMain = styled(BaseLayout)` height: fit-content; From bf1e333f03c2cf260e5648266491bb7f07a36b7f Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sun, 14 Jul 2024 12:31:26 -0700 Subject: [PATCH 08/11] fix: autoscroll speed --- src/components/common/SplideCarousel/SplideCarousel.tsx | 4 +++- .../nft-dashboard/trending-creators/TrendingCreators.tsx | 5 +++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/common/SplideCarousel/SplideCarousel.tsx b/src/components/common/SplideCarousel/SplideCarousel.tsx index a6e323c..9442fe0 100644 --- a/src/components/common/SplideCarousel/SplideCarousel.tsx +++ b/src/components/common/SplideCarousel/SplideCarousel.tsx @@ -8,6 +8,7 @@ interface BaseCarouselProps extends SplideProps { slidesToShow?: number; arrows?: boolean; dots?: boolean; + autoSpeed: number; infinite?: boolean; swipeSpeed?: number; type?: 'loop' | 'fade'; @@ -28,6 +29,7 @@ export const SplideCarousel = forwardRef { const [stories, setStories] = useState([]); @@ -44,7 +44,7 @@ export const TrendingCreators: React.FC = () => { profile11, ], }; - const { isTablet: isTabletOrHigher } = useResponsive(); + const { isTablet: isTabletOrHigher, isDesktop } = useResponsive(); const { t } = useTranslation(); const goPrev = () => { @@ -72,6 +72,7 @@ export const TrendingCreators: React.FC = () => { drag="free" gap=".2rem" snap="false" + autoSpeed= {isDesktop ? .7 : .8} flickPower="500" breakpoints={{ 8000: { From 832311d342334bbd49b5b2326b640071c0d77ba0 Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sun, 14 Jul 2024 12:44:31 -0700 Subject: [PATCH 09/11] fix: cache issues switch --- src/hooks/useRelaySettings.ts | 5 ++++- src/pages/RelaySettingsPage.tsx | 8 ++++++-- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/src/hooks/useRelaySettings.ts b/src/hooks/useRelaySettings.ts index 7aaaa5e..5e9fe67 100644 --- a/src/hooks/useRelaySettings.ts +++ b/src/hooks/useRelaySettings.ts @@ -22,7 +22,7 @@ interface RelaySettings { } const getInitialSettings = (): RelaySettings => { - const savedSettings = localStorage.getItem('relaySettings'); + const savedSettings = localStorage.getItem('settingsCache'); return savedSettings ? JSON.parse(savedSettings) : { @@ -53,6 +53,7 @@ const useRelaySettings = () => { localStorage.setItem('relaySettings', JSON.stringify(relaySettings)); }, [relaySettings]); + const fetchSettings = useCallback(async () => { try { const response = await fetch(`${config.baseURL}/relay-settings`, { @@ -75,6 +76,7 @@ const useRelaySettings = () => { ? data.relay_settings.chunked : [data.relay_settings.chunked], }); + localStorage.setItem('settingsCache', JSON.stringify(data.relay_settings)); localStorage.setItem('relaySettings', JSON.stringify(data.relay_settings)); } catch (error) { console.error('Error fetching settings:', error); @@ -100,6 +102,7 @@ const useRelaySettings = () => { if (!response.ok) { throw new Error(`Network response was not ok (status: ${response.status})`); } + localStorage.setItem('settingsCache', JSON.stringify(relaySettings)); console.log('Settings saved successfully!'); } catch (error) { console.error('Error saving settings:', error); diff --git a/src/pages/RelaySettingsPage.tsx b/src/pages/RelaySettingsPage.tsx index b1b3ce4..9ccbf17 100644 --- a/src/pages/RelaySettingsPage.tsx +++ b/src/pages/RelaySettingsPage.tsx @@ -17,7 +17,6 @@ import { useResponsive } from '@app/hooks/useResponsive'; import useRelaySettings from '@app/hooks/useRelaySettings'; import * as S from '@app/pages/uiComponentsPages/UIComponentsPage.styles'; import { themeObject } from '@app/styles/themes/themeVariables'; - const { Panel } = Collapse; const StyledPanel = styled(Panel)``; const { Option } = Select; @@ -99,7 +98,7 @@ const RelaySettingsPage: React.FC = () => { ]; const [settings, setSettings] = useState({ - mode: 'unlimited', + mode: JSON.parse(localStorage.getItem('relaySettings') || '{}').mode || relaymode || 'unlimited', protocol: ['WebSocket'], chunked: ['unchunked'], chunksize: '2', @@ -415,6 +414,11 @@ const RelaySettingsPage: React.FC = () => { const [newKind, setNewKind] = useState(''); + useEffect(() => { + return () => { + localStorage.setItem('relaySettings', localStorage.getItem('settingsCache') || '{}'); + }; + }, []); const removeDynamicKind = (kind: string) => { setSettings((prevSettings) => ({ ...prevSettings, From a40364b128b58d651a2c158a7f79f74d38e2e8fa Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sun, 14 Jul 2024 17:12:36 -0700 Subject: [PATCH 10/11] format --- src/components/layouts/main/MainLayout/MainLayout.styles.ts | 2 +- .../nft-dashboard/trending-creators/TrendingCreators.tsx | 2 +- src/hooks/useRelaySettings.ts | 1 - 3 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/layouts/main/MainLayout/MainLayout.styles.ts b/src/components/layouts/main/MainLayout/MainLayout.styles.ts index 5d2e2ee..191486d 100644 --- a/src/components/layouts/main/MainLayout/MainLayout.styles.ts +++ b/src/components/layouts/main/MainLayout/MainLayout.styles.ts @@ -3,7 +3,7 @@ import { media } from '@app/styles/themes/constants'; import { BaseLayout } from '@app/components/common/BaseLayout/BaseLayout'; export const LayoutMaster = styled(BaseLayout)` -height: 100vh; + height: 100vh; `; export const LayoutMain = styled(BaseLayout)` diff --git a/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx b/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx index 4a40d32..6a5a0a3 100644 --- a/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx +++ b/src/components/nft-dashboard/trending-creators/TrendingCreators.tsx @@ -72,7 +72,7 @@ export const TrendingCreators: React.FC = () => { drag="free" gap=".2rem" snap="false" - autoSpeed= {isDesktop ? .7 : .8} + autoSpeed={isDesktop ? 0.7 : 0.8} flickPower="500" breakpoints={{ 8000: { diff --git a/src/hooks/useRelaySettings.ts b/src/hooks/useRelaySettings.ts index 5e9fe67..fb2215b 100644 --- a/src/hooks/useRelaySettings.ts +++ b/src/hooks/useRelaySettings.ts @@ -53,7 +53,6 @@ const useRelaySettings = () => { localStorage.setItem('relaySettings', JSON.stringify(relaySettings)); }, [relaySettings]); - const fetchSettings = useCallback(async () => { try { const response = await fetch(`${config.baseURL}/relay-settings`, { From a8bcbf617b218c7d85999ac720bc709da25ef87c Mon Sep 17 00:00:00 2001 From: TONE-E <90010906+AnthonyMarin@users.noreply.github.com> Date: Sun, 14 Jul 2024 17:24:35 -0700 Subject: [PATCH 11/11] fix: close sider button appears now --- .../header/layouts/MobileHeader.tsx | 32 +++++++++---------- .../main/MainHeader/MainHeader.styles.ts | 7 ++++ .../layouts/main/MainHeader/MainHeader.tsx | 9 ++++-- .../layouts/main/MainLayout/MainLayout.tsx | 4 +-- 4 files changed, 32 insertions(+), 20 deletions(-) diff --git a/src/components/header/layouts/MobileHeader.tsx b/src/components/header/layouts/MobileHeader.tsx index fbaf25f..4f3ce45 100644 --- a/src/components/header/layouts/MobileHeader.tsx +++ b/src/components/header/layouts/MobileHeader.tsx @@ -27,24 +27,24 @@ const handleTouchStart = (event: React.TouchEvent) => { export const MobileHeader: React.FC = ({ toggleSider, isSiderOpened }) => { return ( - - - + {!isSiderOpened && } - - - - - - - - - - - - - + {!isSiderOpened && ( + + + + + + + + + + + + + + )} diff --git a/src/components/layouts/main/MainHeader/MainHeader.styles.ts b/src/components/layouts/main/MainHeader/MainHeader.styles.ts index 41908ac..0e88a91 100644 --- a/src/components/layouts/main/MainHeader/MainHeader.styles.ts +++ b/src/components/layouts/main/MainHeader/MainHeader.styles.ts @@ -5,11 +5,18 @@ import styled, { css } from 'styled-components'; interface Header { $isTwoColumnsLayoutHeader: boolean; + $isSiderOpened: boolean; } export const Header = styled(BaseLayout.Header)
` line-height: 1.5; z-index: 100; + ${(props) => + props.$isSiderOpened && + css` + background-color: rgba(0, 0, 0, 0) !important; + z-index: 105; + `} position: sticky; position: -webkit-sticky; top: 0; diff --git a/src/components/layouts/main/MainHeader/MainHeader.tsx b/src/components/layouts/main/MainHeader/MainHeader.tsx index 611cec4..dce4863 100644 --- a/src/components/layouts/main/MainHeader/MainHeader.tsx +++ b/src/components/layouts/main/MainHeader/MainHeader.tsx @@ -4,8 +4,13 @@ import * as S from './MainHeader.styles'; interface MainHeaderProps extends WithChildrenProps { isTwoColumnsLayout: boolean; + isSiderOpened: boolean; } -export const MainHeader: React.FC = ({ isTwoColumnsLayout, children }) => { - return {children}; +export const MainHeader: React.FC = ({ isTwoColumnsLayout, isSiderOpened, children }) => { + return ( + + {children} + + ); }; diff --git a/src/components/layouts/main/MainLayout/MainLayout.tsx b/src/components/layouts/main/MainLayout/MainLayout.tsx index 5f5b594..2313bcd 100644 --- a/src/components/layouts/main/MainLayout/MainLayout.tsx +++ b/src/components/layouts/main/MainLayout/MainLayout.tsx @@ -57,9 +57,8 @@ const MainLayout: React.FC = () => { return ( - - +
{ {!isTwoColumnsLayout && } + ); };