{"record":{"id":"d18224d1da4d3956","repo":"facebook/docusaurus","slug":"useblogmetadata-can-t-be-called-on-the-current-r","errorCode":null,"errorMessage":"useBlogMetadata() can't be called on the current route because the blog metadata could not be found in route context","messagePattern":"useBlogMetadata\\(\\) can't be called on the current route because the blog metadata could not be found in route context","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/docusaurus-plugin-content-blog/src/client/contexts.tsx","lineNumber":21,"sourceCode":" *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport React, {useMemo, type ReactNode, useContext} from 'react';\nimport {ReactContextError} from '@docusaurus/theme-common';\nimport useRouteContext from '@docusaurus/useRouteContext';\n\nimport type {\n  PropBlogPostContent,\n  BlogMetadata,\n} from '@docusaurus/plugin-content-blog';\n\nexport function useBlogMetadata(): BlogMetadata {\n  const routeContext = useRouteContext();\n  const blogMetadata = routeContext?.data?.blogMetadata;\n  if (!blogMetadata) {\n    throw new Error(\n      \"useBlogMetadata() can't be called on the current route because the blog metadata could not be found in route context\",\n    );\n  }\n  return blogMetadata as BlogMetadata;\n}\n\n/**\n * The React context value returned by the `useBlogPost()` hook.\n * It contains useful data related to the currently browsed blog post.\n */\nexport type BlogPostContextValue = Pick<\n  PropBlogPostContent,\n  'metadata' | 'frontMatter' | 'assets' | 'toc'\n> & {\n  readonly isBlogPostPage: boolean;\n};\n\nconst Context = React.createContext<BlogPostContextValue | null>(null);","sourceCodeStart":3,"sourceCodeEnd":39,"githubUrl":"https://github.com/facebook/docusaurus/blob/3f483e80e326cc646b54b83d564b3f0c4881b9a6/packages/docusaurus-plugin-content-blog/src/client/contexts.tsx#L3-L39","documentation":"Thrown by useBlogMetadata() when useRouteContext() returns a route whose data does not carry a `blogMetadata` field. Blog metadata is injected onto the blog list route's route context by the blog plugin; calling this hook on a route that is not the blog list (e.g. a blog post page, a non-blog page, or during SSR outside the routed tree) yields no blogMetadata and throws. Unlike the provider-based hooks, this one reads from the route context, not a React Context provider.","triggerScenarios":"Calling useBlogMetadata() inside a component rendered on a blog post page (which uses BlogPostProvider, not the list route), on a docs/page route, or in a theme layout component that renders on every page regardless of route type.","commonSituations":"Swizzling a shared layout/navbar component and dropping useBlogMetadata() in without guarding the route type; copying blog-list code into a blog post template; using the hook in a component that also renders on the homepage.","solutions":["Only call useBlogMetadata() within components rendered under the blog list route (the BlogListPage theme component and its descendants).","If the component must render on multiple route types, first check the route context / page type before calling the hook.","For blog-post-specific data, use useBlogPost() instead (which reads from BlogPostProvider).","Confirm you are not accidentally rendering the component during SSR or in a storybook/preview without the route wiring."],"exampleFix":"// before\nfunction MyComponent() {\n  const meta = useBlogMetadata(); // throws on non-list routes\n  return <span>{meta.blogTitle}</span>;\n}\n// after: guard by route, or move into BlogListPage subtree only\nfunction MyComponent() {\n  const routeContext = useRouteContext();\n  if (!routeContext?.data?.blogMetadata) return null;\n  const meta = useBlogMetadata();\n  return <span>{meta.blogTitle}</span>;\n}","handlingStrategy":"validation","validationCode":"import useRouteContext from '@docusaurus/useRouteContext';\n\nfunction useIsBlogListRoute() {\n  const routeContext = useRouteContext();\n  return Boolean(routeContext?.data?.blogMetadata);\n}\n\n// if (!useIsBlogListRoute()) return null; // before calling useBlogMetadata()","typeGuard":"const hasBlogMetadata = (\n  routeContext: ReturnType<typeof useRouteContext>,\n): boolean => Boolean(routeContext?.data?.blogMetadata);","tryCatchPattern":null,"preventionTips":["Restrict useBlogMetadata() to BlogListPage and its descendants only.","For shared components, check routeContext.data.blogMetadata before calling.","Use useBlogPost() for blog-post-page data, not useBlogMetadata()."],"tags":["react-hook","blog","route-context","swizzle"],"backgroundTag":null,"analyzedSha":"3f483e80e326cc646b54b83d564b3f0c4881b9a6","analyzedAt":"2026-08-12T13:25:04.382Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}