@webbio/strapi-plugin-page-builder 0.2.4 → 0.2.6

package/README.md

@@ -1,98 +1,98 @@
-# Strapi plugin page-builder
-
-A quick description of page-builder.
-
-# Werking van de plugin
-
-Voeg de plugin aan de plugin.ts toe
-
-```
-'page-builder': {
-  enabled: true,
-  config: {
-    modules: [
-      'modules.header',
-      'modules.cta',
-      ...
-    ]
-  }
-}
-```
-
-In de modules array voeg je alle modules toe die beschikbaar moeten zijn op een pagina. Deze worden bij het opstarten van de server automatisch toegevoegd aan `Page` en `Template`.
-
-De collectiontypes `Page`, `Template` en `PageType` worden aangemaakt of bijgewerkt op het moment van opstarten van de server. Het kan zijn dat de server een keer crasht, start deze dan even opnieuw op.
-
-## Page Types
-
-Maak voor elke pagina type een Page Type aan. Deze kan, maar hoeft niet, gekoppeld worden aan een collection type. Je moet altijd een UID invoeren, als je wenst geen koppeling te maken met een collection type, vul hier alsnog iets in. Het kan zijn dat dit deel van de plugin nog niet werkt, hier is nog niet mee getest.
-hasPage moet toegevoegd worden aan de collectiontype. Dit komt doordat er gefilterd moet kunnen worden middels graphql. Er is een custom manier gebouwd om ervoor te zorgen dat pages gefilterd kan worden.
-
-Voor elk collection type die een page type is, moet deze properties toegevoegd worden:
-
-```
-"page": {
-  "type": "relation",
-  "relation": "morphMany",
-  "target": "api::page.page",
-  "morphBy": "collectionTypeData"
-},
-"hasPage": {
-  "type": "boolean",
-  "default": false
-}
-```
-
-Zodra dit goed is ingesteld, kan je via deze collectie types direct een pagina aanmaken.
-
-## Page
-
-Op een page kan je in de Edit View een page type selecteren. Op basis daarvan wordt er een template geselecteerd (indien gekozen in een page type) en kan je zoeken in verschillende entiteiten binnen die page type. Deze kan je koppelen aan een pagina.
-
-## Template
-
-Een template is niets anders dan een sjabloon die je eenmalig kan toevoegen op een pagina. Dit kan via een page type gaan maar kan ook zonder de page type. Een modal zal eerst nog vragen of je zeker bent van je keuze, alle modules zullen vervangen worden.
-
-## Platform
-
-Om wijzigignen aan te brengen in een platform, moeten deze in de schema aangepast worden van de api. `/src/api/platform/content-types/platform/schema.json`
-
-Voor elk collectiontype die je wil toevoegen aan het platform, moet deze relatie toegevoegd worden:
-
-```
-    "collectiontype": {
-      "type": "relation",
-      "relation": "oneToMany",
-      "target": "UID van collection type",
-      "mappedBy": "platform"
-    }
-```
-
-bijvoorbeeld :
-
-```
-    "faqs": {
-      "type": "relation",
-      "relation": "oneToMany",
-      "target": "api::faq.faq",
-      "mappedBy": "platform"
-    }
-```
-
-Een platform zit altijd aan een pagina gekoppeld. Deze moet handmatig in de pagina toegevoegd worden.
-
-# Known bugs
-
-- Bij het opslaan van een collectietype wil de gekoppelde pagina of type in het ui wel eens verdwijnen.
-- Na het ontkoppelen en opslaan van een collectie item op een pagina, staat deze nog als "Geselecteerd" in de dropdown.
-
-# Improvements
-
-- Deze readme updaten en naar engels vertalen.
-- Intl gebruiken voor de teksten.
-- Pagetype mag ook een default parent page relation hebben. Bij het aanmaken van een pagina obv een page type, deze relatie als default aan de aangemaakte pagina koppelen. Als ik bijvoorbeeld een post pagina maak, dan wordt de pagina automatisch aan de "actueel" pagina gekoppeld zodat al mijn posts die parent hebben.
-- Filteren op Page in GraphQL binnen een collectiontype met een morph op een page kan niet. Strapi staat dit niet toe. Wellicht in de toekomst wel.
-- Slug en path genereren op basis van de titel van het collection type waarvan je een pagina aanmaakt. Nu wordt deze leeggelaten. Dit moet zorgvuldig gebeuren, bij een bestaande slug wil je bijvoorbeeld een -2 toevoegen oid.
-- Dit vorige punt geldt ook andersom, dus als je een entity koppelt vanuit een pagina. Als de titel en slug nog leeg zijn, vul die dan automatisch in.
-- In het overzicht van een collectiontype moet duidelijk worden of en welke pagina er gekoppeld is. [https://share.getcloudapp.com/BluzGYEd](https://share.getcloudapp.com/BluzGYEd)
-- Bij Page Types moet je handmatig de collectiontype uid invoeren. Dit zou idealiter een select zijn van alle mogelijke collecion type uids. Ook moet dit een mogelijkheid bieden voor geen uid.
+# Strapi plugin page-builder
+
+A quick description of page-builder.
+
+# Werking van de plugin
+
+Voeg de plugin aan de plugin.ts toe
+
+```
+'page-builder': {
+  enabled: true,
+  config: {
+    modules: [
+      'modules.header',
+      'modules.cta',
+      ...
+    ]
+  }
+}
+```
+
+In de modules array voeg je alle modules toe die beschikbaar moeten zijn op een pagina. Deze worden bij het opstarten van de server automatisch toegevoegd aan `Page` en `Template`.
+
+De collectiontypes `Page`, `Template` en `PageType` worden aangemaakt of bijgewerkt op het moment van opstarten van de server. Het kan zijn dat de server een keer crasht, start deze dan even opnieuw op.
+
+## Page Types
+
+Maak voor elke pagina type een Page Type aan. Deze kan, maar hoeft niet, gekoppeld worden aan een collection type. Je moet altijd een UID invoeren, als je wenst geen koppeling te maken met een collection type, vul hier alsnog iets in. Het kan zijn dat dit deel van de plugin nog niet werkt, hier is nog niet mee getest.
+hasPage moet toegevoegd worden aan de collectiontype. Dit komt doordat er gefilterd moet kunnen worden middels graphql. Er is een custom manier gebouwd om ervoor te zorgen dat pages gefilterd kan worden.
+
+Voor elk collection type die een page type is, moet deze properties toegevoegd worden:
+
+```
+"page": {
+  "type": "relation",
+  "relation": "morphMany",
+  "target": "api::page.page",
+  "morphBy": "collectionTypeData"
+},
+"hasPage": {
+  "type": "boolean",
+  "default": false
+}
+```
+
+Zodra dit goed is ingesteld, kan je via deze collectie types direct een pagina aanmaken.
+
+## Page
+
+Op een page kan je in de Edit View een page type selecteren. Op basis daarvan wordt er een template geselecteerd (indien gekozen in een page type) en kan je zoeken in verschillende entiteiten binnen die page type. Deze kan je koppelen aan een pagina.
+
+## Template
+
+Een template is niets anders dan een sjabloon die je eenmalig kan toevoegen op een pagina. Dit kan via een page type gaan maar kan ook zonder de page type. Een modal zal eerst nog vragen of je zeker bent van je keuze, alle modules zullen vervangen worden.
+
+## Platform
+
+Om wijzigignen aan te brengen in een platform, moeten deze in de schema aangepast worden van de api. `/src/api/platform/content-types/platform/schema.json`
+
+Voor elk collectiontype die je wil toevoegen aan het platform, moet deze relatie toegevoegd worden:
+
+```
+    "collectiontype": {
+      "type": "relation",
+      "relation": "oneToMany",
+      "target": "UID van collection type",
+      "mappedBy": "platform"
+    }
+```
+
+bijvoorbeeld :
+
+```
+    "faqs": {
+      "type": "relation",
+      "relation": "oneToMany",
+      "target": "api::faq.faq",
+      "mappedBy": "platform"
+    }
+```
+
+Een platform zit altijd aan een pagina gekoppeld. Deze moet handmatig in de pagina toegevoegd worden.
+
+# Known bugs
+
+- Bij het opslaan van een collectietype wil de gekoppelde pagina of type in het ui wel eens verdwijnen.
+- Na het ontkoppelen en opslaan van een collectie item op een pagina, staat deze nog als "Geselecteerd" in de dropdown.
+
+# Improvements
+
+- Deze readme updaten en naar engels vertalen.
+- Intl gebruiken voor de teksten.
+- Pagetype mag ook een default parent page relation hebben. Bij het aanmaken van een pagina obv een page type, deze relatie als default aan de aangemaakte pagina koppelen. Als ik bijvoorbeeld een post pagina maak, dan wordt de pagina automatisch aan de "actueel" pagina gekoppeld zodat al mijn posts die parent hebben.
+- Filteren op Page in GraphQL binnen een collectiontype met een morph op een page kan niet. Strapi staat dit niet toe. Wellicht in de toekomst wel.
+- Slug en path genereren op basis van de titel van het collection type waarvan je een pagina aanmaakt. Nu wordt deze leeggelaten. Dit moet zorgvuldig gebeuren, bij een bestaande slug wil je bijvoorbeeld een -2 toevoegen oid.
+- Dit vorige punt geldt ook andersom, dus als je een entity koppelt vanuit een pagina. Als de titel en slug nog leeg zijn, vul die dan automatisch in.
+- In het overzicht van een collectiontype moet duidelijk worden of en welke pagina er gekoppeld is. [https://share.getcloudapp.com/BluzGYEd](https://share.getcloudapp.com/BluzGYEd)
+- Bij Page Types moet je handmatig de collectiontype uid invoeren. Dit zou idealiter een select zijn van alle mogelijke collecion type uids. Ook moet dit een mogelijkheid bieden voor geen uid.

package/admin/src/api/collection-type.ts

@@ -1,110 +1,110 @@
-import { useQuery, UseQueryOptions } from 'react-query';
-import orderBy from 'lodash/orderBy';
-
-import { useFetchClient } from '@strapi/helper-plugin';
-
-export type SearchResult = {
-	pagination: {
-		page: number;
-		pageCount: number;
-		pageSize: number;
-		total: number;
-	};
-	results: {
-		id: number;
-		title: string;
-		hasPages?: boolean;
-		isCurrentSelected?: boolean;
-	}[];
-};
-
-type SearchEntitiesQueryParams = {
-	fetchClient?: any;
-	uid: string;
-	page: number;
-	locale: string;
-	searchQuery?: string;
-	currentCollectionTypeId?: number;
-	currentPageId?: number;
-};
-
-const QUERY_KEY = ['entities'];
-
-export const getSearchEntities = async ({
-	fetchClient,
-	uid,
-	page,
-	locale,
-	searchQuery,
-	currentCollectionTypeId,
-	currentPageId
-}: SearchEntitiesQueryParams): Promise<SearchResult> => {
-	try {
-		const { get } = fetchClient;
-		const searchParams = new URLSearchParams();
-		searchParams.append('page', String(page));
-		searchParams.append('pageSize', '20');
-		searchParams.append('sort', 'page[id]:DESC');
-		searchParams.append('locale', locale);
-
-		if (searchQuery) {
-			searchParams.delete('sort');
-			searchParams.append('sort', 'title:ASC');
-			searchParams.append('_q', searchQuery);
-		}
-
-		const { data } = await get(`/content-manager/collection-types/${uid}?${searchParams.toString()}`);
-
-		const filteredResults = data.results.filter((p: Record<string, any>) => {
-			// Don't return entities with connected pages when no searchquery is set, unless the entity is the initial selected one.
-			if (!searchQuery) {
-				return p?.page === null || p.id === currentCollectionTypeId;
-			}
-
-			return true;
-		});
-
-		const mapResults = filteredResults.map((result: Record<string, any>) => {
-			const resultPages = (result?.page || []).filter((x: Record<string, any>) => x.id !== currentPageId);
-
-			return {
-				id: result.id,
-				title: result.title,
-				hasPages: resultPages.length > 0,
-				isCurrentSelected: result?.id === currentCollectionTypeId
-			};
-		});
-
-		return {
-			pagination: data.pagination,
-			results: orderBy(mapResults, ['hasPages', 'title'], ['asc', 'asc'])
-		};
-	} catch (e) {
-		return {
-			pagination: { page: 1, pageCount: 0, pageSize: 0, total: 0 },
-			results: []
-		};
-	}
-};
-
-export const useSearchEntities = (
-	params: SearchEntitiesQueryParams,
-	options?: UseQueryOptions<SearchResult, Error>
-) => {
-	const fetchClient = useFetchClient();
-
-	return useQuery<SearchResult, Error>(
-		[
-			QUERY_KEY,
-			{
-				...params
-			}
-		],
-		() =>
-			getSearchEntities({
-				...params,
-				fetchClient
-			}),
-		options
-	);
-};
+import { useQuery, UseQueryOptions } from 'react-query';
+import orderBy from 'lodash/orderBy';
+
+import { useFetchClient } from '@strapi/helper-plugin';
+
+export type SearchResult = {
+	pagination: {
+		page: number;
+		pageCount: number;
+		pageSize: number;
+		total: number;
+	};
+	results: {
+		id: number;
+		title: string;
+		hasPages?: boolean;
+		isCurrentSelected?: boolean;
+	}[];
+};
+
+type SearchEntitiesQueryParams = {
+	fetchClient?: any;
+	uid: string;
+	page: number;
+	locale: string;
+	searchQuery?: string;
+	currentCollectionTypeId?: number;
+	currentPageId?: number;
+};
+
+const QUERY_KEY = ['entities'];
+
+export const getSearchEntities = async ({
+	fetchClient,
+	uid,
+	page,
+	locale,
+	searchQuery,
+	currentCollectionTypeId,
+	currentPageId
+}: SearchEntitiesQueryParams): Promise<SearchResult> => {
+	try {
+		const { get } = fetchClient;
+		const searchParams = new URLSearchParams();
+		searchParams.append('page', String(page));
+		searchParams.append('pageSize', '20');
+		searchParams.append('sort', 'page[id]:DESC');
+		searchParams.append('locale', locale);
+
+		if (searchQuery) {
+			searchParams.delete('sort');
+			searchParams.append('sort', 'title:ASC');
+			searchParams.append('_q', searchQuery);
+		}
+
+		const { data } = await get(`/content-manager/collection-types/${uid}?${searchParams.toString()}`);
+
+		const filteredResults = data.results.filter((p: Record<string, any>) => {
+			// Don't return entities with connected pages when no searchquery is set, unless the entity is the initial selected one.
+			if (!searchQuery) {
+				return p?.page === null || p.id === currentCollectionTypeId;
+			}
+
+			return true;
+		});
+
+		const mapResults = filteredResults.map((result: Record<string, any>) => {
+			const resultPages = (result?.page || []).filter((x: Record<string, any>) => x.id !== currentPageId);
+
+			return {
+				id: result.id,
+				title: result.title,
+				hasPages: resultPages.length > 0,
+				isCurrentSelected: result?.id === currentCollectionTypeId
+			};
+		});
+
+		return {
+			pagination: data.pagination,
+			results: orderBy(mapResults, ['hasPages', 'title'], ['asc', 'asc'])
+		};
+	} catch (e) {
+		return {
+			pagination: { page: 1, pageCount: 0, pageSize: 0, total: 0 },
+			results: []
+		};
+	}
+};
+
+export const useSearchEntities = (
+	params: SearchEntitiesQueryParams,
+	options?: UseQueryOptions<SearchResult, Error>
+) => {
+	const fetchClient = useFetchClient();
+
+	return useQuery<SearchResult, Error>(
+		[
+			QUERY_KEY,
+			{
+				...params
+			}
+		],
+		() =>
+			getSearchEntities({
+				...params,
+				fetchClient
+			}),
+		options
+	);
+};

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

@@ -1,34 +1,34 @@
-import { useQuery, UseQueryOptions } from 'react-query';
-
-import { useFetchClient } from '@strapi/helper-plugin';
-
-import getRequestUrl from '../utils/getRequestUrl';
-
-type HasPageRelationQueryParams = {
-	uid: string;
-	fetchClient?: any;
-};
-
-const QUERY_KEY = ['pageRelation'];
-
-const fetchHasPageRelation = async ({ fetchClient, uid }: HasPageRelationQueryParams): Promise<boolean> => {
-	const { get } = fetchClient;
-	const result = await get(`${getRequestUrl('collection-types')}/${uid}`);
-
-	return Boolean(result?.data?.hasPageRelation);
-};
-
-export const useHasPageRelation = (params: HasPageRelationQueryParams, options?: UseQueryOptions<boolean, Error>) => {
-	const fetchClient = useFetchClient();
-
-	return useQuery<boolean, Error>(
-		[
-			QUERY_KEY,
-			{
-				...params
-			}
-		],
-		() => fetchHasPageRelation({ ...params, fetchClient }),
-		options
-	);
-};
+import { useQuery, UseQueryOptions } from 'react-query';
+
+import { useFetchClient } from '@strapi/helper-plugin';
+
+import getRequestUrl from '../utils/getRequestUrl';
+
+type HasPageRelationQueryParams = {
+	uid: string;
+	fetchClient?: any;
+};
+
+const QUERY_KEY = ['pageRelation'];
+
+const fetchHasPageRelation = async ({ fetchClient, uid }: HasPageRelationQueryParams): Promise<boolean> => {
+	const { get } = fetchClient;
+	const result = await get(`${getRequestUrl('collection-types')}/${uid}`);
+
+	return Boolean(result?.data?.hasPageRelation);
+};
+
+export const useHasPageRelation = (params: HasPageRelationQueryParams, options?: UseQueryOptions<boolean, Error>) => {
+	const fetchClient = useFetchClient();
+
+	return useQuery<boolean, Error>(
+		[
+			QUERY_KEY,
+			{
+				...params
+			}
+		],
+		() => fetchHasPageRelation({ ...params, fetchClient }),
+		options
+	);
+};

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

@@ -1,31 +1,31 @@
-import { useQuery } from 'react-query';
-import { useFetchClient } from '@strapi/helper-plugin';
-
-export type PageType = {
-	id: number;
-	uid: string;
-	title?: string;
-};
-
-const QUERY_KEY = 'page-types';
-
-const fetchPageTypes = async ({ fetchClient }: any): Promise<PageType[]> => {
-	const { get } = fetchClient;
-	const result = await get(`/content-manager/collection-types/api::page-type.page-type`);
-
-	return result?.data?.results?.map((entity: any) => ({
-		id: entity.id,
-		uid: entity.uid,
-		title: entity.title,
-		templateId: entity?.template?.id
-	}));
-};
-
-export const useGetPageTypes = (params: any) => {
-	const fetchClient = useFetchClient();
-	params = {
-		...params,
-		fetchClient
-	};
-	return useQuery<PageType[], Error>(QUERY_KEY, () => fetchPageTypes(params));
-};
+import { useQuery } from 'react-query';
+import { useFetchClient } from '@strapi/helper-plugin';
+
+export type PageType = {
+	id: number;
+	uid: string;
+	title?: string;
+};
+
+const QUERY_KEY = 'page-types';
+
+const fetchPageTypes = async ({ fetchClient }: any): Promise<PageType[]> => {
+	const { get } = fetchClient;
+	const result = await get(`/content-manager/collection-types/api::page-type.page-type`);
+
+	return result?.data?.results?.map((entity: any) => ({
+		id: entity.id,
+		uid: entity.uid,
+		title: entity.title,
+		templateId: entity?.template?.id
+	}));
+};
+
+export const useGetPageTypes = (params: any) => {
+	const fetchClient = useFetchClient();
+	params = {
+		...params,
+		fetchClient
+	};
+	return useQuery<PageType[], Error>(QUERY_KEY, () => fetchPageTypes(params));
+};

package/admin/src/api/template.ts

@@ -1,27 +1,27 @@
-import { useQuery } from 'react-query';
-import { useFetchClient } from '@strapi/helper-plugin';
-import getRequestUrl from '../utils/getRequestUrl';
-
-export type Template = {
-	id: number;
-	title: string;
-	modules: any[];
-};
-
-const QUERY_KEY = ['templates'];
-
-const fetchTemplates = async ({ fetchClient }: any): Promise<Template[]> => {
-	const { get } = fetchClient;
-	const result = await get(getRequestUrl('/template'));
-
-	return result?.data;
-};
-
-export const useGetTemplates = (params: any) => {
-	const fetchClient = useFetchClient();
-	params = {
-		...params,
-		fetchClient
-	};
-	return useQuery<Template[], Error>(QUERY_KEY, () => fetchTemplates(params));
-};
+import { useQuery } from 'react-query';
+import { useFetchClient } from '@strapi/helper-plugin';
+import getRequestUrl from '../utils/getRequestUrl';
+
+export type Template = {
+	id: number;
+	title: string;
+	modules: any[];
+};
+
+const QUERY_KEY = ['templates'];
+
+const fetchTemplates = async ({ fetchClient }: any): Promise<Template[]> => {
+	const { get } = fetchClient;
+	const result = await get(getRequestUrl('/template'));
+
+	return result?.data;
+};
+
+export const useGetTemplates = (params: any) => {
+	const fetchClient = useFetchClient();
+	params = {
+		...params,
+		fetchClient
+	};
+	return useQuery<Template[], Error>(QUERY_KEY, () => fetchTemplates(params));
+};