Page: the 'settingsPage' option now automatically adds the sidebar.

This commit is contained in:
infinite-persistence 2021-08-19 09:36:43 +08:00
parent 6e152a4137
commit 1671deb0b2
No known key found for this signature in database
GPG key ID: B9C3252EDC3D0AA0
2 changed files with 51 additions and 48 deletions

View file

@ -4,6 +4,7 @@ import React, { Fragment } from 'react';
import classnames from 'classnames';
import { lazyImport } from 'util/lazyImport';
import SideNavigation from 'component/sideNavigation';
import SettingsSideNavigation from 'component/settingsSideNavigation';
import Header from 'component/header';
/* @if TARGET='app' */
import StatusBar from 'component/common/status-bar';
@ -78,6 +79,24 @@ function Page(props: Props) {
const isAbsoluteSideNavHidden = (isOnFilePage || isMobile) && !sidebarOpen;
function getSideNavElem() {
if (!authPage) {
if (settingsPage) {
return <SettingsSideNavigation />;
} else if (!noSideNavigation) {
return (
<SideNavigation
sidebarOpen={sidebarOpen}
setSidebarOpen={setSidebarOpen}
isMediumScreen={isMediumScreen}
isOnFilePage={isOnFilePage}
/>
);
}
}
return null;
}
React.useEffect(() => {
if (isOnFilePage || isMediumScreen) {
setSidebarOpen(false);
@ -102,14 +121,8 @@ function Page(props: Props) {
'main-wrapper__inner--theater-mode': isOnFilePage && videoTheaterMode,
})}
>
{!authPage && !noSideNavigation && (
<SideNavigation
sidebarOpen={sidebarOpen}
setSidebarOpen={setSidebarOpen}
isMediumScreen={isMediumScreen}
isOnFilePage={isOnFilePage}
/>
)}
{getSideNavElem()}
<main
id={'main-content'}
className={classnames(MAIN_CLASS, className, {

View file

@ -8,7 +8,6 @@ import Page from 'component/page';
import SettingAccount from 'component/settingAccount';
import SettingAppearance from 'component/settingAppearance';
import SettingContent from 'component/settingContent';
import SettingsSideNavigation from 'component/settingsSideNavigation';
import SettingSystem from 'component/settingSystem';
import SettingUnauthenticated from 'component/settingUnauthenticated';
import Yrbl from 'component/yrbl';
@ -45,48 +44,39 @@ class SettingsPage extends React.PureComponent<Props> {
noFooter
settingsPage
noSideNavigation
backout={{ title: __('Settings'), backLabel: __('Done') }}
backout={{ title: __('Settings'), backLabel: __('Back') }}
className="card-stack"
>
<SettingsSideNavigation />
<div>
{!isAuthenticated && IS_WEB && (
<>
<SettingUnauthenticated />
<div className="main--empty">
<Yrbl
type="happy"
title={__('Sign up for full control')}
subtitle={__('Unlock new buttons that change things.')}
actions={
<div className="section__actions">
<Button
button="primary"
icon={ICONS.SIGN_UP}
label={__('Sign Up')}
navigate={`/$/${PAGES.AUTH}`}
/>
</div>
}
/>
</div>
</>
)}
{!IS_WEB && noDaemonSettings ? (
<section className="card card--section">
<div className="card__title card__title--deprecated">{__('Failed to load settings.')}</div>
</section>
) : (
<div className={classnames('card-stack', { 'card--disabled': IS_WEB && !isAuthenticated })}>
<SettingAppearance />
<SettingAccount />
<SettingContent />
<SettingSystem />
{!isAuthenticated && IS_WEB && (
<>
<SettingUnauthenticated />
<div className="main--empty">
<Yrbl
type="happy"
title={__('Sign up for full control')}
subtitle={__('Unlock new buttons that change things.')}
actions={
<div className="section__actions">
<Button button="primary" icon={ICONS.SIGN_UP} label={__('Sign Up')} navigate={`/$/${PAGES.AUTH}`} />
</div>
}
/>
</div>
)}
</div>
</>
)}
{!IS_WEB && noDaemonSettings ? (
<section className="card card--section">
<div className="card__title card__title--deprecated">{__('Failed to load settings.')}</div>
</section>
) : (
<div className={classnames('card-stack', { 'card--disabled': IS_WEB && !isAuthenticated })}>
<SettingAppearance />
<SettingAccount />
<SettingContent />
<SettingSystem />
</div>
)}
</Page>
);
}