Custom multi-select example should use a JSON type field

[tkrotoff]

Instead of using a text field type and hacking value by transforming JSON into a string and vice-versa, use a JSON type field: https://payloadcms.com/docs/beta/fields/json

• https://github.com/JessChowdhury/custom-select/blob/697c15f197f5f2f9a08b9ef2700460e8bd13261c/src/fields/customSelectHasMany/field.ts#L6
• https://github.com/JessChowdhury/custom-select/blob/697c15f197f5f2f9a08b9ef2700460e8bd13261c/src/fields/customSelectHasMany/component.tsx#L34-L37
• https://github.com/JessChowdhury/custom-select/blob/697c15f197f5f2f9a08b9ef2700460e8bd13261c/src/fields/customSelectHasMany/field.ts#L16-L17

Example with a list of string:

import type { CollectionConfig } from "payload";

import { SelectCategories } from "./SelectCategories";

export const Banners: CollectionConfig = {
  slug: "banners",
  fields: [
    {
      name: "categories",
      type: "json",
      admin: { components: { Field: SelectCategories } },
      // The JSON Schema makes Payload generates the proper TypeScript types in payload-types.ts
      jsonSchema: {
        // Why? https://github.com/payloadcms/payload/issues/6737
        uri: "_",
        fileMatch: ["_"],
        schema: {
          type: "array",
          items: { type: "string" },
        },
      },
    },
  ],
};

"use client";

import { useField } from "@payloadcms/ui";

export function SelectCategories() {
  const { value, setValue } = useField<string[]>({});
  ...
}