Data connectors are High Order Components composed with GraphQL queries. You can connect them with other components to fetch data.

You can write your own connectors and specify the exact fields that you want to fetch.

The various data connectors available are:

SettingsData

This connector can be used to fetch the settings of your site. This is already available as props in your theme's root component Layout.js.

input props:

none

output props:

{
   "settings":{         "loading":true | false,       "data":{}
  }
}

data will be on object containing the below keys. You can get the value of any key using

settings.data[key].value

All these values are configuration from the Admin Dashboard.

site_title site_taglinesite_emailsite_urlsite_footersite_descriptionpost_displaylayout_displaysocial_twittersocial_facebooksocial_instagramsocial_githubtext_notfoundtext_posts_emptysidebar_latest_post_countsidebar_aboutmenucsslocalethemebannerdisplayAuthorInfodisqus_id

site_logogoogle_analyticseditor

PostsData

Used to fetch multiple posts. You should use this to connect to a component responsible for rendering more than one post. Generally, users will be adding a common category in relevant posts to group them together and then add this category in the menu. To display such posts this connector can be used.

SinglePageData.js

This connector can be used to get data of a Page by passing the slug as a prop.

SinglePostData.js

This connector can be used to fetch data of a Post by passing the slug as a prop.

AdjacentPostData.js

This connector can be used to fetch data of adjacent posts by passing the slug of a post as a prop.

"settings":{         "loading":true      | false,       "data":{            "site_title":{               "option":"site_title",             "value":"Letterpad",             "__typename":"Setting"          },          "site_tagline":{               "option":"site_tagline",             "value":"Compose a story",             "__typename":"Setting"          },          "site_email":{               "option":"site_email",             "value":"",             "__typename":"Setting"          },          "site_url":{               "option":"site_url",             "value":"",             "__typename":"Setting"          },          "site_footer":{               "option":"site_footer",             "value":"Powered by Letterpad <br>\nTheme: Document",             "__typename":"Setting"          },          "site_description":{               "option":"site_description",             "value":"",             "__typename":"Setting"          },          "post_display":{               "option":"post_display",             "value":"row",             "__typename":"Setting"          },          "layout_display":{               "option":"layout_display",             "value":"two-column",             "__typename":"Setting"          },          "social_twitter":{               "option":"social_twitter",             "value":"",             "__typename":"Setting"          },          "social_facebook":{               "option":"social_facebook",             "value":"",             "__typename":"Setting"          },          "social_instagram":{               "option":"social_instagram",             "value":"",             "__typename":"Setting"          },          "text_notfound":{               "option":"text_notfound",             "value":"Sorry, we went deep inside, but found nothing",             "__typename":"Setting"          },          "text_posts_empty":{               "option":"text_posts_empty",             "value":"Sorry, we couldn't find any posts",             "__typename":"Setting"          },          "sidebar_latest_post_count":{               "option":"sidebar_latest_post_count",             "value":"3",             "__typename":"Setting"          },          "sidebar_about":{               "option":"sidebar_about",             "value":"You can fill up this space by writing a short bio about yourself or about your site..",             "__typename":"Setting"          },          "menu":{               "option":"menu",             "value":"[]",             "__typename":"Setting"          },          "css":{               "option":"css",             "value":"dcac",             "__typename":"Setting"          },          "locale":{               "option":"locale",             "value":"{\"en\":true,\"fr\":false,\"pl\":false}",             "__typename":"Setting"          },          "theme":{               "option":"theme",             "value":"document",             "__typename":"Setting"          },          "banner":{               "option":"banner",             "value":"/uploads/file-1522239405836.jpg",             "__typename":"Setting"          },          "displayAuthorInfo":{               "option":"displayAuthorInfo",             "value":"1",             "__typename":"Setting"          },          "disqus_id":{               "option":"disqus_id",             "value":"",             "__typename":"Setting"          },          "site_logo":{               "option":"site_logo",             "value":"/uploads/file-1528828932355.png",             "__typename":"Setting"          },          "social_github":{               "option":"social_github",             "value":"",             "__typename":"Setting"          },          "google_analytics":{               "option":"google_analytics",             "value":"UA-120251616-1",             "__typename":"Setting"          },          "editor":{               "option":"editor",             "value":"richtext",             "__typename":"Setting"          }       }    }