Search function problem in Frontity Chakra Theme

šŸ™‹Get Help
1

Thanks for this amazing frontity theme.
I have a little problem in search function. You can test?

Blank page when triying to search and see this in console:

  TypeError: Cannot destructure property `title` of 'undefined' or 'null'.
      at SecondaryPostPreview (webpack-internal:///./packages/frontity-chakra-theme/src/components/featured-post/featured-post.js:13:2258)
      at processChild (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:480:2385)
      at resolve (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:479:122)
      at ReactDOMServerRenderer.render (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:516:1153)
      at ReactDOMServerRenderer.read (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:516:55)
      at renderToString (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:555:116)
      at eval (webpack-internal:///./node_modules/@frontity/core/src/server/index.tsx:45:243)
      at processTicksAndRejections (internal/process/task_queues.js:93:5)
      at eval (webpack-internal:///./node_modules/koa-mount/index.js:16:290)

Someone have same problem? Thankyou!

4

Iā€™ve been taking a look at it and I think Iā€™ve been able to reproduce the problem. Is something that just happens with the search function or with the whole theme?

I think that the error may be caused because you are pointing to a WordPress with just one post. The theme expects a second and a third post to show in the lists of posts, and as it doesnā€™t find it, it returns that error.

Iā€™ve tested that and it returned the same error you mention. Could you confirm if thatā€™s your case?

Iā€™ve opened an issue at chakra repo, you can subscribe to it here, but if thatā€™s your case just adding more posts should solve the problem.

Let us know if that helps :slightly_smiling_face:

6

I also have a problem with the search function in Chakra theme.
When I set in the frontity.settings.js the homepage and postsPage by the wp-source plugin, like:

{
  name: "@frontity/wp-source",
  state: {
    source: {
      ...
      homepage: "/home",
      postsPage: "/news",
    }
  }
}

then I get the following error by using the search, and a blank page:

TypeError: data.items is undefined
archive.module.js line 35 > eval:13:1204
    Archive archive.js:44
    apply self-hosted:1875
    runAsReaction reactionRunner.js:55
    reaction observer.js:11
    ReactiveComp connect.js:70
    React 6
    batch scheduler.js:10
    batchedUpdates$1 React
    batch scheduler.js:10
    batched scheduler.js:25
    React 6
    performSyncWorkOnRoot self-hosted:920
    flushSyncCallbackQueueImpl React
    unstable_runWithPriority scheduler.development.js:697
    React 4
    batch scheduler.js:10
    batched scheduler.js:25
    (Async: promise callback)
    apply self-hosted:1875
    apply scheduler.js:42
    loadAsync loadable.esm.js:217
    componentDidMount loadable.esm.js:147
    React 3
    batch scheduler.js:10
    batchedUpdates$1 React
    batch scheduler.js:10
    batched scheduler.js:25
    React 3
    commitRootImpl self-hosted:975
    unstable_runWithPriority scheduler.development.js:697
    React 4
    performSyncWorkOnRoot self-hosted:920
    flushSyncCallbackQueueImpl React
    unstable_runWithPriority scheduler.development.js:697
    React 4
    batch scheduler.js:10
    batched scheduler.js:25
    (Async: promise callback)
    apply self-hosted:1875
    apply scheduler.js:42
    asyncGeneratorStep actions.ts:6
    _next actions.ts:6
    _asyncToGenerator actions.ts:6
    _asyncToGenerator actions.ts:6
    fetch actions.ts:12
    convertToAction create-store.js:27
    set actions.ts:18
    convertToAction create-store.js:27
    onSubmit useSearch.js:22
    callCallback React
    batch scheduler.js:10
    batchedUpdates$1 React
    batch scheduler.js:10
    batched scheduler.js:25
    React 14
The above error occurred in one of your React components:
    in Unknown (created by InnerLoadable)
    in InnerLoadable (created by Context.Consumer)
    in Unknown (created by ForwardRef)
    in ForwardRef
    in div (created by Context.Consumer)
    in Box
    in Unknown
    in main (created by Context.Consumer)
    in Box
    in ThemeProvider (created by ThemeProvider)
    in ThemeProvider
    in Unknown (created by App)
    in HelmetProvider (created by App)
    in App

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
7

Hey guys, maybe you can clone the Chakra repo in your local machine (https://github.com/chakra-ui/frontity-chakra-ui-theme) try to reproduce the bug, find the source of the problem and do a PR with the fix.

Iā€™m sure it shouldnā€™t be difficult :smile:

8

Hey @luisherranz, I tried it and did it :slight_smile: This is my very first PR in my lifeā€¦

1 Like
9

Looks great to me! :smile:

Iā€™ve left a small review on a change I think should be made.

I donā€™t have permissions on that repo to merge it and do a release but Iā€™m sure @Segun will check it out soon :slight_smile: