fix: add sidebar toggle and windows controls for empty collections page (#5304)

Before this change, when the user gets to an empty collection page & hide the sidebar, there is no sidebar toggle any longer.
Also added windows app control on windows.
This commit is contained in:
Peng Xiao
2023-12-14 07:13:01 +00:00
parent 3efcdc0cc5
commit b925731bf7

View File

@@ -1,3 +1,7 @@
import {
appSidebarOpenAtom,
SidebarSwitch,
} from '@affine/component/app-sidebar';
import { pushNotificationAtom } from '@affine/component/notification-center'; import { pushNotificationAtom } from '@affine/component/notification-center';
import { import {
AffineShapeIcon, AffineShapeIcon,
@@ -5,6 +9,7 @@ import {
useCollectionManager, useCollectionManager,
useEditCollection, useEditCollection,
} from '@affine/component/page-list'; } from '@affine/component/page-list';
import { WindowsAppControls } from '@affine/core/components/pure/header/windows-app-controls';
import type { Collection } from '@affine/env/filter'; import type { Collection } from '@affine/env/filter';
import { Trans } from '@affine/i18n'; import { Trans } from '@affine/i18n';
import { useAFFiNEI18N } from '@affine/i18n/hooks'; import { useAFFiNEI18N } from '@affine/i18n/hooks';
@@ -90,6 +95,8 @@ export const Component = function CollectionPage() {
); );
}; };
const isWindowsDesktop = environment.isDesktop && environment.isWindows;
const Placeholder = ({ collection }: { collection: Collection }) => { const Placeholder = ({ collection }: { collection: Collection }) => {
const { updateCollection } = useCollectionManager(collectionsCRUDAtom); const { updateCollection } = useCollectionManager(collectionsCRUDAtom);
const { node, open } = useEditCollection(useAllPageListConfig()); const { node, open } = useEditCollection(useAllPageListConfig());
@@ -110,6 +117,7 @@ const Placeholder = ({ collection }: { collection: Collection }) => {
localStorage.setItem('hide-empty-collection-help-info', 'true'); localStorage.setItem('hide-empty-collection-help-info', 'true');
}, []); }, []);
const t = useAFFiNEI18N(); const t = useAFFiNEI18N();
const leftSidebarOpen = useAtomValue(appSidebarOpenAtom);
return ( return (
<div <div
style={{ style={{
@@ -123,11 +131,13 @@ const Placeholder = ({ collection }: { collection: Collection }) => {
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
gap: 8, gap: 8,
padding: '12px 24px', height: 52,
paddingLeft: '16px',
fontSize: 'var(--affine-font-xs)', fontSize: 'var(--affine-font-xs)',
['WebkitAppRegion' as string]: 'drag', ['WebkitAppRegion' as string]: 'drag',
}} }}
> >
<SidebarSwitch show={!leftSidebarOpen} />
<div <div
style={{ style={{
display: 'flex', display: 'flex',
@@ -154,6 +164,8 @@ const Placeholder = ({ collection }: { collection: Collection }) => {
> >
{collection.name} {collection.name}
</div> </div>
<div style={{ flex: 1 }} />
{isWindowsDesktop && <WindowsAppControls />}
</div> </div>
<div <div
style={{ style={{