@webbio/strapi-plugin-page-builder 0.9.8-platform → 0.10.0-platform

package/admin/src/api/page-type-relation.ts

@@ -0,0 +1,41 @@
+import { useQuery } from 'react-query';
+
+import { useFetchClient } from '@strapi/helper-plugin';
+import { PageType } from './platform-page-types';
+
+const QUERY_KEY = 'pageTypeRelations';
+
+const fetchPageTypeRelation = async ({
+	fetchClient,
+	id,
+	uid
+}: Record<string, any> & UseGetPageTypeRelationParams): Promise<PageType | undefined> => {
+	try {
+		if (!uid || !id) {
+			throw new Error('No uid or id');
+		}
+
+		const { get } = fetchClient;
+		const result = await get(`/content-manager/relations/${uid}/${id}/pageType?page=1&pageSize=5`);
+
+		return result?.data?.data;
+	} catch {
+		return undefined;
+	}
+};
+
+type UseGetPageTypeRelationParams = {
+	uid: string;
+	id: string;
+};
+
+export const useGetPageTypeRelation = (params: Record<string, any> & UseGetPageTypeRelationParams) => {
+	const fetchClient = useFetchClient();
+
+	return useQuery<PageType | undefined, Error>([QUERY_KEY, params], () =>
+		fetchPageTypeRelation({
+			...params,
+			fetchClient
+		})
+	);
+};

package/admin/src/api/search-filtered-entity.ts

@@ -15,7 +15,7 @@ export type SearchFilteredEntitiesResult = {
 		id: number;
 		title: string;
 		href: string;
-		publicationState?: string;
+		publicationState?: string | false;
 		publishedAt?: string;
 	}[];
 };
@@ -64,15 +64,24 @@ export const getSearchFilteredEntities = async ({
 		});
 
 		const { data } = await get(`/content-manager/collection-types/${uid}?${filters}`);
-
 		const mapResults = data.results.map(
-			(result: Record<string, any>): SearchFilteredEntitiesResult['results'][number] => ({
-				id: result.id,
-				title: result.title,
-				publicationState: result?.publishedAt ? 'published' : 'draft',
-				publishedAt: result?.publishedAt,
-				href: `/content-manager/collectionType/${uid}/${result.id}`
-			})
+			(result: Record<string, any>): SearchFilteredEntitiesResult['results'][number] => {
+				const getPublicationState = () => {
+					if (result?.publishedAt !== undefined) {
+						return result?.publishedAt ? 'published' : 'draft';
+					}
+
+					return false;
+				};
+
+				return {
+					id: result.id,
+					title: result.title,
+					publicationState: getPublicationState(),
+					publishedAt: result?.publishedAt,
+					href: `/content-manager/collectionType/${uid}/${result.id}`
+				};
+			}
 		);
 
 		return {

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import slugify from 'slugify';
 import { useSelector } from 'react-redux';
 import { useHistory } from 'react-router-dom';
@@ -17,12 +17,14 @@ import { Platform } from '../../../../api/platform';
 
 interface ICreatePageButtonProps {
 	selectedPlatform: Platform;
+	onCreatedPage?: (page: Record<string, any>) => void;
 }
 
-export const CreatePageButton = ({ selectedPlatform }: ICreatePageButtonProps) => {
+export const CreatePageButton = ({ selectedPlatform, onCreatedPage }: ICreatePageButtonProps) => {
 	const history = useHistory();
 	const form = (useCMEditViewDataManager() || {}) as Record<string, any>;
-	const { layout, initialData } = form;
+
+	const { layout, initialData, modifiedData } = form;
 
 	const { locales } = useSelector((state: any) => state.i18n_locales);
 
@@ -64,10 +66,13 @@ export const CreatePageButton = ({ selectedPlatform }: ICreatePageButtonProps) =
 				layoutUid: layout.uid,
 				relatedEntityId: createLocalizedPage ? linkedPages.data?.[0]?.id : undefined
 			});
+
 			if (newPage?.id) {
+				onCreatedPage?.(newPage);
 				await put(`/content-manager/collection-types/${layout.uid}/${initialData.id}`, {
 					hasPage: false
 				});
+
 				history.push(`/content-manager/collectionType/${PAGE_UID}/${newPage.id}?plugins[i18n][locale]=${locale}`);
 			}
 		} catch (error) {
@@ -77,7 +82,7 @@ export const CreatePageButton = ({ selectedPlatform }: ICreatePageButtonProps) =
 
 	return (
 		<S.CreateButton to={url} onClick={handleCreatePage} size="S" variant="secondary" startIcon={<Plus />} width="100%">
-			Create new page
+			Maak een pagina aan
 		</S.CreateButton>
 	);
 };

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

@@ -50,7 +50,9 @@ export const CollectionTypeSettings = ({ onlyPlatform }: CollectionTypeSettingsP
 			{!isCreatingEntry && !onlyPlatform && (
 				<Wrapper title="Gekoppelde pagina">
 					<Flex direction="column" gap={4} width="100%" alignItems="start">
-						{showCreatePageButton && selectedPlatform && <CreatePageButton selectedPlatform={selectedPlatform} />}
+						{showCreatePageButton && selectedPlatform && (
+							<CreatePageButton onCreatedPage={(page) => setLinkedPage(page)} selectedPlatform={selectedPlatform} />
+						)}
 
 						{url && (
 							<Flex direction="column" alignItems="start" width="100%" gap={1}>

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

@@ -11,18 +11,24 @@ import { Details } from '../Details';
 import { usePlatformFormData } from '../../../utils/hooks/usePlatformFormData';
 import { useGetPageTypesForPlatform } from '../../../api/platform-page-types';
 import S from '../Details/styles';
+import { useGetPageTypeRelation } from '../../../api/page-type-relation';
 
 export const PageSettings = () => {
 	const form = (useCMEditViewDataManager() || {}) as Record<string, any>;
-	const { isCreatingEntry, initialData, onChange, modifiedData } = form;
+	const { isCreatingEntry, initialData, onChange, modifiedData, layout } = form;
 	const { selectedPlatform, isLoadingPlatform } = usePlatformFormData(form);
+	const { data: pageTypeRelation } = useGetPageTypeRelation({
+		id: initialData?.id,
+		uid: layout.uid
+	});
 
 	const { data: pageTypesForPlatform } = useGetPageTypesForPlatform({
 		id: selectedPlatform?.id
 	});
 	const selectedPageType = pageTypesForPlatform?.find(
-		(pageType) => pageType.id === Number(modifiedData?.pageType?.[0]?.id)
+		(pageType) => pageType.id === Number(modifiedData?.pageType?.[0]?.id || pageTypeRelation?.id)
 	);
+
 	const noPlatformSelected = useMemo(() => !Boolean(selectedPlatform), [selectedPlatform]);
 	const [isEditting, setIsEditting] = useState(false);
 	const showEditFields = useMemo(

package/admin/src/components/GlobalPlatformSelect/styles.ts

@@ -14,7 +14,7 @@ const Wrapper = styled.div<{ small?: boolean }>`
 			position: fixed;
 			top: 64px;
 			left: 0;
-			z-index: 1000;
+			z-index: 4;
 			padding: 0 8px 0 12px;
 		`;
 	}}

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

@@ -23,7 +23,7 @@ export interface ISinglePlatformFilteredSelectFieldProps extends IPlatformFilter
 
 interface CustomReactSelectValue extends Omit<IReactSelectValue, 'initialSelected'> {
 	href?: string;
-	publicationState?: string;
+	publicationState?: string | false;
 	publishedAt?: string;
 }
 
@@ -172,10 +172,11 @@ const SinglePlatformFilteredSelectField = ({
 };
 
 const CustomOption = (props: OptionProps<CustomReactSelectValue, false>) => {
+	console.log('CustomOption', props.data?.publicationState);
 	return (
 		<components.Option {...props}>
 			<S.CustomOption>
-				<S.CustomOptionStatus publicationState={props.data?.publicationState} />
+				{props.data?.publicationState && <S.CustomOptionStatus publicationState={props.data?.publicationState} />}
 				{props.children}
 			</S.CustomOption>
 		</components.Option>

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

@@ -5,8 +5,8 @@ import { useDefaultPlatformFromLocalStorage } from './useDefaultPlatformFromLoca
 import { useGetPlatformRelation } from '../../api/platform-relation';
 
 const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (platform: Platform) => void) => {
-	const { onChange, initialData, layout } = form || {};
-	const { isLoading: isLoadingPlatform, data: selectedPlatform } = useGetPlatformRelation({
+	const { onChange, initialData, modifiedData, layout } = form || {};
+	const { isLoading: isLoadingPlatform, data: platformRelation } = useGetPlatformRelation({
 		id: initialData?.id,
 		uid: layout.uid
 	});
@@ -15,12 +15,12 @@ const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (pla
 		useDefaultPlatformFromLocalStorage();
 
 	useEffect(() => {
-		if (!isLoadingPlatform && !selectedPlatform?.id && defaultPlatform) {
+		if (!isLoadingPlatform && !platformRelation?.id && defaultPlatform) {
 			handleSelectPlatform(defaultPlatform);
 		}
 
-		if (selectedPlatform?.id && defaultPlatform?.id && selectedPlatform.id !== defaultPlatform.id) {
-			setDefaultPlatform(selectedPlatform);
+		if (platformRelation?.id && defaultPlatform?.id && platformRelation.id !== defaultPlatform.id) {
+			setDefaultPlatform(platformRelation);
 		}
 	}, [isLoadingPlatform, defaultPlatform]);
 
@@ -48,7 +48,11 @@ const usePlatformFormData = (form?: Record<string, any>, onPlatformChange?: (pla
 		}
 	};
 
-	return { defaultPlatform, selectedPlatform, isLoadingPlatform };
+	return {
+		defaultPlatform,
+		selectedPlatform: modifiedData?.platform?.[0]?.id ? modifiedData?.platform?.[0] : platformRelation,
+		isLoadingPlatform
+	};
 };
 
 export { usePlatformFormData };

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@webbio/strapi-plugin-page-builder",
-    "version": "0.9.8-platform",
+    "version": "0.10.0-platform",
     "description": "This is the description of the plugin.",
     "scripts": {
         "develop": "tsc -p tsconfig.server.json -w",
@@ -42,7 +42,7 @@
     },
     "peerDependencies": {
         "@strapi/strapi": "^4.15.0",
-        "@webbio/strapi-plugin-slug": "^3.0.1",
+        "@webbio/strapi-plugin-slug": "^3.3.0",
         "react": "^17.0.0 || ^18.0.0",
         "react-dom": "^17.0.0 || ^18.0.0",
         "react-router-dom": "^5.3.4",

package/dist/server/bootstrap/permissions.js

@@ -1,5 +1,9 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const uniq_1 = __importDefault(require("lodash/uniq"));
 const constants_1 = require("../../shared/utils/constants");
 exports.default = async ({ strapi }) => {
     var _a;
@@ -49,6 +53,7 @@ exports.default = async ({ strapi }) => {
                                     return permission.permission;
                                 }
                             });
+                            const uniquePermissions = (0, uniq_1.default)(permissions);
                             return {
                                 $and: [
                                     {
@@ -57,9 +62,19 @@ exports.default = async ({ strapi }) => {
                                         }
                                     },
                                     {
-                                        'pageType.uid': {
-                                            $in: permissions
-                                        }
+                                        $or: [
+                                            {
+                                                'pageType.uid': {
+                                                    $in: uniquePermissions
+                                                }
+                                            },
+                                            {
+                                                'pageType.uid': {
+                                                    // This means there is no pageType (which is the case for any other page)
+                                                    $eq: null
+                                                }
+                                            }
+                                        ]
                                     }
                                 ]
                             };

package/dist/server/bootstrap.js

@@ -102,89 +102,81 @@ exports.default = async ({ strapi }) => {
             }
         },
         async afterUpdate(event) {
-            var _a, _b;
+            await afterUpdate(event === null || event === void 0 ? void 0 : event['result']);
+        },
+        async afterUpdateMany(event) {
+            var _a, _b, _c;
             try {
-                const data = event === null || event === void 0 ? void 0 : event['result'];
-                const hasCollectionTypeRelation = data && ((_a = data === null || data === void 0 ? void 0 : data.collectionTypeData) === null || _a === void 0 ? void 0 : _a[0]) && (data === null || data === void 0 ? void 0 : data.collectionTypeData[0].__type) && (data === null || data === void 0 ? void 0 : data.collectionTypeData[0]);
-                if (hasCollectionTypeRelation) {
-                    const isPublished = data.publishedAt !== undefined;
-                    const pageData = isPublished ? { hasPage: !!data.publishedAt } : {};
-                    await ((_b = strapi.entityService) === null || _b === void 0 ? void 0 : _b.update(data.collectionTypeData[0].__type, data.collectionTypeData[0].id, {
-                        data: {
-                            ...pageData,
-                            id: data.collectionTypeData[0].id,
-                            lifecycleState: {
-                                exit: true
-                            }
+                // console.log('UPDATEMANY', event.params.where);
+                const pagesToUpdate = (_b = (_a = event.params.where) === null || _a === void 0 ? void 0 : _a.id) === null || _b === void 0 ? void 0 : _b['$in'];
+                const pages = (await ((_c = strapi.entityService) === null || _c === void 0 ? void 0 : _c.findMany(constants_1.PAGE_UID, {
+                    populate: {
+                        collectionTypeData: true
+                    },
+                    filters: {
+                        id: {
+                            $in: pagesToUpdate
                         }
-                    }));
+                    }
+                })));
+                if (pages && pages.length > 0) {
+                    await Promise.all(pages === null || pages === void 0 ? void 0 : pages.map((p) => afterUpdate(p)));
                 }
-                // This used to be the way to go. Not sure if the new way works
-                // const data = event?.params?.data;
-                // if (data.collectionTypeData?.__type && data.collectionTypeData.id) {
-                // 	await strapi.entityService?.update(data.collectionTypeData.__type, data.collectionTypeData.id, {
-                // 		data: {
-                // 			id: data.collectionTypeData.id,
-                // 			hasPage: true,
-                // 			lifecycleState: {
-                // 				exit: true
-                // 			}
-                // 		}
-                // 	});
-                // }
             }
             catch (error) {
-                console.error('Failed to save hasPage data', error);
+                console.error('Failed to save hasPage many data', error);
             }
         },
-        // async afterCreate(event) {
-        // 	const data = event?.params?.data;
-        // 	if (data.collectionTypeData?.__type && data.collectionTypeData.id) {
-        // 		await strapi.entityService?.update(data.collectionTypeData.__type, data.collectionTypeData.id, {
-        // 			data: {
-        // 				id: data.collectionTypeData.id,
-        // 				hasPage: true,
-        // 				lifecycleState: {
-        // 					exit: true
-        // 				}
-        // 			}
-        // 		});
-        // 	}
-        // },
         async beforeDelete(event) {
-            var _a, _b, _c, _d, _e, _f;
-            const originalEntity = (await ((_a = strapi.entityService) === null || _a === void 0 ? void 0 : _a.findOne(constants_1.PAGE_UID, event.params.where.id, {
-                populate: {
-                    collectionTypeData: true
-                }
-            })));
-            if (((_c = (_b = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.__type) && ((_e = (_d = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.id)) {
-                await ((_f = strapi.entityService) === null || _f === void 0 ? void 0 : _f.update(originalEntity.collectionTypeData[0].__type, originalEntity.collectionTypeData[0].id, {
-                    data: {
-                        id: originalEntity.collectionTypeData[0].id,
-                        hasPage: false
-                    }
-                }));
-            }
+            await beforeDelete(event.params.where.id);
         },
         async beforeDeleteMany(event) {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+            var _a, _b, _c, _d;
             const pagesToDisconnect = (_d = (_c = (_b = (_a = event.params.where) === null || _a === void 0 ? void 0 : _a['$and']) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.id) === null || _d === void 0 ? void 0 : _d['$in'];
             for (const pageId of pagesToDisconnect) {
-                const originalEntity = (await ((_e = strapi.entityService) === null || _e === void 0 ? void 0 : _e.findOne(constants_1.PAGE_UID, pageId, {
-                    populate: {
-                        collectionTypeData: true
-                    }
-                })));
-                if (((_g = (_f = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.__type) && ((_j = (_h = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.id)) {
-                    await ((_k = strapi.entityService) === null || _k === void 0 ? void 0 : _k.update(originalEntity.collectionTypeData[0].__type, originalEntity.collectionTypeData[0].id, {
-                        data: {
-                            id: originalEntity.collectionTypeData[0].id,
-                            hasPage: false
-                        }
-                    }));
-                }
+                await beforeDelete(pageId);
             }
         }
     });
 };
+const beforeDelete = async (id) => {
+    var _a, _b, _c, _d, _e, _f;
+    const originalEntity = (await ((_a = strapi.entityService) === null || _a === void 0 ? void 0 : _a.findOne(constants_1.PAGE_UID, id, {
+        populate: {
+            collectionTypeData: true
+        }
+    })));
+    if (((_c = (_b = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.__type) && ((_e = (_d = originalEntity === null || originalEntity === void 0 ? void 0 : originalEntity.collectionTypeData) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.id)) {
+        await ((_f = strapi.entityService) === null || _f === void 0 ? void 0 : _f.update(originalEntity.collectionTypeData[0].__type, originalEntity.collectionTypeData[0].id, {
+            data: {
+                id: originalEntity.collectionTypeData[0].id,
+                hasPage: false
+            }
+        }));
+    }
+};
+const afterUpdate = async (result) => {
+    var _a, _b;
+    try {
+        const hasCollectionTypeRelation = result &&
+            ((_a = result === null || result === void 0 ? void 0 : result.collectionTypeData) === null || _a === void 0 ? void 0 : _a[0]) &&
+            (result === null || result === void 0 ? void 0 : result.collectionTypeData[0].__type) &&
+            (result === null || result === void 0 ? void 0 : result.collectionTypeData[0]);
+        if (hasCollectionTypeRelation) {
+            const isPublished = result.publishedAt !== undefined;
+            const pageData = isPublished ? { hasPage: !!result.publishedAt } : {};
+            await ((_b = strapi.entityService) === null || _b === void 0 ? void 0 : _b.update(result.collectionTypeData[0].__type, result.collectionTypeData[0].id, {
+                data: {
+                    ...pageData,
+                    id: result.collectionTypeData[0].id,
+                    lifecycleState: {
+                        exit: true
+                    }
+                }
+            }));
+        }
+    }
+    catch (error) {
+        console.error('Failed to save hasPage data', error);
+    }
+};