merge branch develop into branch feat/doublelink220820

docs/CONTRIBUTING.md

@@ -2,7 +2,7 @@
 
 Thank you for investing your time in contributing to our project! Any contribution you make will be reflected on our GitHub :sparkles:.
 
-Read our [Code of Conduct](./CODE_OF_CONDUCT.md) to keep our community approachable and respectable. Join our [dicord](https://discord.com/invite/yz6tGVsf5p) server for more.
+Read our [Code of Conduct](./CODE_OF_CONDUCT.md) to keep our community approachable and respectable. Join our [Discord](https://discord.com/invite/yz6tGVsf5p) server for more.
 
 In this guide you will get an overview of the contribution workflow from opening an issue, creating a PR, reviewing, and merging the PR.
 

libs/components/editor-blocks/src/blocks/group/group-menu/MainMenu.tsx

@@ -82,7 +82,7 @@ const GroupMenuWrapper = ({
             content={
                 <GroupPanel>
                     <ViewsMenu />
-                    <AddViewMenu />
+                    {/*<AddViewMenu />*/}
                     {
                         // // Closed beta period temporarily
                         // filterSorterFlag && (

libs/components/editor-core/package.json

@@ -13,5 +13,8 @@
         "nanoid": "^4.0.0",
         "slate": "^0.81.0",
         "style9": "^0.14.0"
+    },
+    "devDependencies": {
+        "@types/html-escaper": "^3.0.0"
     }
 }

libs/components/editor-plugins/src/menu/inline-menu/config.ts

@@ -12,13 +12,20 @@ export const INLINE_MENU_UI_TYPES = {
 } as const;
 
 /** inline menu item { key : display-name } */
-export const inlineMenuShortcuts = {
+export const MacInlineMenuShortcuts = {
     textBold: '⌘+B',
     textItalic: '⌘+I',
     textStrikethrough: '⌘+S',
     link: '⌘+K',
     [Protocol.Block.Type.code]: '⌘+E',
 };
+export const WinInlineMenuShortcuts = {
+    textBold: 'Ctrl+B',
+    textItalic: 'Ctrl+I',
+    textStrikethrough: 'Ctrl+S',
+    link: 'Ctrl+K',
+    [Protocol.Block.Type.code]: 'Ctrl+E',
+};
 export const inlineMenuNames = {
     currentText: 'TEXT SIZE',
     [Protocol.Block.Type.heading1]: 'Heading 1',

libs/components/editor-plugins/src/menu/inline-menu/menu-item/DropdownItem.tsx

@@ -1,22 +1,24 @@
-import React, { useState, useCallback } from 'react';
-import style9 from 'style9';
-import {
-    Popover,
-    styled,
-    type SvgIconProps,
-    Tooltip,
-} from '@toeverything/components/ui';
 import {
     fontBgColorPalette,
     fontColorPalette,
 } from '@toeverything/components/common';
 import { ArrowDropDownIcon } from '@toeverything/components/icons';
-import type { DropdownItemType, WithEditorSelectionType } from '../types';
 import {
-    inlineMenuNamesKeys,
+    Popover,
+    styled,
+    Tooltip,
+    type SvgIconProps,
+} from '@toeverything/components/ui';
+import { uaHelper } from '@toeverything/utils';
+import { useCallback, useState } from 'react';
+import style9 from 'style9';
+import {
     inlineMenuNamesForFontColor,
-    inlineMenuShortcuts,
+    inlineMenuNamesKeys,
+    MacInlineMenuShortcuts,
+    WinInlineMenuShortcuts,
 } from '../config';
+import type { DropdownItemType, WithEditorSelectionType } from '../types';
 
 type MenuDropdownItemProps = DropdownItemType & WithEditorSelectionType;
 
@@ -36,102 +38,100 @@ export const MenuDropdownItem = ({
         set_anchor_ele(null);
     }, []);
 
-    //@ts-ignore
+    const shortcut = uaHelper.isMacOs
-    const shortcut = inlineMenuShortcuts[nameKey];
+        ? //@ts-ignore
+          MacInlineMenuShortcuts[nameKey]
+        : //@ts-ignore
+          WinInlineMenuShortcuts[nameKey];
 
     return (
-        <>
+        <Popover
-            <Popover
+            trigger="click"
-                trigger="click"
+            placement="bottom-start"
-                placement="bottom-start"
+            content={
+                <div className={styles('dropdownContainer')}>
+                    {children.map(item => {
+                        const {
+                            name,
+                            icon: ItemIcon,
+                            onClick,
+                            nameKey: itemNameKey,
+                        } = item;
+
+                        const StyledIcon = withStylesForIcon(ItemIcon);
+
+                        return (
+                            <button
+                                className={styles('dropdownItem')}
+                                key={name}
+                                onClick={() => {
+                                    if (
+                                        onClick &&
+                                        selectionInfo?.anchorNode?.id
+                                    ) {
+                                        onClick({
+                                            editor,
+                                            type: itemNameKey,
+                                            anchorNodeId:
+                                                selectionInfo?.anchorNode?.id,
+                                        });
+                                    }
+                                    handle_close_dropdown_menu();
+                                }}
+                            >
+                                <StyledIcon
+                                    fontColor={
+                                        nameKey ===
+                                        inlineMenuNamesKeys.currentFontColor
+                                            ? fontColorPalette[
+                                                  inlineMenuNamesForFontColor[
+                                                      itemNameKey as keyof typeof inlineMenuNamesForFontColor
+                                                  ]
+                                              ]
+                                            : nameKey ===
+                                              inlineMenuNamesKeys.currentFontBackground
+                                            ? fontBgColorPalette[
+                                                  inlineMenuNamesForFontColor[
+                                                      itemNameKey as keyof typeof inlineMenuNamesForFontColor
+                                                  ]
+                                              ]
+                                            : ''
+                                    }
+                                    // fontBgColor={
+                                    //     nameKey=== inlineMenuNamesKeys.currentFontBackground ?  fontBgColorPalette[
+                                    //         inlineMenuNamesForFontColor[itemNameKey] as keyof typeof fontBgColorPalette
+                                    //     ]:''
+                                    // }
+                                />
+                                {/* <ItemIcon sx={{ width: 20, height: 20 }} /> */}
+                                <span className={styles('dropdownItemItext')}>
+                                    {name}
+                                </span>
+                            </button>
+                        );
+                    })}
+                </div>
+            }
+        >
+            <Tooltip
                 content={
-                    <div className={styles('dropdownContainer')}>
+                    <div style={{ padding: '2px 4px' }}>
-                        {children.map(item => {
+                        <p>{name}</p>
-                            const {
+                        {shortcut && <p>{shortcut}</p>}
-                                name,
-                                icon: ItemIcon,
-                                onClick,
-                                nameKey: itemNameKey,
-                            } = item;
-
-                            const StyledIcon = withStylesForIcon(ItemIcon);
-
-                            return (
-                                <button
-                                    className={styles('dropdownItem')}
-                                    key={name}
-                                    onClick={() => {
-                                        if (
-                                            onClick &&
-                                            selectionInfo?.anchorNode?.id
-                                        ) {
-                                            onClick({
-                                                editor,
-                                                type: itemNameKey,
-                                                anchorNodeId:
-                                                    selectionInfo?.anchorNode
-                                                        ?.id,
-                                            });
-                                        }
-                                        handle_close_dropdown_menu();
-                                    }}
-                                >
-                                    <StyledIcon
-                                        fontColor={
-                                            nameKey ===
-                                            inlineMenuNamesKeys.currentFontColor
-                                                ? fontColorPalette[
-                                                      inlineMenuNamesForFontColor[
-                                                          itemNameKey as keyof typeof inlineMenuNamesForFontColor
-                                                      ]
-                                                  ]
-                                                : nameKey ===
-                                                  inlineMenuNamesKeys.currentFontBackground
-                                                ? fontBgColorPalette[
-                                                      inlineMenuNamesForFontColor[
-                                                          itemNameKey as keyof typeof inlineMenuNamesForFontColor
-                                                      ]
-                                                  ]
-                                                : ''
-                                        }
-                                        // fontBgColor={
-                                        //     nameKey=== inlineMenuNamesKeys.currentFontBackground ?  fontBgColorPalette[
-                                        //         inlineMenuNamesForFontColor[itemNameKey] as keyof typeof fontBgColorPalette
-                                        //     ]:''
-                                        // }
-                                    />
-                                    {/* <ItemIcon sx={{ width: 20, height: 20 }} /> */}
-                                    <span
-                                        className={styles('dropdownItemItext')}
-                                    >
-                                        {name}
-                                    </span>
-                                </button>
-                            );
-                        })}
                     </div>
                 }
+                placement="top"
+                trigger="hover"
             >
-                <Tooltip
+                <button
-                    content={
+                    className={styles('currentDropdownButton')}
-                        <div style={{ padding: '2px 4px' }}>
+                    aria-label={name}
-                            <p>{name}</p>
-                            {shortcut && <p>{shortcut}</p>}
-                        </div>
-                    }
-                    placement="top"
-                    trigger="hover"
                 >
-                    <button
+                    <MenuIcon sx={{ width: 20, height: 20 }} />
-                        className={styles('currentDropdownButton')}
+                    <ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
-                        aria-label={name}
+                </button>
-                    >
+            </Tooltip>
-                        <MenuIcon sx={{ width: 20, height: 20 }} />
+        </Popover>
-                        <ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
-                    </button>
-                </Tooltip>
-            </Popover>
-        </>
     );
 };
 

libs/components/editor-plugins/src/menu/inline-menu/menu-item/IconItem.tsx

@@ -1,7 +1,8 @@
 import { Tooltip } from '@toeverything/components/ui';
+import { uaHelper } from '@toeverything/utils';
 import React, { useCallback } from 'react';
 import style9 from 'style9';
-import { inlineMenuNamesKeys, inlineMenuShortcuts } from '../config';
+import { inlineMenuNamesKeys, WinInlineMenuShortcuts } from '../config';
 import type { IconItemType, WithEditorSelectionType } from '../types';
 
 type MenuIconItemProps = IconItemType & WithEditorSelectionType;
@@ -36,7 +37,11 @@ export const MenuIconItem = ({
     );
 
     //@ts-ignore
-    const shortcut = inlineMenuShortcuts[nameKey];
+    const shortcut = uaHelper.isMacOs
+        ? //@ts-ignore
+          MacInlineMenuShortcuts[nameKey]
+        : //@ts-ignore
+          WinInlineMenuShortcuts[nameKey];
 
     return (
         <Tooltip

libs/components/layout/src/header/LayoutHeader.tsx

@@ -13,7 +13,7 @@ import {
 import { useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { EditorBoardSwitcher } from './EditorBoardSwitcher';
-import { FileSystem, fsApiSupported } from './FileSystem';
+import { fsApiSupported } from './FileSystem';
 import { CurrentPageTitle } from './Title';
 
 export const LayoutHeader = () => {
@@ -51,7 +51,6 @@ export const LayoutHeader = () => {
                 </FlexContainer>
                 <FlexContainer>
                     <StyledHelper>
-                        <FileSystem />
                         <StyledShare disabled={true}>{t('Share')}</StyledShare>
                         <div style={{ margin: '0px 12px' }}>
                             <IconButton
@@ -76,9 +75,6 @@ export const LayoutHeader = () => {
                     <EditorBoardSwitcher />
                 </StyledContainerForEditorBoardSwitcher>
             </StyledHeaderRoot>
-            <StyledUnstableTips>
-                <StyledUnstableTipsText>{warningTips}</StyledUnstableTipsText>
-            </StyledUnstableTips>
         </StyledContainerForHeaderRoot>
     );
 };

libs/components/layout/src/header/PageSettingPortal.tsx

@@ -58,8 +58,6 @@ function PageSettingPortal() {
     const navigate = useNavigate();
     const { user } = useUserAndSpaces();
     const BooleanFullWidthChecked = useFlag('BooleanFullWidthChecked', false);
-    const BooleanExportWorkspace = useFlag('BooleanExportWorkspace', false);
-    const BooleanImportWorkspace = useFlag('BooleanImportWorkspace', false);
     const BooleanExportHtml = useFlag('BooleanExportHtml', false);
     const BooleanExportPdf = useFlag('BooleanExportPdf', false);
     const BooleanExportMarkdown = useFlag('BooleanExportMarkdown', false);
@@ -217,18 +215,14 @@ function PageSettingPortal() {
                             />
                         )}
                         <Divider />
-                        {BooleanImportWorkspace && (
+                        <ListButton
-                            <ListButton
+                            content="Import Workspace"
-                                content="Import Workspace"
+                            onClick={handleImportWorkspace}
-                                onClick={handleImportWorkspace}
+                        />
-                            />
+                        <ListButton
-                        )}
+                            content="Export Workspace"
-                        {BooleanExportWorkspace && (
+                            onClick={handleExportWorkspace}
-                            <ListButton
+                        />
-                                content="Export Workspace"
-                                onClick={handleExportWorkspace}
-                            />
-                        )}
 
                         <p className="textDescription">
                             Last edited by {user && user.nickname}

libs/components/layout/src/settings-sidebar/Settings/SettingsList.tsx

@@ -49,7 +49,7 @@ export const SettingsList = () => {
                         {item.key === 'Language' ? (
                             <div style={{ marginLeft: '12em' }}>
                                 <Select
-                                    defaultValue={options[0].value}
+                                    defaultValue={i18n.language}
                                     onChange={changeLanguage}
                                 >
                                     {options.map(option => (

libs/components/layout/src/settings-sidebar/Settings/use-setting-flags.ts

@@ -2,8 +2,6 @@ import { useFlag } from '@toeverything/datasource/feature-flags';
 
 export const useSettingFlags = () => {
     const booleanFullWidthChecked = useFlag('BooleanFullWidthChecked', false);
-    const booleanExportWorkspace = useFlag('BooleanExportWorkspace', false);
-    const booleanImportWorkspace = useFlag('BooleanImportWorkspace', false);
     const booleanExportHtml = useFlag('BooleanExportHtml', false);
     const booleanExportPdf = useFlag('BooleanExportPdf', false);
     const booleanExportMarkdown = useFlag('BooleanExportMarkdown', false);
@@ -11,8 +9,6 @@ export const useSettingFlags = () => {
 
     return {
         booleanFullWidthChecked,
-        booleanExportWorkspace,
-        booleanImportWorkspace,
         booleanExportHtml,
         booleanExportPdf,
         booleanExportMarkdown,

libs/components/layout/src/settings-sidebar/Settings/use-settings.ts

@@ -145,26 +145,24 @@ export const useSettings = (): SettingItem[] => {
             type: 'separator',
             key: 'separator2',
         },
+        {
+            type: 'button',
+            name: t('Clear Workspace'),
+            key: 'Clear Workspace',
+            onClick: () => clearWorkspace(workspaceId),
+            flag: 'booleanClearWorkspace',
+        },
         {
             type: 'button',
             name: t('Import Workspace'),
             key: 'Import Workspace',
-            onClick: () => importWorkspace(workspaceId),
+            onClick: () => importWorkspace(),
-            flag: 'booleanImportWorkspace',
         },
         {
             type: 'button',
             name: t('Export Workspace'),
             key: 'Export Workspace',
             onClick: () => exportWorkspace(),
-            flag: 'booleanExportWorkspace',
-        },
-        {
-            type: 'button',
-            name: t('Clear Workspace'),
-            key: 'Clear Workspace',
-            onClick: () => clearWorkspace(workspaceId),
-            flag: 'booleanClearWorkspace',
         },
     ];
 

libs/components/layout/src/settings-sidebar/Settings/util/inspector-workspace.ts

@@ -1,14 +1,15 @@
 /**
  * @deprecated debugging method, deprecated
  */
-export const importWorkspace = (workspaceId: string) => {
+export const importWorkspace = async () => {
-    //@ts-ignore
+    if (window.confirm('Your currently open data will be lost.')) {
-    window.client
+        //@ts-ignore
-        .inspector()
+        const status = await window.client.inspector().load();
-        .load()
+
-        .then(() => {
+        if (status) {
-            window.location.href = `/${workspaceId}/`;
+            window.location.reload();
-        });
+        }
+    }
 };
 
 /**

libs/components/ui/src/list/ListItem.tsx

@@ -32,4 +32,5 @@ const Container = styled(Clickable)({
     display: 'flex',
     alignItems: 'center',
     padding: '6px 12px',
+    whiteSpace: 'nowrap',
 });

libs/datasource/db-service/src/services/database/index.ts

@@ -39,7 +39,7 @@ async function _getCurrentToken() {
 
 const _enabled = {
     demo: [],
-    AFFiNE: ['sqlite'],
+    AFFiNE: ['idb'],
 } as any;
 
 async function _getBlockDatabase(

libs/datasource/db-service/src/services/workspace/user-config.ts

@@ -36,7 +36,7 @@ export class UserConfig extends ServiceBaseClass {
         }
 
         const db = await this.database.getDatabase(workspace);
-        const newPage = await db.get('page');
+        const newPage = await db.getNamedBlock('start-page');
 
         await this.get_dependency(PageTree).addPage(workspace, newPage.id);
         await this.addRecentPage(workspace, userId, newPage.id);

libs/datasource/jwt/src/index.ts

@@ -357,7 +357,7 @@ export class BlockClient<
      * @param name block name
      * @returns block instance
      */
-    private async get_named_block(
+    public async getNamedBlock(
         name: string,
         options?: { workspace?: boolean }
     ): Promise<BaseBlock<B, C>> {
@@ -376,7 +376,7 @@ export class BlockClient<
      */
     public async getWorkspace() {
         if (!this._root.node) {
-            this._root.node = await this.get_named_block(this._workspace, {
+            this._root.node = await this.getNamedBlock(this._workspace, {
                 workspace: true,
             });
         }

libs/datasource/jwt/src/yjs/index.ts

@@ -56,6 +56,7 @@ type YjsProviders = {
     connListener: { listeners?: ConnectivityListener };
     userId: string;
     remoteToken: string | undefined; // remote storage token
+    providers: unknown[];
 };
 
 const _yjsDatabaseInstance = new Map<string, YjsProviders>();
@@ -107,19 +108,25 @@ async function _initYjsDatabase(
     );
 
     const connListener: { listeners?: ConnectivityListener } = {};
+    let providers: unknown[] = [];
     if (options.provider) {
         const emitState = (c: Connectivity) =>
             connListener.listeners?.(workspace, c);
-        await Promise.all(
+        providers = await Promise.all(
-            Object.entries(options.provider).flatMap(([, p]) => [
+            Object.entries(options.provider).flatMap(([name, p]) => [
-                p({ awareness, doc, token, workspace, emitState }),
+                p({ awareness, doc, token, workspace, emitState }).then(p => {
+                    console.log(p);
+                    return {
+                        [name]: p,
+                    };
+                }),
                 p({
                     awareness,
                     doc: binaries,
                     token,
                     workspace: `${workspace}_binaries`,
                     emitState,
-                }),
+                }).then(p => ({ [`${name}_binaries`]: p })),
             ])
         );
     }
@@ -128,7 +135,7 @@ async function _initYjsDatabase(
         binaries,
         doc,
         gatekeeper,
-
+        providers,
         connListener,
         userId,
         remoteToken: token,
@@ -324,53 +331,63 @@ export class YjsAdapter implements AsyncDatabaseAdapter<YjsContentOperation> {
                 const binary = encodeStateAsUpdate(this._doc);
                 saveAs(
                     new Blob([binary]),
-                    `affine_workspace_${new Date().toDateString()}.apk`
+                    `affine_workspace_${new Date().toDateString()}.affine`
                 );
             },
             load: async () => {
-                const handles = await window.showOpenFilePicker({
+                try {
-                    types: [
+                    const handles = await window.showOpenFilePicker({
-                        {
+                        types: [
-                            description: 'AFFiNE Package',
+                            {
-                            accept: {
+                                description: 'AFFiNE Package',
-                                // eslint-disable-next-line @typescript-eslint/naming-convention
+                                accept: {
-                                'application/affine': ['.apk'],
+                                    // eslint-disable-next-line @typescript-eslint/naming-convention
+                                    'application/affine': ['.affine'],
+                                },
                             },
-                        },
+                        ],
-                    ],
+                    });
-                });
+                    const [file] = (await fromEvent(handles)) as File[];
-                const [file] = (await fromEvent(handles)) as File[];
+                    const binary = await file?.arrayBuffer();
-                const binary = await file?.arrayBuffer();
+                    console.log(this._provider.providers);
-                // await this._provider.idb.clearData();
+                    let { indexeddb } = (
-                const doc = new Doc({ autoLoad: true, shouldLoad: true });
+                        this._provider.providers as any[]
-                let updated = 0;
+                    ).find(p => p.indexeddb);
-                let isUpdated = false;
+                    await indexeddb?.idb?.clearData();
-                doc.on('update', () => {
+                    const doc = new Doc({ autoLoad: true, shouldLoad: true });
-                    isUpdated = true;
+                    let updated = 0;
-                    updated += 1;
+                    let isUpdated = false;
-                });
+                    doc.on('update', () => {
-                setInterval(() => {
+                        isUpdated = true;
-                    if (updated > 0) {
+                        updated += 1;
-                        updated -= 1;
+                    });
-                    }
+                    setInterval(() => {
-                }, 500);
+                        if (updated > 0) {
-
+                            updated -= 1;
-                const update_check = new Promise<void>(resolve => {
-                    const check = async () => {
-                        while (!isUpdated || updated > 0) {
-                            await sleep();
                         }
-                        resolve();
+                    }, 500);
-                    };
+
-                    check();
+                    const update_check = new Promise<void>(resolve => {
-                });
+                        const check = async () => {
-                // await new IndexedDBProvider(this._provider.idb.name, doc)
+                            while (!isUpdated || updated > 0) {
-                //     .whenSynced;
+                                await sleep();
-                if (binary) {
+                            }
-                    applyUpdate(doc, new Uint8Array(binary));
+                            resolve();
-                    await update_check;
+                        };
+                        check();
+                    });
+                    await new indexeddb.ctor(indexeddb.idb.name, doc)
+                        .whenSynced;
+                    if (binary) {
+                        applyUpdate(doc, new Uint8Array(binary));
+                        await update_check;
+                    }
+
+                    return true;
+                } catch (err) {
+                    console.log(err);
+                    return false;
                 }
-                console.log('load success');
             },
             parse: () => this._doc.toJSON(),
             // eslint-disable-next-line @typescript-eslint/naming-convention

libs/datasource/jwt/src/yjs/provider.ts

@@ -18,7 +18,9 @@ type YjsDefaultInstances = {
     emitState: (connectivity: Connectivity) => void;
 };
 
-export type YjsProvider = (instances: YjsDefaultInstances) => Promise<void>;
+export type YjsProvider = (
+    instances: YjsDefaultInstances
+) => Promise<unknown | undefined>;
 
 type ProviderType = 'idb' | 'sqlite' | 'ws';
 
@@ -38,9 +40,12 @@ export const getYjsProviders = (
     return {
         indexeddb: async (instances: YjsDefaultInstances) => {
             if (options.enabled.includes('idb')) {
-                await new IndexedDBProvider(instances.workspace, instances.doc)
+                return new IndexedDBProvider(
-                    .whenSynced;
+                    instances.workspace,
+                    instances.doc
+                ).whenSynced.then(idb => ({ idb, ctor: IndexedDBProvider }));
             }
+            return undefined;
         },
         sqlite: async (instances: YjsDefaultInstances) => {
             if (options.enabled.includes('sqlite')) {

libs/datasource/state/src/user.ts

@@ -71,44 +71,20 @@ const _useUserAndSpacesForFreeLogin = () => {
 
     useEffect(() => {
         if (loading) {
-            if (location.pathname.startsWith('/local')) {
+            navigate(`/${BRAND_ID}`);
-                navigate('/local');
-            } else {
-                navigate('/demo');
-            }
             setLoading(false);
         }
     }, []);
 
     useEffect(() => {
-        if (localTrigger) {
+        setUser({
-            setUser({
+            photo: '',
-                photo: '',
+            id: BRAND_ID,
-                id: BRAND_ID,
+            username: BRAND_ID,
-                username: BRAND_ID,
+            nickname: BRAND_ID,
-                nickname: BRAND_ID,
+            email: '',
-                email: '',
+        });
-            });
+    }, [setUser]);
-        } else {
-            if (location.pathname.startsWith('/local')) {
-                setUser({
-                    photo: '',
-                    id: 'local',
-                    username: 'local',
-                    nickname: 'local',
-                    email: '',
-                });
-            } else {
-                setUser({
-                    photo: '',
-                    id: 'demo',
-                    username: 'demo',
-                    nickname: 'demo',
-                    email: '',
-                });
-            }
-        }
-    }, [localTrigger, location, setLoading, setUser]);
 
     const currentSpaceId: string | undefined = useMemo(() => user?.id, [user]);
 

pnpm-lock.yaml

@@ -413,18 +413,18 @@ importers:
     dependencies:
       '@codemirror/commands': 6.0.1
       '@codemirror/lang-cpp': 6.0.1
-      '@codemirror/lang-css': 6.0.0
+      '@codemirror/lang-css': 6.0.0_bmjizg7gr5ieupmvn5u62mbipm
-      '@codemirror/lang-html': 6.1.0
+      '@codemirror/lang-html': 6.1.0_@codemirror+view@6.2.0
       '@codemirror/lang-java': 6.0.0
       '@codemirror/lang-javascript': 6.0.2
       '@codemirror/lang-json': 6.0.0
       '@codemirror/lang-lezer': 6.0.0
       '@codemirror/lang-markdown': 6.0.1
-      '@codemirror/lang-php': 6.0.0
+      '@codemirror/lang-php': 6.0.0_@codemirror+view@6.2.0
       '@codemirror/lang-python': 6.0.1
       '@codemirror/lang-rust': 6.0.0
-      '@codemirror/lang-sql': 6.1.0
+      '@codemirror/lang-sql': 6.1.0_bmjizg7gr5ieupmvn5u62mbipm
-      '@codemirror/lang-xml': 6.0.0
+      '@codemirror/lang-xml': 6.0.0_@codemirror+view@6.2.0
       '@codemirror/language': 6.2.1
       '@codemirror/legacy-modes': 6.1.0
       '@codemirror/next': 0.16.0
@@ -438,7 +438,7 @@ importers:
       '@emotion/styled': 11.9.3_dc5dh2wp562rsjxvguwi2i3yzq
       '@mui/system': 5.8.7_d6menda4vqwq6peqnkbe7mkj4i
       code-example: 3.3.6
-      codemirror: 6.0.1
+      codemirror: 6.0.1_@lezer+common@1.0.0
       codemirror-lang-elixir: 3.0.0_@codemirror+language@6.2.1
       keymap: link:@codemirror/next/keymap
       nanoid: 4.0.0
@@ -455,6 +455,7 @@ importers:
   libs/components/editor-core:
     specifiers:
       '@mui/icons-material': ^5.8.4
+      '@types/html-escaper': ^3.0.0
       date-fns: ^2.29.2
       eventemitter3: ^4.0.7
       hotkeys-js: ^3.9.4
@@ -475,6 +476,8 @@ importers:
       nanoid: 4.0.0
       slate: 0.81.1
       style9: 0.14.0
+    devDependencies:
+      '@types/html-escaper': 3.0.0
 
   libs/components/editor-plugins:
     specifiers:
@@ -574,9 +577,6 @@ importers:
     dependencies:
       ffc-js-client-side-sdk: 1.1.5
 
-  libs/datasource/jwst/pkg:
-    specifiers: {}
-
   libs/datasource/jwt:
     specifiers:
       '@types/debug': ^4.1.7
@@ -2265,8 +2265,13 @@ packages:
     resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==}
     dev: true
 
-  /@codemirror/autocomplete/6.0.3:
+  /@codemirror/autocomplete/6.0.3_nq4pwfkqi5icglf26kczcr4s2i:
     resolution: {integrity: sha512-JTSBDC4tUyR8iRmCwQJaYpTXtOZmRn4gKjw1Fu4xIatFPqTJ7m0QRCdkdbzlvMovzjTiuHp4a8WUEB1c/LtiHg==}
+    peerDependencies:
+      '@codemirror/language': ^6.0.0
+      '@codemirror/state': ^6.0.0
+      '@codemirror/view': ^6.0.0
+      '@lezer/common': ^1.0.0
     dependencies:
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
@@ -2290,25 +2295,30 @@ packages:
       '@lezer/cpp': 1.0.0
     dev: false
 
-  /@codemirror/lang-css/6.0.0:
+  /@codemirror/lang-css/6.0.0_bmjizg7gr5ieupmvn5u62mbipm:
     resolution: {integrity: sha512-jBqc+BTuwhNOTlrimFghLlSrN6iFuE44HULKWoR4qKYObhOIl9Lci1iYj6zMIte1XTQmZguNvjXMyr43LUKwSw==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@lezer/css': 1.0.0
+    transitivePeerDependencies:
+      - '@codemirror/view'
+      - '@lezer/common'
     dev: false
 
-  /@codemirror/lang-html/6.1.0:
+  /@codemirror/lang-html/6.1.0_@codemirror+view@6.2.0:
     resolution: {integrity: sha512-gA7NmJxqvnhwza05CvR7W/39Ap9r/4Vs9uiC0IeFYo1hSlJzc/8N6Evviz6vTW1x8SpHcRYyqKOf6rpl6LfWtg==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
-      '@codemirror/lang-css': 6.0.0
+      '@codemirror/lang-css': 6.0.0_bmjizg7gr5ieupmvn5u62mbipm
       '@codemirror/lang-javascript': 6.0.2
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@lezer/common': 1.0.0
       '@lezer/html': 1.0.0
+    transitivePeerDependencies:
+      - '@codemirror/view'
     dev: false
 
   /@codemirror/lang-java/6.0.0:
@@ -2321,7 +2331,7 @@ packages:
   /@codemirror/lang-javascript/6.0.2:
     resolution: {integrity: sha512-BZRJ9u/zl16hLkSpDAWm73mrfIR7HJrr0lvnhoSOCQVea5BglguWI/slxexhvUb0CB5cXgKWuo2bM+N9EhIaZw==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
       '@codemirror/language': 6.2.1
       '@codemirror/lint': 6.0.0
       '@codemirror/state': 6.1.1
@@ -2349,7 +2359,7 @@ packages:
   /@codemirror/lang-markdown/6.0.1:
     resolution: {integrity: sha512-pHPQuRwf9cUrmkmsTHRjtS9ZnGu3fA9YzAdh2++d+L9wbfnC2XbKh0Xvm/0YiUjdCnoCx9wDFEoCuAnkqKWLIw==}
     dependencies:
-      '@codemirror/lang-html': 6.1.0
+      '@codemirror/lang-html': 6.1.0_@codemirror+view@6.2.0
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@codemirror/view': 6.2.0
@@ -2357,14 +2367,16 @@ packages:
       '@lezer/markdown': 1.0.1
     dev: false
 
-  /@codemirror/lang-php/6.0.0:
+  /@codemirror/lang-php/6.0.0_@codemirror+view@6.2.0:
     resolution: {integrity: sha512-96CEjq0xEgbzc6bdFPwILPfZ6m8917JRbh2oPszZJABlYxG4Y+eYjtYkUTDb4yuyjQKyigHoeGC6zoIOYA1NWA==}
     dependencies:
-      '@codemirror/lang-html': 6.1.0
+      '@codemirror/lang-html': 6.1.0_@codemirror+view@6.2.0
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@lezer/common': 1.0.0
       '@lezer/php': 1.0.0
+    transitivePeerDependencies:
+      - '@codemirror/view'
     dev: false
 
   /@codemirror/lang-python/6.0.1:
@@ -2381,24 +2393,29 @@ packages:
       '@lezer/rust': 1.0.0
     dev: false
 
-  /@codemirror/lang-sql/6.1.0:
+  /@codemirror/lang-sql/6.1.0_bmjizg7gr5ieupmvn5u62mbipm:
     resolution: {integrity: sha512-eTNTP0+uNHqYClCvJ3QGE7mn1S96QJFNsK76dB4c1pYAQjbgVVjy5DqtD3//A44rp2kuRkgBccRaPKrWDzBdNQ==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@lezer/highlight': 1.0.0
       '@lezer/lr': 1.2.0
+    transitivePeerDependencies:
+      - '@codemirror/view'
+      - '@lezer/common'
     dev: false
 
-  /@codemirror/lang-xml/6.0.0:
+  /@codemirror/lang-xml/6.0.0_@codemirror+view@6.2.0:
     resolution: {integrity: sha512-M/HLWxIiP956xGjtrxkeHkCmDGVQGKu782x8pOH5CLJIMkWtiB1DWfDoDHqpFjdEE9dkfcqPWvYfVi6GbhuXEg==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
       '@codemirror/language': 6.2.1
       '@codemirror/state': 6.1.1
       '@lezer/common': 1.0.0
       '@lezer/xml': 1.0.0
+    transitivePeerDependencies:
+      - '@codemirror/view'
     dev: false
 
   /@codemirror/language/6.2.1:
@@ -6746,6 +6763,10 @@ packages:
     resolution: {integrity: sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==}
     dev: true
 
+  /@types/html-escaper/3.0.0:
+    resolution: {integrity: sha512-OcJcvP3Yk8mjYwf/IdXZtTE1tb/u0WF0qa29ER07ZHCYUBZXSN29Z1mBS+/96+kNMGTFUAbSz9X+pHmHpZrTCw==}
+    dev: true
+
   /@types/html-minifier-terser/6.1.0:
     resolution: {integrity: sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==}
     dev: true
@@ -7396,8 +7417,10 @@ packages:
       indent-string: 4.0.0
     dev: true
 
-  /ajv-formats/2.1.1:
+  /ajv-formats/2.1.1_ajv@8.11.0:
     resolution: {integrity: sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==}
+    peerDependencies:
+      ajv: ^8.0.0
     peerDependenciesMeta:
       ajv:
         optional: true
@@ -8605,16 +8628,18 @@ packages:
       '@codemirror/language': 6.2.1
     dev: false
 
-  /codemirror/6.0.1:
+  /codemirror/6.0.1_@lezer+common@1.0.0:
     resolution: {integrity: sha512-J8j+nZ+CdWmIeFIGXEFbFPtpiYacFMDR8GlHK3IyHQJMCaVRfGx9NT+Hxivv1ckLWPvNdZqndbr/7lVhrf/Svg==}
     dependencies:
-      '@codemirror/autocomplete': 6.0.3
+      '@codemirror/autocomplete': 6.0.3_nq4pwfkqi5icglf26kczcr4s2i
       '@codemirror/commands': 6.0.1
       '@codemirror/language': 6.2.1
       '@codemirror/lint': 6.0.0
       '@codemirror/search': 6.0.0
       '@codemirror/state': 6.1.1
       '@codemirror/view': 6.2.0
+    transitivePeerDependencies:
+      - '@lezer/common'
     dev: false
 
   /collect-v8-coverage/1.0.1:
@@ -16962,7 +16987,7 @@ packages:
     dependencies:
       '@types/json-schema': 7.0.11
       ajv: 8.11.0
-      ajv-formats: 2.1.1
+      ajv-formats: 2.1.1_ajv@8.11.0
       ajv-keywords: 5.1.0_ajv@8.11.0
     dev: true