* wip moves payload, user and data into partial req * chore: adjust req type * chore(next): installs sass and resolves type errors * feat: working login route/view * fix: me route * chore(next): scaffolds access routes (#4562) * chore(next): scaffolds admin layout and dashboard view (#4566) * chore(next): builds initPage utility (#4589) * feat(3.0): next route handlers (#4590) * chore: removes old files * chore(next): ssr list view (#4594) * chore: removes old files * chore: adjusts graphql file imports to align with new operation exports * chore: allows for custom endpoints * chore: cleanup * chore(next): ssr edit view (#4614) * chore(ui): ssr main nav (#4619) * chore(next): ssr account view (#4620) * chore(next): ssr auth views and document create (#4631) * chore(next): ssr globals view (#4640) * chore(next): scaffolds document layout (#4644) * chore(next): ssr versions view (#4645) * chore(next): ssr field conditions (#4675) * chore(next): ssr field validations (#4700) * chore(next): moves dashboard view into next dir * chore(next): moves account view into next dir * chore(next): moves global edit view into next dir * chore(next): returns isolated configs and locale from initPage * chore(next): ssr api view (#4721) * feat: adds i18n functionality within Rest API, Local and Client contexts (#4749) * chore: separate client translation groups with empty line * chore: add missing translation used in db adapters * chore: simplify next/routes export and import paths * chore: renames PayloadT to Payload * chore(next): custom views (#4748) * chore: fix translation tsconfig * chore: adjust other package ts-configs that rely on translations * chore(next): installs @payloadcms/ui as direct dependency * chore(next): progress to build * chore(next): migrates types (#4792) * fixes acccept-language detection * chore(next): moves remaining components out from payload core (#4794) * chore(deps): removes all unused dependencies from payload core (#4797) * chore(next): achieves buildable state (#4803) * adds Translation component and removes more react-i18next * fixes up remaining translation strings * fixes a few i18n TODO's * chore: remaining translation strings without colons * chore: adds missing ja translations * chore(next): ssr group field (#4830) * chore: removes placeholder t function * chore: removes old file * chore(bundler-webpack): removes webpack bundler * chore(bundler-vite): removes vite bundler * chore(next): ssr tabs field (#4863) * chore(next): ssr row field * chore(next): ssr textarea field * chore(next): wires server action into document edit view (#4873) * chore(next): conditional logic (#4880) * chore(next): ssr radio, point, code, json, ui, and hidden fields (#4891) * chore(next): ssr collapsible field (#4894) * chore: remove findByID from req * chore: adjusts file property on request type * comment clarification * chore: wires up busboy with Requst readstream * chore: ports over express-fileupload into a NextJS compatible format * chore: adjust upload file structure * chore: adds try/catch around routes, corrects a few route responses * chore: renames file/function * chore: improve req type safety in local operations, misc req.files replacements * chore: misc type and fn export changes * chore: ensures root routes take pass unmodified request to root routes * chore: improve types * chore: consolidates locale api req initialization (#4922) * chore(next): overhauls field rendering strategy (#4924) * chore(next): ssr array field (#4937) * chore(next): ssr blocks field (#4942) * chore(next): ssr upload field and document drawer (#4957) * chore(next): wires form submissions (#4982) * chore: api handler adjustments * feat: adds graphql playground handler * adds credentials include setting to playground * remove old playground init, stub graphql handler location * fix: allow for null fallbackLocale * fix: correctly prioritize locales passed as null * chore: move all graphql code into next package * graphql changes * chore: semi working version of graphql http layer * gql fix attempts * rm console log * chore: partial gql changes * chore: adds gql and gql-http back into payload * chore: removes collection from req * chore: separates graphql package out for schema generation * chore: dep cleanup * chore: move graphql handlers * chore: removes unused deps * chore(next): ssr list view (#5032) * chore: refactor response handler order for custom endpoints * chore: add back in condition for collection GET path with 2 slugs * chore: rm optional chain * chore: import sort route file * chore: allows custom endpoints to attempt before erroring * feat: adds memoization to translation functions (#5036) * chore: fix APIError import * chore: return attemptCustomEndpointBeforeError responses * chore(next): properly instantiates table columns * fix(next): attaches params to req and properly assigns prefs key (#5042) * chore: reorganize next route order * chore(next): adds RouteError handler to next routes * chore: builds payload successfully * chore: misc file omissions * fix(ui): maintains proper column order * fix(ui): ensures first cell is a link * fix(next): properly copies url object in createPayloadRequest (#5064) * fix(ui): bumps react-toastify to v10.0.4 to fix hydration warnings * feat: add route for static file GET requests (#5065) * chore(next): allows resolved config promise to be thread through initPage (#5071) * chore(ui): conditionally renders field label from props * feat(next): next install script * chore: pass config to route handlers * feat: initial test suite framework (#4929) * chore(next): renderable account, api, and create first user views (#5084) * fix(next): properly parses search params in find, update, and delete handlers (#5088) * chore(next): ssr versions view (#5085) * chore: adds homepage for scss testing * chore: moves dev folder to top, establishes new test pattern * chore: working turbopack * chore: sets up working dynamic payload-config imports * remove unused code * chore: rm console log * misc * feat: correctly subs out ability to boot REST API within same process * chore: WIP dev suites * chore: removes need for REST_API folder in test dir * removes duplicate bootAdminPanel fn * misc * specify default export * chore: sets up jest to work with next/jest * chore: progress to mongodb and sharp builds * chore: passing community tests * chore: sorta workin * chore: adjust payload-config import * chore: adds rest client for Next handlers * chore: removes test garb * chore: restores payload-config tsconfig path temporarily * chore: establishes pattern for memory db during tests * chore: bumps mongoose to 7 * chore(next): 404s on nested create urls * chore: functional _community e2e * chore: increases e2e expect timeout * fix(next): sanitizes locale toString from client config * chore: type fixes * chore: pulls mongodb from main * chore: uses graphql to log user in * feat: passing auth test suite * chore(ui): threads params through context and conditionally renders document tabs (#5094) * feat(ui): adds params context (#5095) * chore: removes unecessary memory allocation for urlPropertiesObject object * chore: passing graphql test suite * chore: removes references to bson * chore: re-enables mongodb memory server for auth test suite * chore: replace bson with bson-objectid * feat: passing collections-rest int suite * chore: fixes bad imports * chore: more passing int suites * feat: passing globals int tests * feat: passing hooks int test suite * chore: remove last express file * chore: start live-preview int test migration * chore: passing localization int tests * passing relationships int tests * chore: partial passing upload int tests * chore: fixes scss imports * chore(ui): renders document info provider at root (#5106) * chore: adds schema path to useFieldPath provider, more passing tests * chore: begins work to optimize translation imports * chore: add translations to ui ts-config references * chore: add exports folder to package json exports * chore: adds readme how-to-use instructions * chore: attempts refactor of translation imports * chore: adds authentication:account translation key to server keys * chore: finishes translation optimization * chore: ignores warnings from mongodb * chore(ui): renders live document title (#5115) * chore(ui): ssr document tabs (#5116) * chore: handles redirecting from login * chore: handle redirect with no searchParams * chore: handle missing segments * chore(next): migrates server action into standalone api endpoint (#5122) * chore: adjust dashboard colection segments * test: update e2e suites * fix(ui): prevents unnecessary calls to form state * chore: fix finding global config fields from schema path * fix(next): executes root POST endpoints * chore(ui): ignores values returned by form state polling * chore: scaffolds ssr rte * chore: renders client leaves * chore: server-side rendered rich text elements * chore: defines ClientFunction pattern * chore(ui): migrates relationship field * chore: adds translations, cleans up slate * chore: functional slate link * chore: slate upload ssr * chore: relationship slate ssr * chore: remaining slate ssr * chore: fixes circular workspace dep * chore: correct broken int test import paths * chore: remove media files from root * chore: server renders custom edit view * fix(ui): resolves infinite loading in versions view * fix(next): resolves global edit view lookup * chore: payload builds * chore: delete unused files * chore: removes local property from payload * chore: adds mongodb as dev dep in db-mongodb package * chore: hide deprecation warnings for tempfile and jest-environment-jsdom * chore: remove all translations from translations dist * chore: clean ts-config files * chore: simple type fixes * chore(ui): server renders custom list view * chore: fix next config payload-config alias * chore: adds turbo alias paths * chore: adjusts translation generation * chore: improve auth function * chore: eslint config for packages/ui * chore(ui): exports FormState * chore(next): migrates account view to latest patterns * chore: disable barbie mode * chore(ui): lints * chore(next): lints * chore: for alexical * chore: custom handler type signature adjustment * fix: non-boolean condition result causes infinite looping (#4579) * chore(richtext-lexical): upgrade lexical from v0.12.5 to v0.12.6 (#4732) * chore(richtext-lexical): upgrade all lexical packages from 0.12.5 to 0.12.6 * fix(richtext-lexical): fix TypeScript errors * fix indenting * feat(richtext-lexical): Blocks: generate type definitions for blocks fields (#4529) * feat(richtext-lexical)!: Update lexical from 0.12.6 to 0.13.1, port over all useful changes from playground (#5066) * feat(richtext-lexical): Update lexical from 0.12.6 to 0.13.1, port over all useful changes from playground * chore: upgrade lexical version used in monorepo * chore: remove the 3 * chore: upgrade nodemon versions (#5059) * feat: add more options to addFieldStatePromise so that it can be used for field flattening (#4799) * feat(plugin-seo)!: remove support for payload <2.7.0 (#4765) * chore(plugin-seo): remove test script from package.json (#4762) * chore: upgrade @types/nodemailer from v6.4.8 to v6.4.14 (#4733) * chore: revert auth and initPage changes * chore(next): moves edit and list views (#5170) * fix: "The punycode module is deprecated" warning by updating nodemailer * chore: adjust translations tsconfig paths in root * chore: fix merge build --------- Co-authored-by: Jarrod Flesch <jarrodmflesch@gmail.com> Co-authored-by: Jacob Fletcher <jacobsfletch@gmail.com> Co-authored-by: Jarrod Flesch <30633324+JarrodMFlesch@users.noreply.github.com> Co-authored-by: Elliot DeNolf <denolfe@gmail.com> Co-authored-by: James <james@trbl.design> Co-authored-by: Alessio Gravili <alessio@gravili.de> Co-authored-by: Alessio Gravili <70709113+AlessioGr@users.noreply.github.com>
326 lines
9.6 KiB
Plaintext
326 lines
9.6 KiB
Plaintext
---
|
|
title: Collection Hooks
|
|
label: Collections
|
|
order: 20
|
|
desc: You can add hooks to any Collection, several hook types are available including beforeChange, afterRead, afterDelete and more.
|
|
keywords: hooks, collections, config, configuration, documentation, Content Management System, cms, headless, javascript, node, react, express
|
|
---
|
|
|
|
Collections feature the ability to define the following hooks:
|
|
|
|
- [beforeOperation](#beforeoperation)
|
|
- [beforeValidate](#beforevalidate)
|
|
- [beforeChange](#beforechange)
|
|
- [afterChange](#afterchange)
|
|
- [beforeRead](#beforeread)
|
|
- [afterRead](#afterread)
|
|
- [beforeDelete](#beforedelete)
|
|
- [afterDelete](#afterdelete)
|
|
- [afterOperation](#afteroperation)
|
|
|
|
Additionally, `auth`-enabled collections feature the following hooks:
|
|
|
|
- [beforeLogin](#beforelogin)
|
|
- [afterLogin](#afterlogin)
|
|
- [afterLogout](#afterlogout)
|
|
- [afterRefresh](#afterrefresh)
|
|
- [afterMe](#afterme)
|
|
- [afterForgotPassword](#afterforgotpassword)
|
|
|
|
## Config
|
|
|
|
All collection Hook properties accept arrays of synchronous or asynchronous functions. Each Hook type receives specific arguments and has the ability to modify specific outputs.
|
|
|
|
`collections/exampleHooks.js`
|
|
|
|
```ts
|
|
import { CollectionConfig } from 'payload/types';
|
|
|
|
export const ExampleHooks: CollectionConfig = {
|
|
slug: 'example-hooks',
|
|
fields: [
|
|
{ name: 'name', type: 'text'},
|
|
],
|
|
hooks: {
|
|
beforeOperation: [(args) => {...}],
|
|
beforeValidate: [(args) => {...}],
|
|
beforeDelete: [(args) => {...}],
|
|
beforeChange: [(args) => {...}],
|
|
beforeRead: [(args) => {...}],
|
|
afterChange: [(args) => {...}],
|
|
afterRead: [(args) => {...}],
|
|
afterDelete: [(args) => {...}],
|
|
afterOperation: [(args) => {...}],
|
|
|
|
// Auth-enabled hooks
|
|
beforeLogin: [(args) => {...}],
|
|
afterLogin: [(args) => {...}],
|
|
afterLogout: [(args) => {...}],
|
|
afterRefresh: [(args) => {...}],
|
|
afterMe: [(args) => {...}],
|
|
afterForgotPassword: [(args) => {...}],
|
|
},
|
|
}
|
|
```
|
|
|
|
### beforeOperation
|
|
|
|
The `beforeOperation` hook can be used to modify the arguments that operations accept or execute side-effects that run before an operation begins.
|
|
|
|
Available Collection operations include `create`, `read`, `update`, `delete`, `login`, `refresh`, and `forgotPassword`.
|
|
|
|
```ts
|
|
import { CollectionBeforeOperationHook } from 'payload/types'
|
|
|
|
const beforeOperationHook: CollectionBeforeOperationHook = async ({
|
|
args, // original arguments passed into the operation
|
|
operation, // name of the operation
|
|
req, // full express request
|
|
}) => {
|
|
return args // return modified operation arguments as necessary
|
|
}
|
|
```
|
|
|
|
### beforeValidate
|
|
|
|
Runs before the `create` and `update` operations. This hook allows you to add or format data before the incoming data is validated server-side.
|
|
|
|
Please do note that this does not run before the client-side validation. If you added a `validate` function, this would be the lifecycle:
|
|
|
|
1. `validate` runs on the client
|
|
2. if successful, `beforeValidate` runs on the server
|
|
3. `validate` runs on the server
|
|
|
|
```ts
|
|
import { CollectionBeforeValidateHook } from 'payload/types'
|
|
|
|
const beforeValidateHook: CollectionBeforeValidateHook = async ({
|
|
data, // incoming data to update or create with
|
|
req, // full express request
|
|
operation, // name of the operation ie. 'create', 'update'
|
|
originalDoc, // original document
|
|
}) => {
|
|
return data // Return data to either create or update a document with
|
|
}
|
|
```
|
|
|
|
### beforeChange
|
|
|
|
Immediately following validation, `beforeChange` hooks will run within `create` and `update` operations. At this stage, you can be confident that the data that will be saved to the document is valid in accordance to your field validations. You can optionally modify the shape of data to be saved.
|
|
|
|
```ts
|
|
import { CollectionBeforeChangeHook } from 'payload/types'
|
|
|
|
const beforeChangeHook: CollectionBeforeChangeHook = async ({
|
|
data, // incoming data to update or create with
|
|
req, // full express request
|
|
operation, // name of the operation ie. 'create', 'update'
|
|
originalDoc, // original document
|
|
}) => {
|
|
return data // Return data to either create or update a document with
|
|
}
|
|
```
|
|
|
|
### afterChange
|
|
|
|
After a document is created or updated, the `afterChange` hook runs. This hook is helpful to recalculate statistics such as total sales within a global, syncing user profile changes to a CRM, and more.
|
|
|
|
```ts
|
|
import { CollectionAfterChangeHook } from 'payload/types'
|
|
|
|
const afterChangeHook: CollectionAfterChangeHook = async ({
|
|
doc, // full document data
|
|
req, // full express request
|
|
previousDoc, // document data before updating the collection
|
|
operation, // name of the operation ie. 'create', 'update'
|
|
}) => {
|
|
return doc
|
|
}
|
|
```
|
|
|
|
### beforeRead
|
|
|
|
Runs before `find` and `findByID` operations are transformed for output by `afterRead`. This hook fires before hidden fields are removed and before localized fields are flattened into the requested locale. Using this Hook will provide you with all locales and all hidden fields via the `doc` argument.
|
|
|
|
```ts
|
|
import { CollectionBeforeReadHook } from 'payload/types'
|
|
|
|
const beforeReadHook: CollectionBeforeReadHook = async ({
|
|
doc, // full document data
|
|
req, // full express request
|
|
query, // JSON formatted query
|
|
}) => {
|
|
return doc
|
|
}
|
|
```
|
|
|
|
### afterRead
|
|
|
|
Runs as the last step before documents are returned. Flattens locales, hides protected fields, and removes fields that users do not have access to.
|
|
|
|
```ts
|
|
import { CollectionAfterReadHook } from 'payload/types'
|
|
|
|
const afterReadHook: CollectionAfterReadHook = async ({
|
|
doc, // full document data
|
|
req, // full express request
|
|
query, // JSON formatted query
|
|
findMany, // boolean to denote if this hook is running against finding one, or finding many
|
|
}) => {
|
|
return doc
|
|
}
|
|
```
|
|
|
|
### beforeDelete
|
|
|
|
Runs before the `delete` operation. Returned values are discarded.
|
|
|
|
```ts
|
|
import { CollectionBeforeDeleteHook } from 'payload/types';
|
|
|
|
const beforeDeleteHook: CollectionBeforeDeleteHook = async ({
|
|
req, // full express request
|
|
id, // id of document to delete
|
|
}) => {...}
|
|
```
|
|
|
|
### afterDelete
|
|
|
|
Runs immediately after the `delete` operation removes records from the database. Returned values are discarded.
|
|
|
|
```ts
|
|
import { CollectionAfterDeleteHook } from 'payload/types';
|
|
|
|
const afterDeleteHook: CollectionAfterDeleteHook = async ({
|
|
req, // full express request
|
|
id, // id of document to delete
|
|
doc, // deleted document
|
|
}) => {...}
|
|
```
|
|
|
|
### afterOperation
|
|
|
|
The `afterOperation` hook can be used to modify the result of operations or execute side-effects that run after an operation has completed.
|
|
|
|
Available Collection operations include `create`, `find`, `findByID`, `update`, `updateByID`, `delete`, `deleteByID`, `login`, `refresh`, and `forgotPassword`.
|
|
|
|
```ts
|
|
import { CollectionAfterOperationHook } from 'payload/types'
|
|
|
|
const afterOperationHook: CollectionAfterOperationHook = async ({
|
|
args, // arguments passed into the operation
|
|
operation, // name of the operation
|
|
req, // full express request
|
|
result, // the result of the operation, before modifications
|
|
}) => {
|
|
return result // return modified result as necessary
|
|
}
|
|
```
|
|
|
|
### beforeLogin
|
|
|
|
For auth-enabled Collections, this hook runs during `login` operations where a user with the provided credentials exist, but before a token is generated and added to the response. You can optionally modify the user that is returned, or throw an error in order to deny the login operation.
|
|
|
|
```ts
|
|
import { CollectionBeforeLoginHook } from 'payload/types'
|
|
|
|
const beforeLoginHook: CollectionBeforeLoginHook = async ({
|
|
req, // full express request
|
|
user, // user being logged in
|
|
}) => {
|
|
return user
|
|
}
|
|
```
|
|
|
|
### afterLogin
|
|
|
|
For auth-enabled Collections, this hook runs after successful `login` operations. You can optionally modify the user that is returned.
|
|
|
|
```ts
|
|
import { CollectionAfterLoginHook } from 'payload/types';
|
|
|
|
const afterLoginHook: CollectionAfterLoginHook = async ({
|
|
req, // full express request
|
|
user, // user that was logged in
|
|
token, // user token
|
|
}) => {...}
|
|
```
|
|
|
|
### afterLogout
|
|
|
|
For auth-enabled Collections, this hook runs after `logout` operations.
|
|
|
|
```ts
|
|
import { CollectionAfterLogoutHook } from 'payload/types';
|
|
|
|
const afterLogoutHook: CollectionAfterLogoutHook = async ({
|
|
req, // full express request
|
|
}) => {...}
|
|
```
|
|
|
|
### afterRefresh
|
|
|
|
For auth-enabled Collections, this hook runs after `refresh` operations.
|
|
|
|
```ts
|
|
import { CollectionAfterRefreshHook } from 'payload/types';
|
|
|
|
const afterRefreshHook: CollectionAfterRefreshHook = async ({
|
|
req, // full express request
|
|
res, // full express response
|
|
token, // newly refreshed user token
|
|
}) => {...}
|
|
```
|
|
|
|
### afterMe
|
|
|
|
For auth-enabled Collections, this hook runs after `me` operations.
|
|
|
|
```ts
|
|
import { CollectionAfterMeHook } from 'payload/types';
|
|
|
|
const afterMeHook: CollectionAfterMeHook = async ({
|
|
req, // full express request
|
|
response, // response to return
|
|
}) => {...}
|
|
```
|
|
|
|
### afterForgotPassword
|
|
|
|
For auth-enabled Collections, this hook runs after successful `forgotPassword` operations. Returned values are discarded.
|
|
|
|
```ts
|
|
import { CollectionAfterForgotPasswordHook } from 'payload/types'
|
|
|
|
const afterLoginHook: CollectionAfterForgotPasswordHook = async ({
|
|
req, // full express request
|
|
user, // user being logged in
|
|
token, // user token
|
|
}) => {
|
|
return user
|
|
}
|
|
```
|
|
|
|
## TypeScript
|
|
|
|
Payload exports a type for each Collection hook which can be accessed as follows:
|
|
|
|
```ts
|
|
import type {
|
|
CollectionBeforeOperationHook,
|
|
CollectionBeforeValidateHook,
|
|
CollectionBeforeChangeHook,
|
|
CollectionAfterChangeHook,
|
|
CollectionAfterReadHook,
|
|
CollectionBeforeReadHook,
|
|
CollectionBeforeDeleteHook,
|
|
CollectionAfterDeleteHook,
|
|
CollectionBeforeLoginHook,
|
|
CollectionAfterLoginHook,
|
|
CollectionAfterLogoutHook,
|
|
CollectionAfterRefreshHook,
|
|
CollectionAfterMeHook,
|
|
CollectionAfterForgotPasswordHook,
|
|
} from 'payload/types'
|
|
```
|