Page model with many content pages return empty array when I try to get contents

[Luiz]

I created a model page and five content pages of this model and I’m trying to get these content pages in nextjs but it’s returning an empty array.

I already tried builder.get(), builder.getAll and builder.getContent and none of this is working, but when I tried with especific urlPath, it’s working for example:

builder.get(‘pible-page-article’, {
userAttributes: {
urlPath: ‘/tax-pible/develop-page-test’,
},
}).toPromise()
.then(response => {
setSearchResults(response);
console.log('foi ', response)
}).catch(error => console.log('error ', error));

}, [searchTerm]);

Do we have a way to try urlPath dinamically to return all content pages?

[manish-sharma]

Hello @Luiz,

You can use builder.getAll to fetch all the pible-page-articles

Here is an example:

  const articles = await builder.getAll('pible-page-article', {
    options: { includeRefs: true },
  });

[Luiz]

Like I said, I already tried it and it doesnt’ work, it’s returning an empty array

[manish-sharma]

Hello @Luiz,

Can you share the complete code?

[Luiz]

import React, { useState, useEffect } from ‘react’;
import { Container, Input, SearchIconSection } from ‘./styles’;
import { FontAwesomeIcon } from ‘@fortawesome/react-fontawesome’;
import { faSearch } from ‘@fortawesome/free-solid-svg-icons’;
import { builder } from ‘@builder.io/react’;
import { useRouter } from ‘next/router’;

type Props = {
placeholder: string;
};

builder.init(process.env.NEXT_PUBLIC_BUILDER_API_KEY || ‘’);

function InputSearch(props: Props) {
const router = useRouter();

const [searchTerm, setSearchTerm] = useState(‘’);
const [searchResults, setSearchResults] = useState();

useEffect(() => {
/* if (searchTerm) {
builder
.getAll(‘pible-page-article’, {
limit: 100,
query: {
data: {
$or: [
{
title: { $eq: ‘dev’ },
},
],
},
},
})
.toPromise()
.then((response) => setSearchResults(response));
} */

builder.getAll('pible-page-article', { options: { includeRefs: true } })
  .then(response => {

    console.log('foi ', response)
    setSearchResults(response);
  }).catch(error => console.log('error ', error));

}, [searchTerm]);

const handleSearch = () => {
router.push(/tax-pible/${searchTerm});
};

return (

<Input
type=“text”
placeholder={props.placeholder}
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>

  <SearchIconSection onClick={handleSearch}>
    <FontAwesomeIcon icon={faSearch} />
  </SearchIconSection>

  {/*  <ul>
    {searchResults.length > 0 && searchResults.map(({ data }, index) => {
      console.log('ields ', data.title)
      return (
        <li key={index}>{data.title}</li>
      )
    })}
  </ul> */}
</Container>

);
}

export default InputSearch;

[manish-sharma]

Hello @Luiz,

Does removing the searchTerm dependency for useEffect helps?

[Luiz]

Hi @manish-sharma

Actually not.

[Luiz]

I solved the problem with “noTargeting: true” parameter in builder.getAll

builder.getAll(“my-model”, { options: { noTargeting: true }} );