Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-12 04:18:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: page mode shortcut (#2985)

Browse Source
This commit is contained in:
danielchim
2023-07-04 00:23:53 +08:00
committed by GitHub
parent 7b2acec7c3
commit 32692bd54a
2 changed files with 57 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
apps/web/src/components/blocksuite/workspace-header/editor-mode-switch/index.tsx
View File

@@ -1,8 +1,10 @@
import { Tooltip } from '@affine/component';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { assertExists } from '@blocksuite/store';
import { useBlockSuitePageMeta } from '@toeverything/hooks/use-block-suite-page-meta';
import { useAtom } from 'jotai';
import type { CSSProperties } from 'react';
import { useEffect } from 'react';
import { pageSettingFamily } from '../../../../atoms';
import type { BlockSuiteWorkspace } from '../../../../shared';
@@ -30,39 +32,59 @@ export const EditorModeSwitch = ({
const t = useAFFiNEI18N();
assertExists(pageMeta);
const { trash } = pageMeta;
return (
<StyledEditorModeSwitch
style={style}
switchLeft={currentMode === 'page'}
showAlone={trash}
>
<PageSwitchItem
data-testid="switch-page-mode-button"
active={currentMode === 'page'}
hide={trash && currentMode !== 'page'}
onClick={() => {
setSetting(setting => {
if (setting?.mode !== 'page') {
toast(t['com.affine.pageMode']());
}
useEffect(() => {
const keydown = (e: KeyboardEvent) => {
if ((e.key === 's' && e.metaKey) || (e.key === 's' && e.altKey)) {
e.preventDefault();
setSetting(setting => {
if (setting?.mode !== 'page') {
toast(t['com.affine.pageMode']());
return { ...setting, mode: 'page' };
});
}}
/>
<EdgelessSwitchItem
data-testid="switch-edgeless-mode-button"
active={currentMode === 'edgeless'}
hide={trash && currentMode !== 'edgeless'}
onClick={() => {
setSetting(setting => {
if (setting?.mode !== 'edgeless') {
toast(t['com.affine.pageMode']());
}
} else {
toast(t['com.affine.edgelessMode']());
return { ...setting, mode: 'edgeless' };
});
}}
/>
</StyledEditorModeSwitch>
}
});
}
};
document.addEventListener('keydown', keydown, { capture: true });
return () =>
document.removeEventListener('keydown', keydown, { capture: true });
}, [setSetting, t]);
return (
<Tooltip content={'Switch ⌘ + S'}>
<StyledEditorModeSwitch
style={style}
switchLeft={currentMode === 'page'}
showAlone={trash}
>
<PageSwitchItem
data-testid="switch-page-mode-button"
active={currentMode === 'page'}
hide={trash && currentMode !== 'page'}
onClick={() => {
setSetting(setting => {
if (setting?.mode !== 'page') {
toast(t['com.affine.pageMode']());
}
return { ...setting, mode: 'page' };
});
}}
/>
<EdgelessSwitchItem
data-testid="switch-edgeless-mode-button"
active={currentMode === 'edgeless'}
hide={trash && currentMode !== 'edgeless'}
onClick={() => {
setSetting(setting => {
if (setting?.mode !== 'edgeless') {
toast(t['com.affine.edgelessMode']());
}
return { ...setting, mode: 'edgeless' };
});
}}
/>
</StyledEditorModeSwitch>
</Tooltip>
);
};

3
apps/web/src/hooks/affine/use-shortcuts.ts
View File

@@ -91,6 +91,7 @@ export const useWinEdgelessKeyboardShortcuts = (): ShortcutTip => {
[t['Pen']()]: 'P',
[t['Hand']()]: 'H',
[t['Note']()]: 'N',
['Switch']: 'Alt + S',
// not implement yet
// [t['Group']()]: 'Ctrl + G',
// [t['Ungroup']()]: 'Ctrl + Shift + G',
@@ -122,6 +123,7 @@ export const useMacPageKeyboardShortcuts = (): ShortcutTip => {
[t['Increase indent']()]: 'Tab',
[t['Reduce indent']()]: '⇧+Tab',
[t['Group as Database']()]: '⌘ + G',
['Switch']: '⌘ + S',
// not implement yet
// [t['Move Up']()]: '⌘ + ⌥ + ↑',
// [t['Move Down']()]: '⌘ + ⌥ + ↓',
@@ -176,6 +178,7 @@ export const useWinPageKeyboardShortcuts = (): ShortcutTip => {
[t['Increase indent']()]: 'Tab',
[t['Reduce indent']()]: 'Shift+Tab',
[t['Group as Database']()]: 'Ctrl + G',
['Switch']: 'Alt + S',
// not implement yet
// [t['Move Up']()]: 'Ctrl + Alt + ↑',
// [t['Move Down']()]: 'Ctrl + Alt + ↓',