Add append on duplication for slug fields

README.md

@@ -88,6 +88,8 @@ The `SlugField` accepts the following parameters
 
   - `useFields` - `string[]` defaults to `['title']`
 
+  - `appendOnDuplication` - `boolean` defaults to `false` | Adds a validation hook that appends `-1` to your slug to avoid conflicts (experimental)
+
   - `slugify` - Options to be passed to the [slugify](https://www.npmjs.com/package/slugify) function
 
   ```ts
@@ -123,6 +125,10 @@ Here is a more full example:
 )
 ```
 
+### Notes
+
+`index` and `unique` are set to true by default
+
 ## Combo field
 
 [source](https://github.com/NouanceLabs/payload-better-fields-plugin/tree/master/src/fields/Combo)

dev/src/collections/SlugExamples.ts

@@ -40,6 +40,7 @@ const SlugExamples: CollectionConfig = {
       },
       {
         useFields: ['title', 'subtitle'],
+        appendOnDuplication: true,
       },
     ),
     {
@@ -49,6 +50,8 @@ const SlugExamples: CollectionConfig = {
         ...SlugField(
           {
             name: 'secondSlug',
+            index: false,
+            unique: false,
             admin: {
               position: 'sidebar',
             },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nouance/payload-better-fields-plugin",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "homepage:": "https://github.com/NouanceLabs/payload-better-fields-plugin",
   "repository": "[email protected]:NouanceLabs/payload-better-fields-plugin.git",
   "description": "A Payload plugin that aims to provide improved fields for the admin panel",

src/fields/Slug/index.ts

@@ -5,6 +5,7 @@ import type { SlugifyOptions } from '../../types'
 import { TextField, CheckboxField } from 'payload/types'
 import beforeValidate from './beforeValidate'
 import { PartialRequired } from '../../utilities/partialRequired'
+import { FieldHook } from 'payload/types'
 
 /**
  * Additional config unique to the Slug field
@@ -15,6 +16,10 @@ export type Config = {
    * @default {string[]} ['title']
    */
   useFields: string[]
+  /**
+   * Append a '-1' on duplication of collection in the case that the slug needs to be unique
+   */
+  appendOnDuplication?: boolean
   /**
    * Options passed to the slugify function
    * @default { lower: true }
@@ -62,6 +67,7 @@ export const SlugField: Slug = (
   config = {
     useFields: ['title'],
     slugify: { lower: true, remove: /[*+~.()'"!?#\.,:@]/g },
+    appendOnDuplication: false,
   },
   checkbox = {
     enable: true,
@@ -86,35 +92,61 @@ export const SlugField: Slug = (
     checkbox.overrides,
   )
 
+  const checkboxName = checkboxField.name
+  const slugName = slugOverrides.name ?? 'slug'
+
+  const checkboxDedupe: FieldHook[] = [
+    ({ operation, siblingData }) => {
+      if (operation === 'create') {
+        const slugValue = siblingData[slugName]
+
+        if (slugValue && slugValue !== '') {
+          return true
+        }
+      }
+    },
+  ]
+
+  const slugDedupe: FieldHook[] = [
+    ({ operation, value }) => {
+      if (operation === 'create') {
+        if (value && value !== '') {
+          const incrementedValue = value + '-1'
+
+          return incrementedValue
+        }
+      }
+    },
+  ]
+
   const editField = deepMerge<CheckboxField, Partial<CheckboxField>>(
     {
-      name: checkboxField.name,
+      name: checkboxName,
       label: checkboxField.label,
       type: 'checkbox',
       required: false,
       admin: {
         disabled: !checkbox.enable,
         hidden: true,
       },
+      hooks: {
+        beforeValidate: [...(config.appendOnDuplication ? checkboxDedupe : [])],
+      },
     },
     checkboxField,
   )
 
   const slugField = deepMerge<TextField, Partial<TextField>>(
     {
-      name: 'slug',
+      name: slugName,
       label: 'Slug',
       type: 'text',
       index: true,
       required: false,
       hooks: {
         beforeValidate: [
-          beforeValidate(
-            config.useFields,
-            Boolean(checkbox.enable),
-            editField.name,
-            slugifyOptions,
-          ),
+          beforeValidate(config.useFields, Boolean(checkbox.enable), checkboxName, slugifyOptions),
+          ...(config.appendOnDuplication ? slugDedupe : []),
         ],
       },
       unique: true,