From 1382c508b765b793a89a6422c7a5b1254d0cd8ab Mon Sep 17 00:00:00 2001
From: llj <lingjun.li1@gmail.com>
Date: Wed, 10 Jul 2024 11:14:10 +0800
Subject: [PATCH] ['settings' page] fixup for the display of the logo

---
 frontend/src/components/logo.js       | 11 +++++++++--
 frontend/src/components/side-panel.js |  6 ++++--
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/logo.js b/frontend/src/components/logo.js
index 049b3693a6f..1e7fefc2159 100644
--- a/frontend/src/components/logo.js
+++ b/frontend/src/components/logo.js
@@ -1,11 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { siteRoot, mediaUrl, logoPath, logoWidth, logoHeight, siteTitle } from '../utils/constants';
+import { Utils } from '../utils/utils';
 
 const propTypes = {
   onCloseSidePanel: PropTypes.func,
   showCloseSidePanelIcon: PropTypes.bool,
-  positioned: PropTypes.bool
+  positioned: PropTypes.bool,
+  showLogoOnlyInMobile: PropTypes.bool
 };
 
 class Logo extends React.Component {
@@ -15,7 +17,12 @@ class Logo extends React.Component {
   };
 
   render() {
-    const { positioned } = this.props;
+    const { positioned, showLogoOnlyInMobile } = this.props;
+
+    if (showLogoOnlyInMobile && Utils.isDesktop()) {
+      return null;
+    }
+
     return (
       <div className={`top-logo ${positioned ? 'd-none d-md-block positioned-top-logo' : ''}`}>
         <a href={siteRoot} id="logo">
diff --git a/frontend/src/components/side-panel.js b/frontend/src/components/side-panel.js
index 6b4f9e3f738..1ff78f13760 100644
--- a/frontend/src/components/side-panel.js
+++ b/frontend/src/components/side-panel.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { Utils } from '../utils/utils';
 import Logo from './logo';
 import MainSideNav from './main-side-nav';
 import { SIDE_PANEL_FOLDED_WIDTH } from '../constants';
@@ -25,7 +24,10 @@ class SidePanel extends React.Component {
     return (
       <div className={classnames('side-panel', { 'side-panel-folded': isSidePanelFolded, 'left-zero': !this.props.isSidePanelClosed })} style={style}>
         <div className={'side-panel-north'}>
-          {showLogoOnlyInMobile && !Utils.isDesktop() && <Logo onCloseSidePanel={this.props.onCloseSidePanel} />}
+          <Logo
+            onCloseSidePanel={this.props.onCloseSidePanel}
+            showLogoOnlyInMobile={showLogoOnlyInMobile}
+          />
         </div>
         <div className="side-panel-center">
           {children ? children : (