#455 - Show a description for the SEO section

CHANGELOG.md

@@ -21,6 +21,7 @@
 
 - [#431](https://github.com/estruyf/vscode-front-matter/issues/431): Performance improvements for the content dashboard
 - [#448](https://github.com/estruyf/vscode-front-matter/issues/448): Retrieving files fails when content folder name and workspace folder name are the same
+- [#455](https://github.com/estruyf/vscode-front-matter/issues/455): Show a description for the SEO section when title nor description is set
 
 ### 🐞 Fixes
 

src/panelWebView/components/SeoStatus.tsx

@@ -44,10 +44,6 @@ const SeoStatus: React.FunctionComponent<ISeoStatusProps> = ({ data, seo, focusE
     }, 10);
   }, [title, data[descriptionField], data?.articleDetails?.wordCount]);
 
-  if (!title && !data[descriptionField]) {
-    return null;
-  }
-
   const renderContent = () => {
     if (!isOpen) {
       return null;
@@ -120,7 +116,15 @@ const SeoStatus: React.FunctionComponent<ISeoStatusProps> = ({ data, seo, focusE
 
   return (
     <Collapsible id={`seo`} title="SEO Status" sendUpdate={pushUpdate}>
-      { renderContent() }
+      {
+        !title && !data[descriptionField] ? (
+          <div className={`seo__status__empty`}>
+            <p><b>Title</b> or <b>{descriptionField}</b> is needed.</p>
+          </div>
+        ) : (
+          renderContent() 
+        )
+      }
     </Collapsible>
   );
 };