The ContentService is used to get the data of the base theme configured in Admin Panel. You can import the ContentService from the experro-storefront package.
import { ContentService } from 'experro-storefront';
Here is a list of functions that the ContentService provides.
  1. getSingleTypeContent
  2. getCollectionRecordsByCollectionInternalName
  3. getCollectionTypeContentById
  4. getMenuById
  5. getContentModelRecordsByFieldKeyValue

getSingleTypeContent

This function returns the single type data. This function accepts an object with modelName as the property.
const single_type_data = getSingleTypeContent({modelName : 'globalSettings'});

getCollectionRecordsByCollectionInternalName

This function returns the record list by id, versionId, modelName, and componentId.
const collectionData = getCollectionRecordsByCollectionInternalName({ modelInternalName: "collection_data_internal_name: });
If you’re fetching the “zig zag banner”, then will get a response similar to shown below.
{
  content_model_id: "a5d01c39-202f-45a9-b9f6-49b3e0a63b8c", 
  content_model_name: "Home Zig zag banner",
  current_version_id: "197fbd97-faad-44dc-a823-de72b806e4c8-2",
  current_version_name: "#2",
  id: "197fbd97-faad-44dc-a823-de72b806e4c8",
  title: "Headless CMS"
}

getCollectionTypeContentById

This function returns the collection type by content id. This function accepts an object with the properies you get from getCollectionRecordsByCollectionInternalName function call.
const collectionDataById = await ContentService.getCollectionTypeContentById({
  id: '197fbd97-faad-44dc-a823-de72b806e4c8',
  versionId: '197fbd97-faad-44dc-a823-de72b806e4c8-2',
  modelName: 'modal_name',
  componentId: 'component_id',
  ssrKey: `${id}-'example-ssr`,
  enableSSR: true,
});
The id in ssrKey should be any unique value for each API call. If same duplicate id is found, it may behave differently.

getMenuById

This function returns menu or navigation created in Admin Panel. This function accept menuId.
const menuDataResponse = await ContentService.getMenuById(menuId);

getContentModelRecordsByFieldKeyValue

This function returns all the records by the model internal name. If you’ve created the “zig zag banner”, with this method, you’ll get all the records for this “zig zag banner” as an array of objects contains data for the “zig zag banner”.
const zig_zag_banner_records =
  ContentService.getContentModelRecordsByFieldKeyValue({
    modelInternalName: 'zig_zag_banner',
    fieldKey: 'id',
    fieldValue: '*',
    fieldsToQuery: '',
  });
To fetch the specific data, we can mention the name of the fields in fieldsToQuery e.g.,
fieldsToQuery: 'title_text_et,banner_description_et,button_layout_com,pop_up_com'
Following are the list of other options that you can pass with this method.
PropertyDescriptionType
sortByField to sort by.String
sortTypeThe direction to sort ascending or descending as ASC or DESC.String
limitNumber of records you want to fetch.Number
skipNumber of records you want to skip.Number
Note: The following properties need to be used together: sortBy and sortType limit and skip