[fix] Display history button when share button in hidden (#698)

Co-authored-by: Ian Seabock (Centific Technologies Inc) <[email protected]>
microsoft · Mar 13, 2024 · 255ccf2 · 255ccf2
1 parent e9fc0ae
commit 255ccf2
Show file tree

Hide file tree

Showing 8 changed files with 37 additions and 52 deletions.
diff --git a/frontend/src/components/common/Button.module.css b/frontend/src/components/common/Button.module.css
@@ -4,7 +4,6 @@
     border-radius: 4px;
     background: radial-gradient(109.81% 107.82% at 100.1% 90.19%, #0F6CBD 33.63%, #2D87C3 70.31%, #8DDDD8 100%);
     padding: 5px 12px;
-    margin-right: 20px;
   }
 
   .shareButtonRoot:hover {

diff --git a/frontend/src/pages/layout/Layout.module.css b/frontend/src/pages/layout/Layout.module.css
@@ -41,19 +41,7 @@
     display: flex;
     flex-direction: row;
     justify-content: center;
-    align-items: center;
-    padding: 5px 12px;
-    gap: 4px;
-    width: 86px;
-    height: 32px;
-    background: radial-gradient(109.81% 107.82% at 100.1% 90.19%, #0F6CBD 33.63%, #2D87C3 70.31%, #8DDDD8 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */;
-    border-radius: 4px;
-    flex: none;
-    order: 1;
-    flex-grow: 0;
-    position: absolute;
-    right: 20px;
-    cursor: pointer;
+    margin-right: 20px;
 }
 
 .shareButton {

diff --git a/frontend/src/pages/layout/Layout.tsx b/frontend/src/pages/layout/Layout.tsx
@@ -78,14 +78,12 @@ const Layout = () => {
                             <h1 className={styles.headerTitle}>{ui?.title}</h1>
                         </Link>
                     </Stack>
-                    {ui?.show_share_button &&
-                        <Stack horizontal tokens={{ childrenGap: 4 }}>
-                            {(appStateContext?.state.isCosmosDBAvailable?.status !== CosmosDBStatus.NotConfigured) &&
-                                <HistoryButton onClick={handleHistoryClick} text={appStateContext?.state?.isChatHistoryOpen ? hideHistoryLabel : showHistoryLabel} />
-                            }
-                            <ShareButton onClick={handleShareClick} text={shareLabel} />
-                        </Stack>
-                    }
+                    <Stack horizontal tokens={{ childrenGap: 4 }} className={styles.shareButtonContainer}>
+                        {(appStateContext?.state.isCosmosDBAvailable?.status !== CosmosDBStatus.NotConfigured) &&
+                            <HistoryButton onClick={handleHistoryClick} text={appStateContext?.state?.isChatHistoryOpen ? hideHistoryLabel : showHistoryLabel} />
+                        }
+                        {ui?.show_share_button &&<ShareButton onClick={handleShareClick} text={shareLabel} />}
+                    </Stack>
                 </Stack>
             </header>
             <Outlet />

diff --git a/static/assets/index-0774d4f6.css b/static/assets/index-0774d4f6.css