[#111]: Backport changes from ecosystem

site/content/config.js

@@ -1,5 +1,5 @@
 const config = {
-  title: 'Flowershow',
+  navbarTitle: { version: true },
   analytics: 'G-RQWLTRWBS2',
   navLinks: [
     { href: '/#overview', name: 'Overview' },

templates/default/.env.development

@@ -0,0 +1,3 @@
+NEXT_PUBLIC_DOCSEARCH_APP_ID=R2IYF7ETH7
+NEXT_PUBLIC_DOCSEARCH_API_KEY=599cec31baffa4868cae4e79f180729b
+NEXT_PUBLIC_DOCSEARCH_INDEX_NAME=docsearch

templates/default/components/Nav.js

@@ -14,6 +14,36 @@ function GitHubIcon(props) {
   );
 }
 
+function NavbarTitle() {
+  // include option to define different text from title (if needed) in config
+  const title = siteConfig.navbarTitle?.text || siteConfig.title
+  /**
+   * Navbar logo will not show if:
+   *  - the authorLogo is not defined, or
+   *  - explicitly set to false in config's navbarTitle logo property.
+   * In all other cases the logo is shown by default.
+   */
+  const logo = (siteConfig.navbarTitle?.logo === false ? false : siteConfig.authorLogo) && siteConfig.authorLogo
+
+  return (
+    <>
+      <Link href="/" aria-label="Home page">
+        <a className="flex items-center font-extrabold text-xl sm:text-2xl text-slate-900 dark:text-white">
+          {logo && <img src={logo} alt={title} className="w-9 h-9 mr-1 fill-white" />}
+          {title}
+        </a>
+      </Link>
+      {siteConfig.navbarTitle?.version &&
+        (
+          <div className="mx-4 rounded-full border border-slate-500 py-1 px-3 text-xs text-slate-500">
+            {siteConfig.version}
+          </div>
+        )
+      }
+    </>
+  )
+}
+
 export default function Header() {
   const router = useRouter();
   const [isScrolled, setIsScrolled] = useState(false);
@@ -42,18 +72,7 @@ export default function Header() {
         <MobileNavigation navigation={siteConfig.navLinks} />
       </div>
       <div className="flex flex-none items-center">
-        <Link href="/" aria-label="Home page">
-          <a className="flex items-center font-extrabold text-xl sm:text-2xl text-slate-900 dark:text-white">
-            <img src="/assets/images/logo.svg" alt="" className="w-9 h-9 mr-1 fill-white" />
-            {siteConfig.author}
-          </a>
-        </Link>
-        {siteConfig.version
-          && (
-          <div className="mx-4 rounded-full border border-slate-500 py-1 px-3 text-xs text-slate-500">
-            {siteConfig.version}
-          </div>
-          )}
+        <NavbarTitle />
         <div className="hidden lg:flex ml-8 mr-6 sm:mr-8 md:mr-0">
           {siteConfig.navLinks.map((item) => (
             <Link key={item.href} href={item.href}>

templates/default/components/Search.js

@@ -42,6 +42,8 @@ export function Search(props) {
     );
   }, []);
 
+  if (!docSearchConfig.appId && !docSearchConfig.apiKey && !docSearchConfig.indexName) return null
+
   return (
     <>
       <button

templates/default/components/ThemeSelector.js

@@ -13,6 +13,8 @@ export function ThemeSelector() {
 	*/
   if (!mounted) return null;
 
+  if (!siteConfig.theme.default) return null
+
   return (
     <button
       className={`

templates/default/config/siteConfig.js

@@ -5,7 +5,7 @@ const defaultConfig = {
   description: 'Publish your digital garden',
   author: 'Flowershow',
   // logo image
-  authorLogo: '/assets/images/logo.svg',
+  authorLogo: '/_flowershow/logo.svg',
   // url to author
   authorUrl: 'https://flowershow.app/',
   // Google analytics key e.g. G-XXXX
@@ -20,13 +20,22 @@ const defaultConfig = {
   // Theme
   theme: {
     default: 'dark',
-    toggleIcon: '/assets/images/theme-button.svg',
+    toggleIcon: '/_flowershow/theme-button.svg',
   },
   navLinks: [
     { href: '/about', name: 'About' },
   ],
 };
 
-const siteConfig = { ...defaultConfig, ...userConfig };
+const siteConfig = {
+  ...defaultConfig,
+  ...userConfig,
+  // prevent theme object overrides for
+  // values not provided in userConfig
+  theme: {
+    ...defaultConfig.theme,
+    ...userConfig.theme,
+  }
+};
 
 module.exports = siteConfig;

templates/default/contentlayer.config.js

@@ -20,7 +20,7 @@ const sharedFields = {
 };
 
 const computedFields = {
-  url: {
+  url_path: {
     type: 'string',
     resolve: (post) => post._raw.flattenedPath,
   },

templates/default/pages/[[...slug]].js

@@ -16,13 +16,13 @@ export default function Page({ body, ...rest }) {
 export async function getStaticProps({ params }) {
   // params.slug is undefined for root index page
   const urlPath = params.slug ? params.slug.join('/') : '';
-  const page = allDocuments.find((p) => p.url === urlPath);
+  const page = allDocuments.find((p) => p.url_path === urlPath);
   return { props: page };
 }
 
 export async function getStaticPaths() {
   const paths = allDocuments.map((page) => {
-    const parts = page.url.split('/');
+    const parts = page.url_path.split('/');
     return { params: { slug: parts } };
   });
 

templates/default/pages/_app.js

@@ -29,7 +29,11 @@ function MyApp({ Component, pageProps }) {
   // end Google Analytics
 
   return (
-    <ThemeProvider disableTransitionOnChange attribute="class" defaultTheme={siteConfig.theme.default}>
+    <ThemeProvider
+      disableTransitionOnChange attribute="class"
+      defaultTheme={siteConfig.theme.default}
+      forcedTheme={siteConfig.theme.default ? null : 'light'}
+    >
       <DefaultSeo defaultTitle={siteConfig.title} {...siteConfig.nextSeo} />
       {/* Global Site Tag (gtag.js) - Google Analytics */}
       {siteConfig.analytics