@webbio/strapi-plugin-page-builder 0.12.2-platform → 0.12.4-platform

package/admin/src/components/PlatformFilteredSelectField/index.tsx

@@ -1,85 +1,85 @@
-import React from 'react';
-import { useCMEditViewDataManager } from '@strapi/helper-plugin';
-
-import RelationHelper, { IPlatformFilteredSelectFieldProps } from './utils/relation-helper';
-import MultiPlatformFilteredSelectField from './Multi';
-import SinglePlatformFilteredSelectField from './Single';
-import { useRelationLoad } from './hooks/useRelationLoad';
-import { usePlatformFormData } from '../../utils/hooks/usePlatformFormData';
-
-const PlatformFilteredSelectField = (props: IPlatformFilteredSelectFieldProps) => {
-	const { name, attribute, labelAction } = props;
-	const form = useCMEditViewDataManager() as any;
-	const { modifiedData, layout, allLayoutData } = form;
-	const { selectedPlatform } = usePlatformFormData(form);
-	const { relations, isCloningEntry, totalRelations, relationsFromModifiedData } = useRelationLoad(props);
-	const { targetAttributes } = RelationHelper.getTargetAttributes(name, attribute, modifiedData, layout, allLayoutData);
-	const toOneRelation = ['oneWay', 'oneToOne', 'manyToOne', 'oneToManyMorph', 'oneToOneMorph'].includes(
-		targetAttributes?.relation || ''
-	);
-	const hiddenId =
-		attribute?.pluginOptions?.filteredSelect?.hideSameEntity && layout.uid === targetAttributes?.targetModel
-			? [modifiedData.id]
-			: [];
-
-	const correctedLabelAction = getLocalizedActionLabel(labelAction, layout);
-
-	if (toOneRelation) {
-		return (
-			<SinglePlatformFilteredSelectField
-				selectedPlatform={selectedPlatform}
-				hiddenId={hiddenId}
-				{...props}
-				labelAction={correctedLabelAction}
-			/>
-		);
-	}
-
-	return (
-		<MultiPlatformFilteredSelectField
-			selectedPlatform={selectedPlatform}
-			relations={relations}
-			isCloningEntry={isCloningEntry}
-			totalRelations={totalRelations}
-			relationsFromModifiedData={relationsFromModifiedData}
-			hiddenId={hiddenId}
-			{...props}
-			labelAction={correctedLabelAction}
-		/>
-	);
-};
-
-PlatformFilteredSelectField.defaultProps = {
-	description: undefined,
-	disabled: false,
-	error: undefined,
-	labelAction: undefined,
-	placeholder: undefined,
-	value: '',
-	required: false
-};
-
-export default PlatformFilteredSelectField;
-
-const getLocalizedActionLabel = (actionLabel?: JSX.Element, layout?: Record<string, any>): JSX.Element | undefined => {
-	if (!actionLabel) {
-		return undefined;
-	}
-
-	if (!layout?.layouts?.edit || layout?.layouts?.edit?.length === 0) {
-		return actionLabel;
-	}
-
-	if (layout?.pluginOptions?.i18n?.localized === true) {
-		for (let index = 0; index < layout?.layouts?.edit.length; index++) {
-			const element = layout?.layouts?.edit[index];
-			const foundElement = element.find(
-				(x: Record<string, any>) => x.fieldSchema?.pluginOptions?.i18n?.localized === true
-			);
-
-			if (foundElement?.labelAction) {
-				return foundElement.labelAction;
-			}
-		}
-	}
-};
+import React from 'react';
+import { useCMEditViewDataManager } from '@strapi/helper-plugin';
+
+import RelationHelper, { IPlatformFilteredSelectFieldProps } from './utils/relation-helper';
+import MultiPlatformFilteredSelectField from './Multi';
+import SinglePlatformFilteredSelectField from './Single';
+import { useRelationLoad } from './hooks/useRelationLoad';
+import { usePlatformFormData } from '../../utils/hooks/usePlatformFormData';
+
+const PlatformFilteredSelectField = (props: IPlatformFilteredSelectFieldProps) => {
+	const { name, attribute, labelAction } = props;
+	const form = useCMEditViewDataManager() as any;
+	const { modifiedData, layout, allLayoutData } = form;
+	const { selectedPlatform } = usePlatformFormData(form);
+	const { relations, isCloningEntry, totalRelations, relationsFromModifiedData } = useRelationLoad(props);
+	const { targetAttributes } = RelationHelper.getTargetAttributes(name, attribute, modifiedData, layout, allLayoutData);
+	const toOneRelation = ['oneWay', 'oneToOne', 'manyToOne', 'oneToManyMorph', 'oneToOneMorph'].includes(
+		targetAttributes?.relation || ''
+	);
+	const hiddenId =
+		attribute?.pluginOptions?.filteredSelect?.hideSameEntity && layout.uid === targetAttributes?.targetModel
+			? [modifiedData.id]
+			: [];
+
+	const correctedLabelAction = getLocalizedActionLabel(labelAction, layout);
+
+	if (toOneRelation) {
+		return (
+			<SinglePlatformFilteredSelectField
+				selectedPlatform={selectedPlatform}
+				hiddenId={hiddenId}
+				{...props}
+				labelAction={correctedLabelAction}
+			/>
+		);
+	}
+
+	return (
+		<MultiPlatformFilteredSelectField
+			selectedPlatform={selectedPlatform}
+			relations={relations}
+			isCloningEntry={isCloningEntry}
+			totalRelations={totalRelations}
+			relationsFromModifiedData={relationsFromModifiedData}
+			hiddenId={hiddenId}
+			{...props}
+			labelAction={correctedLabelAction}
+		/>
+	);
+};
+
+PlatformFilteredSelectField.defaultProps = {
+	description: undefined,
+	disabled: false,
+	error: undefined,
+	labelAction: undefined,
+	placeholder: undefined,
+	value: '',
+	required: false
+};
+
+export default PlatformFilteredSelectField;
+
+const getLocalizedActionLabel = (actionLabel?: JSX.Element, layout?: Record<string, any>): JSX.Element | undefined => {
+	if (!actionLabel) {
+		return undefined;
+	}
+
+	if (!layout?.layouts?.edit || layout?.layouts?.edit?.length === 0) {
+		return actionLabel;
+	}
+
+	if (layout?.pluginOptions?.i18n?.localized === true) {
+		for (let index = 0; index < layout?.layouts?.edit.length; index++) {
+			const element = layout?.layouts?.edit[index];
+			const foundElement = element.find(
+				(x: Record<string, any>) => x.fieldSchema?.pluginOptions?.i18n?.localized === true
+			);
+
+			if (foundElement?.labelAction) {
+				return foundElement.labelAction;
+			}
+		}
+	}
+};

package/admin/src/components/PlatformFilteredSelectField/styles.tsx

@@ -1,77 +1,77 @@
-import styled, { css } from 'styled-components';
-import { Box, Link, Typography } from '@strapi/design-system';
-
-const EntityLinkWrapper = styled(Typography)`
-	${({ _theme }) => css`
-		margin-top: 4px;
-		display: flex;
-	`}
-`;
-
-const EntityLink = styled(Link)`
-	${({ _theme }) => css`
-		span {
-			line-height: 1.2;
-			font-size: inherit;
-			display: flex;
-			gap: 6px;
-			align-items: center;
-		}
-
-		svg {
-			width: 0.7rem;
-			height: 0.7rem;
-		}
-	`}
-`;
-
-const CustomOption = styled(Box)`
-	display: flex;
-	align-items: center;
-	gap: 8px;
-`;
-
-const CustomOptionStatus = styled(Box)`
-	background: ${({ theme, publicationState }) =>
-		publicationState === 'published' ? theme.colors.success600 : theme.colors.secondary600};
-	width: 6px;
-	height: 6px;
-	border-radius: 100px;
-`;
-
-const FieldWrapper = styled(Box)`
-	display: flex;
-	gap: 4px;
-`;
-
-const LinkToPage = styled(Link)`
-	${({ theme, disabled }) => css`
-		height: 40px;
-		width: 40px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		align-self: flex-end;
-		flex-shrink: 0;
-		border: ${`1px solid ${theme.colors.neutral200}`};
-		border-radius: ${theme.borderRadius};
-		opacity: ${disabled ? 0.5 : 1};
-		> span {
-			display: flex;
-		}
-
-		svg {
-			width: ${theme.fontSizes[2]};
-			height: ${theme.fontSizes[2]};
-		}
-	`}
-`;
-
-export default {
-	FieldWrapper,
-	EntityLinkWrapper,
-	EntityLink,
-	CustomOptionStatus,
-	CustomOption,
-	LinkToPage
-};
+import styled, { css } from 'styled-components';
+import { Box, Link, Typography } from '@strapi/design-system';
+
+const EntityLinkWrapper = styled(Typography)`
+	${({ _theme }) => css`
+		margin-top: 4px;
+		display: flex;
+	`}
+`;
+
+const EntityLink = styled(Link)`
+	${({ _theme }) => css`
+		span {
+			line-height: 1.2;
+			font-size: inherit;
+			display: flex;
+			gap: 6px;
+			align-items: center;
+		}
+
+		svg {
+			width: 0.7rem;
+			height: 0.7rem;
+		}
+	`}
+`;
+
+const CustomOption = styled(Box)`
+	display: flex;
+	align-items: center;
+	gap: 8px;
+`;
+
+const CustomOptionStatus = styled(Box)`
+	background: ${({ theme, publicationState }) =>
+		publicationState === 'published' ? theme.colors.success600 : theme.colors.secondary600};
+	width: 6px;
+	height: 6px;
+	border-radius: 100px;
+`;
+
+const FieldWrapper = styled(Box)`
+	display: flex;
+	gap: 4px;
+`;
+
+const LinkToPage = styled(Link)`
+	${({ theme, disabled }) => css`
+		height: 40px;
+		width: 40px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		align-self: flex-end;
+		flex-shrink: 0;
+		border: ${`1px solid ${theme.colors.neutral200}`};
+		border-radius: ${theme.borderRadius};
+		opacity: ${disabled ? 0.5 : 1};
+		> span {
+			display: flex;
+		}
+
+		svg {
+			width: ${theme.fontSizes[2]};
+			height: ${theme.fontSizes[2]};
+		}
+	`}
+`;
+
+export default {
+	FieldWrapper,
+	EntityLinkWrapper,
+	EntityLink,
+	CustomOptionStatus,
+	CustomOption,
+	LinkToPage
+};

package/admin/src/components/PlatformFilteredSelectField/utils/get-translations.ts

@@ -1,3 +1,3 @@
-const getTranslation = (id: string) => `content-manager.${id}`;
-
-export { getTranslation };
+const getTranslation = (id: string) => `content-manager.${id}`;
+
+export { getTranslation };

package/admin/src/components/PlatformFilteredSelectField/utils/relation-helper.ts

@@ -1,147 +1,147 @@
-import { IntlFormatters, MessageDescriptor } from '@formatjs/intl';
-import get from 'lodash/get';
-import { pointPathToGetPath } from '../../../utils/getObjectFromFormName';
-
-export interface GetTargetAttributesResult {
-	targetAttributes?: {
-		relation: string;
-		relationType: string;
-		target: string;
-		targetModel: string;
-		type: string;
-	};
-	targetFieldValue?: any;
-	targetField: string;
-	targetFieldName: string;
-	componentUid?: string;
-	componentId?: number;
-	relationMainFieldName?: string;
-}
-
-export interface IPlatformFilteredSelectFieldProps {
-	intlLabel?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
-	onChange?: any;
-	attribute?: {
-		pluginOptions?: {
-			filteredSelect?: {
-				targetField?: string;
-				customFilters?: Record<string, any>[];
-				disablePlatformFilter?: boolean;
-				hideSameEntity?: boolean;
-			};
-		};
-		required?: boolean;
-	};
-	name?: string;
-	description?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
-	disabled?: boolean;
-	error?: any;
-	labelAction?: any;
-	required?: boolean;
-	value?: string;
-	contentTypeUID?: string;
-	placeholder?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
-}
-
-const RelationHelper = {
-	getTargetAttributes: (
-		fieldName?: string,
-		attribute?: IPlatformFilteredSelectFieldProps['attribute'],
-		modifiedData?: Record<string, any>,
-		layout?: Record<string, any>,
-		allLayoutData?: Record<string, any>
-	) => {
-		const lastFieldName = fieldName?.split('.')?.[fieldName?.split('.')?.length - 1];
-		const targetField = attribute?.pluginOptions?.filteredSelect?.targetField || fieldName || '';
-		const targetFieldName = (fieldName || '')?.replace(lastFieldName || '', targetField);
-
-		const component = getComponent(targetFieldName, modifiedData, allLayoutData);
-		const result: GetTargetAttributesResult = {
-			targetAttributes: undefined,
-			targetFieldValue: undefined,
-			targetField,
-			componentUid: '',
-			componentId: undefined,
-			targetFieldName,
-			relationMainFieldName: ''
-		};
-
-		if (component?.uid) {
-			result.targetAttributes = allLayoutData?.components?.[component.uid]?.attributes?.[targetField];
-			result.relationMainFieldName = component?.settings?.mainField;
-			result.targetFieldValue = component?.values?.[targetField];
-			result.componentUid = component?.uid;
-			result.componentId = component?.id;
-			result.targetField = (fieldName || '')?.replace(lastFieldName || '', targetField);
-		} else {
-			result.targetAttributes = layout?.attributes?.[targetField];
-			result.relationMainFieldName = layout?.metadatas?.[targetField]?.list?.mainField?.name;
-			result.targetFieldValue = modifiedData?.[targetField];
-		}
-
-		return result;
-	}
-};
-
-export default RelationHelper;
-
-interface IComponent {
-	id: number;
-	uid: string;
-	attributes?: Record<string, any>;
-	metadatas?: Record<string, any>;
-	settings?: {
-		mainField?: string;
-	} & Record<string, any>;
-	values?: Record<string, any>;
-}
-
-const getComponent = (
-	targetFieldName?: string,
-	modifiedData?: Record<string, any>,
-	allLayoutData?: Record<string, any>
-): IComponent | undefined => {
-	const path = pointPathToGetPath(targetFieldName);
-	const keys = (path || '')?.split('.');
-	// Last key is the target field name, so not a component
-	keys.pop();
-	let newPath = '';
-	const components: any[] = [];
-
-	for (let index = 0; index < keys.length; index++) {
-		const newPathPart = keys?.[index];
-		const key = newPathPart.split('[')?.[0];
-		newPath = [...(newPath || '')?.split('.'), newPathPart].filter(Boolean).join('.');
-
-		const component = get(modifiedData, newPath, true);
-		const foundRootComponent =
-			index === 0 ? get(allLayoutData?.contentType?.attributes, newPath.split('[')?.[0]) : undefined;
-
-		if (component?.__component) {
-			const componentLayout = allLayoutData?.components?.[component.__component];
-			components.push({ id: component.id, ...componentLayout, values: component });
-			continue;
-		}
-
-		if (foundRootComponent?.component) {
-			const subComponent = allLayoutData?.components?.[foundRootComponent?.component];
-
-			if (subComponent?.uid) {
-				components.push({ id: component?.id, ...subComponent, values: component });
-			}
-			continue;
-		}
-
-		const lastComponent = components?.at(-1);
-
-		if (lastComponent?.attributes?.[key]?.component) {
-			const subComponent = allLayoutData?.components?.[lastComponent?.attributes?.[key]?.component];
-			if (subComponent?.uid) {
-				components.push({ id: component?.id, ...subComponent, values: component });
-			}
-			continue;
-		}
-	}
-
-	return components?.at(-1);
-};
+import { IntlFormatters, MessageDescriptor } from '@formatjs/intl';
+import get from 'lodash/get';
+import { pointPathToGetPath } from '../../../utils/getObjectFromFormName';
+
+export interface GetTargetAttributesResult {
+	targetAttributes?: {
+		relation: string;
+		relationType: string;
+		target: string;
+		targetModel: string;
+		type: string;
+	};
+	targetFieldValue?: any;
+	targetField: string;
+	targetFieldName: string;
+	componentUid?: string;
+	componentId?: number;
+	relationMainFieldName?: string;
+}
+
+export interface IPlatformFilteredSelectFieldProps {
+	intlLabel?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
+	onChange?: any;
+	attribute?: {
+		pluginOptions?: {
+			filteredSelect?: {
+				targetField?: string;
+				customFilters?: Record<string, any>[];
+				disablePlatformFilter?: boolean;
+				hideSameEntity?: boolean;
+			};
+		};
+		required?: boolean;
+	};
+	name?: string;
+	description?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
+	disabled?: boolean;
+	error?: any;
+	labelAction?: any;
+	required?: boolean;
+	value?: string;
+	contentTypeUID?: string;
+	placeholder?: MessageDescriptor & Parameters<IntlFormatters['formatMessage']>;
+}
+
+const RelationHelper = {
+	getTargetAttributes: (
+		fieldName?: string,
+		attribute?: IPlatformFilteredSelectFieldProps['attribute'],
+		modifiedData?: Record<string, any>,
+		layout?: Record<string, any>,
+		allLayoutData?: Record<string, any>
+	) => {
+		const lastFieldName = fieldName?.split('.')?.[fieldName?.split('.')?.length - 1];
+		const targetField = attribute?.pluginOptions?.filteredSelect?.targetField || fieldName || '';
+		const targetFieldName = (fieldName || '')?.replace(lastFieldName || '', targetField);
+
+		const component = getComponent(targetFieldName, modifiedData, allLayoutData);
+		const result: GetTargetAttributesResult = {
+			targetAttributes: undefined,
+			targetFieldValue: undefined,
+			targetField,
+			componentUid: '',
+			componentId: undefined,
+			targetFieldName,
+			relationMainFieldName: ''
+		};
+
+		if (component?.uid) {
+			result.targetAttributes = allLayoutData?.components?.[component.uid]?.attributes?.[targetField];
+			result.relationMainFieldName = component?.settings?.mainField;
+			result.targetFieldValue = component?.values?.[targetField];
+			result.componentUid = component?.uid;
+			result.componentId = component?.id;
+			result.targetField = (fieldName || '')?.replace(lastFieldName || '', targetField);
+		} else {
+			result.targetAttributes = layout?.attributes?.[targetField];
+			result.relationMainFieldName = layout?.metadatas?.[targetField]?.list?.mainField?.name;
+			result.targetFieldValue = modifiedData?.[targetField];
+		}
+
+		return result;
+	}
+};
+
+export default RelationHelper;
+
+interface IComponent {
+	id: number;
+	uid: string;
+	attributes?: Record<string, any>;
+	metadatas?: Record<string, any>;
+	settings?: {
+		mainField?: string;
+	} & Record<string, any>;
+	values?: Record<string, any>;
+}
+
+const getComponent = (
+	targetFieldName?: string,
+	modifiedData?: Record<string, any>,
+	allLayoutData?: Record<string, any>
+): IComponent | undefined => {
+	const path = pointPathToGetPath(targetFieldName);
+	const keys = (path || '')?.split('.');
+	// Last key is the target field name, so not a component
+	keys.pop();
+	let newPath = '';
+	const components: any[] = [];
+
+	for (let index = 0; index < keys.length; index++) {
+		const newPathPart = keys?.[index];
+		const key = newPathPart.split('[')?.[0];
+		newPath = [...(newPath || '')?.split('.'), newPathPart].filter(Boolean).join('.');
+
+		const component = get(modifiedData, newPath, true);
+		const foundRootComponent =
+			index === 0 ? get(allLayoutData?.contentType?.attributes, newPath.split('[')?.[0]) : undefined;
+
+		if (component?.__component) {
+			const componentLayout = allLayoutData?.components?.[component.__component];
+			components.push({ id: component.id, ...componentLayout, values: component });
+			continue;
+		}
+
+		if (foundRootComponent?.component) {
+			const subComponent = allLayoutData?.components?.[foundRootComponent?.component];
+
+			if (subComponent?.uid) {
+				components.push({ id: component?.id, ...subComponent, values: component });
+			}
+			continue;
+		}
+
+		const lastComponent = components?.at(-1);
+
+		if (lastComponent?.attributes?.[key]?.component) {
+			const subComponent = allLayoutData?.components?.[lastComponent?.attributes?.[key]?.component];
+			if (subComponent?.uid) {
+				components.push({ id: component?.id, ...subComponent, values: component });
+			}
+			continue;
+		}
+	}
+
+	return components?.at(-1);
+};