feat: add migration pref pane (#825)

* feat: add migration pane

* style: clean imports

* removeme: beta version

* fix: do no show dropzone when tag has no parent

* fix: hide the Folders toggle

* fix: hide migrations option when user has no folders

* fix: add delimiter on Folders mark

* removeme: bump beta

* fix: remove component viewer for tag folders

* removeme: bump beta

* chore(deps): snjs
This commit is contained in:
Laurent Senta
2022-02-01 02:18:14 +01:00
committed by GitHub
parent ed729ab4ef
commit 3c0bc79768
12 changed files with 181 additions and 145 deletions

View File

@@ -1,4 +1,3 @@
import { ComponentView } from '@/components/ComponentView';
import { SmartTagsSection } from '@/components/Tags/SmartTagsSection';
import { TagsSection } from '@/components/Tags/TagsSection';
import { WebApplication } from '@/ui_models/application';
@@ -6,13 +5,7 @@ import { PANEL_NAME_NAVIGATION } from '@/views/constants';
import { ApplicationEvent, PrefKey } from '@standardnotes/snjs';
import { observer } from 'mobx-react-lite';
import { FunctionComponent } from 'preact';
import {
useCallback,
useEffect,
useMemo,
useRef,
useState,
} from 'preact/hooks';
import { useCallback, useEffect, useMemo, useState } from 'preact/hooks';
import { PremiumModalProvider } from './Premium';
import {
PanelSide,
@@ -28,7 +21,6 @@ type Props = {
export const Navigation: FunctionComponent<Props> = observer(
({ application }) => {
const appState = useMemo(() => application.getAppState(), [application]);
const componentViewer = appState.foldersComponentViewer;
const enableNativeSmartTagsFeature =
appState.features.enableNativeSmartTagsFeature;
const [ref, setRef] = useState<HTMLDivElement | null>();
@@ -72,42 +64,30 @@ export const Navigation: FunctionComponent<Props> = observer(
data-aria-label="Navigation"
ref={setRef}
>
{componentViewer ? (
<div className="component-view-container">
<div className="component-view">
<ComponentView
componentViewer={componentViewer}
application={application}
appState={appState}
/>
</div>
</div>
) : (
<div id="navigation-content" className="content">
<div className="section-title-bar">
<div className="section-title-bar-header">
<div className="sk-h3 title">
<span className="sk-bold">Views</span>
</div>
{!enableNativeSmartTagsFeature && (
<div
className="sk-button sk-secondary-contrast wide"
onClick={onCreateNewTag}
title="Create a new tag"
>
<div className="sk-label">
<i className="icon ion-plus add-button" />
</div>
</div>
)}
<div id="navigation-content" className="content">
<div className="section-title-bar">
<div className="section-title-bar-header">
<div className="sk-h3 title">
<span className="sk-bold">Views</span>
</div>
</div>
<div className="scrollable">
<SmartTagsSection appState={appState} />
<TagsSection appState={appState} />
{!enableNativeSmartTagsFeature && (
<div
className="sk-button sk-secondary-contrast wide"
onClick={onCreateNewTag}
title="Create a new tag"
>
<div className="sk-label">
<i className="icon ion-plus add-button" />
</div>
</div>
)}
</div>
</div>
)}
<div className="scrollable">
<SmartTagsSection appState={appState} />
<TagsSection appState={appState} />
</div>
</div>
{ref && (
<PanelResizer
collapsable={true}