mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-18 02:26:21 +08:00
merge branch develop into branch feat/doublelink220820
This commit is contained in:
@@ -82,7 +82,7 @@ const GroupMenuWrapper = ({
|
||||
content={
|
||||
<GroupPanel>
|
||||
<ViewsMenu />
|
||||
<AddViewMenu />
|
||||
{/*<AddViewMenu />*/}
|
||||
{
|
||||
// // Closed beta period temporarily
|
||||
// filterSorterFlag && (
|
||||
|
||||
@@ -13,5 +13,8 @@
|
||||
"nanoid": "^4.0.0",
|
||||
"slate": "^0.81.0",
|
||||
"style9": "^0.14.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/html-escaper": "^3.0.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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',
|
||||
|
||||
@@ -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 = inlineMenuShortcuts[nameKey];
|
||||
const shortcut = uaHelper.isMacOs
|
||||
? //@ts-ignore
|
||||
MacInlineMenuShortcuts[nameKey]
|
||||
: //@ts-ignore
|
||||
WinInlineMenuShortcuts[nameKey];
|
||||
|
||||
return (
|
||||
<>
|
||||
<Popover
|
||||
trigger="click"
|
||||
placement="bottom-start"
|
||||
<Popover
|
||||
trigger="click"
|
||||
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')}>
|
||||
{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 style={{ padding: '2px 4px' }}>
|
||||
<p>{name}</p>
|
||||
{shortcut && <p>{shortcut}</p>}
|
||||
</div>
|
||||
}
|
||||
placement="top"
|
||||
trigger="hover"
|
||||
>
|
||||
<Tooltip
|
||||
content={
|
||||
<div style={{ padding: '2px 4px' }}>
|
||||
<p>{name}</p>
|
||||
{shortcut && <p>{shortcut}</p>}
|
||||
</div>
|
||||
}
|
||||
placement="top"
|
||||
trigger="hover"
|
||||
<button
|
||||
className={styles('currentDropdownButton')}
|
||||
aria-label={name}
|
||||
>
|
||||
<button
|
||||
className={styles('currentDropdownButton')}
|
||||
aria-label={name}
|
||||
>
|
||||
<MenuIcon sx={{ width: 20, height: 20 }} />
|
||||
<ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</Popover>
|
||||
</>
|
||||
<MenuIcon sx={{ width: 20, height: 20 }} />
|
||||
<ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
|
||||
</button>
|
||||
</Tooltip>
|
||||
</Popover>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -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
|
||||
content="Import Workspace"
|
||||
onClick={handleImportWorkspace}
|
||||
/>
|
||||
)}
|
||||
{BooleanExportWorkspace && (
|
||||
<ListButton
|
||||
content="Export Workspace"
|
||||
onClick={handleExportWorkspace}
|
||||
/>
|
||||
)}
|
||||
<ListButton
|
||||
content="Import Workspace"
|
||||
onClick={handleImportWorkspace}
|
||||
/>
|
||||
<ListButton
|
||||
content="Export Workspace"
|
||||
onClick={handleExportWorkspace}
|
||||
/>
|
||||
|
||||
<p className="textDescription">
|
||||
Last edited by {user && user.nickname}
|
||||
|
||||
@@ -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 => (
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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),
|
||||
flag: 'booleanImportWorkspace',
|
||||
onClick: () => importWorkspace(),
|
||||
},
|
||||
{
|
||||
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',
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
/**
|
||||
* @deprecated debugging method, deprecated
|
||||
*/
|
||||
export const importWorkspace = (workspaceId: string) => {
|
||||
//@ts-ignore
|
||||
window.client
|
||||
.inspector()
|
||||
.load()
|
||||
.then(() => {
|
||||
window.location.href = `/${workspaceId}/`;
|
||||
});
|
||||
export const importWorkspace = async () => {
|
||||
if (window.confirm('Your currently open data will be lost.')) {
|
||||
//@ts-ignore
|
||||
const status = await window.client.inspector().load();
|
||||
|
||||
if (status) {
|
||||
window.location.reload();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@@ -32,4 +32,5 @@ const Container = styled(Clickable)({
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
padding: '6px 12px',
|
||||
whiteSpace: 'nowrap',
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user