-
Notifications
You must be signed in to change notification settings - Fork 9
/
block-parcel.tsx
62 lines (59 loc) · 2.1 KB
/
block-parcel.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
import React from 'react';
import Stack from '@akashaorg/design-system-core/lib/components/Stack';
import { RootParcel } from '../root-parcel';
import { MatchingBlock } from './common.types';
import { BlockInstanceMethods, ContentBlockModes } from '@akashaorg/typings/lib/ui';
import { ParcelConfigObject } from 'single-spa';
import { useRootComponentProps } from '@akashaorg/ui-awf-hooks';
export type BlockParcelProps = {
matchingBlock: MatchingBlock & { config: ParcelConfigObject };
blockId: string;
index: number;
blockRef?: React.RefObject<BlockInstanceMethods>;
onError?: (error: Error) => void;
} & (
| { mode: ContentBlockModes.READONLY }
| {
mode: ContentBlockModes.EDIT;
externalHandler?: (value: never) => void;
}
);
export const BlockParcel: React.FC<BlockParcelProps> = props => {
const { matchingBlock, blockId, index, blockRef, onError, ...rest } = props;
const { getContext, logger } = useRootComponentProps();
const handleParcelError = React.useCallback(
(parcelName: string) => {
return error => {
if (logger) logger.error(`error in parcel ${parcelName}: ${error}`);
onError?.(error);
};
},
[logger, onError],
);
return (
<Stack
fullWidth
id={`${rest.mode}_${matchingBlock.blockInfo.propertyType}_${blockId}_${index}`}
key={`${rest.mode}_${matchingBlock.blockInfo.propertyType}_${blockId}_${index}`}
>
<RootParcel
config={{
...matchingBlock.config,
name: `${matchingBlock.blockInfo.appName}_${matchingBlock.blockInfo.propertyType}_${blockId}_${index}`,
}}
{...getContext()}
blockInfo={{
...matchingBlock.blockInfo,
mode: rest.mode,
externalHandler: rest.mode === ContentBlockModes.EDIT ? rest?.externalHandler : null,
}}
blockData={matchingBlock.blockData}
blockRef={blockRef}
content={matchingBlock.content}
handleError={handleParcelError(
`${matchingBlock.blockInfo.appName}_${matchingBlock.blockInfo.propertyType}_${blockId}_${index}`,
)}
/>
</Stack>
);
};