# Not all data when navigating to a page using same template

**URL:** <https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003>\
**Category:** Technical Questions\
**Created:** [September 20, 2021, 7:07pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003 "2021-09-20T19:07:27Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![niftycode](https://avatars.discourse-cdn.com/v4/letter/n/c5a1d2/32.png) [@niftycode](https://forum.builder.io/u/niftycode)\
**Post date:** [September 20, 2021, 7:07pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/1 "2021-09-20T19:07:27Z")

</div>

Hi

I have a staging site deployed at [Home | Joe Fizz Asset Finance Ltd](https://staging--joefizz.netlify.app/;) when I navigate to a page using the same template, not all the data is changing. I am asking this question here because I have another Next.js site using a different CMS and I don’t get this issue.

Here is the page code:

```auto
import React from 'react';

import { builder, BuilderComponent } from '@builder.io/react';
import BuilderPage from 'builder/Page';

import { get, includes, map, reject, trimStart } from 'lodash';
import { Helmet } from 'react-helmet';

import * as models from 'utils/models';

import Aos from 'vendor/Aos';
import Layout from 'layouts/Layout';
import Regions from 'regions';

const Page = ({ data }) => {
	const slug = trimStart(get(data, 'url'), '/');

	let bodyClass;
	switch (slug) {
		case 'insights':
			bodyClass = 'posts';
			break;
		case 'case-studies':
			bodyClass = 'projects';
			break
		default:
			bodyClass = slug;
	}

	// console.log('Debug page [slug]:', data);

	return (
		<BuilderPage>
			<Aos>
				<Helmet>
					<body className={`p-${bodyClass}`} itemScope itemType="http://schema.org/WebPage" />
				</Helmet>

				<Layout data={data}>
					<BuilderComponent
						model="page"
						data={{
							...(get(data, 'articles') && { articles: get(data, 'articles')}),
							...(get(data, 'certifications') && { certifications: get(data, 'certifications')}),
							...(get(data, 'events') && { events: get(data, 'events')}),
							...(get(data, 'jobs') && { jobs: get(data, 'jobs')}),
							organisation: get(data, 'organisation'),
							...(get(data, 'patrons') && { patrons: get(data, 'patrons')}),
							...(get(data, 'people') && { people: get(data, 'people')}),
							...(get(data, 'posts') && { posts: get(data, 'posts')}),
							...(get(data, 'products') && { products: get(data, 'products')}),
							...(get(data, 'projects') && { projects: get(data, 'projects')}),
							...(get(data, 'recipes') && { recipes: get(data, 'recipes')}),
							...(get(data, 'reviews') && { reviews: get(data, 'reviews')}),
							...(get(data, 'services') && { services: get(data, 'services')}),
							...(get(data, 'stockists') && { stockists: get(data, 'stockists')}),
						}}
					/>
				</Layout>
			</Aos>
		</BuilderPage>
	);
};

export const getStaticPaths = async () => {
	try {
		let pages = await builder.getAll('page', {
			options: {
				fields: 'data.url',
				noTargeting: true,
			}
		});

		pages = reject(pages, page => {
			return page.data.url === '/';
		});

		// console.log('Debug pages:', pages);

		const paths = map(pages, page => get(page, ['data', 'url']));

		// console.log('Debug paths:', paths);

		return { paths, fallback: false };
	} catch (error) {
		console.error(error);
		return null;
	}
};

export const getStaticProps = async context => {
	try {
		const { slug = '' } = context.params;

		console.log(slug);

		const { data } = await builder.get('page', { url: `/${slug}` }).promise();

		if (includes(get(data, 'models'), 'article')) {
			data.articles = await models.getArticle(slug !== 'articles' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'certification')) {
			data.certifications = await models.getCertification();
		}

		if (includes(get(data, 'models'), 'event')) {
			data.events = await models.getEvent(slug !== 'events' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'job')) {
			data.jobs = await models.getJob(slug !== 'jobs' ? 6 : null);
		}

		data.menus = await models.getMenu();

		data.organisation = await models.getOrganisation();

		if (includes(get(data, 'models'), 'patron')) {
			data.patrons = await models.getPatron();
		}

		if (includes(get(data, 'models'), 'person')) {
			data.people = await models.getPerson(slug !== 'people' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'post')) {
			data.posts = await models.getPost(slug !== 'insights' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'product')) {
			data.products = await models.getProduct(slug !== 'products' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'project')) {
			data.projects = await models.getProject(slug !== 'case-studies' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'recipe')) {
			data.recipes = await models.getRecipe(slug !== 'recipes' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'review')) {
			data.reviews = await models.getReview(slug !== 'reviews' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'service')) {
			data.services = await models.getService(slug !== 'services' ? 6 : null);
		}

		if (includes(get(data, 'models'), 'stockist')) {
			data.stockists = await models.getStockist();
		}

		// console.log('Debug data:', data);

		return { props: { data } };
	} catch (error) {
		console.error(error);
		return { props: null };
	}
};

export default Page;

```

The URL in the browser updates, the pageClass updates and title in the browser tab updates but the page content remains the same, so potentially the BuilderComponent is nopt updating?

Cheers

Peter

---

<div class="post-metadata">

**Author:** ![steve](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/steve/32/78_2.png) [@steve](https://forum.builder.io/u/steve)\
**Post date:** [September 22, 2021, 4:10pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/2 "2021-09-22T16:10:15Z")

</div>

Thanks for sharing @niftycode. Is there any chance you can provide a minimal reproducable example in [codesandbox](https://codesandbox.io/)? Theres a couple details here I’m fuzzy on but if we can see the issue directly I believe we can diagnose it very quickly for you

---

<div class="post-metadata">

**Author:** ![niftycode](https://avatars.discourse-cdn.com/v4/letter/n/c5a1d2/32.png) [@niftycode](https://forum.builder.io/u/niftycode)\
**Post date:** [September 22, 2021, 5:06pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/3 "2021-09-22T17:06:40Z")

</div>

Hi Steve

Never used Sandbox before so not 100% sure if what I have done is correct.

I think I have included everything to run a minimum example.

Here is the link [https://codesandbox.io/s/builder-nefsu](https://codesandbox.io/s/builder-nefsu).

If this is no good or you need more, I am happy to share by GitHub repo with you.

One thing I did notice in the next.config.js I have a RunTime cache setting … however this exists on the site that has no issues.

---

<div class="post-metadata">

**Author:** ![aziz](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/aziz/32/2551_2.png) [@aziz](https://forum.builder.io/u/aziz)\
**Post date:** [September 22, 2021, 6:55pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/4 "2021-09-22T18:55:48Z")

</div>

Hi @niftycode , trying to investigate the issue but I’m seeing this error on the codesanbox you sent:

 ![Screen Shot 2021-09-22 at 11.54.22 AM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/1X/a678a26bc5f3eb7c312295b63d46ec969140ab6b.png)

---

<div class="post-metadata">

**Author:** ![niftycode](https://avatars.discourse-cdn.com/v4/letter/n/c5a1d2/32.png) [@niftycode](https://forum.builder.io/u/niftycode)\
**Post date:** [September 22, 2021, 9:57pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/5 "2021-09-22T21:57:47Z")

</div>

Ok, I have updated and am now getting the compiled successfully message.

---

<div class="post-metadata">

**Author:** ![aziz](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/aziz/32/2551_2.png) [@aziz](https://forum.builder.io/u/aziz)\
**Post date:** [September 22, 2021, 11:48pm UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/6 "2021-09-22T23:48:13Z")

</div>

@niftycode

I see you’re getting the page content in `getStaticProps` but only picking the `data` prop, which is omitting key informations from the `BuilderComponent` like (`id`, `query` , `variations` , `testRatios` , … etc )

Do this change and it should fix your navigations issues and render the content on the server as well (right now it’s not)

in `getStaticProps`:

```auto
    const fullContent = await builder.get("page", { url: ... }).promise();
    const { data } = fullContent;

   // do your processing then return
    return { props: { data, fullContent } };

```

and in the page component:

```auto
// get fullContent from static props
const Page = ({ data, fullContent }) => {
 // and pass it to BuilderComponent
        <BuilderComponent
          content={fullContent}

```

---

<div class="post-metadata">

**Author:** ![niftycode](https://avatars.discourse-cdn.com/v4/letter/n/c5a1d2/32.png) [@niftycode](https://forum.builder.io/u/niftycode)\
**Post date:** [September 23, 2021, 9:41am UTC](https://forum.builder.io/t/not-all-data-when-navigating-to-a-page-using-same-template/1003/7 "2021-09-23T09:41:53Z")

</div>

Hi Aziz

That’s fixed the issue, thank you.
