@ainsleydev/payload-helper 0.0.1

package/README.md

@@ -0,0 +1,16 @@
+## Payload Helper
+
+Payload Helper is a project designed to extend and enhance functionality for Payload CMS. This
+project includes custom configurations, scripts, and utilities to streamline development and content
+management processes.
+
+## Open Source
+
+ainsley.dev permits the use of any HTML, SCSS and Javascript found within the repository for use
+with external projects.
+
+## Trademark
+
+ainsley.dev and the ainsley.dev logo are either registered trademarks or trademarks of ainsley.dev
+LTD in the United Kingdom and/or other countries. All other trademarks are the property of their
+respective owners.

package/eslint.config.mjs

@@ -0,0 +1,4 @@
+import config from '@ainsleydev/eslint-config/eslint.config.mjs';
+
+/** @type { import("eslint").Linter.FlatConfig[] } */
+export default [...config];

package/package.json

@@ -0,0 +1,40 @@
+{
+	"name": "@ainsleydev/payload-helper",
+	"version": "0.0.1",
+	"description": "Payload CMS utilities, collections and global types for ainsley.dev builds",
+	"license": "MIT",
+	"keywords": [
+		"payload",
+		"payloadcms",
+		"cms",
+		"utilities"
+	],
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/ainsleydev/webkit.git",
+		"directory": "packages/payload-helper"
+	},
+	"author": {
+		"name": "ainsley.dev",
+		"email": "hello@ainsley.dev",
+		"url": "https://ainsley.dev"
+	},
+	"scripts": {
+		"publish": "npm publish --access public",
+		"test": "echo \"Error: no test specified\" && exit 1"
+	},
+	"dependencies": {
+		"@nouance/payload-better-fields-plugin": "^1.4.1",
+		"@payloadcms/richtext-slate": "^1.5.2",
+		"json-schema": "^0.4.0",
+		"payload": "^2.18.3",
+		"pluralize": "^8.0.0"
+	},
+	"devDependencies": {
+		"@ainsleydev/eslint-config": "workspace:*"
+	},
+	"engines": {
+		"node": ">=18",
+		"pnpm": ">=9"
+	}
+}

package/src/collections/Media.ts

@@ -0,0 +1,149 @@
+// import { slateEditor } from '@payloadcms/richtext-slate';
+import type { CollectionConfig, Field } from 'payload/types';
+
+/**
+ * Media Collection Configuration
+ * Additional fields will be appended to the media collection.
+ *
+ * @param filePath
+ * @param additionalFields
+ * @constructor
+ */
+export const Media = (filePath: string, additionalFields?: Field[]): CollectionConfig => {
+	return {
+		slug: 'media',
+		upload: {
+			staticURL: '/media',
+			staticDir: filePath,
+			imageSizes: [
+				// Original Size (for WebP & Avif)
+				{
+					name: 'webp',
+					width: undefined,
+					height: undefined,
+					formatOptions: {
+						format: 'webp',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				{
+					name: 'avif',
+					width: undefined,
+					height: undefined,
+					formatOptions: {
+						format: 'avif',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				// Thumbnail Sizes
+				{
+					name: 'thumbnail',
+					width: 400,
+					height: 300,
+					position: 'centre',
+				},
+				{
+					name: 'thumbnail_webp',
+					width: 400,
+					height: 300,
+					position: 'centre',
+					formatOptions: {
+						format: 'webp',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				{
+					name: 'thumbnail_avif',
+					width: 400,
+					height: 300,
+					position: 'centre',
+					formatOptions: {
+						format: 'avif',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				// Mobile Sizes
+				{
+					name: 'mobile',
+					width: 768,
+					height: undefined,
+				},
+				{
+					name: 'mobile_webp',
+					width: 768,
+					height: undefined,
+					formatOptions: {
+						format: 'webp',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				{
+					name: 'mobile_avif',
+					width: 768,
+					height: undefined,
+					formatOptions: {
+						format: 'avif',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				// Tablet Sizes
+				{
+					name: 'tablet',
+					width: 1024,
+					height: undefined,
+				},
+				{
+					name: 'tablet_webp',
+					width: 1024,
+					height: undefined,
+					formatOptions: {
+						format: 'webp',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+				{
+					name: 'tablet_avif',
+					width: 1024,
+					height: undefined,
+					formatOptions: {
+						format: 'avif',
+						options: {
+							quality: 80,
+						},
+					},
+				},
+			],
+		},
+		fields: [
+			{
+				name: 'alt',
+				type: 'text',
+				required: true,
+			},
+			{
+				name: 'caption',
+				type: 'richText',
+				// editor: slateEditor({
+				// 		admin: {
+				// 			elements: ['link'],
+				// 		},
+				// 	}),
+			},
+			...(additionalFields ? additionalFields : []),
+		],
+	};
+};

package/src/collections/Redirects.ts

@@ -0,0 +1,58 @@
+import type { CollectionConfig } from 'payload/types';
+
+/**
+ * Redirects Collection Configuration
+ * In favour of the native plugin for more granular control.
+ *
+ * TODO: Potential to add regex redirects here, i.e product-category/(.*)$ => /category/$1
+ *
+ * @constructor
+ */
+export const Redirects = (overrides?: Partial<CollectionConfig>): CollectionConfig => {
+	return {
+		...{
+			slug: 'redirects',
+			admin: {
+				useAsTitle: 'from',
+			},
+			fields: [
+				{
+					name: 'from',
+					type: 'text',
+					label: 'From URL',
+					required: true,
+					index: true,
+					admin: {
+						description: 'The URL you want to redirect from, ensure it starts with a /',
+					},
+				},
+				{
+					name: 'to',
+					type: 'text',
+					label: 'Destination URL',
+					required: true,
+					admin: {
+						description:
+							'The URL you want to redirect to, can be a relative or absolute URL',
+					},
+				},
+				{
+					name: 'code',
+					type: 'select',
+					label: 'Redirect Code',
+					required: true,
+					defaultValue: '301',
+					options: [
+						{ label: '301 - Permanent', value: '301' },
+						{ label: '302 - Temporary', value: '302' },
+						{ label: '307 - Temporary Redirect', value: '307' },
+						{ label: '308 - Permanent Redirect', value: '308' },
+						{ label: '410 - Content Deleted', value: '410' },
+						{ label: '451 - Unavailable For Legal Reasons', value: '451' },
+					],
+				},
+			],
+		},
+		...(overrides ? overrides : {}),
+	};
+};

package/src/common/SEO.ts

@@ -0,0 +1,45 @@
+import { Field } from 'payload/types';
+import { validateURL } from '../util/validation';
+
+/**
+ * SEO Fields define the additional fields that appear
+ * within the Payload SEO plugin.
+ */
+export const SEOFields: Field[] = [
+	{
+		type: 'row',
+		fields: [
+			{
+				name: 'private',
+				type: 'checkbox',
+				label: 'Private',
+				defaultValue: false,
+				admin: {
+					width: '50%',
+					description:
+						'Enable private mode to prevent robots from crawling the page or website. When enabled it will output <meta name="robots" content="noindex" /> on the frontend.',
+				},
+			},
+			{
+				name: 'canonicalURL',
+				type: 'text',
+				label: 'Canonical',
+				admin: {
+					width: '50%',
+					description:
+						'A canonical URL is the version of a webpage chosen by search engines like Google as the main version when there are duplicates.',
+				},
+				validate: validateURL,
+			},
+		],
+	},
+	{
+		name: 'structuredData',
+		type: 'json',
+		label: 'Structured Data',
+		admin: {
+			description:
+				'Structured data is a standardized format for providing information about a page and classifying the page content. The site Schema.org contains a standardised list of markup that the major search engines — Google, Bing, Yahoo and Yandex — have collectively agreed to support.',
+		},
+	},
+];

package/src/endpoints/slug.ts

@@ -0,0 +1,30 @@
+import { PayloadHandler } from 'payload/config';
+
+/**
+ * Find a document in the given collection by its slug.
+ *
+ * @param collection
+ */
+export const findBySlug = (collection: string): PayloadHandler => {
+	return async (req, res) => {
+		try {
+			const data = await req.payload.find({
+				collection,
+				where: {
+					slug: {
+						equals: req.params.slug,
+					},
+				},
+				limit: 1,
+			});
+			if (data.docs.length === 0) {
+				res.status(404).send({ error: 'not found' });
+			} else {
+				res.status(200).send(data.docs[0]);
+			}
+		} catch (error) {
+			console.error('Error occurred while fetching document:', error);
+			res.status(500).send({ error: 'Internal server error' });
+		}
+	};
+};