fix icons

gatsby-config.js

@@ -51,7 +51,7 @@ module.exports = {
       resolve: `gatsby-plugin-purgecss`,
       options: {
         printRejected: false,
-        whitelist: ['.algolia-autocomplete'],
+        whitelist: ['algolia-autocomplete'],
         ignore: ['prismjs/','docsearch.js/', 'src/theme/assets/search/algolia.css'],
         //purgeOnly : ['components/', '/main.css', 'bootstrap/'],
       }

src/components/ChildrenOf.tsx

@@ -4,14 +4,15 @@ import { Link } from 'gatsby';
 import { getChildren, getSiblings } from '../utils/nodes';
 
 const createCards = (children: SilverstripeDocument[]): ReactElement[] => {
-    return children.map(({ summary, slug, title, icon }) => {
+    return children.map(({ summary, slug, title, icon, iconBrand }) => {
+        const iconClass = iconBrand ? `fab fa-${iconBrand}` : `fas fa-${icon || 'file-alt'}`
         return (
             <div className="col-12 col-lg-6 py-3" key={slug}>
                 <div className="card shadow-sm">
                     <div className="card-body">
                         <h5 className="card-title mb-3">
                             <span className="theme-icon-holder card-icon-holder mr-2">                                
-                                <i className={`fas fa-${icon || 'file-alt'}`}></i>                                
+                                <i className={iconClass}></i>
                             </span>
                             <span className="card-title-text">{title}</span>
                         </h5>

src/components/Header.tsx

@@ -9,16 +9,21 @@ interface HeaderProps {
 }
 
 const handleNavigate = (e: any): void => {
+  if (typeof window === 'undefined') {
+    return;
+  }
+
   const currentNode = getCurrentNode();
   const ver = e.target.value;
 
   if (currentNode) {
     const newPath = currentNode.slug.replace(/^\/en\/[0-9]+\//, `/en/${ver}/`);
     const otherNode = getNodes().find(n => n.slug === newPath);
+    // This has to be a hard refresh, because the sidebar needs to unmount
     if (otherNode) {
-      navigate(otherNode.slug);
+      window.location.href = otherNode.slug;
     } else {
-      navigate(`/en/${ver}`);
+      window.location.href = `/en/${ver}`;
     }
   }
 }

src/types/index.ts

@@ -25,10 +25,11 @@ export interface SilverstripeDocument {
     slug: string;
     isIndex: boolean;
     filePath: string;
-    introduction: string;
-    icon: string;
-    hideChildren: boolean;
-    hideSelf: boolean;
+    introduction?: string;
+    icon?: string;
+    iconBrand?: string;
+    hideChildren?: boolean;
+    hideSelf?: boolean;
     parentSlug: string;
     summary: string;
     fileTitle: string;

src/utils/nodes.ts

@@ -4,7 +4,6 @@ import { HierarchyQuery, SilverstripeDocument } from '../types';
 import sortFiles from './sortFiles';
 
 let __nodes: SilverstripeDocument[] | undefined;
-let __path: string | null = null;
 let __currentNode: SilverstripeDocument | null = null;
 let __currentVersion: string | null = null;
 let __home: SilverstripeDocument | null = null;
@@ -27,6 +26,7 @@ const getNodes = (): SilverstripeDocument[] => {
             isIndex
             introduction
             icon
+            iconBrand
             hideChildren
             slug
             parentSlug