Webpack Error with @payloadcms/plugin-search (Beta 21)

[hatchli]

Something (I believe depth) has changed with the search plugin from its 2.0 version to the latest 3.0 beta.

To reproduce, simply create a new Restaurant in the Restaurants collection - theoretically, the search plugin is supposed to create a zero-depth search-optimized collection representing that restaurant. While the plugin succeeds in creating an object, the searchOverrides appear to fail: the city and citySlug fields fail while also returning the above Webpack error (which shouldn't exist in 3.0). Additionally, trying to open any of the Search Results collection causes a crash.

The error below logs out constantly when navigating around the Admin Panel, but doesn't to seem cause any problems, so I've generally ignored it:

 ⨯ node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_avlgtmrux6d4uu4nxa4264tz4u/node_modules/@payloadcms/plugin-search/dist/Search/ui/index.js (5:30) @ LinkToDoc
 ⨯ TypeError: (0 , _payloadcms_ui_forms_Form__WEBPACK_IMPORTED_MODULE_0__.useWatchForm) is not a function
    at stringify (<anonymous>)
digest: "1307261427"
  3 | import React from 'react';
  4 | export const LinkToDoc = ()=>{
> 5 |     const form = useWatchForm();
    |                              ^
  6 |     const fields = form.fields;
  7 |     const { doc: { value: { relationTo, value: docId } } } = fields;
  8 |     const config = useConfig();

This is how I configure the search plugin in the payload config, which worked just fine in 2.0:

    search({
      collections: ['restaurants'],
      searchOverrides: {
        fields: [
          { name: 'city', type: 'text' },
          { name: 'citySlug', type: 'text' },
          { name: 'slug', type: 'text' },
        ],
      },
      beforeSync: ({ searchDoc, originalDoc }) => {
        console.log('searchDoc', searchDoc, 'originalDoc', originalDoc)
        const returnDoc = {
          ...searchDoc,
          city: originalDoc?.city?.name,
          citySlug: originalDoc?.city?.slug,
          title: originalDoc?.name,
          slug: originalDoc?.slug,
        }
        return returnDoc
      },
    }),

This is how it appears in the admin panel, where you can see the 2.0 entries that succeeded with the same config, and the failed 3.0beta21 entry

Doing an additional payload call on the assumption that the depth of the query changed fixes the searchOverrides issue:

search({
      collections: ['restaurants'],
      searchOverrides: {
        fields: [
          { name: 'city', type: 'text' },
          { name: 'citySlug', type: 'text' },
          { name: 'slug', type: 'text' },
        ],
      },
      beforeSync: async ({ searchDoc, originalDoc, payload }) => {
        console.log('searchDoc', searchDoc, 'originalDoc', originalDoc)
        const { slug: citySlug, name: cityName } = await payload.findByID({
          collection: 'cities',
          id: originalDoc?.city,
        })
        const returnDoc = {
          ...searchDoc,
          city: cityName,
          citySlug: citySlug,
          title: originalDoc?.name,
          slug: originalDoc?.slug,
        }
        return returnDoc
      },
    }),

Notably the webpack error persists despite the above fix, and clicking any search item causes the admin panel to crash with the console logging that same aforementioned webpack error followed by this TypeError:

[20:23:49] ERROR: There was an error building form state
    err: {
      "type": "TypeError",
      "message": "Cannot destructure property 'collectionSlug' of 'reqData' as it is undefined.",
      "stack":
          TypeError: Cannot destructure property 'collectionSlug' of 'reqData' as it is undefined.
              at Object.buildFormState [as form-state] (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_next@_hkmzhwv2pfhwxpo272ueu2xx7e/node_modules/@payloadcms/next/dist/routes/rest/buildFormState.js:35:17)
              at eval (webpack-internal:///(rsc)/./node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected]_next@_hkmzhwv2pfhwxpo272ueu2xx7e/node_modules/@payloadcms/next/dist/routes/rest/index.js:537:55)
              at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
              at async /Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/next-server/app-route-experimental.runtime.dev.js:6:54186
              at async e_.execute (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/next-server/app-route-experimental.runtime.dev.js:6:45421)
              at async e_.handle (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/compiled/next-server/app-route-experimental.runtime.dev.js:6:55440)
              at async doRender (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1364:42)
              at async cacheEntry.responseCache.get.routeKind (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1578:40)
              at async DevServer.renderToResponseWithComponentsImpl (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1498:28)
              at async DevServer.renderPageComponent (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1915:24)
              at async DevServer.renderToResponseImpl (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1953:32)
              at async DevServer.pipeImpl (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:900:25)
              at async NextNodeServer.handleCatchallRenderRequest (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/next-server.js:273:17)
              at async DevServer.handleRequestImpl (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:796:17)
              at async /Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:339:20
              at async Span.traceAsyncFn (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/trace/trace.js:157:20)
              at async DevServer.handleRequest (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:336:24)
              at async invokeRender (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:174:21)
              at async handleRequest (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:353:24)
              at async requestHandlerImpl (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:377:13)
              at async Server.requestListener (/Users/wade/Git/payload-3.0-demo/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/next/dist/server/lib/start-server.js:142:13)
    }

I've sent @paulpopus the repro and dm'd him the env file for reproduction.

[siobahnschuck]

@hatchli @paulpopus Is there any update on this? I am currently trying to enable the search plugin on version 3.0.0-beta.24 and am seeing both these errors in addition to an empty search results index in the admin dash.

[paulpopus]

This should no longer be an issue on the latest beta from my testing just now. If it persists let me know though!

[hatchli]

Thanks Paul! Sadly I can't test this as a necessary package my in my project can't go React 15 yet. But, for future projects I'll be sure to report here if this issue stands! Thanks for following up and taking care of this!

[github-actions]

This issue has been automatically locked.
Please open a new issue if this issue persists with any additional detail.