From eba837229a5ca0d3019b90312cd5334cbc653a61 Mon Sep 17 00:00:00 2001
From: blahetal <43687107+blahetal@users.noreply.github.com>
Date: Wed, 24 Jan 2024 15:06:36 +0100
Subject: [PATCH] feat: add a new setting logo_link (#1070)

---
 packages/core/dev-test/config.yml             |  1 +
 .../core/src/components/navbar/Navbar.tsx     | 21 +++++++++++++++----
 packages/core/src/constants/configSchema.tsx  |  1 +
 packages/core/src/interface.ts                |  1 +
 .../content/docs/configuration-options.mdx    |  3 +++
 5 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/packages/core/dev-test/config.yml b/packages/core/dev-test/config.yml
index 236f4f8d..4129b427 100644
--- a/packages/core/dev-test/config.yml
+++ b/packages/core/dev-test/config.yml
@@ -1,5 +1,6 @@
 backend:
   name: test-repo
+logo_link: '/#/page/custom-page'
 site_url: 'https://example.com'
 media_folder: /assets/uploads
 media_library:
diff --git a/packages/core/src/components/navbar/Navbar.tsx b/packages/core/src/components/navbar/Navbar.tsx
index 391d2517..32de6629 100644
--- a/packages/core/src/components/navbar/Navbar.tsx
+++ b/packages/core/src/components/navbar/Navbar.tsx
@@ -76,10 +76,23 @@ const Navbar: FC<NavbarProps> = ({
           <div className={classes.breadcrumbs}>
             <div className={classes['logo-wrapper']}>
               {config?.logo_url ? (
-                <div
-                  className={classNames(classes.logo, classes['custom-logo'])}
-                  style={{ backgroundImage: `url('${config.logo_url}')` }}
-                />
+                config.logo_link ? (
+                  <a href={config.logo_link}>
+                    <div
+                      className={classNames(classes.logo, classes['custom-logo'])}
+                      style={{ backgroundImage: `url('${config.logo_url}')` }}
+                    />
+                  </a>
+                ) : (
+                  <div
+                    className={classNames(classes.logo, classes['custom-logo'])}
+                    style={{ backgroundImage: `url('${config.logo_url}')` }}
+                  />
+                )
+              ) : config?.logo_link ? (
+                <a href={config.logo_link}>
+                  <StaticCmsIcon className={classes.logo} />
+                </a>
               ) : (
                 <StaticCmsIcon className={classes.logo} />
               )}
diff --git a/packages/core/src/constants/configSchema.tsx b/packages/core/src/constants/configSchema.tsx
index f09b04ca..314827f4 100644
--- a/packages/core/src/constants/configSchema.tsx
+++ b/packages/core/src/constants/configSchema.tsx
@@ -488,6 +488,7 @@ function getConfigSchema() {
       display_url: { type: 'string', examples: ['https://example.com'] },
       base_url: { type: 'string' },
       logo_url: { type: 'string', examples: ['https://example.com/images/logo.svg'] },
+      logo_link: { type: 'string', examples: ['https://example.com'] },
       media_folder: { type: 'string', examples: ['assets/uploads'] },
       public_folder: { type: 'string', examples: ['/uploads'] },
       media_folder_relative: { type: 'boolean' },
diff --git a/packages/core/src/interface.ts b/packages/core/src/interface.ts
index d5455d27..7ff8744d 100644
--- a/packages/core/src/interface.ts
+++ b/packages/core/src/interface.ts
@@ -1047,6 +1047,7 @@ export interface Config<EF extends BaseField = UnknownField> {
   display_url?: string;
   base_url?: string;
   logo_url?: string;
+  logo_link?: string;
   media_folder?: string;
   public_folder?: string;
   media_folder_relative?: boolean;
diff --git a/packages/docs/content/docs/configuration-options.mdx b/packages/docs/content/docs/configuration-options.mdx
index 3d081830..857bf939 100644
--- a/packages/docs/content/docs/configuration-options.mdx
+++ b/packages/docs/content/docs/configuration-options.mdx
@@ -203,16 +203,19 @@ display_url: 'https://your-site.com',
 ## Custom Logo
 
 When the `logo_url` setting is specified, the Static CMS UI will change the logo displayed at the top of the login page, allowing you to brand Static CMS with your own logo. `logo_url` is assumed to be a URL to an image file.
+When the `logo_link` setting is specified, the Static CMS UI will wrap the logo in a link, allowing you to make the logo clickable. `logo_link` can be a URL to an external page or an address of one of Static CMS pages giving you a quick link to your favourite page.
 
 **Example:**
 
 <CodeTabs>
 ```yaml
 logo_url: https://your-site.com/images/logo.svg
+logo_link: https://your-site.com
 ```
 
 ```js
 logo_url: 'https://your-site.com/images/logo.svg',
+logo_link: 'https://your-site.com',
 ```
 
 </CodeTabs>