From 97441e6abda7afa8458c04ab62c934bc24e9f5b6 Mon Sep 17 00:00:00 2001
From: atanasster <atanasster@gmail.com>
Date: Sun, 12 Jul 2020 10:43:10 -0400
Subject: [PATCH] feat: add seo document description

---
 core/store/src/Store/Store.ts                | 16 +++++++++++++++-
 core/store/src/types.ts                      |  1 +
 ui/app/src/App/App.tsx                       | 11 +++++++++--
 ui/blocks/src/context/block/BlockContext.tsx |  1 -
 4 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/core/store/src/Store/Store.ts b/core/store/src/Store/Store.ts
index d6b95447e..6f877ec64 100644
--- a/core/store/src/Store/Store.ts
+++ b/core/store/src/Store/Store.ts
@@ -9,6 +9,7 @@ import {
   getStoryPath,
   DocType,
   defDocType,
+  getComponentName,
 } from '@component-controls/core';
 import { BroadcastChannel } from 'broadcast-channel';
 import {
@@ -396,8 +397,21 @@ export class Store implements StoryStore {
     }
   };
   visitPage = () => {
-    if (this._analytics && typeof window !== 'undefined') {
+    if (this._analytics) {
       this._analytics.page();
     }
   };
+  getDocDescriotion = (doc: Document): string | undefined => {
+    if (doc.description) {
+      return doc.description;
+    }
+    const componentName = getComponentName(doc.component);
+    if (componentName) {
+      const component = this.loadedStore?.components[componentName];
+      if (component?.info?.description) {
+        return component.info.description;
+      }
+    }
+    return doc.title;
+  };
 }
diff --git a/core/store/src/types.ts b/core/store/src/types.ts
index 75f630b2a..24d3508c7 100644
--- a/core/store/src/types.ts
+++ b/core/store/src/types.ts
@@ -46,6 +46,7 @@ export interface StoryStore {
   addObserver: (observer: StoreObserver) => void;
   removeObserver: (observer: StoreObserver) => void;
   visitPage: () => void;
+  getDocDescriotion: (doc: Document) => string | undefined;
 }
 
 export const UPDATE_STORY_MSG = 'component_controls_update_story';
diff --git a/ui/app/src/App/App.tsx b/ui/app/src/App/App.tsx
index b68109785..8936d6208 100644
--- a/ui/app/src/App/App.tsx
+++ b/ui/app/src/App/App.tsx
@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { FC, Fragment, useContext } from 'react';
+import { FC, Fragment, useContext, useEffect } from 'react';
 import { jsx, Box } from 'theme-ui';
 import { SkipLinks, SkiLinksItemProps } from '@component-controls/components';
 import { BlockContext } from '@component-controls/blocks';
@@ -40,9 +40,16 @@ export const App: FC<AppProps> = ({ title = '', children }) => {
   }
   const titleParts = title ? title.split('/') : [''];
   const pageTitle = titleParts[titleParts.length - 1];
+  const pageDescription = doc
+    ? storeProvider.getDocDescriotion(doc)
+    : undefined;
+  useEffect(() => {
+    storeProvider.visitPage();
+  }, [storeProvider]);
+
   return (
     <Fragment>
-      <SEO title={pageTitle} />
+      <SEO title={pageTitle} description={pageDescription} />
       <SkipLinks items={items} />
       <Box variant="app">
         <Header toolbar={toolbar} />
diff --git a/ui/blocks/src/context/block/BlockContext.tsx b/ui/blocks/src/context/block/BlockContext.tsx
index 5b237c76d..195b58651 100644
--- a/ui/blocks/src/context/block/BlockContext.tsx
+++ b/ui/blocks/src/context/block/BlockContext.tsx
@@ -69,7 +69,6 @@ export const BlockContextProvider: React.FC<BlockContextInputProps> = ({
     storyId =
       doc && doc.stories && doc.stories.length ? doc.stories[0] : undefined;
   }
-  store.visitPage();
   return (
     <RecoilRoot>
       <ErrorBoundary>