From e8f390a0d26e60b5e01177b43f2ed31dbf5cba11 Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Tue, 2 Aug 2022 16:17:10 +0800 Subject: [PATCH 001/112] fix iframe will take away the focus --- .../src/components/source-view/SourceView.tsx | 80 +++++++++++++++---- .../editor-core/src/recast-block/view.ts | 23 +++++- 2 files changed, 85 insertions(+), 18 deletions(-) diff --git a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx index 3835199d3f..2c117e97fe 100644 --- a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx +++ b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx @@ -1,6 +1,11 @@ -import type { AsyncBlock } from '@toeverything/components/editor-core'; +import { + AsyncBlock, + useCurrentView, + useLazyIframe, +} from '@toeverything/components/editor-core'; import { styled } from '@toeverything/components/ui'; -import type { FC } from 'react'; +import { FC, useRef } from 'react'; +import { SCENE_CONFIG } from '../../blocks/group/config'; import { BlockPreview } from './BlockView'; import { formatUrl } from './format-url'; @@ -15,7 +20,18 @@ export interface Props { } const getHost = (url: string) => new URL(url).host; - +const MouseMaskContainer = styled('div')({ + position: 'absolute', + zIndex: 1, + top: '0px', + left: '0px', + right: '0px', + bottom: '0px', + backgroundColor: 'transparent', + '&:hover': { + pointerEvents: 'none', + }, +}); const LinkContainer = styled('div')<{ isSelected: boolean; }>(({ theme, isSelected }) => { @@ -38,12 +54,28 @@ const LinkContainer = styled('div')<{ }, }; }); - +const _getLinkStyle = (scene: string) => { + switch (scene) { + case SCENE_CONFIG.PAGE: + return { + width: '420px', + height: '198px', + }; + default: + return { + width: '252px', + height: '126px', + }; + } +}; const SourceViewContainer = styled('div')<{ isSelected: boolean; -}>(({ theme, isSelected }) => { + scene: string; +}>(({ theme, isSelected, scene }) => { return { + ..._getLinkStyle(scene), overflow: 'hidden', + position: 'relative', borderRadius: theme.affine.shape.borderRadius, background: isSelected ? 'rgba(152, 172, 189, 0.1)' : 'transparent', padding: '8px', @@ -52,32 +84,46 @@ const SourceViewContainer = styled('div')<{ height: '100%', border: '1px solid #EAEEF2', borderRadius: theme.affine.shape.borderRadius, + userSelect: 'none', }, }; }); - +const IframeContainer = styled('div')<{ show: boolean }>(({ show }) => { + return { + height: '100%', + display: show ? 'block' : 'none', + }; +}); export const SourceView: FC = props => { const { link, isSelected, block, editorElement } = props; const src = formatUrl(link); - const openTabOnBrowser = () => { - window.open(link, '_blank'); - }; + + const iframeContainer = useRef(null); + let iframeShow = useLazyIframe(src, 3000, iframeContainer); + const [currentView] = useCurrentView(); + const { type } = currentView; if (src?.startsWith('http')) { return ( - e.preventDefault()} - onClick={openTabOnBrowser} - > -

{getHost(src)}

-

{src}

- +
+ + + { + e.preventDefault(); + e.stopPropagation(); + }} + show={iframeShow} + ref={iframeContainer} + > + +
); } else if (src?.startsWith('affine')) { return ( { ); return [currentView, setCurrentView] as const; }; +export const useLazyIframe = ( + link: string, + timers: number, + container: MutableRefObject +) => { + const [iframeShow, setIframeShow] = useState(false); + useEffect(() => { + const iframe = document.createElement('iframe'); + iframe.src = link; + iframe.onload = () => { + setTimeout(() => { + setIframeShow(true); + }, timers); + }; + container.current.appendChild(iframe); + return () => { + iframe.remove(); + }; + }, [link, container]); + return iframeShow; +}; export const useRecastView = () => { const recastBlock = useRecastBlock(); const recastViews = From 3722dde811422b884d851d0d79ffdc18c6e38121 Mon Sep 17 00:00:00 2001 From: SaikaSakura Date: Tue, 2 Aug 2022 16:57:00 +0800 Subject: [PATCH 002/112] feat: grid optimise --- .../src/blocks/grid/GirdHandle.tsx | 32 ++++-- .../editor-blocks/src/blocks/grid/Grid.tsx | 99 +++++++++++++------ .../src/editor/drag-drop/drag-drop.ts | 12 +++ .../editor-core/src/editor/editor.ts | 29 +++++- 4 files changed, 131 insertions(+), 41 deletions(-) diff --git a/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx b/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx index e6464860c5..3ac519f3c5 100644 --- a/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx +++ b/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx @@ -12,6 +12,8 @@ type GridHandleProps = { blockId: string; enabledAddItem: boolean; draggable: boolean; + alertHandleId: string; + onMouseEnter?: React.MouseEventHandler; }; export const GridHandle: FC = function ({ @@ -21,6 +23,8 @@ export const GridHandle: FC = function ({ onDrag, onMouseDown, draggable, + alertHandleId, + onMouseEnter, }) { const [isMouseDown, setIsMouseDown] = useState(false); const handleMouseDown: React.MouseEventHandler = e => { @@ -44,16 +48,17 @@ export const GridHandle: FC = function ({ editor.selectionManager.setActivatedNodeId(textBlock.id); } }; + + const handleMouseEnter: React.MouseEventHandler = e => { + onMouseEnter && onMouseEnter(e); + }; + return ( {enabledAddItem ? ( = function ({ ); }; -const GridHandleContainer = styled('div')(({ theme }) => ({ +const GridHandleContainer = styled('div')<{ + isMouseDown: boolean; + isAlert: boolean; +}>(({ theme, isMouseDown, isAlert }) => ({ position: 'relative', width: '10px', flexGrow: '0', @@ -78,11 +86,17 @@ const GridHandleContainer = styled('div')(({ theme }) => ({ borderRadius: '1px', backgroundClip: 'content-box', ' &:hover': { - backgroundColor: theme.affine.palette.primary, + backgroundColor: isAlert + ? 'red !important' + : theme.affine.palette.primary, [`.${GRID_ADD_HANDLE_NAME}`]: { display: 'block', }, }, + ...(isMouseDown && + (isAlert + ? { backgroundColor: 'red' } + : { backgroundColor: theme.affine.palette.primary })), })); const AddGridHandle = styled('div')(({ theme }) => ({ diff --git a/libs/components/editor-blocks/src/blocks/grid/Grid.tsx b/libs/components/editor-blocks/src/blocks/grid/Grid.tsx index 77a83ff599..bc27ec4ac6 100644 --- a/libs/components/editor-blocks/src/blocks/grid/Grid.tsx +++ b/libs/components/editor-blocks/src/blocks/grid/Grid.tsx @@ -31,6 +31,7 @@ export const Grid: FC = function (props) { const gridItemCountRef = useRef(); const originalLeftWidth = useRef(GRID_ITEM_MIN_WIDTH); const originalRightWidth = useRef(GRID_ITEM_MIN_WIDTH); + const [alertHandleId, setAlertHandleId] = useState(null); const getLeftRightGridItemDomByIndex = (index: number) => { const gridItems = Array.from(gridContainerRef.current?.children).filter( @@ -117,7 +118,7 @@ export const Grid: FC = function (props) { itemDom.style.width = width; }; - const handleDragGrid = (e: MouseEvent, index: number) => { + const handleDragGrid = async (e: MouseEvent, index: number) => { setIsOnDrag(true); window.getSelection().removeAllRanges(); if (!isSetMouseUp.current) { @@ -165,39 +166,47 @@ export const Grid: FC = function (props) { setItemWidth(leftGrid, newLeft); setItemWidth(rightGrid, newRight); updateDbWidth(leftBlockId, newLeft, rightBlockId, newRight); + [leftBlockId, rightBlockId].forEach(async blockId => { + if (await checkGridItemHasOverflow(blockId)) { + setAlertHandleId(leftBlockId); + } else { + setAlertHandleId(null); + } + }); } } }; - const children = ( - <> - {block.childrenIds.map((id, i) => { - return ( - - - handleDragGrid(event, i)} - editor={editor} - onMouseDown={event => handleMouseDown(event, i)} - blockId={id} - enabledAddItem={ - block.childrenIds.length < MAX_ITEM_COUNT - } - draggable={i !== block.childrenIds.length - 1} - /> - - ); - })} - - ); + const checkGridItemHasOverflow = async (blockId: string) => { + let isOverflow = false; + const block = await editor.getBlockById(blockId); + if (block) { + const blockDom = block.dom; + if (blockDom) { + block.dom.style.overflow = 'scroll'; + if (block.dom.clientWidth !== block.dom.scrollWidth) { + isOverflow = true; + } + blockDom.style.overflow = 'visible'; + } + } + return isOverflow; + }; + + const handleHandleMouseEnter = ( + e: React.MouseEvent, + index: number + ) => { + const leftBlockId = block.childrenIds[index]; + const rightBlockId = block.childrenIds[index + 1]; + [leftBlockId, rightBlockId].forEach(async blockId => { + if (await checkGridItemHasOverflow(blockId)) { + setAlertHandleId(leftBlockId); + } else { + setAlertHandleId(null); + } + }); + }; return ( <> @@ -206,7 +215,35 @@ export const Grid: FC = function (props) { ref={gridContainerRef} isOnDrag={isOnDrag} > - {children} + {block.childrenIds.map((id, i) => { + return ( + + + handleDragGrid(event, i)} + editor={editor} + onMouseDown={event => handleMouseDown(event, i)} + blockId={id} + enabledAddItem={ + block.childrenIds.length < MAX_ITEM_COUNT + } + onMouseEnter={event => + handleHandleMouseEnter(event, i) + } + alertHandleId={alertHandleId} + draggable={i !== block.childrenIds.length - 1} + /> + + ); + })} {isOnDrag ? ReactDOM.createPortal(, window.document.body) diff --git a/libs/components/editor-core/src/editor/drag-drop/drag-drop.ts b/libs/components/editor-core/src/editor/drag-drop/drag-drop.ts index d3160d56f5..35426c73de 100644 --- a/libs/components/editor-core/src/editor/drag-drop/drag-drop.ts +++ b/libs/components/editor-core/src/editor/drag-drop/drag-drop.ts @@ -12,6 +12,7 @@ enum DragType { } const DRAG_STATE_CHANGE_EVENT_KEY = 'dragStateChange'; +const MAX_GRID_BLOCK_FLOOR = 3; export class DragDropManager { private _editor: Editor; private _enabled: boolean; @@ -231,6 +232,17 @@ export class DragDropManager { if (!(await this._canBeDrop(event))) { direction = BlockDropPlacement.none; } + if ( + direction === BlockDropPlacement.left || + direction === BlockDropPlacement.right + ) { + const path = await this._editor.getBlockPath(blockId); + const gridBlocks = path.filter(block => block.type === 'grid'); + // limit grid block floor counts + if (gridBlocks.length >= MAX_GRID_BLOCK_FLOOR) { + direction = BlockDropPlacement.none; + } + } this._setBlockDragDirection(direction); return direction; } diff --git a/libs/components/editor-core/src/editor/editor.ts b/libs/components/editor-core/src/editor/editor.ts index 73e7f6f7d5..8750a566c7 100644 --- a/libs/components/editor-core/src/editor/editor.ts +++ b/libs/components/editor-core/src/editor/editor.ts @@ -340,7 +340,20 @@ export class Editor implements Virgo { const rootBlockId = this.getRootBlockId(); const rootBlock = await this.getBlockById(rootBlockId); const blockList: Array = rootBlock ? [rootBlock] : []; - const children = (await rootBlock?.children()) || []; + return [...blockList, ...(await this.getOffspring(rootBlockId))]; + } + + /** + * + * get all offspring of block + * @param {string} id + * @return {*} + * @memberof Editor + */ + async getOffspring(id: string) { + const block = await this.getBlockById(id); + const blockList: Array = []; + const children = (await block?.children()) || []; for (const block of children) { if (!block) { continue; @@ -379,6 +392,20 @@ export class Editor implements Virgo { return lastBlock; } + async getBlockPath(id: string) { + const block = await this.getBlockById(id); + if (!block) { + return []; + } + const path = [block]; + let parent = await block.parent(); + while (parent) { + path.unshift(parent); + parent = await parent.parent(); + } + return path; + } + async getBlockByPoint(point: Point) { const blockList = await this.getBlockList(); From 6f340adf243e470cfba04916ec1ddc2780fde3d5 Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Tue, 2 Aug 2022 16:59:59 +0800 Subject: [PATCH 003/112] fix iframe will take away the focus --- libs/components/editor-core/src/recast-block/view.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/libs/components/editor-core/src/recast-block/view.ts b/libs/components/editor-core/src/recast-block/view.ts index 4386c83918..89b32488ea 100644 --- a/libs/components/editor-core/src/recast-block/view.ts +++ b/libs/components/editor-core/src/recast-block/view.ts @@ -61,10 +61,15 @@ export const useLazyIframe = ( iframe.src = link; iframe.onload = () => { setTimeout(() => { + // Prevent iframe from scrolling parent container + // TODO W3C https://github.com/w3c/csswg-drafts/issues/7134 + // https://forum.figma.com/t/prevent-figmas-embed-code-from-automatically-scrolling-to-it-on-page-load/26029/6 setIframeShow(true); }, timers); }; - container.current.appendChild(iframe); + if (container?.current) { + container.current.appendChild(iframe); + } return () => { iframe.remove(); }; From 96ea531b4ed508ff6cf4a9ab0431b47b0983a2de Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Tue, 2 Aug 2022 17:03:01 +0800 Subject: [PATCH 004/112] fix iframe will take away the focus --- libs/components/editor-core/src/recast-block/view.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/components/editor-core/src/recast-block/view.ts b/libs/components/editor-core/src/recast-block/view.ts index 89b32488ea..09e4644977 100644 --- a/libs/components/editor-core/src/recast-block/view.ts +++ b/libs/components/editor-core/src/recast-block/view.ts @@ -53,7 +53,7 @@ export const useCurrentView = () => { export const useLazyIframe = ( link: string, timers: number, - container: MutableRefObject + container: MutableRefObject ) => { const [iframeShow, setIframeShow] = useState(false); useEffect(() => { From 45691c025df881c57fa891624cff4b3421efeb61 Mon Sep 17 00:00:00 2001 From: SaikaSakura Date: Tue, 2 Aug 2022 17:27:06 +0800 Subject: [PATCH 005/112] feat: change left menu icon style --- .../src/menu/group-menu/DragItem.tsx | 20 +++++++++++-------- .../src/menu/left-menu/LeftMenuDraggable.tsx | 12 +++++++---- 2 files changed, 20 insertions(+), 12 deletions(-) diff --git a/libs/components/editor-plugins/src/menu/group-menu/DragItem.tsx b/libs/components/editor-plugins/src/menu/group-menu/DragItem.tsx index a323ca1961..35ee3d9683 100644 --- a/libs/components/editor-plugins/src/menu/group-menu/DragItem.tsx +++ b/libs/components/editor-plugins/src/menu/group-menu/DragItem.tsx @@ -4,7 +4,7 @@ import { HandleParentIcon } from '@toeverything/components/icons'; import { styled } from '@toeverything/components/ui'; import { Point } from '@toeverything/utils'; -export const ICON_WIDTH = 24; +export const ICON_WIDTH = 16; type DragItemProps = { isShow: boolean; @@ -30,17 +30,21 @@ export const DragItem = function ({ ); }; -const StyledDiv = styled('div')({ +const StyledDiv = styled('div')(theme => ({ padding: '0', - display: 'inlineFlex', + display: 'inline-flex', width: `${ICON_WIDTH}px`, - height: `${ICON_WIDTH}px`, + height: '20px', cursor: 'grab', - ':hover': { - backgroundColor: '#edeef0', - borderRadius: '4px', + '& svg': { + fontSize: '20px', + marginLeft: '-2px', }, -}); + ':hover': { + backgroundColor: '#F5F7F8', + borderRadius: '3.75px', + }, +})); const StyledButton = styled('div')({ padding: '0', diff --git a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx index 602c08aacb..693c29c9b4 100644 --- a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx +++ b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx @@ -239,11 +239,15 @@ const Draggable = styled(Button)({ alignItems: 'center', justifyContent: 'center', backgroundColor: 'transparent', - width: '24px', - height: '24px', + width: '16px', + height: '20px', + '& svg': { + fontSize: '20px', + marginLeft: '-2px', + }, ':hover': { - backgroundColor: '#edeef0', - borderRadius: '4px', + backgroundColor: '#F5F7F8', + borderRadius: '3.75px', }, }); From f18f51ba7cf245f3cb3042540ba5f0237bdb4767 Mon Sep 17 00:00:00 2001 From: QiShaoXuan Date: Tue, 2 Aug 2022 19:10:51 +0800 Subject: [PATCH 006/112] feat: support group by status in kanban mode, resolved #40 --- .../group/scene-kanban/CardContainer.tsx | 1 + .../pendant-modify-panel/Information.tsx | 8 ++-- .../pendant-modify-panel/Select.tsx | 4 +- .../CreatePendantPanel.tsx | 15 ++++--- .../editor-core/src/block-pendant/utils.ts | 24 ++++++++---- .../components/editor-core/src/kanban/atom.ts | 39 +++++++++++++++---- .../editor-core/src/kanban/group.ts | 1 + .../editor-core/src/kanban/kanban.ts | 8 ++-- .../editor-core/src/kanban/types.ts | 5 ++- .../editor-core/src/recast-block/property.ts | 12 +++--- 10 files changed, 76 insertions(+), 41 deletions(-) diff --git a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContainer.tsx b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContainer.tsx index 3616c0d206..cd71b72666 100644 --- a/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContainer.tsx +++ b/libs/components/editor-blocks/src/blocks/group/scene-kanban/CardContainer.tsx @@ -41,6 +41,7 @@ const getKanbanColor = ( return DEFAULT_COLOR; } if ( + group.type === PropertyType.Status || group.type === PropertyType.Select || group.type === PropertyType.MultiSelect || group.type === DEFAULT_GROUP_ID diff --git a/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Information.tsx b/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Information.tsx index afd5bc5525..a8929f9e6b 100644 --- a/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Information.tsx +++ b/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Information.tsx @@ -4,7 +4,7 @@ import { ModifyPanelContentProps } from './types'; import { StyledDivider, StyledPopoverSubTitle } from '../StyledComponent'; import { BasicSelect } from './Select'; import { InformationProperty, InformationValue } from '../../recast-block'; -import { genInitialOptions, getPendantIconsConfigByName } from '../utils'; +import { generateInitialOptions, getPendantIconsConfigByName } from '../utils'; export default (props: ModifyPanelContentProps) => { const { onPropertyChange, onValueChange, initialValue, property } = props; @@ -38,7 +38,7 @@ export default (props: ModifyPanelContentProps) => { }} initialOptions={ propProperty?.emailOptions || - genInitialOptions( + generateInitialOptions( property?.type, getPendantIconsConfigByName('Email') ) @@ -66,7 +66,7 @@ export default (props: ModifyPanelContentProps) => { }} initialOptions={ propProperty?.phoneOptions || - genInitialOptions( + generateInitialOptions( property?.type, getPendantIconsConfigByName('Phone') ) @@ -94,7 +94,7 @@ export default (props: ModifyPanelContentProps) => { }} initialOptions={ propProperty?.locationOptions || - genInitialOptions( + generateInitialOptions( property?.type, getPendantIconsConfigByName('Location') ) diff --git a/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Select.tsx b/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Select.tsx index 6d0d1f26f9..b016437ac8 100644 --- a/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Select.tsx +++ b/libs/components/editor-core/src/block-pendant/pendant-modify-panel/Select.tsx @@ -21,7 +21,7 @@ import { } from '@toeverything/components/ui'; import { HighLightIconInput } from './IconInput'; import { PendantConfig, IconNames, OptionIdType, OptionType } from '../types'; -import { genBasicOption } from '../utils'; +import { generateBasicOption } from '../utils'; type OptionItemType = { option: OptionType; @@ -66,7 +66,7 @@ export const BasicSelect = ({ const [selectIds, setSelectIds] = useState(initialValue); const insertOption = (insertId: OptionIdType) => { - const newOption = genBasicOption({ + const newOption = generateBasicOption({ index: options.length + 1, iconConfig, }); diff --git a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx index b9d29cebe7..fa7d50bfba 100644 --- a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx +++ b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx @@ -1,5 +1,4 @@ import React, { useState, useEffect } from 'react'; -import { nanoid } from 'nanoid'; import { Input, Option, Select, Tooltip } from '@toeverything/components/ui'; import { HelpCenterIcon } from '@toeverything/components/icons'; import { AsyncBlock } from '../../editor'; @@ -15,13 +14,13 @@ import { StyledPopoverSubTitle, StyledPopoverWrapper, } from '../StyledComponent'; -import { genInitialOptions, getPendantConfigByType } from '../utils'; +import { + generateRandomFieldName, + generateInitialOptions, + getPendantConfigByType, +} from '../utils'; import { useOnCreateSure } from './hooks'; -const upperFirst = (str: string) => { - return `${str[0].toUpperCase()}${str.slice(1)}`; -}; - export const CreatePendantPanel = ({ block, onSure, @@ -35,7 +34,7 @@ export const CreatePendantPanel = ({ useEffect(() => { selectedOption && - setFieldName(upperFirst(`${selectedOption.type}#${nanoid(4)}`)); + setFieldName(generateRandomFieldName(selectedOption.type)); }, [selectedOption]); return ( @@ -93,7 +92,7 @@ export const CreatePendantPanel = ({ { return tempOptions.findIndex((o: OptionType) => o.id === id); }) - .filter(index => index != -1); + .filter(index => index !== -1); selectedId = selectedIndex.map((index: number) => { return options[index].id; }); @@ -130,7 +131,7 @@ export const getPendantIconsConfigByName = ( return pendantConfig[pendantName]; }; -export const genBasicOption = ({ +export const generateBasicOption = ({ index, iconConfig, name = '', @@ -159,22 +160,22 @@ export const genBasicOption = ({ /** * Status Pendant is a Select Pendant built-in some options * **/ -export const genInitialOptions = ( +export const generateInitialOptions = ( type: PendantTypes, iconConfig: PendantConfig ) => { if (type === PendantTypes.Status) { return [ - genBasicOption({ index: 0, iconConfig, name: 'No Started' }), - genBasicOption({ + generateBasicOption({ index: 0, iconConfig, name: 'No Started' }), + generateBasicOption({ index: 1, iconConfig, name: 'In Progress', }), - genBasicOption({ index: 2, iconConfig, name: 'Complete' }), + generateBasicOption({ index: 2, iconConfig, name: 'Complete' }), ]; } - return [genBasicOption({ index: 0, iconConfig })]; + return [generateBasicOption({ index: 0, iconConfig })]; }; export const checkPendantForm = ( @@ -222,3 +223,10 @@ export const checkPendantForm = ( return { passed: true, message: 'Check passed !' }; }; + +const upperFirst = (str: string) => { + return `${str[0].toUpperCase()}${str.slice(1)}`; +}; + +export const generateRandomFieldName = (type: PendantTypes) => + upperFirst(`${type}#${nanoid(4)}`); diff --git a/libs/components/editor-core/src/kanban/atom.ts b/libs/components/editor-core/src/kanban/atom.ts index b903e2d92f..238690863c 100644 --- a/libs/components/editor-core/src/kanban/atom.ts +++ b/libs/components/editor-core/src/kanban/atom.ts @@ -10,6 +10,12 @@ import { } from '../recast-block/types'; import type { DefaultGroup, KanbanGroup } from './types'; import { DEFAULT_GROUP_ID } from './types'; +import { + generateInitialOptions, + generateRandomFieldName, + getPendantIconsConfigByName, +} from '../block-pendant/utils'; +import { SelectOption } from '../recast-block'; /** * - If the `groupBy` is `SelectProperty` or `MultiSelectProperty`, return `(Multi)SelectProperty.options`. @@ -23,6 +29,7 @@ export const getGroupOptions = async ( return []; } switch (groupBy.type) { + case PropertyType.Status: case PropertyType.Select: case PropertyType.MultiSelect: { return groupBy.options.map(option => ({ @@ -57,6 +64,9 @@ const isValueBelongOption = ( case PropertyType.MultiSelect: { return propertyValue.value.some(i => i === option.id); } + case PropertyType.Status: { + return propertyValue.value === option.id; + } // case PropertyType.Text: { // TOTODO:DO support this type // } @@ -107,6 +117,7 @@ export const moveCardToGroup = async ( success = await removeValue(groupById); return false; } + switch (group.type) { case PropertyType.Select: { success = await setValue({ @@ -116,6 +127,14 @@ export const moveCardToGroup = async ( }); break; } + case PropertyType.Status: { + success = await setValue({ + id: groupById, + type: group.type, + value: group.id, + }); + break; + } case PropertyType.MultiSelect: { success = await setValue({ id: groupById, @@ -194,14 +213,18 @@ export const genDefaultGroup = (groupBy: RecastMetaProperty): DefaultGroup => ({ items: [], }); -export const DEFAULT_GROUP_BY_PROPERTY = { - name: 'Status', - options: [ - { name: 'No Started', color: '#E53535', background: '#FFCECE' }, - { name: 'In Progress', color: '#A77F1A', background: '#FFF5AB' }, - { name: 'Complete', color: '#3C8867', background: '#C5FBE0' }, - ], -}; +export const generateDefaultGroupByProperty = (): { + name: string; + options: Omit[]; + type: PropertyType.Status; +} => ({ + name: generateRandomFieldName(PropertyType.Status), + type: PropertyType.Status, + options: generateInitialOptions( + PropertyType.Status, + getPendantIconsConfigByName(PropertyType.Status) + ), +}); /** * Unwrap blocks from the grid recursively. diff --git a/libs/components/editor-core/src/kanban/group.ts b/libs/components/editor-core/src/kanban/group.ts index 0297946d89..e857a6865a 100644 --- a/libs/components/editor-core/src/kanban/group.ts +++ b/libs/components/editor-core/src/kanban/group.ts @@ -7,6 +7,7 @@ export const useKanbanGroup = (groupBy: RecastMetaProperty) => { const { updateSelect } = useSelectProperty(); switch (groupBy.type) { + case PropertyType.Status: case PropertyType.MultiSelect: case PropertyType.Select: { const { diff --git a/libs/components/editor-core/src/kanban/kanban.ts b/libs/components/editor-core/src/kanban/kanban.ts index 675e75db3e..21564b6b2e 100644 --- a/libs/components/editor-core/src/kanban/kanban.ts +++ b/libs/components/editor-core/src/kanban/kanban.ts @@ -18,8 +18,8 @@ import { import { supportChildren } from '../utils'; import { calcCardGroup, - DEFAULT_GROUP_BY_PROPERTY, genDefaultGroup, + generateDefaultGroupByProperty, getCardGroup, getGroupOptions, moveCardToAfter, @@ -48,6 +48,7 @@ export const useRecastKanbanGroupBy = () => { // Add other type groupBy support const supportedGroupBy = getProperties().filter( prop => + prop.type === PropertyType.Status || prop.type === PropertyType.Select || prop.type === PropertyType.MultiSelect ); @@ -88,7 +89,8 @@ export const useRecastKanbanGroupBy = () => { // TODO: support other property type if ( groupByProperty.type !== PropertyType.Select && - groupByProperty.type !== PropertyType.MultiSelect + groupByProperty.type !== PropertyType.MultiSelect && + groupByProperty.type !== PropertyType.Status ) { console.warn('Not support groupBy type', groupByProperty); @@ -134,7 +136,7 @@ export const useInitKanbanEffect = (): } // 3. no group by, no properties // create a new property and set it as group by - const prop = await createSelect(DEFAULT_GROUP_BY_PROPERTY); + const prop = await createSelect(generateDefaultGroupByProperty()); await setGroupBy(prop.id); }; diff --git a/libs/components/editor-core/src/kanban/types.ts b/libs/components/editor-core/src/kanban/types.ts index c34371f2d8..926b274c77 100644 --- a/libs/components/editor-core/src/kanban/types.ts +++ b/libs/components/editor-core/src/kanban/types.ts @@ -46,7 +46,10 @@ export type DefaultGroup = KanbanGroupBase & { type SelectGroup = KanbanGroupBase & SelectOption & { - type: PropertyType.Select | PropertyType.MultiSelect; + type: + | PropertyType.Select + | PropertyType.MultiSelect + | PropertyType.Status; }; type TextGroup = KanbanGroupBase & { diff --git a/libs/components/editor-core/src/recast-block/property.ts b/libs/components/editor-core/src/recast-block/property.ts index e8f0104269..1452bba849 100644 --- a/libs/components/editor-core/src/recast-block/property.ts +++ b/libs/components/editor-core/src/recast-block/property.ts @@ -257,14 +257,12 @@ export const getRecastItemValue = (block: RecastItem | AsyncBlock) => { const isSelectLikeProperty = ( metaProperty?: RecastMetaProperty ): metaProperty is SelectProperty | MultiSelectProperty => { - if ( + return !( !metaProperty || - (metaProperty.type !== PropertyType.Select && + (metaProperty.type !== PropertyType.Status && + metaProperty.type !== PropertyType.Select && metaProperty.type !== PropertyType.MultiSelect) - ) { - return false; - } - return true; + ); }; /** @@ -312,7 +310,7 @@ export const useSelectProperty = () => { }; const updateSelect = ( - selectProperty: SelectProperty | MultiSelectProperty + selectProperty: StatusProperty | SelectProperty | MultiSelectProperty ) => { // if (typeof selectProperty === 'string') { // const maybeSelectProperty = getProperty(selectProperty); From dd4360fb7988202bd88ae81c85c03fca0a811336 Mon Sep 17 00:00:00 2001 From: QiShaoXuan Date: Tue, 2 Aug 2022 19:44:04 +0800 Subject: [PATCH 007/112] fix: The status history in kanban mode cannot be synced to text mode, fixed #43 --- .../src/block-pendant/use-pendant.ts | 37 ++------------ .../editor-core/src/block-pendant/utils.ts | 45 +++++++++++++++-- .../components/editor-core/src/kanban/atom.ts | 49 ++++++++----------- .../editor-core/src/kanban/kanban.ts | 21 ++++++-- 4 files changed, 84 insertions(+), 68 deletions(-) diff --git a/libs/components/editor-core/src/block-pendant/use-pendant.ts b/libs/components/editor-core/src/block-pendant/use-pendant.ts index 55c8aa054e..da66906db2 100644 --- a/libs/components/editor-core/src/block-pendant/use-pendant.ts +++ b/libs/components/editor-core/src/block-pendant/use-pendant.ts @@ -1,41 +1,10 @@ -import { removePropertyValueRecord, setPendantHistory } from './utils'; +import { getPendantController } from './utils'; import { AsyncBlock } from '../editor'; -import { - getRecastItemValue, - RecastMetaProperty, - useRecastBlock, -} from '../recast-block'; +import { useRecastBlock } from '../recast-block'; export const usePendant = (block: AsyncBlock) => { // const { getProperties, removeProperty } = useRecastBlockMeta(); const recastBlock = useRecastBlock(); - const { getValue, setValue, removeValue } = getRecastItemValue(block); - // const { updateSelect } = useSelectProperty(); - const setPendant = async (property: RecastMetaProperty, newValue: any) => { - const nv = { - id: property.id, - type: property.type, - value: newValue, - }; - await setValue(nv); - setPendantHistory({ - recastBlockId: recastBlock.id, - blockId: block.id, - propertyId: property.id, - }); - }; - - const removePendant = async (property: RecastMetaProperty) => { - await removeValue(property.id); - removePropertyValueRecord({ - recastBlockId: block.id, - propertyId: property.id, - }); - }; - - return { - setPendant, - removePendant, - }; + return getPendantController(recastBlock, block); }; diff --git a/libs/components/editor-core/src/block-pendant/utils.ts b/libs/components/editor-core/src/block-pendant/utils.ts index a7cd6f3fc9..b55e0a9175 100644 --- a/libs/components/editor-core/src/block-pendant/utils.ts +++ b/libs/components/editor-core/src/block-pendant/utils.ts @@ -1,13 +1,16 @@ import { + getRecastItemValue, PropertyType, - RecastBlockValue, + RecastBlock, + RecastItem, + RecastMetaProperty, RecastPropertyId, SelectOption, } from '../recast-block'; -import { OptionIdType, OptionType } from './types'; +import { OptionIdType, OptionType, PendantConfig, PendantTypes } from './types'; import { pendantConfig } from './config'; -import { PendantConfig, PendantTypes } from './types'; import { nanoid } from 'nanoid'; +import { AsyncBlock } from '../editor'; type Props = { recastBlockId: string; blockId: string; @@ -81,6 +84,42 @@ export const removePendantHistory = ({ localStorage.setItem(LOCAL_STORAGE_NAME, JSON.stringify(data)); }; +export const getPendantController = ( + recastBlock: RecastBlock, + block: AsyncBlock | RecastItem +) => { + const { setValue, removeValue } = getRecastItemValue(block); + + const setPendant = async (property: RecastMetaProperty, newValue: any) => { + const nv = { + id: property.id, + type: property.type, + value: newValue, + }; + + setPendantHistory({ + recastBlockId: recastBlock.id, + blockId: block.id, + propertyId: property.id, + }); + + return await setValue(nv); + }; + + const removePendant = async (property: RecastMetaProperty) => { + removePendantHistory({ + recastBlockId: block.id, + propertyId: property.id, + }); + return await removeValue(property.id); + }; + + return { + setPendant, + removePendant, + }; +}; + /** * In select pendant panel, use mock options instead of use `createSelect` when add or delete option * so the option`s id is index number, not `SelectOptionId` diff --git a/libs/components/editor-core/src/kanban/atom.ts b/libs/components/editor-core/src/kanban/atom.ts index 238690863c..5bb3e652a6 100644 --- a/libs/components/editor-core/src/kanban/atom.ts +++ b/libs/components/editor-core/src/kanban/atom.ts @@ -6,7 +6,6 @@ import { PropertyType, RecastBlockValue, RecastMetaProperty, - RecastPropertyId, } from '../recast-block/types'; import type { DefaultGroup, KanbanGroup } from './types'; import { DEFAULT_GROUP_ID } from './types'; @@ -14,6 +13,7 @@ import { generateInitialOptions, generateRandomFieldName, getPendantIconsConfigByName, + getPendantController, } from '../block-pendant/utils'; import { SelectOption } from '../recast-block'; @@ -106,49 +106,42 @@ export const calcCardGroup = ( /** * Set group value for the card block */ -export const moveCardToGroup = async ( - groupById: RecastPropertyId, - cardBlock: RecastItem, - group: KanbanGroup -) => { - const { setValue, removeValue } = getRecastItemValue(cardBlock); +export const moveCardToGroup = async ({ + groupBy, + cardBlock, + group, + recastBlock, +}: { + groupBy: RecastMetaProperty; + cardBlock: RecastItem; + group: KanbanGroup; + recastBlock: RecastBlock; +}) => { + const { setPendant, removePendant } = getPendantController( + recastBlock, + cardBlock + ); let success = false; if (group.id === DEFAULT_GROUP_ID) { - success = await removeValue(groupById); + success = await removePendant(groupBy); return false; } switch (group.type) { case PropertyType.Select: { - success = await setValue({ - id: groupById, - type: group.type, - value: group.id, - }); + success = await setPendant(groupBy, group.id); break; } case PropertyType.Status: { - success = await setValue({ - id: groupById, - type: group.type, - value: group.id, - }); + success = await setPendant(groupBy, group.id); break; } case PropertyType.MultiSelect: { - success = await setValue({ - id: groupById, - type: group.type, - value: [group.id], - }); + success = await setPendant(groupBy, [group.id]); break; } case PropertyType.Text: { - success = await setValue({ - id: groupById, - type: group.type, - value: group.id, - }); + success = await setPendant(groupBy, group.id); break; } default: diff --git a/libs/components/editor-core/src/kanban/kanban.ts b/libs/components/editor-core/src/kanban/kanban.ts index 21564b6b2e..ff33b17f1d 100644 --- a/libs/components/editor-core/src/kanban/kanban.ts +++ b/libs/components/editor-core/src/kanban/kanban.ts @@ -199,7 +199,12 @@ export const useRecastKanban = () => { beforeBlock: string | null, afterBlock: string | null ) => { - await moveCardToGroup(groupBy.id, child, kanbanMap[id]); + await moveCardToGroup({ + groupBy, + cardBlock: child, + group: kanbanMap[id], + recastBlock, + }); if (beforeBlock) { const block = await editor.getBlockById( beforeBlock @@ -288,7 +293,12 @@ export const useKanban = () => { ); if (isChangedGroup) { // 1.2 Move to the target group - await moveCardToGroup(groupBy.id, targetCard, targetGroup); + await moveCardToGroup({ + groupBy, + cardBlock: targetCard, + group: targetGroup, + recastBlock, + }); } // 2. Reorder the card @@ -326,7 +336,12 @@ export const useKanban = () => { } recastBlock.append(newBlock); const newCard = newBlock as unknown as RecastItem; - await moveCardToGroup(groupBy.id, newCard, group); + await moveCardToGroup({ + groupBy, + cardBlock: newCard, + group, + recastBlock, + }); }, [editor, groupBy.id, recastBlock] ); From 928a90942a408d42d5d1a16cc774bd7a32420a93 Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Wed, 3 Aug 2022 11:04:02 +0800 Subject: [PATCH 008/112] fix clickaway error in page --- .../src/menu/command-menu/Menu.tsx | 42 ++++++++++--------- 1 file changed, 23 insertions(+), 19 deletions(-) diff --git a/libs/components/editor-plugins/src/menu/command-menu/Menu.tsx b/libs/components/editor-plugins/src/menu/command-menu/Menu.tsx index 3ab140f3bc..1cd22e48e2 100644 --- a/libs/components/editor-plugins/src/menu/command-menu/Menu.tsx +++ b/libs/components/editor-plugins/src/menu/command-menu/Menu.tsx @@ -237,25 +237,29 @@ export const CommandMenu = ({ editor, hooks, style }: CommandMenuProps) => { onKeyUpCapture={handle_keyup} ref={commandMenuContentRef} > - -
- -
- + {show ? ( + +
+ +
+ + ) : ( + <> + )} ); }; From 727c7428890bf855634973bbe386b4d71521ef96 Mon Sep 17 00:00:00 2001 From: QiShaoXuan Date: Wed, 3 Aug 2022 11:14:52 +0800 Subject: [PATCH 009/112] feat: modify the type of animation that appears for the pendant Add button --- .../src/block-pendant/pendant-render/PandentRender.tsx | 7 +++---- libs/components/ui/src/mui.ts | 6 ++++++ 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/libs/components/editor-core/src/block-pendant/pendant-render/PandentRender.tsx b/libs/components/editor-core/src/block-pendant/pendant-render/PandentRender.tsx index 8b6c9bb53f..76ed0d4e32 100644 --- a/libs/components/editor-core/src/block-pendant/pendant-render/PandentRender.tsx +++ b/libs/components/editor-core/src/block-pendant/pendant-render/PandentRender.tsx @@ -1,5 +1,5 @@ import { - MuiZoom, + MuiFade, Popover, PopperHandler, styled, @@ -100,16 +100,15 @@ export const PendantRender = ({ block }: { block: AsyncBlock }) => { ); })} {hasAddBtn ? ( - +
- + ) : null} ); diff --git a/libs/components/ui/src/mui.ts b/libs/components/ui/src/mui.ts index 94025c5f5b..b0658ad526 100644 --- a/libs/components/ui/src/mui.ts +++ b/libs/components/ui/src/mui.ts @@ -51,6 +51,7 @@ import { tooltipClasses, Typography, Zoom, + Fade, } from '@mui/material'; export { alpha } from '@mui/system'; @@ -233,6 +234,11 @@ export const MuiInput = Input; */ export const MuiZoom = Zoom; +/** + * @deprecated It is not recommended to use Mui directly, because the design will not refer to Mui's interaction logic. + */ +export const MuiFade = Fade; + /** * @deprecated It is not recommended to use Mui directly, because the design will not refer to Mui's interaction logic. */ From fe9a4470fceee1f235567732e86485963db54b65 Mon Sep 17 00:00:00 2001 From: QiShaoXuan Date: Wed, 3 Aug 2022 11:18:00 +0800 Subject: [PATCH 010/112] fix: fix mui select throw wraning when pendant select change --- .../pendant-operation-panel/CreatePendantPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx index fa7d50bfba..b09f23ed35 100644 --- a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx +++ b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx @@ -44,7 +44,7 @@ export const CreatePendantPanel = ({ set_search(e.target.value)} /> - @@ -119,8 +99,30 @@ export const Search = (props: SearchProps) => { }} /> ))} - + ); }; + +const SearchInput = styled('input')(({ theme }) => ({ + margin: '0.5em', + backgroundColor: 'white', + boxShadow: theme.affine.shadows.shadowSxDownLg, + padding: '16px 32px', + borderRadius: '10px', +})); + +const ResultContainer = styled(MuiBox)(({ theme }) => ({ + margin: '0.5em', + backgroundColor: 'white', + boxShadow: theme.affine.shadows.shadowSxDownLg, + padding: '16px 32px', + borderRadius: '10px', + transitionProperty: 'max-height', + transitionDuration: '300ms', + transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)', + transitionDelay: '0ms', + overflowX: 'hidden', + overflowY: 'hidden', +})); diff --git a/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx b/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx index ada3a92f57..47003af1c2 100644 --- a/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx +++ b/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx @@ -20,7 +20,7 @@ const IconWrapper = styled('div')>( width: '20px', height: '20px', borderRadius: '5px', - boxShadow: '0px 1px 10px rgba(152, 172, 189, 0.6)', + boxShadow: theme.affine.shadows.shadowSxDownLg, color: theme.affine.palette.primary, cursor: 'pointer', backgroundColor: theme.affine.palette.white, diff --git a/libs/components/ui/src/cascader/Cascader.tsx b/libs/components/ui/src/cascader/Cascader.tsx index 5ff6fe608d..5c8a02e3a9 100644 --- a/libs/components/ui/src/cascader/Cascader.tsx +++ b/libs/components/ui/src/cascader/Cascader.tsx @@ -133,7 +133,7 @@ export function Cascader(props: CascaderProps) { const MenuPaper = styled('div')(({ theme }) => ({ fontFamily: 'PingFang SC', background: '#FFF', - boxShadow: '0px 1px 10px rgba(152, 172, 189, 0.6)', + boxShadow: theme.affine.shadows.shadowSxDownLg, borderRadius: '10px 0px 10px 10px', color: '#4C6275', fontWeight: '400', diff --git a/libs/components/ui/src/theme/theme.ts b/libs/components/ui/src/theme/theme.ts index a51bca8827..1e9f6f5436 100644 --- a/libs/components/ui/src/theme/theme.ts +++ b/libs/components/ui/src/theme/theme.ts @@ -225,7 +225,7 @@ export const Theme = { }, shadows: { none: 'none', - shadowSxDownLg: '0px 1px 10px rgba(152, 172, 189, 0.6)', + shadowSxDownLg: '0px 1px 5px rgba(152, 172, 189, 0.2)', }, border: ['none'], spacing: { From fdc9a17f46e54d493d3a9249ea983bc03cfe7dcb Mon Sep 17 00:00:00 2001 From: DarkSky Date: Thu, 4 Aug 2022 17:13:24 +0800 Subject: [PATCH 032/112] chore: file copy --- .github/deployment/Dockerfile-affine | 2 +- .github/deployment/Dockerfile-lisa | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/deployment/Dockerfile-affine b/.github/deployment/Dockerfile-affine index 09524b335b..46a46233f2 100644 --- a/.github/deployment/Dockerfile-affine +++ b/.github/deployment/Dockerfile-affine @@ -7,7 +7,7 @@ RUN npm i -g pnpm@7 && pnpm i --frozen-lockfile --store=node_modules/.pnpm-store FROM node:16-alpine as relocate WORKDIR /app COPY --from=builder /app/dist/apps/ligo-virgo ./dist -COPY --from=builder /app/.github/deployment/Caddyfile-affine ./ +COPY --from=builder /app/.github/deployment/Caddyfile-affine ./Caddyfile RUN rm ./dist/*.txt # ============= diff --git a/.github/deployment/Dockerfile-lisa b/.github/deployment/Dockerfile-lisa index 413cb625fa..471e4d0d48 100644 --- a/.github/deployment/Dockerfile-lisa +++ b/.github/deployment/Dockerfile-lisa @@ -7,7 +7,7 @@ RUN npm i -g pnpm@7 && pnpm i --frozen-lockfile --store=node_modules/.pnpm-store FROM node:16-alpine as relocate WORKDIR /app COPY --from=builder /app/dist/apps/ligo-virgo ./dist -COPY --from=builder /app/.github/deployment/Caddyfile-lisa ./ +COPY --from=builder /app/.github/deployment/Caddyfile-lisa ./Caddyfile RUN rm ./dist/*.txt # ============= From ce5a523b12ff5244ed7c553cec6b3792fb01e262 Mon Sep 17 00:00:00 2001 From: alt0 Date: Thu, 4 Aug 2022 17:47:09 +0800 Subject: [PATCH 033/112] fix: rename shadowSxDownLg -> shadow1 --- apps/ligo-virgo/src/pages/workspace/docs/Page.tsx | 2 +- libs/components/common/src/lib/text/plugins/link.tsx | 4 ++-- libs/components/editor-blocks/src/blocks/group/GroupView.tsx | 2 +- .../editor-blocks/src/blocks/group/components/Panel.tsx | 2 +- libs/components/editor-plugins/src/comment/Container.tsx | 2 +- .../editor-plugins/src/menu/command-menu/Container.tsx | 2 +- .../editor-plugins/src/menu/inline-menu/Container.tsx | 2 +- .../editor-plugins/src/menu/reference-menu/Container.tsx | 2 +- libs/components/editor-plugins/src/search/Search.tsx | 4 ++-- .../layout/src/header/EditorBoardSwitcher/StatusIcon.tsx | 2 +- .../layout/src/settings-sidebar/Comments/CommentItem.tsx | 2 +- libs/components/ui/src/cascader/Cascader.tsx | 2 +- libs/components/ui/src/popover/Container.tsx | 2 +- libs/components/ui/src/select/Select.tsx | 2 +- libs/components/ui/src/theme/theme.ts | 4 ++-- 15 files changed, 18 insertions(+), 18 deletions(-) diff --git a/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx b/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx index b150303d31..9bab8ba8ea 100644 --- a/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx +++ b/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx @@ -210,7 +210,7 @@ const WorkspaceSidebar = styled('div')(({ theme }) => ({ width: 300, minWidth: 300, borderRadius: '0px 10px 10px 0px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: '#FFFFFF', transitionProperty: 'left', transitionDuration: '0.35s', diff --git a/libs/components/common/src/lib/text/plugins/link.tsx b/libs/components/common/src/lib/text/plugins/link.tsx index 52c39f6053..60193e38a0 100644 --- a/libs/components/common/src/lib/text/plugins/link.tsx +++ b/libs/components/common/src/lib/text/plugins/link.tsx @@ -125,7 +125,7 @@ const LinkStyledTooltip = styled(({ className, ...props }: MuiTooltipProps) => ( [`& .${muiTooltipClasses.tooltip}`]: { backgroundColor: '#fff', color: '#4C6275', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, fontSize: '14px', }, [`& .MuiTooltip-tooltipPlacementBottom`]: { @@ -497,7 +497,7 @@ const LinkModalContainer = styled('div')(({ theme }) => ({ padding: '12px', display: 'flex', borderRadius: '4px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: '#fff', alignItems: 'center', zIndex: '1', diff --git a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx index a3e2353fb5..193a97f076 100644 --- a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx +++ b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx @@ -69,7 +69,7 @@ const GroupContainer = styled('div')<{ isSelect?: boolean }>( } : { '&:hover': { - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, }, }), }) diff --git a/libs/components/editor-blocks/src/blocks/group/components/Panel.tsx b/libs/components/editor-blocks/src/blocks/group/components/Panel.tsx index 269fe892bf..d6d4b79f02 100644 --- a/libs/components/editor-blocks/src/blocks/group/components/Panel.tsx +++ b/libs/components/editor-blocks/src/blocks/group/components/Panel.tsx @@ -6,7 +6,7 @@ const StyledPanel = styled('div')(({ theme }) => ({ position: 'absolute', top: 50, background: '#FFFFFF', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, borderRadius: 10, padding: '12px 24px', })); diff --git a/libs/components/editor-plugins/src/comment/Container.tsx b/libs/components/editor-plugins/src/comment/Container.tsx index 6c0ed17b4c..fd8568725f 100644 --- a/libs/components/editor-plugins/src/comment/Container.tsx +++ b/libs/components/editor-plugins/src/comment/Container.tsx @@ -64,7 +64,7 @@ const StyledContainerForAddCommentContainer = styled('div')(({ theme }) => { zIndex: 1, display: 'flex', borderRadius: theme.affine.shape.borderRadius, - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: theme.affine.palette.white, }; }); diff --git a/libs/components/editor-plugins/src/menu/command-menu/Container.tsx b/libs/components/editor-plugins/src/menu/command-menu/Container.tsx index 755076d49d..43092ea535 100644 --- a/libs/components/editor-plugins/src/menu/command-menu/Container.tsx +++ b/libs/components/editor-plugins/src/menu/command-menu/Container.tsx @@ -31,7 +31,7 @@ const RootContainer = styled('div')(({ theme }) => { width: 352, maxHeight: 525, borderRadius: '10px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: '#fff', padding: '8px 4px', }; diff --git a/libs/components/editor-plugins/src/menu/inline-menu/Container.tsx b/libs/components/editor-plugins/src/menu/inline-menu/Container.tsx index ac9b985dc4..27807b6186 100644 --- a/libs/components/editor-plugins/src/menu/inline-menu/Container.tsx +++ b/libs/components/editor-plugins/src/menu/inline-menu/Container.tsx @@ -82,6 +82,6 @@ const ToolbarContainer = styled('div')(({ theme }) => ({ alignItems: 'center', padding: '0 12px', borderRadius: '10px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: '#fff', })); diff --git a/libs/components/editor-plugins/src/menu/reference-menu/Container.tsx b/libs/components/editor-plugins/src/menu/reference-menu/Container.tsx index fc1c09d2ca..47a1672d4d 100644 --- a/libs/components/editor-plugins/src/menu/reference-menu/Container.tsx +++ b/libs/components/editor-plugins/src/menu/reference-menu/Container.tsx @@ -179,7 +179,7 @@ const RootContainer = styled('div')(({ theme }) => ({ zIndex: 1, maxHeight: '525px', borderRadius: '10px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, backgroundColor: '#fff', padding: '8px 4px', })); diff --git a/libs/components/editor-plugins/src/search/Search.tsx b/libs/components/editor-plugins/src/search/Search.tsx index 228c858aa5..6b02b6334e 100644 --- a/libs/components/editor-plugins/src/search/Search.tsx +++ b/libs/components/editor-plugins/src/search/Search.tsx @@ -108,7 +108,7 @@ export const Search = (props: SearchProps) => { const SearchInput = styled('input')(({ theme }) => ({ margin: '0.5em', backgroundColor: 'white', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, padding: '16px 32px', borderRadius: '10px', })); @@ -116,7 +116,7 @@ const SearchInput = styled('input')(({ theme }) => ({ const ResultContainer = styled(MuiBox)(({ theme }) => ({ margin: '0.5em', backgroundColor: 'white', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, padding: '16px 32px', borderRadius: '10px', transitionProperty: 'max-height', diff --git a/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx b/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx index 47003af1c2..a30e17f913 100644 --- a/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx +++ b/libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx @@ -20,7 +20,7 @@ const IconWrapper = styled('div')>( width: '20px', height: '20px', borderRadius: '5px', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, color: theme.affine.palette.primary, cursor: 'pointer', backgroundColor: theme.affine.palette.white, diff --git a/libs/components/layout/src/settings-sidebar/Comments/CommentItem.tsx b/libs/components/layout/src/settings-sidebar/Comments/CommentItem.tsx index 8ebc4baf24..2ac99e7185 100644 --- a/libs/components/layout/src/settings-sidebar/Comments/CommentItem.tsx +++ b/libs/components/layout/src/settings-sidebar/Comments/CommentItem.tsx @@ -94,7 +94,7 @@ const StyledContainerForCommentItem = styled('div', { transition: 'left 150ms ease-in-out', backgroundColor: theme.affine.palette.white, '&:hover': { - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, }, }; }); diff --git a/libs/components/ui/src/cascader/Cascader.tsx b/libs/components/ui/src/cascader/Cascader.tsx index 5c8a02e3a9..ef486e5029 100644 --- a/libs/components/ui/src/cascader/Cascader.tsx +++ b/libs/components/ui/src/cascader/Cascader.tsx @@ -133,7 +133,7 @@ export function Cascader(props: CascaderProps) { const MenuPaper = styled('div')(({ theme }) => ({ fontFamily: 'PingFang SC', background: '#FFF', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, borderRadius: '10px 0px 10px 10px', color: '#4C6275', fontWeight: '400', diff --git a/libs/components/ui/src/popover/Container.tsx b/libs/components/ui/src/popover/Container.tsx index 8fdfc5aea9..3f7f8c382f 100644 --- a/libs/components/ui/src/popover/Container.tsx +++ b/libs/components/ui/src/popover/Container.tsx @@ -12,7 +12,7 @@ const border_radius_map: Record = { export const PopoverContainer = styled('div')< Pick >(({ theme, direction, style }) => { - const shadow = theme.affine.shadows.shadowSxDownLg; + const shadow = theme.affine.shadows.shadow1; const white = theme.affine.palette.white; const borderRadius = diff --git a/libs/components/ui/src/select/Select.tsx b/libs/components/ui/src/select/Select.tsx index ebbf585e11..d1f3141e69 100644 --- a/libs/components/ui/src/select/Select.tsx +++ b/libs/components/ui/src/select/Select.tsx @@ -117,7 +117,7 @@ const StyledListbox = styled('ul')(({ theme }) => ({ background: '#fff', borderRadius: '10px', overflow: 'auto', - boxShadow: theme.affine.shadows.shadowSxDownLg, + boxShadow: theme.affine.shadows.shadow1, })); const StyledPopper = styled(PopperUnstyled)` diff --git a/libs/components/ui/src/theme/theme.ts b/libs/components/ui/src/theme/theme.ts index 1e9f6f5436..70aace8122 100644 --- a/libs/components/ui/src/theme/theme.ts +++ b/libs/components/ui/src/theme/theme.ts @@ -70,7 +70,7 @@ interface Typography { interface Shadows { none: 'none'; - shadowSxDownLg: string; + shadow1: string; } type StringWithNone = [ @@ -225,7 +225,7 @@ export const Theme = { }, shadows: { none: 'none', - shadowSxDownLg: '0px 1px 5px rgba(152, 172, 189, 0.2)', + shadow1: '0px 1px 5px rgba(152, 172, 189, 0.2)', }, border: ['none'], spacing: { From c4e39980c60ca050f2e9c1bcb820acb5f52d98cb Mon Sep 17 00:00:00 2001 From: austaras Date: Thu, 4 Aug 2022 17:21:38 +0800 Subject: [PATCH 034/112] fix(whiteboard): disable editor rotation --- libs/components/board-sessions/src/rotate-session.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/libs/components/board-sessions/src/rotate-session.ts b/libs/components/board-sessions/src/rotate-session.ts index e9da6b6bcc..2de48ed120 100644 --- a/libs/components/board-sessions/src/rotate-session.ts +++ b/libs/components/board-sessions/src/rotate-session.ts @@ -6,6 +6,7 @@ import { TldrawPatch, TDShape, TDStatus, + TDShapeType, } from '@toeverything/components/board-types'; import { TLDR } from '@toeverything/components/board-state'; import { BaseSession } from './base-session'; @@ -75,6 +76,10 @@ export class RotateSession extends BaseSession { app: { currentPageId, currentPoint, shiftKey }, } = this; + const filteredShapes = initialShapes.filter( + shape => shape.shape.type !== TDShapeType.Editor + ); + const shapes: Record> = {}; let directionDelta = @@ -85,7 +90,7 @@ export class RotateSession extends BaseSession { } // Update the shapes - initialShapes.forEach(({ center, shape }) => { + filteredShapes.forEach(({ center, shape }) => { const { rotation = 0 } = shape; let shapeDelta = 0; From e46da42facef00422a36899822fef8a8bf1704ec Mon Sep 17 00:00:00 2001 From: DarkSky Date: Thu, 4 Aug 2022 17:53:59 +0800 Subject: [PATCH 035/112] feat: query blocks --- libs/datasource/jwt/src/index.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/libs/datasource/jwt/src/index.ts b/libs/datasource/jwt/src/index.ts index bd01d93dcb..343f1f79ad 100644 --- a/libs/datasource/jwt/src/index.ts +++ b/libs/datasource/jwt/src/index.ts @@ -305,6 +305,18 @@ export class BlockClient< return this._blockIndexer.query(query); } + public queryBlocks(query: QueryIndexMetadata): Promise { + const ids = this.query(query); + return Promise.all( + this._blockIndexer.getMetadata(ids).map(async page => ({ + content: this.get_decoded_content( + await this._adapter.getBlock(page.id) + ), + ...page, + })) + ); + } + /** * Get a fixed name, which has the same UUID in each workspace, and is automatically created when it does not exist * Generally used to store workspace-level global configuration From f490ad497b357f6262f4164c04325b2e0223c369 Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Thu, 4 Aug 2022 17:59:34 +0800 Subject: [PATCH 036/112] fix bacakspace in group first block --- .../src/blocks/image/ImageView.tsx | 6 ++-- .../src/blocks/text/TextView.tsx | 33 ++++--------------- 2 files changed, 10 insertions(+), 29 deletions(-) diff --git a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx index 36b446d790..a68292f022 100644 --- a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx +++ b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx @@ -143,13 +143,13 @@ export const ImageView: FC = ({ block, editor }) => { type: 'link', }); }; - const handle_click = (e: React.MouseEvent) => { + const handle_click = async (e: React.MouseEvent) => { //TODO clear active selection // document.getElementsByTagName('body')[0].click(); e.stopPropagation(); e.nativeEvent.stopPropagation(); - editor.selectionManager.setSelectedNodesIds([block.id]); - editor.selectionManager.activeNodeByNodeId(block.id); + await editor.selectionManager.setSelectedNodesIds([block.id]); + await editor.selectionManager.activeNodeByNodeId(block.id, 'end'); }; const down_file = () => { if (down_ref) { diff --git a/libs/components/editor-blocks/src/blocks/text/TextView.tsx b/libs/components/editor-blocks/src/blocks/text/TextView.tsx index ced1a8745d..64f10fc4f1 100644 --- a/libs/components/editor-blocks/src/blocks/text/TextView.tsx +++ b/libs/components/editor-blocks/src/blocks/text/TextView.tsx @@ -99,7 +99,7 @@ export const TextView: FC = ({ if (!parentBlock) { return false; } - + let preParent = await parentBlock.previousSibling(); if (Protocol.Block.Type.group === parentBlock.type) { const children = await block.children(); const preNode = await block.physicallyPerviousSibling(); @@ -129,34 +129,15 @@ export const TextView: FC = ({ 'start' ); if (block.blockProvider.isEmpty()) { - block.remove(); - } - } - return true; - } else { - // TODO remove timing problem - const prevGroupBlock = await parentBlock.previousSibling(); - - if (!prevGroupBlock) { - const childrenBlock = await parentBlock.children(); - if (childrenBlock.length) { - if (children.length) { - await parentBlock.append(...children); - } await block.remove(); - return true; + let parentChild = await parentBlock.children(); + if (!parentChild.length) { + await editor.selectionManager.setSelectedNodesIds( + [preParent.id] + ); + } } - - parentBlock.remove(); - return true; } - if (prevGroupBlock.type !== Protocol.Block.Type.group) { - unwrapGroup(parentBlock); - return true; - } - - mergeGroup(prevGroupBlock, parentBlock); - return true; } } From c63d5da4dfde1976d1907f9e22d72d0cab93d918 Mon Sep 17 00:00:00 2001 From: austaras Date: Thu, 4 Aug 2022 16:04:52 +0800 Subject: [PATCH 037/112] refact(hook): remove afterOnNodeDragOver --- .../src/blocks/bullet/BulletView.tsx | 6 +-- .../src/blocks/code/CodeView.tsx | 6 +-- .../src/blocks/embed-link/EmbedLinkView.tsx | 6 +-- .../src/blocks/figma/FigmaView.tsx | 6 +-- .../src/blocks/image/ImageView.tsx | 6 +-- .../src/blocks/numbered/NumberedView.tsx | 7 ++-- .../src/blocks/text/TextView.tsx | 6 +-- .../src/utils/WithTreeViewChildren.tsx | 6 +-- .../BlockContentWrapper.tsx | 22 ---------- .../src/block-content-wrapper/index.ts | 1 - .../src/drag-drop-wrapper/DragDropWrapper.tsx | 28 ------------- .../src/drag-drop-wrapper/index.ts | 1 - .../editor-core/src/editor/plugin/hooks.ts | 7 ---- .../editor-core/src/editor/types.ts | 5 --- libs/components/editor-core/src/index.ts | 3 -- .../src/menu/left-menu/LeftMenuPlugin.tsx | 42 +++++++++++-------- 16 files changed, 48 insertions(+), 110 deletions(-) delete mode 100644 libs/components/editor-core/src/block-content-wrapper/BlockContentWrapper.tsx delete mode 100644 libs/components/editor-core/src/block-content-wrapper/index.ts delete mode 100644 libs/components/editor-core/src/drag-drop-wrapper/DragDropWrapper.tsx delete mode 100644 libs/components/editor-core/src/drag-drop-wrapper/index.ts diff --git a/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx b/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx index 6f1970df15..dee9042e7a 100644 --- a/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx +++ b/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx @@ -17,7 +17,7 @@ import { supportChildren, RenderBlockChildren, useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { List } from '../../components/style-container'; import { getChildrenType, BulletIcon, NumberType } from './data'; @@ -188,7 +188,7 @@ export const BulletView: FC = ({ block, editor }) => { return ( - + @@ -206,7 +206,7 @@ export const BulletView: FC = ({ block, editor }) => { /> - + diff --git a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx index 3a729e51f0..3b64cc3b1a 100644 --- a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx +++ b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx @@ -50,7 +50,7 @@ import { Option, Select } from '@toeverything/components/ui'; import { useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { copyToClipboard } from '@toeverything/utils'; interface CreateCodeView extends CreateView { @@ -163,7 +163,7 @@ export const CodeView: FC = ({ block, editor }) => { editor.selectionManager.activePreviousNode(block.id, 'start'); }; return ( - + { e.stopPropagation(); @@ -222,6 +222,6 @@ export const CodeView: FC = ({ block, editor }) => { handleKeyArrowUp={handleKeyArrowUp} /> - + ); }; diff --git a/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx b/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx index ac073abdb0..da33c2be4a 100644 --- a/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx +++ b/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx @@ -1,7 +1,7 @@ import { FC, useState } from 'react'; import { CreateView } from '@toeverything/framework/virgo'; import { - WrapperWithPendantAndDragDrop, + BlockPendantProvider, useOnSelect, } from '@toeverything/components/editor-core'; import { Upload } from '../../components/upload/upload'; @@ -33,7 +33,7 @@ export const EmbedLinkView: FC = props => { }; return ( - + {embedLinkUrl ? ( = props => { /> )} - + ); }; diff --git a/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx b/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx index 1dbaef3e11..2d12315235 100644 --- a/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx +++ b/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx @@ -2,7 +2,7 @@ import { FC, useState } from 'react'; import { CreateView } from '@toeverything/framework/virgo'; import { useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { Upload } from '../../components/upload/upload'; import { SourceView } from '../../components/source-view'; @@ -30,7 +30,7 @@ export const FigmaView: FC = ({ block, editor }) => { setIsSelect(isSelect); }); return ( - + {figmaUrl ? ( = ({ block, editor }) => { /> )} - + ); }; diff --git a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx index 36b446d790..dd07a1058a 100644 --- a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx +++ b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx @@ -1,7 +1,7 @@ import { useCurrentView, useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { styled } from '@toeverything/components/ui'; import { services } from '@toeverything/datasource/db-service'; @@ -158,7 +158,7 @@ export const ImageView: FC = ({ block, editor }) => { }; return ( - +
{imgUrl ? ( @@ -229,6 +229,6 @@ export const ImageView: FC = ({ block, editor }) => {
*/} - + ); }; diff --git a/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx b/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx index 514ce335f6..2f8f29b706 100644 --- a/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx +++ b/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx @@ -19,9 +19,8 @@ import { supportChildren, RenderBlockChildren, useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; -import { styled } from '@toeverything/components/ui'; import { List } from '../../components/style-container'; import { BlockContainer } from '../../components/BlockContainer'; @@ -185,7 +184,7 @@ export const NumberedView: FC = ({ block, editor }) => { return ( - +
{getNumber(properties.numberType, number)}. @@ -203,7 +202,7 @@ export const NumberedView: FC = ({ block, editor }) => { />
- + diff --git a/libs/components/editor-blocks/src/blocks/text/TextView.tsx b/libs/components/editor-blocks/src/blocks/text/TextView.tsx index ced1a8745d..66c6360633 100644 --- a/libs/components/editor-blocks/src/blocks/text/TextView.tsx +++ b/libs/components/editor-blocks/src/blocks/text/TextView.tsx @@ -8,7 +8,7 @@ import { supportChildren, unwrapGroup, useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { styled } from '@toeverything/components/ui'; import { Protocol } from '@toeverything/datasource/db-service'; @@ -231,7 +231,7 @@ export const TextView: FC = ({ selected={isSelect} className={containerClassName} > - + = ({ handleConvert={handleConvert} handleTab={onTab} /> - + diff --git a/libs/components/editor-blocks/src/utils/WithTreeViewChildren.tsx b/libs/components/editor-blocks/src/utils/WithTreeViewChildren.tsx index f7f9cf39d7..f2b2b3652d 100644 --- a/libs/components/editor-blocks/src/utils/WithTreeViewChildren.tsx +++ b/libs/components/editor-blocks/src/utils/WithTreeViewChildren.tsx @@ -3,7 +3,7 @@ import { RenderBlock, useCurrentView, useOnSelect, - WrapperWithPendantAndDragDrop, + BlockPendantProvider, } from '@toeverything/components/editor-core'; import { styled } from '@toeverything/components/ui'; import type { @@ -128,9 +128,9 @@ export const withTreeViewChildren = ( selected={isSelect} className={Wrapper.toString()} > - +
{creator(props)}
- + {collapsed && ( = - function ({ block, children, editor }) { - return ( - - - {children} - - - ); - }; diff --git a/libs/components/editor-core/src/block-content-wrapper/index.ts b/libs/components/editor-core/src/block-content-wrapper/index.ts deleted file mode 100644 index 80c770d496..0000000000 --- a/libs/components/editor-core/src/block-content-wrapper/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './BlockContentWrapper'; diff --git a/libs/components/editor-core/src/drag-drop-wrapper/DragDropWrapper.tsx b/libs/components/editor-core/src/drag-drop-wrapper/DragDropWrapper.tsx deleted file mode 100644 index 030c2b5c20..0000000000 --- a/libs/components/editor-core/src/drag-drop-wrapper/DragDropWrapper.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { AsyncBlock, BlockEditor } from '../editor'; -import { ReactElement } from 'react'; - -interface DragDropWrapperProps { - editor: BlockEditor; - block: AsyncBlock; - children: ReactElement | null; -} - -export function DragDropWrapper({ - children, - editor, - block, -}: DragDropWrapperProps) { - const handlerDragOver: React.DragEventHandler = event => { - event.preventDefault(); - if (block.dom) { - editor.getHooks().afterOnNodeDragOver(event, { - blockId: block.id, - dom: block.dom, - rect: block.dom?.getBoundingClientRect(), - type: block.type, - properties: block.getProperties(), - }); - } - }; - return
{children}
; -} diff --git a/libs/components/editor-core/src/drag-drop-wrapper/index.ts b/libs/components/editor-core/src/drag-drop-wrapper/index.ts deleted file mode 100644 index bfade20431..0000000000 --- a/libs/components/editor-core/src/drag-drop-wrapper/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './DragDropWrapper'; diff --git a/libs/components/editor-core/src/editor/plugin/hooks.ts b/libs/components/editor-core/src/editor/plugin/hooks.ts index 1c05308a84..45cecebc0f 100644 --- a/libs/components/editor-core/src/editor/plugin/hooks.ts +++ b/libs/components/editor-core/src/editor/plugin/hooks.ts @@ -113,13 +113,6 @@ export class Hooks implements HooksRunner, PluginHooks { this._runHook(HookType.ON_ROOTNODE_DRAG_OVER_CAPTURE, e); } - public afterOnNodeDragOver( - e: React.DragEvent, - node: BlockDomInfo - ): void { - this._runHook(HookType.AFTER_ON_NODE_DRAG_OVER, e, node); - } - public onSearch(): void { this._runHook(HookType.ON_SEARCH); } diff --git a/libs/components/editor-core/src/editor/types.ts b/libs/components/editor-core/src/editor/types.ts index 797d68f46c..ca22ae5d4e 100644 --- a/libs/components/editor-core/src/editor/types.ts +++ b/libs/components/editor-core/src/editor/types.ts @@ -177,7 +177,6 @@ export enum HookType { ON_ROOTNODE_DRAG_END = 'onRootNodeDragEnd', ON_ROOTNODE_DRAG_OVER_CAPTURE = 'onRootNodeDragOverCapture', ON_ROOTNODE_DROP = 'onRootNodeDrop', - AFTER_ON_NODE_DRAG_OVER = 'afterOnNodeDragOver', BEFORE_COPY = 'beforeCopy', BEFORE_CUT = 'beforeCut', ON_ROOTNODE_SCROLL = 'onRootNodeScroll', @@ -219,10 +218,6 @@ export interface HooksRunner { onRootNodeDragEnd: (e: React.DragEvent) => void; onRootNodeDragLeave: (e: React.DragEvent) => void; onRootNodeDrop: (e: React.DragEvent) => void; - afterOnNodeDragOver: ( - e: React.DragEvent, - node: BlockDomInfo - ) => void; beforeCopy: (e: ClipboardEvent) => void; beforeCut: (e: ClipboardEvent) => void; onRootNodeScroll: (e: React.UIEvent) => void; diff --git a/libs/components/editor-core/src/index.ts b/libs/components/editor-core/src/index.ts index 64939c0659..6cdd358058 100644 --- a/libs/components/editor-core/src/index.ts +++ b/libs/components/editor-core/src/index.ts @@ -15,7 +15,4 @@ export * from './kanban/types'; export * from './utils'; -export * from './drag-drop-wrapper'; -export * from './block-content-wrapper'; - export * from './editor'; diff --git a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuPlugin.tsx b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuPlugin.tsx index 29c421f29f..806c93c971 100644 --- a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuPlugin.tsx +++ b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuPlugin.tsx @@ -37,7 +37,7 @@ export class LeftMenuPlugin extends BasePlugin { ); this.sub.add( this.hooks - .get(HookType.AFTER_ON_NODE_DRAG_OVER) + .get(HookType.ON_ROOTNODE_DRAG_OVER) .subscribe(this._handleDragOverBlockNode) ); this.sub.add( @@ -65,24 +65,30 @@ export class LeftMenuPlugin extends BasePlugin { private _onDrop = () => { this._lineInfo.next(undefined); }; - private _handleDragOverBlockNode = async ([event, blockInfo]: [ - React.DragEvent, - BlockDomInfo - ]) => { - const { type, dom, blockId } = blockInfo; + private _handleDragOverBlockNode = async ( + event: React.DragEvent + ) => { event.preventDefault(); - if (this.editor.dragDropManager.isDragBlock(event)) { - if (ignoreBlockTypes.includes(type)) { - return; - } - const direction = - await this.editor.dragDropManager.checkBlockDragTypes( - event, - dom, - blockId - ); - this._lineInfo.next({ direction, blockInfo }); - } + if (!this.editor.dragDropManager.isDragBlock(event)) return; + const block = await this.editor.getBlockByPoint( + new Point(event.clientX, event.clientY) + ); + if (block == null || ignoreBlockTypes.includes(block.type)) return; + const direction = await this.editor.dragDropManager.checkBlockDragTypes( + event, + block.dom, + block.id + ); + this._lineInfo.next({ + direction, + blockInfo: { + blockId: block.id, + dom: block.dom, + rect: block.dom.getBoundingClientRect(), + type: block.type, + properties: block.getProperties(), + }, + }); }; private _handleMouseMove = async ( From 9ec41c013b7afc136803bb4e91144bd2122e656e Mon Sep 17 00:00:00 2001 From: mitsuha Date: Thu, 4 Aug 2022 18:34:47 +0800 Subject: [PATCH 038/112] fixbug: [issue76]when click activities button, throw error; --- .../src/pages/workspace/docs/Page.tsx | 22 ------------- .../activities/activities.tsx | 33 +++++++++++-------- .../src/services/workspace/user-config.ts | 17 ++++++++++ 3 files changed, 36 insertions(+), 36 deletions(-) diff --git a/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx b/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx index bdba3722fe..eb6c334803 100644 --- a/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx +++ b/apps/ligo-virgo/src/pages/workspace/docs/Page.tsx @@ -33,30 +33,8 @@ export function Page(props: PageProps) { const { page_id } = useParams(); const { showSpaceSidebar, fixedDisplay, setSpaceSidebarVisible } = useShowSpaceSidebar(); - const { user } = useUserAndSpaces(); const dailyNotesFlag = useFlag('BooleanDailyNotes', false); - useEffect(() => { - if (!user?.id || !page_id) return; - const updateRecentPages = async () => { - // TODO: deal with it temporarily - await services.api.editorBlock.getWorkspaceDbBlock( - props.workspace, - { - userId: user.id, - } - ); - - await services.api.userConfig.addRecentPage( - props.workspace, - user.id, - page_id - ); - await services.api.editorBlock.clearUndoRedo(props.workspace); - }; - updateRecentPages(); - }, [user, props.workspace, page_id]); - return ( diff --git a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx index 4e5a9de413..195bc1fa09 100644 --- a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx +++ b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx @@ -64,30 +64,34 @@ export const Activities = () => { const [recentPages, setRecentPages] = useState([]); const userId = user?.id; - /* temporarily remove:show recently viewed documents */ - const fetchRecentPages = useCallback(async () => { + /* show recently edit documents */ + const getRecentEditPages = useCallback(async () => { if (!userId || !currentSpaceId) { return; } - const recent_pages = await services.api.userConfig.getRecentPages( - currentSpaceId, - userId - ); - setRecentPages(recent_pages); - }, [userId, currentSpaceId]); + + console.log('不执行吗'); + + const RecentEditPages = + (await services.api.userConfig.getRecentEditedPages( + currentSpaceId + )) || []; + + setRecentPages(RecentEditPages); + }, [currentSpaceId, userId]); useEffect(() => { (async () => { - await fetchRecentPages(); + await getRecentEditPages(); })(); - }, [fetchRecentPages]); + }, [getRecentEditPages]); useEffect(() => { let unobserve: () => void; const observe = async () => { unobserve = await services.api.userConfig.observe( { workspace: currentSpaceId }, - fetchRecentPages + getRecentEditPages ); }; observe(); @@ -95,12 +99,13 @@ export const Activities = () => { return () => { unobserve?.(); }; - }, [currentSpaceId, fetchRecentPages]); + }, [currentSpaceId, getRecentEditPages]); return ( - {recentPages.map(({ id, title, lastOpenTime }) => { + {recentPages.map(item => { + const { id, title, updated } = item; return ( { /> diff --git a/libs/datasource/db-service/src/services/workspace/user-config.ts b/libs/datasource/db-service/src/services/workspace/user-config.ts index 001eaca18b..6fb96bb04c 100644 --- a/libs/datasource/db-service/src/services/workspace/user-config.ts +++ b/libs/datasource/db-service/src/services/workspace/user-config.ts @@ -3,6 +3,7 @@ import { ServiceBaseClass } from '../base'; import { ObserveCallback, ReturnUnobserve } from '../database'; import { PageTree } from './page-tree'; import { PageConfigItem } from './types'; +import { QueryIndexMetadata } from '@toeverything/datasource/jwt'; /** Operate the user configuration at the workspace level */ export class UserConfig extends ServiceBaseClass { @@ -122,4 +123,20 @@ export class UserConfig extends ServiceBaseClass { const workspaceDbBlock = await this.getWorkspaceDbBlock(workspace); workspaceDbBlock.setDecoration(WORKSPACE_CONFIG, workspaceName); } + + async getRecentEditedPages(workspace: string) { + const db = await this.database.getDatabase(workspace); + const recentEditedPages = + (await db.queryBlocks({ + $sort: 'lastUpdated', + $desc: false /* sort rule: true(default)(ASC), or false(DESC) */, + $limit: 4, + flavor: 'page', + } as QueryIndexMetadata)) || []; + + return recentEditedPages.map(item => { + item['title'] = item.content || 'Untitled'; + return item; + }); + } } From f0713400d0433f93cf548239253947de33b24a1a Mon Sep 17 00:00:00 2001 From: mitsuha Date: Thu, 4 Aug 2022 18:39:01 +0800 Subject: [PATCH 039/112] fixbug: [issue76]when click activities button, throw error; --- .../layout/src/workspace-sidebar/activities/activities.tsx | 2 -- .../datasource/db-service/src/services/workspace/user-config.ts | 2 +- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx index 195bc1fa09..52ad5d2c5c 100644 --- a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx +++ b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx @@ -70,8 +70,6 @@ export const Activities = () => { return; } - console.log('不执行吗'); - const RecentEditPages = (await services.api.userConfig.getRecentEditedPages( currentSpaceId diff --git a/libs/datasource/db-service/src/services/workspace/user-config.ts b/libs/datasource/db-service/src/services/workspace/user-config.ts index 6fb96bb04c..887bb1ec2a 100644 --- a/libs/datasource/db-service/src/services/workspace/user-config.ts +++ b/libs/datasource/db-service/src/services/workspace/user-config.ts @@ -3,7 +3,7 @@ import { ServiceBaseClass } from '../base'; import { ObserveCallback, ReturnUnobserve } from '../database'; import { PageTree } from './page-tree'; import { PageConfigItem } from './types'; -import { QueryIndexMetadata } from '@toeverything/datasource/jwt'; +import type { QueryIndexMetadata } from '@toeverything/datasource/jwt'; /** Operate the user configuration at the workspace level */ export class UserConfig extends ServiceBaseClass { From b129030dbbde9c9c8c55683f23edb35714abf2c0 Mon Sep 17 00:00:00 2001 From: mitsuha Date: Thu, 4 Aug 2022 18:42:55 +0800 Subject: [PATCH 040/112] fixbug: [issue76]when click activities button, throw error; --- .../layout/src/workspace-sidebar/activities/activities.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx index 52ad5d2c5c..a532d9bd02 100644 --- a/libs/components/layout/src/workspace-sidebar/activities/activities.tsx +++ b/libs/components/layout/src/workspace-sidebar/activities/activities.tsx @@ -70,12 +70,12 @@ export const Activities = () => { return; } - const RecentEditPages = + const recentEditPages = (await services.api.userConfig.getRecentEditedPages( currentSpaceId )) || []; - setRecentPages(RecentEditPages); + setRecentPages(recentEditPages); }, [currentSpaceId, userId]); useEffect(() => { From 1a43ce4d0224f40bc1d509df1dcd1827e998e9bd Mon Sep 17 00:00:00 2001 From: DarkSky Date: Thu, 4 Aug 2022 18:55:23 +0800 Subject: [PATCH 041/112] feat: fix private prefix --- libs/datasource/jwt/src/adapter/yjs/binary.ts | 4 ++-- libs/datasource/jwt/src/adapter/yjs/block.ts | 22 ++++++++++--------- .../jwt/src/adapter/yjs/gatekeeper.ts | 7 +++--- .../datasource/jwt/src/adapter/yjs/history.ts | 8 +++---- libs/datasource/jwt/src/adapter/yjs/index.ts | 20 ++++++++--------- .../jwt/src/adapter/yjs/operation.ts | 12 +++++----- libs/datasource/jwt/src/block/abstract.ts | 8 +++---- libs/datasource/jwt/src/block/base.ts | 8 +++---- libs/datasource/jwt/src/block/indexer.ts | 14 ++++++------ libs/datasource/jwt/src/index.ts | 18 +++++++-------- libs/datasource/jwt/src/utils/event-bus.ts | 8 +++---- 11 files changed, 65 insertions(+), 64 deletions(-) diff --git a/libs/datasource/jwt/src/adapter/yjs/binary.ts b/libs/datasource/jwt/src/adapter/yjs/binary.ts index 5c677a4f51..468710ac4a 100644 --- a/libs/datasource/jwt/src/adapter/yjs/binary.ts +++ b/libs/datasource/jwt/src/adapter/yjs/binary.ts @@ -3,8 +3,8 @@ import { Array as YArray, Map as YMap } from 'yjs'; import { RemoteKvService } from '@toeverything/datasource/remote-kv'; export class YjsRemoteBinaries { - readonly _binaries: YMap>; // binary instance - readonly _remoteStorage?: RemoteKvService; + private readonly _binaries: YMap>; // binary instance + private readonly _remoteStorage?: RemoteKvService; constructor(binaries: YMap>, remote_token?: string) { this._binaries = binaries; diff --git a/libs/datasource/jwt/src/adapter/yjs/block.ts b/libs/datasource/jwt/src/adapter/yjs/block.ts index ad60aa31e0..1f49ad0ed1 100644 --- a/libs/datasource/jwt/src/adapter/yjs/block.ts +++ b/libs/datasource/jwt/src/adapter/yjs/block.ts @@ -32,19 +32,21 @@ type YjsBlockInstanceProps = { }; export class YjsBlockInstance implements BlockInstance { - readonly _id: string; - readonly _block: YMap; - readonly _binary?: YArray; - readonly _children: YArray; - readonly _setBlock: ( + private readonly _id: string; + private readonly _block: YMap; + private readonly _binary?: YArray; + private readonly _children: YArray; + private readonly _setBlock: ( id: string, block: BlockItem ) => Promise; - readonly _getUpdated: (id: string) => number | undefined; - readonly _getCreator: (id: string) => string | undefined; - readonly _getBlockInstance: (id: string) => YjsBlockInstance | undefined; - readonly _childrenListeners: Map; - readonly _contentListeners: Map; + private readonly _getUpdated: (id: string) => number | undefined; + private readonly _getCreator: (id: string) => string | undefined; + private readonly _getBlockInstance: ( + id: string + ) => YjsBlockInstance | undefined; + private readonly _childrenListeners: Map; + private readonly _contentListeners: Map; // eslint-disable-next-line @typescript-eslint/naming-convention _childrenMap: Map; diff --git a/libs/datasource/jwt/src/adapter/yjs/gatekeeper.ts b/libs/datasource/jwt/src/adapter/yjs/gatekeeper.ts index 1ee3e93ca3..7e02c5a09e 100644 --- a/libs/datasource/jwt/src/adapter/yjs/gatekeeper.ts +++ b/libs/datasource/jwt/src/adapter/yjs/gatekeeper.ts @@ -1,10 +1,9 @@ import { Map as YMap } from 'yjs'; export class GateKeeper { - // eslint-disable-next-line @typescript-eslint/naming-convention - _userId: string; - _creators: YMap; - _common: YMap; + private readonly _userId: string; + private readonly _creators: YMap; + private readonly _common: YMap; constructor(userId: string, creators: YMap, common: YMap) { this._userId = userId; diff --git a/libs/datasource/jwt/src/adapter/yjs/history.ts b/libs/datasource/jwt/src/adapter/yjs/history.ts index 34884a1150..6739cf9a50 100644 --- a/libs/datasource/jwt/src/adapter/yjs/history.ts +++ b/libs/datasource/jwt/src/adapter/yjs/history.ts @@ -5,10 +5,10 @@ import { HistoryCallback, HistoryManager } from '../../adapter'; type StackItem = UndoManager['undoStack'][0]; export class YjsHistoryManager implements HistoryManager { - readonly _blocks: YMap; - readonly _historyManager: UndoManager; - readonly _pushListeners: Map>; - readonly _popListeners: Map>; + private readonly _blocks: YMap; + private readonly _historyManager: UndoManager; + private readonly _pushListeners: Map>; + private readonly _popListeners: Map>; constructor(scope: YMap, tracker?: any[]) { this._blocks = scope; diff --git a/libs/datasource/jwt/src/adapter/yjs/index.ts b/libs/datasource/jwt/src/adapter/yjs/index.ts index 1a0a637859..eb886afae5 100644 --- a/libs/datasource/jwt/src/adapter/yjs/index.ts +++ b/libs/datasource/jwt/src/adapter/yjs/index.ts @@ -178,22 +178,22 @@ export type YjsInitOptions = { }; export class YjsAdapter implements AsyncDatabaseAdapter { - readonly _provider: YjsProviders; - readonly _doc: Doc; // doc instance - readonly _awareness: Awareness; // lightweight state synchronization - readonly _gatekeeper: GateKeeper; // Simple access control - readonly _history: YjsHistoryManager; + private readonly _provider: YjsProviders; + private readonly _doc: Doc; // doc instance + private readonly _awareness: Awareness; // lightweight state synchronization + private readonly _gatekeeper: GateKeeper; // Simple access control + private readonly _history: YjsHistoryManager; // Block Collection // key is a randomly generated global id - readonly _blocks: YMap>; - readonly _blockUpdated: YMap; + private readonly _blocks: YMap>; + private readonly _blockUpdated: YMap; // Maximum cache Block 1024, ttl 10 minutes - readonly _blockCaches: LRUCache; + private readonly _blockCaches: LRUCache; - readonly _binaries: YjsRemoteBinaries; + private readonly _binaries: YjsRemoteBinaries; - readonly _listener: Map>; + private readonly _listener: Map>; static async init( workspace: string, diff --git a/libs/datasource/jwt/src/adapter/yjs/operation.ts b/libs/datasource/jwt/src/adapter/yjs/operation.ts index e4b2da50dd..a8dfdaffa4 100644 --- a/libs/datasource/jwt/src/adapter/yjs/operation.ts +++ b/libs/datasource/jwt/src/adapter/yjs/operation.ts @@ -52,7 +52,7 @@ function auto_set(root: ContentOperation, key: string, data: BaseTypes): void { } export class YjsContentOperation implements ContentOperation { - readonly _content: YAbstractType; + private readonly _content: YAbstractType; constructor(content: YAbstractType) { this._content = content; @@ -197,7 +197,7 @@ export class YjsContentOperation implements ContentOperation { } class YjsTextOperation extends YjsContentOperation implements TextOperation { - readonly _textContent: YText; + private readonly _textContent: YText; constructor(content: YText) { super(content); @@ -241,8 +241,8 @@ class YjsArrayOperation extends YjsContentOperation implements ArrayOperation { - readonly _arrayContent: YArray; - readonly _listeners: Map; + private readonly _arrayContent: YArray; + private readonly _listeners: Map; constructor(content: YArray) { super(content); @@ -344,8 +344,8 @@ class YjsMapOperation extends YjsContentOperation implements MapOperation { - readonly _mapContent: YMap; - readonly _listeners: Map; + private readonly _mapContent: YMap; + private readonly _listeners: Map; constructor(content: YMap) { super(content); diff --git a/libs/datasource/jwt/src/block/abstract.ts b/libs/datasource/jwt/src/block/abstract.ts index 9d675ee803..29ee655dc2 100644 --- a/libs/datasource/jwt/src/block/abstract.ts +++ b/libs/datasource/jwt/src/block/abstract.ts @@ -26,11 +26,11 @@ export class AbstractBlock< B extends BlockInstance, C extends ContentOperation > { - readonly _id: string; + private readonly _id: string; readonly #block: BlockInstance; - readonly _history: HistoryManager; - readonly _root?: AbstractBlock; - readonly _parentListener: Map; + private readonly _history: HistoryManager; + private readonly _root?: AbstractBlock; + private readonly _parentListener: Map; _parent?: AbstractBlock; diff --git a/libs/datasource/jwt/src/block/base.ts b/libs/datasource/jwt/src/block/base.ts index cf79c08ea7..72183187b1 100644 --- a/libs/datasource/jwt/src/block/base.ts +++ b/libs/datasource/jwt/src/block/base.ts @@ -51,19 +51,19 @@ export class BaseBlock< B extends BlockInstance, C extends ContentOperation > extends AbstractBlock { - readonly _exporters?: Exporters; - readonly _contentExportersGetter: () => Map< + private readonly _exporters?: Exporters; + private readonly _contentExportersGetter: () => Map< string, ReadableContentExporter >; - readonly _metadataExportersGetter: () => Map< + private readonly _metadataExportersGetter: () => Map< string, ReadableContentExporter< Array<[string, number | string | string[]]>, any > >; - readonly _tagExportersGetter: () => Map< + private readonly _tagExportersGetter: () => Map< string, ReadableContentExporter >; diff --git a/libs/datasource/jwt/src/block/indexer.ts b/libs/datasource/jwt/src/block/indexer.ts index 39dd52c4e0..d9ecde1658 100644 --- a/libs/datasource/jwt/src/block/indexer.ts +++ b/libs/datasource/jwt/src/block/indexer.ts @@ -107,18 +107,18 @@ export class BlockIndexer< B extends BlockInstance, C extends ContentOperation > { - readonly _adapter: A; - readonly _idb: BlockIdbInstance; + private readonly _adapter: A; + private readonly _idb: BlockIdbInstance; - readonly _blockIndexer: DocumentIndexer; - readonly _blockMetadata: LRUCache; - readonly _eventBus: BlockEventBus; + private readonly _blockIndexer: DocumentIndexer; + private readonly _blockMetadata: LRUCache; + private readonly _eventBus: BlockEventBus; - readonly _blockBuilder: ( + private readonly _blockBuilder: ( block: BlockInstance ) => Promise>; - readonly _delayIndex: { documents: Map> }; + private readonly _delayIndex: { documents: Map> }; constructor( adapter: A, diff --git a/libs/datasource/jwt/src/index.ts b/libs/datasource/jwt/src/index.ts index 343f1f79ad..6ced321c2c 100644 --- a/libs/datasource/jwt/src/index.ts +++ b/libs/datasource/jwt/src/index.ts @@ -69,14 +69,14 @@ export class BlockClient< B extends BlockInstance, C extends ContentOperation > { - readonly _adapter: A; - readonly _workspace: string; + private readonly _adapter: A; + private readonly _workspace: string; // Maximum cache Block 8192, ttl 30 minutes - readonly _blockCaches: LRUCache>; - readonly _blockIndexer: BlockIndexer; + private readonly _blockCaches: LRUCache>; + private readonly _blockIndexer: BlockIndexer; - readonly _exporters: { + private readonly _exporters: { readonly content: BlockExporters; readonly metadata: BlockExporters< Array<[string, number | string | string[]]> @@ -84,12 +84,12 @@ export class BlockClient< readonly tag: BlockExporters; }; - readonly _eventBus: BlockEventBus; + private readonly _eventBus: BlockEventBus; - readonly _parentMapping: Map; - readonly _pageMapping: Map; + private readonly _parentMapping: Map; + private readonly _pageMapping: Map; - readonly _root: { node?: BaseBlock }; + private readonly _root: { node?: BaseBlock }; private constructor( adapter: A, diff --git a/libs/datasource/jwt/src/utils/event-bus.ts b/libs/datasource/jwt/src/utils/event-bus.ts index 9d128049e7..50f5363390 100644 --- a/libs/datasource/jwt/src/utils/event-bus.ts +++ b/libs/datasource/jwt/src/utils/event-bus.ts @@ -7,9 +7,9 @@ declare const JWT_DEV: boolean; const logger = getLogger('BlockDB:event_bus'); export class BlockEventBus { - readonly _eventBus: EventTarget; - readonly _eventCallbackCache: Map; - readonly _scopedCache: Map>; + private readonly _eventBus: EventTarget; + private readonly _eventCallbackCache: Map; + private readonly _scopedCache: Map>; constructor(event_bus?: EventTarget) { this._eventBus = event_bus || new EventTarget(); @@ -68,7 +68,7 @@ type ListenerOptions = { }; class BlockScopedEventBus extends BlockEventBus { - readonly _topic: string; + private readonly _topic: string; constructor(topic: string, event_bus?: EventTarget) { super(event_bus); From fc1377bcfb4981c288332d79bf043cae4307d148 Mon Sep 17 00:00:00 2001 From: DiamondThree Date: Thu, 4 Aug 2022 19:01:04 +0800 Subject: [PATCH 042/112] add loding style --- .../src/components/source-view/SourceView.tsx | 22 ++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx index 9b5c813679..f8264e8f18 100644 --- a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx +++ b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx @@ -135,10 +135,27 @@ const LazyIframe = ({ >