mirror of
https://github.com/toeverything/AFFiNE.git
synced 2024-12-23 08:53:27 +03:00
fix(component): toast too many times when switch page mode (#2296)
This commit is contained in:
parent
e4f13ddae4
commit
19e20a6a20
@ -1,3 +1,4 @@
|
||||
import { useAFFiNEI18N } from '@affine/i18n/hooks';
|
||||
import { assertExists } from '@blocksuite/store';
|
||||
import { useBlockSuitePageMeta } from '@toeverything/hooks/use-block-suite-page-meta';
|
||||
import { useAtomValue, useSetAtom } from 'jotai';
|
||||
@ -27,6 +28,7 @@ export const EditorModeSwitch = ({
|
||||
const pageMeta = useBlockSuitePageMeta(blockSuiteWorkspace).find(
|
||||
meta => meta.id === pageId
|
||||
);
|
||||
const t = useAFFiNEI18N();
|
||||
assertExists(pageMeta);
|
||||
const { trash } = pageMeta;
|
||||
|
||||
@ -41,8 +43,12 @@ export const EditorModeSwitch = ({
|
||||
active={currentMode === 'page'}
|
||||
hide={trash && currentMode !== 'page'}
|
||||
onClick={() => {
|
||||
setMode(mode => ({ ...mode, [pageMeta.id]: 'page' }));
|
||||
toast('Page mode');
|
||||
setMode(mode => {
|
||||
if (mode[pageMeta.id] !== 'page') {
|
||||
toast(t['com.affine.pageMode']());
|
||||
}
|
||||
return { ...mode, [pageMeta.id]: 'page' };
|
||||
});
|
||||
}}
|
||||
/>
|
||||
<EdgelessSwitchItem
|
||||
@ -50,8 +56,12 @@ export const EditorModeSwitch = ({
|
||||
active={currentMode === 'edgeless'}
|
||||
hide={trash && currentMode !== 'edgeless'}
|
||||
onClick={() => {
|
||||
setMode(mode => ({ ...mode, [pageMeta.id]: 'edgeless' }));
|
||||
toast('Edgeless mode');
|
||||
setMode(mode => {
|
||||
if (mode[pageMeta.id] !== 'edgeless') {
|
||||
toast(t['com.affine.edgelessMode']());
|
||||
}
|
||||
return { ...mode, [pageMeta.id]: 'edgeless' };
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</StyledEditorModeSwitch>
|
||||
|
@ -47,3 +47,15 @@ export function useOnTransformWorkspace() {
|
||||
[setUser, transformWorkspace]
|
||||
);
|
||||
}
|
||||
|
||||
declare global {
|
||||
// global Events
|
||||
interface WindowEventMap {
|
||||
'affine-workspace:transform': CustomEvent<{
|
||||
from: WorkspaceFlavour;
|
||||
to: WorkspaceFlavour;
|
||||
oldId: string;
|
||||
newId: string;
|
||||
}>;
|
||||
}
|
||||
}
|
||||
|
@ -9,8 +9,20 @@ export const toast = (message: string, options?: ToastOptions) => {
|
||||
'.main-container'
|
||||
) as HTMLElement;
|
||||
logger.debug(`toast with message: "${message}"`, options);
|
||||
window.dispatchEvent(
|
||||
new CustomEvent('affine-toast:emit', { detail: message })
|
||||
);
|
||||
return basicToast(message, {
|
||||
portal: mainContainer || document.body,
|
||||
...options,
|
||||
});
|
||||
};
|
||||
|
||||
declare global {
|
||||
// global Events
|
||||
interface WindowEventMap {
|
||||
'affine-toast:emit': CustomEvent<{
|
||||
message: string;
|
||||
}>;
|
||||
}
|
||||
}
|
||||
|
@ -265,5 +265,7 @@
|
||||
"Default db location hint": "By default will be saved to {{location}}",
|
||||
"light": "light",
|
||||
"dark": "dark",
|
||||
"system": "system"
|
||||
"system": "system",
|
||||
"com.affine.pageMode": "Page Mode",
|
||||
"com.affine.edgelessMode": "Edgeless Mode"
|
||||
}
|
||||
|
@ -5,11 +5,26 @@ import { openHomePage } from '../libs/load-page';
|
||||
import { clickPageMoreActions, waitMarkdownImported } from '../libs/page-logic';
|
||||
|
||||
test('Switch to edgeless by switch edgeless item', async ({ page }) => {
|
||||
async function getCount(): Promise<number> {
|
||||
return page.evaluate(() => {
|
||||
return globalThis.__toastCount;
|
||||
});
|
||||
}
|
||||
await openHomePage(page);
|
||||
await waitMarkdownImported(page);
|
||||
const btn = await page.getByTestId('switch-edgeless-mode-button');
|
||||
await page.evaluate(() => {
|
||||
globalThis.__toastCount = 0;
|
||||
window.addEventListener('affine-toast:emit', () => {
|
||||
globalThis.__toastCount++;
|
||||
});
|
||||
});
|
||||
await btn.click();
|
||||
await page.waitForTimeout(100);
|
||||
{
|
||||
const count = await getCount();
|
||||
expect(count).toBe(1);
|
||||
}
|
||||
const edgeless = page.locator('affine-edgeless-page');
|
||||
expect(await edgeless.isVisible()).toBe(true);
|
||||
|
||||
@ -19,6 +34,18 @@ test('Switch to edgeless by switch edgeless item', async ({ page }) => {
|
||||
return window.getComputedStyle(element).getPropertyValue('padding');
|
||||
});
|
||||
expect(editorWrapperPadding).toBe('0px');
|
||||
{
|
||||
const count = await getCount();
|
||||
expect(count).toBe(1);
|
||||
}
|
||||
await btn.click();
|
||||
await btn.click();
|
||||
await btn.click();
|
||||
await page.waitForTimeout(100);
|
||||
{
|
||||
const count = await getCount();
|
||||
expect(count).toBe(1);
|
||||
}
|
||||
});
|
||||
|
||||
test('Convert to edgeless by editor header items', async ({ page }) => {
|
||||
|
Loading…
Reference in New Issue
Block a user