Getting stream data from directory manager

Hi Yext team,

We are building a project using React Typescript and we are struggling to get a stream object back when trying to define data created by the directory manager.

After running “npm run dev”, it does not create the new stream objects. Looking at the readMe file, the features.json file should have updated with changes but it has remained the same.

Code of stream config in our directory root page:

export const config: TemplateConfig = {
  stream: {
    $id: "root",
    filter: {
      savedFilterIds: ["1248669922"],
    },
    fields: ["id", "uid", "meta", "name", "slug", "address"],
    localization: {
      locales: ["en"],
      primary: false,
    },
  },
};

We have been successfully in defining and returning the location data.

Also seems like we cannot change the id of the stream for the locations data, by default is it “my-stream-id-1”. We have tried to change this id in the TemplateConfig but it does not seem to update. Not sure if these are related issues.

Code of stream config in location page:

export const config: TemplateConfig = {
  stream: {
    $id: "locations-data",
    // Specifies the exact data that each generated document will contain. This data is passed in
    // directly as props to the default exported function.
    fields: [
      "id",
      "uid",
      "meta",
      "name",
      "address",
      "mainPhone",
      "description",
      "hours",
      "slug",
      "geocodedCoordinate",
      "services",
      "googlePlaceId",
    ],
    // Defines the scope of entities that qualify for this stream.
    filter: {
      savedFilterIds: ["1239394440"],
    },
    // The entity language profiles that documents will be generated for.
    localization: {
      locales: ["en"],
      primary: false,
    },
  },
};

Any advice or pointers we are missing in order to get the data through?

Many thanks,
Steven

1 Like

Hi Steven,

For future inquiries, please include all relevant error messages to help us better advise.
After digging into your code, it turns out this was due to the following error in your code:

ReferenceError: window is not defined

Browser globals, such as window or document, aren’t available during server-side rendering.

To fix this, switch your API request from Axios to fetch and this will solve the problem!

Best,
Luc