chore: optimisation code

This commit is contained in:
qishaoxuan
2022-07-26 18:53:28 +08:00
parent c6cad6a911
commit a881556ad3
3 changed files with 24 additions and 48 deletions

View File

@@ -1,11 +1,10 @@
import React, { ReactNode, useRef, useState } from 'react'; import React, { ReactNode, useRef } from 'react';
import { getLatestPropertyValue } from '../utils'; import { getLatestPropertyValue } from '../utils';
import { import {
getRecastItemValue, getRecastItemValue,
RecastMetaProperty, RecastMetaProperty,
useRecastBlock, useRecastBlock,
useRecastBlockMeta, useRecastBlockMeta,
RecastBlockValue,
} from '../../recast-block'; } from '../../recast-block';
import { AsyncBlock } from '../../editor'; import { AsyncBlock } from '../../editor';
import { Popover, PopperHandler, styled } from '@toeverything/components/ui'; import { Popover, PopperHandler, styled } from '@toeverything/components/ui';
@@ -19,10 +18,6 @@ export const PendantHistoryPanel = ({
block: AsyncBlock; block: AsyncBlock;
endElement?: ReactNode; endElement?: ReactNode;
}) => { }) => {
const [propertyWithValue, setPropertyWithValue] = useState<{
value: RecastBlockValue;
property: RecastMetaProperty;
}>();
const popoverHandlerRef = useRef<{ [key: string]: PopperHandler }>({}); const popoverHandlerRef = useRef<{ [key: string]: PopperHandler }>({});
const { getProperty } = useRecastBlockMeta(); const { getProperty } = useRecastBlockMeta();
@@ -53,25 +48,23 @@ export const PendantHistoryPanel = ({
}} }}
placement="bottom-start" placement="bottom-start"
content={ content={
propertyWithValue && ( <UpdatePendantPanel
<UpdatePendantPanel block={block}
block={block} value={item}
value={propertyWithValue.value} property={property}
property={propertyWithValue.property} hasDelete={false}
hasDelete={false} onSure={() => {
onSure={() => { popoverHandlerRef.current[
popoverHandlerRef.current[ item.id
item.id ].setVisible(false);
].setVisible(false); }}
}} onCancel={() => {
onCancel={() => { popoverHandlerRef.current[
popoverHandlerRef.current[ item.id
item.id ].setVisible(false);
].setVisible(false); }}
}} titleEditable={false}
titleEditable={false} />
/>
)
} }
trigger="click" trigger="click"
> >
@@ -84,14 +77,6 @@ export const PendantHistoryPanel = ({
}} }}
property={property as RecastMetaProperty} property={property as RecastMetaProperty}
value={item} value={item}
onClick={e => {
if (property) {
setPropertyWithValue({
property,
value: item,
});
}
}}
/> />
</Popover> </Popover>
); );

View File

@@ -3,7 +3,7 @@ import { Input, Option, Select, Tooltip } from '@toeverything/components/ui';
import { HelpCenterIcon } from '@toeverything/components/icons'; import { HelpCenterIcon } from '@toeverything/components/icons';
import { AsyncBlock } from '../../editor'; import { AsyncBlock } from '../../editor';
import { pendantOptions, IconMap } from '../config'; import { IconMap, pendantOptions } from '../config';
import { OptionType, PendantOptions, PendantTypes } from '../types'; import { OptionType, PendantOptions, PendantTypes } from '../types';
import { PendantModifyPanel } from '../pendant-modify-panel'; import { PendantModifyPanel } from '../pendant-modify-panel';
import { import {
@@ -15,12 +15,11 @@ import {
StyledPopoverWrapper, StyledPopoverWrapper,
} from '../StyledComponent'; } from '../StyledComponent';
import { import {
PropertyType, genSelectOptionId,
InformationProperty,
useRecastBlock, useRecastBlock,
useRecastBlockMeta, useRecastBlockMeta,
useSelectProperty, useSelectProperty,
genSelectOptionId,
InformationProperty,
} from '../../recast-block'; } from '../../recast-block';
import { import {
genInitialOptions, genInitialOptions,
@@ -103,9 +102,7 @@ export const CreatePendantPanel = ({
selectedOption.type, selectedOption.type,
getPendantConfigByType(selectedOption.type) getPendantConfigByType(selectedOption.type)
)} )}
iconConfig={getPendantConfigByType( iconConfig={getPendantConfigByType(selectedOption.type)}
selectedOption.type
)}
// isStatusSelect={selectedOption.name === 'Status'} // isStatusSelect={selectedOption.name === 'Status'}
onSure={async (type, newPropertyItem, newValue) => { onSure={async (type, newPropertyItem, newValue) => {
if (!fieldName) { if (!fieldName) {
@@ -177,8 +174,7 @@ export const CreatePendantPanel = ({
}); });
} else { } else {
// TODO: Color and background should use pendant config, but ui is not design now // TODO: Color and background should use pendant config, but ui is not design now
const iconConfig = const iconConfig = getPendantConfigByType(type);
getPendantConfigByType(type);
// TODO: Color and background should be choose by user in the future // TODO: Color and background should be choose by user in the future
const newProperty = await addProperty({ const newProperty = await addProperty({
type: type, type: type,

View File

@@ -1,11 +1,6 @@
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { AsyncBlock } from '../../editor'; import { AsyncBlock } from '../../editor';
import { import { getRecastItemValue, useRecastBlockMeta } from '../../recast-block';
getRecastItemValue,
RecastBlockValue,
RecastMetaProperty,
useRecastBlockMeta,
} from '../../recast-block';
import { import {
MuiZoom, MuiZoom,
Popover, Popover,