toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-19 23:11:44 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #158 from toeverything/chore/ref-menu-plugin

Browse Source 
fix: cleaning ReferenceMenuPlugin side effect
This commit is contained in:
DarkSky 2022-08-09 15:11:13 +08:00 committed by GitHub
commit f413d4ce0e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
libs/components/editor-plugins/src/menu/reference-menu/Container.tsx
View File

@ -1,5 +1,4 @@
import React, { useEffect, useState, useCallback, useRef } from 'react'; import React, { useEffect, useState, useCallback, useRef } from 'react';
import style9 from 'style9';
import { Virgo, PluginHooks, HookType } from '@toeverything/framework/virgo'; import { Virgo, PluginHooks, HookType } from '@toeverything/framework/virgo';
import { import {

25
libs/components/editor-plugins/src/menu/reference-menu/index.tsx → libs/components/editor-plugins/src/menu/reference-menu/Plugin.tsx
View File

@ -1,33 +1,34 @@
import { StrictMode } from 'react'; import { StrictMode } from 'react';
import { createRoot, type Root } from 'react-dom/client';
import { BasePlugin } from '../../base-plugin'; import { BasePlugin } from '../../base-plugin';
import { PluginRenderRoot } from '../../utils';
import { ReferenceMenu } from './ReferenceMenu'; import { ReferenceMenu } from './ReferenceMenu';
const PLUGIN_NAME = 'reference-menu'; const PLUGIN_NAME = 'reference-menu';
export class ReferenceMenuPlugin extends BasePlugin { export class ReferenceMenuPlugin extends BasePlugin {
private root?: Root; private _root?: PluginRenderRoot;
public static override get pluginName(): string { public static override get pluginName(): string {
return PLUGIN_NAME; return PLUGIN_NAME;
} }
protected override _onRender(): void { protected override _onRender(): void {
const container = document.createElement('div'); this._root = new PluginRenderRoot({
// TODO: remove name: PLUGIN_NAME,
container.classList.add(`id-${PLUGIN_NAME}`); render: this.editor.reactRenderRoot.render,
// this.editor.attachElement(this.menu_container); });
window.document.body.appendChild(container); this._root.mount();
this.root = createRoot(container);
this.render_reference_menu();
}
private render_reference_menu(): void { this._root?.render(
this.root?.render(
<StrictMode> <StrictMode>
<ReferenceMenu editor={this.editor} hooks={this.hooks} /> <ReferenceMenu editor={this.editor} hooks={this.hooks} />
</StrictMode> </StrictMode>
); );
} }
public override dispose() {
this._root?.unmount();
super.dispose();
}
} }

12
libs/components/editor-plugins/src/menu/reference-menu/ReferenceMenu.tsx
View File

@ -1,7 +1,6 @@
import React, { useCallback, useEffect, useMemo, useState } from 'react'; import React, { useCallback, useEffect, useMemo, useState } from 'react';
import style9 from 'style9';
import { MuiClickAwayListener } from '@toeverything/components/ui'; import { MuiClickAwayListener, styled } from '@toeverything/components/ui';
import { Virgo, HookType, PluginHooks } from '@toeverything/framework/virgo'; import { Virgo, HookType, PluginHooks } from '@toeverything/framework/virgo';
import { Point } from '@toeverything/utils'; import { Point } from '@toeverything/utils';
@ -120,8 +119,7 @@ export const ReferenceMenu = ({ editor, hooks, style }: ReferenceMenuProps) => {
}; };
return ( return (
<div <ReferenceMenuWrapper
className={styles('referenceMenu')}
style={{ top: position.y, left: position.x }} style={{ top: position.y, left: position.x }}
onKeyUp={handle_keyup} onKeyUp={handle_keyup}
> >
@ -140,13 +138,11 @@ export const ReferenceMenu = ({ editor, hooks, style }: ReferenceMenuProps) => {
/> />
</div> </div>
</MuiClickAwayListener> </MuiClickAwayListener>
</div> </ReferenceMenuWrapper>
); );
}; };
const styles = style9.create({ const ReferenceMenuWrapper = styled('div')({
referenceMenu: {
position: 'absolute', position: 'absolute',
zIndex: 1, zIndex: 1,
},
}); });

1
libs/components/editor-plugins/src/menu/reference-menu/index.ts Normal file
View File

@ -0,0 +1 @@
export { ReferenceMenuPlugin } from './Plugin';