Using custom list preview with prepare in sanity schema fails production build

Question

I am fairly new with next.js, typescript and sanity, and so far everything was going fine. I have multiple schemas defined in my project and it runs fine in development. linting checks do not return any errors too, but when I try to deploy to vercel build fails with error:

\`Failed to compile.
./src/pages/admin/\[\[...index\]\].tsx:12:19
Type error: Type '{ dataset: string; apiVersion: string; basePath: string; title: string; projectId: string; plugins: PluginOptions\[\]; schema: { types: ({ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<...\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 ...' is not assignable to type 'Config'.
Type '{ dataset: string; apiVersion: string; basePath: string; title: string; projectId: string; plugins: PluginOptions\[\]; schema: { types: ({ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<...\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 ...' is not assignable to type 'SingleWorkspace'.
Type '{ dataset: string; apiVersion: string; basePath: string; title: string; projectId: string; plugins: PluginOptions\[\]; schema: { types: ({ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<...\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 ...' is not assignable to type 'Omit\<WorkspaceOptions, "name" | "basePath"\>'.
The types of 'schema.types' are incompatible between these types.
Type '({ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<Omit\<SVGProps\<SVGSVGElement\>, "ref"\> & RefAttributes\<SVGSVGElement\>\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 more ... | { ...; })\[\]' is not assignable to type 'SchemaTypeDefinition\[\] | ComposableOption\<SchemaTypeDefinition\[\], Omit\<ConfigContext, "schema" | "currentUser" | "getClient" | "client"\>\> | undefined'.
Type '({ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<Omit\<SVGProps\<SVGSVGElement\>, "ref"\> & RefAttributes\<SVGSVGElement\>\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 more ... | { ...; })\[\]' is not assignable to type 'SchemaTypeDefinition\[\]'.
Type '{ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<Omit\<SVGProps\<SVGSVGElement\>, "ref"\> & RefAttributes\<SVGSVGElement\>\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; } | ... 4 more ... | { ...; }' is not assignable to type 'SchemaTypeDefinition'.
Type '{ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<Omit\<SVGProps\<SVGSVGElement\>, "ref"\> & RefAttributes\<SVGSVGElement\>\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; }' is not assignable to type 'SchemaTypeDefinition'.
Type '{ name: string; type: string; title: string; icon: ForwardRefExoticComponent\<Omit\<SVGProps\<SVGSVGElement\>, "ref"\> & RefAttributes\<SVGSVGElement\>\>; groups: { ...; }\[\]; fields: ({ ...; } | ... 7 more ... | { ...; })\[\]; preview: { ...; }; }' is not assignable to type 'TypeAliasDefinition\<string, "string" | "number" | "boolean" | "object" | "document" | "url" | "slug" | "image" | "array" | "block" | "text" | "email" | "reference" | "datetime" | "date" | "file" | "geopoint" | "crossDatasetReference"\>'.
The types of 'preview.prepare' are incompatible between these types.
Type '(selection: { title: string; index: number; inSlides: boolean; inRestaurants: boolean; img: string; }) =\> { title: string; media: string; subtitle: string; }' is not assignable to type '(value: Record\<string, any\>, viewOptions?: PrepareViewOptions | undefined) =\> PreviewValue'.
Types of parameters 'selection' and 'value' are incompatible.
Type 'Record\<string, any\>' is missing the following properties from type '{ title: string; index: number; inSlides: boolean; inRestaurants: boolean; img: string; }': title, index, inSlides, inRestaurants, img
10 |         \<NextStudioHead /\>
11 |       \</Head\>

> 12 |       \<NextStudio config={config} /\>;
> |                   ^
> 13 |     \</\>
> 14 |   );
> 15 | }
> Error: Command "npm run build" exited with 1
> Deployment completed
> BUILD_UTILS_SPAWN_1: Command "npm run build" exited with 1\`

I narrowed the problem to the preview part of the schema:

    `preview: {
        select: {
          title: "name",
          index: "visibility.index",
          inSlides: "visibility.inSlides",
          inRestaurants: "visibility.inRestaurants",
          img: "logo",
        },
        prepare(selection: {
          title: string;
          index: number;
          inSlides: boolean;
          inRestaurants: boolean;
          img: string;
        }) {
          return {
            title: selection.title,
            media: selection.img,
            subtitle: `POS:${selection.index}, Slide:${
              selection.inSlides ? "🟢" : "🔴"
            }, List:${selection.inRestaurants ? "🟢" : "🔴"}`,
          };
        },
      },

without the preview code, everything deploys as expected. In development project works, and runs fine with above code included: And custom schema preview works without any issues.

I am using integrated sanity studio in nextjs page:

config:

I understand that some types are incompatible but have no idea how to adjust it / make it compatible, as it looks like all of my code is written according to the manuals I found and even works in dev environment. Any help would be appreciated.

Answer 1

Exact same issue for me, in same stack/context.

Types errors came form this exact part of the code :

prepare(selection: {
      title: string;
          index: number;
          inSlides: boolean;
          inRestaurants: boolean;
          img: string;
    })

which I turned to :

prepare(value: Record<string, any>)

To avoid types errors at build time.