@webbio/strapi-plugin-page-builder 0.17.1-platform → 0.18.1-platform

package/admin/src/components/EditView/CollectionTypeSettings/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 
 import { useCMEditViewDataManager } from '@strapi/helper-plugin';
-import { Flex, Typography, Link } from '@strapi/design-system';
+import { Flex, Link } from '@strapi/design-system';
 import { Link as LinkIcon } from '@strapi/icons';
 
 import { Wrapper } from '../wrapper';
@@ -10,6 +10,7 @@ import { PAGE_TYPE_PAGE, PAGE_UID } from '../../../../../shared/utils/constants'
 import { usePlatformFormData } from '../../../utils/hooks/usePlatformFormData';
 import S from '../Details/styles';
 import { usePageTypeExists } from '../../../api/page-type-exists';
+import { delay } from '../../../utils/delay';
 
 interface CollectionTypeSettingsProps {
 	onlyPlatform?: boolean;
@@ -38,15 +39,26 @@ export const CollectionTypeSettings = ({ onlyPlatform }: CollectionTypeSettingsP
 		}
 	}, [modifiedData.page?.[0]]);
 
-	useEffect(() => {
-		if (isCreatingEntry) {
-			onChange({
+	// Reset page link if creating entry
+	// Reason for the delay is explained in usePlatformFormData.ts
+	const resetPageLinkIfCreatingEntry = async () => {
+		if (!isCreatingEntry || (isCreatingEntry && !initialData.page)) return;
+
+		await delay(100);
+
+		onChange(
+			{
 				target: {
 					name: 'page',
 					value: null
 				}
-			});
-		}
+			},
+			false
+		);
+	};
+
+	useEffect(() => {
+		resetPageLinkIfCreatingEntry();
 	}, []);
 
 	return (

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

@@ -55,16 +55,6 @@ const PlatformFilteredSelectField = (props: IPlatformFilteredSelectFieldProps) =
 	);
 };
 
-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 => {

package/admin/src/utils/delay.ts

@@ -0,0 +1 @@
+export const delay = (ms: number): Promise<void> => new Promise((resolve) => setTimeout(resolve, ms));

package/admin/src/utils/hooks/usePlatformFormData.ts

@@ -4,9 +4,10 @@ import { Platform } from '../../api/platform';
 import { useDefaultPlatformFromLocalStorage } from './useDefaultPlatformFromLocalStorage';
 import { useGetPlatformRelation } from '../../api/platform-relation';
 import { PLATFORM_UID } from '../../../../shared/utils/constants';
+import { delay } from '../delay';
 
 const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (platform: Platform) => void) => {
-	const { onChange, initialData, modifiedData, layout } = form || {};
+	const { onChange, initialData, modifiedData, layout, isCreatingEntry } = form || {};
 	const { isLoading: isLoadingPlatform, data: platformRelation } = useGetPlatformRelation({
 		id: initialData?.id,
 		uid: layout.uid
@@ -28,14 +29,28 @@ const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (pla
 		}
 	}, [isLoadingPlatform, defaultPlatform]);
 
-	const setFormValue = (name: string, value?: string | Record<string, any>[]) => {
-		onChange({
-			target: {
-				name,
-				value
+	const setFormValue = async (name: string, value?: Record<string, any>[]) => {
+		// So let me explain...
+		// For some time now Strapi will wait for all form values to be populated before finalizing the form's initialData.
+		// In a sense this is a good thing as you now will have all the data you need to operate on.
+		// But since we have an onChange with shouldSetInitialValue set to false, we should expect this value to not be in the initialData.
+		// Of course this isn't the case and means our platform value will be set too soon and be part of the initialData.
+		// On save this will result in no changes being made to the platform field and no platform will be linked.
+		// To fix this we need to (any) delay the setting of the platform value until the initialData has been set (as there is no status to check for the finalization of the initialData).
+		// Oh yeah, and apparently this only happens when creating a new entry.
+		if (isCreatingEntry) {
+			await delay(100);
+		}
+
+		onChange(
+			{
+				target: {
+					name,
+					value
+				}
 			},
-			shouldSetInitialValue: true
-		});
+			false
+		);
 	};
 
 	const handleSelectPlatform = async (platform: Platform) => {
@@ -44,7 +59,8 @@ const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (pla
 			const formPlatform = {
 				...platform,
 				label: platform.title,
-				value: platform.id
+				value: platform.id,
+				mainField: platform.title
 			};
 			setFormValue('platform', [formPlatform]);
 		} else {

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@webbio/strapi-plugin-page-builder",
-    "version": "0.17.1-platform",
+    "version": "0.18.1-platform",
     "description": "This is the description of the plugin.",
     "scripts": {
         "develop": "tsc -p tsconfig.server.json -w",
@@ -24,11 +24,11 @@
         "@mantine/hooks": "^7.2.2",
         "@sindresorhus/slugify": "^2.2.1",
         "@strapi/design-system": "^1.19.0",
-        "@strapi/helper-plugin": "^4.25.4",
+        "@strapi/helper-plugin": "^4.25.8",
         "@strapi/icons": "^1.19.0",
         "@strapi/provider-email-amazon-ses": "^4.16.2",
-        "@strapi/typescript-utils": "^4.25.4",
-        "@strapi/utils": "^4.25.4",
+        "@strapi/typescript-utils": "^4.25.8",
+        "@strapi/utils": "^4.25.8",
         "add": "^2.0.6",
         "aws-sdk": "^2.1528.0",
         "fuse.js": "^7.0.0",
@@ -48,7 +48,7 @@
         "typescript": "5.1.6"
     },
     "peerDependencies": {
-        "@strapi/strapi": "^4.25.4",
+        "@strapi/strapi": "^4.25.8",
         "@webbio/strapi-plugin-slug": "^3.3.2",
         "react": "^17.0.0 || ^18.0.0",
         "react-dom": "^17.0.0 || ^18.0.0",