payload 1.8.5 → 1.9.0

package/docs/queries/overview.mdx

@@ -17,55 +17,53 @@ Payload provides an extremely granular querying language through all APIs. Each
 For example, say you have a collection as follows:
 
 ```ts
-import { CollectionConfig } from 'payload/types';
+import { CollectionConfig } from "payload/types";
 
 export const Post: CollectionConfig = {
-  slug: 'posts',
+  slug: "posts",
   fields: [
     {
-      name: 'color',
-      type: 'select',
-      options: [
-        'mint',
-        'dark-gray',
-        'white',
-      ],
+      name: "color",
+      type: "select",
+      options: ["mint", "dark-gray", "white"],
     },
     {
-      name: 'featured',
-      type: 'checkbox',
-    }
-  ]
-}
+      name: "featured",
+      type: "checkbox",
+    },
+  ],
+};
 ```
 
 You may eventually have a lot of documents within this Collection. If you wanted to find only documents with `color` equal to `mint`, you could write a query as follows:
 
 ```js
 const query = {
-  color: { // property name to filter on
-    equals: 'mint', // operator to use and value to compare against
+  color: {
+    // property name to filter on
+    equals: "mint", // operator to use and value to compare against
   },
-}
+};
 ```
 
 The above example demonstrates a simple query but you can get much more complex.
 
 ### Operators
 
-| Operator             | Description  |
-| -------------------- | ------------ |
-| `equals`             | The value must be exactly equal. |
-| `not_equals`         | The query will return all documents where the value is not equal. |
-| `greater_than`       | For numeric or date-based fields. |
-| `greater_than_equal` | For numeric or date-based fields. |
-| `less_than`          | For numeric or date-based fields. |
-| `less_than_equal`    | For numeric or date-based fields. |
-| `like`               | Case-insensitive string must be present. If string of words, all words must be present, in any order. |
-| `contains`           | Must contain the value entered, case-insensitive. |
-| `in`                 | The value must be found within the provided comma-delimited list of values. |
-| `not_in`             | The value must NOT be within the provided comma-delimited list of values. |
-| `exists`             | Only return documents where the value either exists (`true`) or does not exist (`false`). |
+| Operator             | Description                                                                                                                                                                       |
+| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `equals`             | The value must be exactly equal.                                                                                                                                                  |
+| `not_equals`         | The query will return all documents where the value is not equal.                                                                                                                 |
+| `greater_than`       | For numeric or date-based fields.                                                                                                                                                 |
+| `greater_than_equal` | For numeric or date-based fields.                                                                                                                                                 |
+| `less_than`          | For numeric or date-based fields.                                                                                                                                                 |
+| `less_than_equal`    | For numeric or date-based fields.                                                                                                                                                 |
+| `like`               | Case-insensitive string must be present. If string of words, all words must be present, in any order.                                                                             |
+| `contains`           | Must contain the value entered, case-insensitive.                                                                                                                                 |
+| `in`                 | The value must be found within the provided comma-delimited list of values.                                                                                                       |
+| `not_in`             | The value must NOT be within the provided comma-delimited list of values.                                                                                                         |
+| `all`                | The value must contain all values provided in the comma-delimited list.                                                                                                           |
+| `exists`             | Only return documents where the value either exists (`true`) or does not exist (`false`).                                                                                         |
 | `near`               | For distance related to a [point field](/docs/fields/point) comma separated as `<longitude>, <latitude>, <maxDistance in meters (nullable)>, <minDistance in meters (nullable)>`. |
 
 <Banner type="success">
@@ -79,28 +77,30 @@ In addition to defining simple queries, you can join multiple queries together u
 
 ```js
 const query = {
-  or: [ // array of OR conditions
+  or: [
+    // array of OR conditions
     {
       color: {
-        equals: 'mint',
+        equals: "mint",
       },
     },
     {
-      and: [ // nested array of AND conditions
+      and: [
+        // nested array of AND conditions
         {
           color: {
-            equals: 'white',
-          }
+            equals: "white",
+          },
         },
         {
           featured: {
             equals: false,
-          }
-        }
-      ]
-    }
-  ]
-}
+          },
+        },
+      ],
+    },
+  ],
+};
 ```
 
 Written in plain English, if the above query were passed to a `find` operation, it would translate to finding posts where either the `color` is `mint` OR the `color` is `white` AND `featured` is set to false.
@@ -111,10 +111,11 @@ When working with nested properties, which can happen when using relational fiel
 
 ```js
 const query = {
-  'artists.featured': { // nested property name to filter on
+  "artists.featured": {
+    // nested property name to filter on
     exists: true, // operator to use and boolean value that needs to be true
   },
-}
+};
 ```
 
 ### GraphQL Find Queries
@@ -147,24 +148,29 @@ This one isn't too bad, but more complex queries get unavoidably more difficult
 **For example, using fetch:**
 
 ```js
-import qs from 'qs';
+import qs from "qs";
 
 const query = {
   color: {
-    equals: 'mint',
+    equals: "mint",
   },
   // This query could be much more complex
   // and QS would handle it beautifully
-}
+};
 
 const getPosts = async () => {
-  const stringifiedQuery = qs.stringify({
-    where: query // ensure that `qs` adds the `where` property, too!
-  }, { addQueryPrefix: true });
+  const stringifiedQuery = qs.stringify(
+    {
+      where: query, // ensure that `qs` adds the `where` property, too!
+    },
+    { addQueryPrefix: true }
+  );
 
-  const response = await fetch(`http://localhost:3000/api/posts${stringifiedQuery}`);
+  const response = await fetch(
+    `http://localhost:3000/api/posts${stringifiedQuery}`
+  );
   // Continue to handle the response below...
-}
+};
 ```
 
 ### Local API Queries
@@ -174,19 +180,18 @@ The Local API's `find` operation accepts an object exactly how you write it. For
 ```js
 const getPosts = async () => {
   const posts = await payload.find({
-    collection: 'posts',
+    collection: "posts",
     where: {
       color: {
-        equals: 'mint',
+        equals: "mint",
       },
     },
   });
 
   return posts;
-}
+};
 ```
 
-
 ## Sort
 
 Payload `find` queries support a `sort` parameter through all APIs. Pass the `name` of a top-level field to sort by that field in ascending order. Prefix the name of the field with a minus symbol ("-") to sort in descending order.
@@ -195,6 +200,7 @@ Payload `find` queries support a `sort` parameter through all APIs. Pass the `na
 **`https://localhost:3000/api/posts?sort=-createdAt`**
 
 **GraphQL example:**
+
 ```
 query {
   Posts(sort: "-createdAt") {
@@ -210,10 +216,10 @@ query {
 ```js
 const getPosts = async () => {
   const posts = await payload.find({
-    collection: 'posts',
-    sort: '-createdAt',
+    collection: "posts",
+    sort: "-createdAt",
   });
 
   return posts;
-}
+};
 ```

package/docs/troubleshooting/troubleshooting.mdx

@@ -0,0 +1,25 @@
+---
+title: Troubleshooting
+label: Troubleshooting
+order: 10
+desc: Troubleshooting Common Issues in Payload
+keywords: admin, components, custom, customize, documentation, Content Management System, cms, headless, javascript, node, react, express, troubleshooting
+---
+
+## Common Issues
+
+### "Unauthorized, you must be logged in to make this request" when attempting to log in
+
+This means that your auth cookie is not being set or accepted correctly upon logging in. To resolve heck the following settings in your Payload config:
+
+- CORS - If you are using the '*', try to explicitly only allow certain domains instead including the one you have specified.
+- CSRF - Do you have this set? if so, make sure your domain is whitelisted within the csrf domains. If not, probably not the issue, but probably can't hurt to whitelist it anyway.
+- Cookie settings. If these are completely undefined, then that's fine. but if you have cookie domain set, or anything similar, make sure you don't have the domain misconfigured
+
+This error likely means that the auth cookie that Payload sets after logging in successfully is being rejected because of misconfiguration.
+
+To further investigate the issue:
+
+- Go to the login screen. Open your inspector. Go to the Network tab.
+- Log in and then find the login request that should appear in your network panel. Click the login request.
+- The login request should have a Set-Cookie header on the response, and the cookie should be getting set successfully. If it is not, most browsers generally have a little yellow ⚠️ symbol that you can hover over to see why the cookie was rejected.

package/docs/typescript/generating-types.mdx

@@ -8,7 +8,9 @@ keywords: headless cms, typescript, documentation, Content Management System, cm
 
 While building your own custom functionality into Payload, like plugins, hooks, access control functions, custom routes, GraphQL queries / mutations, or anything else, you may benefit from generating your own TypeScript types dynamically from your Payload config itself.
 
-Run the following command in a Payload project to generate types:
+### Types generatation script
+
+Run the following command in a Payload project to generate types based on your Payload config:
 
 ```
 payload generate:types
@@ -16,6 +18,46 @@ payload generate:types
 
 You can run this command whenever you need to regenerate your types, and then you can use these types in your Payload code directly.
 
+### Configuration
+
+In order for Payload to properly infer these types when using local operations, you'll need to alias the following in your tsconfig.json file:
+
+```json
+// tsconfig.json
+
+{
+  "compilerOptions": {
+    // ...
+    "paths": {
+      "payload/generated-types": [
+        "./src/payload-types.ts" // Ensure this matches the path to your typescript outputFile
+      ]
+    }
+  }
+  // ...
+}
+```
+
+#### Custom output file path
+
+You can specify where you want your types to be generated by adding a property to your Payload config:
+
+```ts
+// payload.config.ts
+
+{
+  // ...
+	typescript: {
+    // defaults to: path.resolve(__dirname, './payload-types.ts')
+		outputFile: path.resolve(__dirname, './generated-types.ts'),
+	},
+}
+```
+
+The above example places your types next to your Payload config itself as the file `generated-types.ts`.
+
+### Example Usage
+
 For example, let's look at the following simple Payload config:
 
 ```ts
@@ -74,44 +116,65 @@ export interface Post {
   title?: string;
   author?: string | User;
 }
-
 ```
 
-In order for Payload to properly infer these types when using local operations, you'll need to alias the following in your tsconfig.json file:
+### Custom Field Interfaces
 
-```json
+For `array`, `block`, `group` and named `tab` fields, you can generate top level reusable interfaces. The following group field config:
+
+```ts
 {
-  "compilerOptions": {
-    // ...
-    "paths": {
-      "payload/generated-types": [
-        "./src/payload-types.ts", // Ensure this matches the path to your typescript outputFile
-      ],
-    }
-  },
-  // ...
+  type: 'group',
+  name: 'meta',
+  interfaceName: 'SharedMeta', <-- here!!
+  fields: [
+    {
+      name: 'title',
+      type: 'text',
+    },
+    {
+      name: 'description',
+      type: 'text',
+    },
+  ],
 }
 ```
 
-#### Customizing the output path of your generated types
-
-You can specify where you want your types to be generated by adding a property to your Payload config:
+will generate:
 
 ```ts
-{
-  // the remainder of your config
-	typescript: {
-		outputFile: path.resolve(__dirname, './payload-types.ts'),
-	},
+// a top level reusable interface!!
+export interface SharedMeta {
+  title?: string;
+  description?: string;
+}
+
+// example usage inside collection interface
+export interface Collection1 {
+  // ...other fields
+  meta?: SharedMeta;
 }
 ```
 
-The above example places your types next to your Payload config itself as the file `generated-types.ts`. By default, the file will be output to your current working directory as `payload-types.ts`.
+<Banner type="warning">
+  <strong>Naming Collisions</strong>
+  <br />
+  Since these types are hoisted to the top level, you need to be aware that
+  naming collisions can occur. For example, if you have a collection with the
+  name of `Meta` and you also create a interface with the name `Meta` they will
+  collide. It is recommended to scope your interfaces by appending the field
+  type to the end, i.e. `MetaGroup` or similar.
+</Banner>
+
+### Using your types
+
+Now that your types have been generated, payloads local API will now be typed. It is common for users to want to use this in their frontend code, we recommend generating them with payload and then copying the file over to your frontend codebase. This is the simplest way to get your types into your frontend codebase.
 
 #### Adding an NPM script
 
 <Banner type="warning">
-  <strong>Important:</strong><br/>
+  <strong>Important</strong>
+  <br />
   Payload needs to be able to find your config to generate your types.
 </Banner>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payload",
-  "version": "1.8.5",
+  "version": "1.9.0",
   "description": "Node, React and MongoDB Headless CMS and Application Framework",
   "license": "MIT",
   "engines": {
@@ -147,7 +147,6 @@
     "passport-headerapikey": "^1.2.2",
     "passport-jwt": "^4.0.1",
     "passport-local": "^1.0.0",
-    "passport-local-mongoose": "^7.1.2",
     "path-browserify": "^1.0.1",
     "pino": "^6.4.1",
     "pino-pretty": "^9.1.1",
@@ -174,6 +173,7 @@
     "sass": "^1.57.1",
     "sass-loader": "^12.6.0",
     "scheduler": "^0.23.0",
+    "scmp": "^2.1.0",
     "sharp": "^0.31.3",
     "slate": "^0.91.4",
     "slate-history": "^0.86.0",

package/dist/graphql/schema/buildBlockType.d.ts

@@ -1,9 +0,0 @@
-import { Payload } from '../../payload';
-import { Block } from '../../fields/config/types';
-type Args = {
-    payload: Payload;
-    block: Block;
-    forceNullable?: boolean;
-};
-declare function buildBlockType({ payload, block, forceNullable, }: Args): void;
-export default buildBlockType;

package/dist/graphql/schema/buildBlockType.js

@@ -1,28 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const buildObjectType_1 = __importDefault(require("./buildObjectType"));
-const formatLabels_1 = require("../../utilities/formatLabels");
-function buildBlockType({ payload, block, forceNullable, }) {
-    const { slug, graphQL: { singularName, } = {}, } = block;
-    if (!payload.types.blockTypes[slug]) {
-        const formattedBlockName = singularName || (0, formatLabels_1.toWords)(slug, true);
-        payload.types.blockTypes[slug] = (0, buildObjectType_1.default)({
-            payload,
-            name: formattedBlockName,
-            parentName: formattedBlockName,
-            fields: [
-                ...block.fields,
-                {
-                    name: 'blockType',
-                    type: 'text',
-                },
-            ],
-            forceNullable,
-        });
-    }
-}
-exports.default = buildBlockType;
-//# sourceMappingURL=buildBlockType.js.map

package/dist/graphql/schema/buildBlockType.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"buildBlockType.js","sourceRoot":"","sources":["../../../src/graphql/schema/buildBlockType.ts"],"names":[],"mappings":";;;;;AAGA,wEAAgD;AAChD,+DAAuD;AAQvD,SAAS,cAAc,CAAC,EACtB,OAAO,EACP,KAAK,EACL,aAAa,GACR;IACL,MAAM,EACJ,IAAI,EACJ,OAAO,EAAE,EACP,YAAY,GACb,GAAG,EAAE,GACP,GAAG,KAAK,CAAC;IAEV,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE;QACnC,MAAM,kBAAkB,GAAG,YAAY,IAAI,IAAA,sBAAO,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QAC/D,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,IAAA,yBAAe,EAAC;YAC/C,OAAO;YACP,IAAI,EAAE,kBAAkB;YACxB,UAAU,EAAE,kBAAkB;YAC9B,MAAM,EAAE;gBACN,GAAG,KAAK,CAAC,MAAM;gBACf;oBACE,IAAI,EAAE,WAAW;oBACjB,IAAI,EAAE,MAAM;iBACb;aACF;YACD,aAAa;SACd,CAAC,CAAC;KACJ;AACH,CAAC;AAED,kBAAe,cAAc,CAAC"}