PS-745 use logo instead of databox text (#499)

* use logo if exist * add maxHeight maxWidth * fix icon alignement and add git-log link
alchemy-fr · Dec 4, 2024 · 944c51c · 944c51c
1 parent bf36a79
commit 944c51c
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 11 deletions.
diff --git a/dashboard/client/config-compiler.js b/dashboard/client/config-compiler.js
@@ -71,6 +71,7 @@ window.config.muiTheme = ${stackConfig.theme.replace(/^export\s+const\s+themeOpt
 
     return {
         customHTML,
+        logo: stackConfig.logo,
         locales: config.available_locales,
         autoConnectIdP: env.AUTO_CONNECT_IDP,
         baseUrl: env.DASHBOARD_CLIENT_URL,

diff --git a/dashboard/client/src/Dashboard.tsx b/dashboard/client/src/Dashboard.tsx
@@ -65,16 +65,26 @@ export default function Dashboard({}: Props) {
                             },
                         }}
                     >
-                        {STACK_NAME}
-                        {user ? (
-                            <Chip
-                                icon={<SellIcon />}
-                                label={STACK_VERSION}
-                                color={'info'}
-                            />
-                        ) : (
-                            ''
-                        )}
+                        <div style={{ display: 'flex', alignItems: 'center' }}> 
+                            { 
+                                config.logo ? <img src={config.logo} alt={STACK_NAME}  style={{ maxHeight:48, maxWidth:150 }}/>
+                                : STACK_NAME
+                            }
+
+                            {user ? (
+                                <Chip
+                                    icon={<SellIcon />}
+                                    label={STACK_VERSION}
+                                    color={'info'}
+                                    component="a"
+                                    href="/git-log.html"
+                                    target={'_blank'}
+                                    clickable
+                                />
+                            ) : (
+                                ''
+                            )}
+                        </div>
                     </Typography>
                 </DashboardBar>
             )}

diff --git a/databox/client/config-compiler.js b/databox/client/config-compiler.js
@@ -61,6 +61,7 @@ window.config.muiTheme = ${stackConfig.theme.replace(/^export\s+const\s+themeOpt
 
     return {
         customHTML,
+        logo: stackConfig.logo,
         autoConnectIdP: env.AUTO_CONNECT_IDP,
         baseUrl: env.DATABOX_API_URL,
         uploaderApiBaseUrl: env.UPLOADER_API_URL,

diff --git a/databox/client/src/components/Layout/MainAppBar.tsx b/databox/client/src/components/Layout/MainAppBar.tsx
@@ -78,7 +78,11 @@ export default function MainAppBar({onToggleLeftPanel}: Props) {
                                 cursor: 'pointer',
                             }}
                         >
-                            {t('common.databox', `Databox`)}
+                            { 
+                                config.logo ? <img src={config.logo} alt={t('common.databox', `Databox`)}  style={{ maxHeight:32, maxWidth:150 }}/>
+                                : t('common.databox', `Databox`)
+                            }
+
                         </Typography>
 
                         <Box

diff --git a/lib/js/core/src/types.ts b/lib/js/core/src/types.ts
@@ -23,6 +23,7 @@ export type WindowConfig = {
     analytics?: AnalyticsConfig;
     pusherHost?: Readonly<string>;
     pusherKey?: Readonly<string>;
+    logo: Readonly<string>;
 }
 
 export type SentryConfig = Pick<WindowConfig,