fix: footer items should be in bottom even if menuItems is empty

gravity-ui · Nov 24, 2022 · d55e55e · d55e55e
1 parent df865df
commit d55e55e
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/src/components/AsideHeader/AsideHeader.scss b/src/components/AsideHeader/AsideHeader.scss
@@ -158,6 +158,10 @@ $block: '.#{variables.$ns}aside-header';
         }
     }
 
+    &__menu-items {
+        flex-grow: 1;
+    }
+
     &__footer {
         flex-shrink: 0;
         width: 100%;

diff --git a/src/components/AsideHeader/AsideHeader.tsx b/src/components/AsideHeader/AsideHeader.tsx
@@ -81,13 +81,17 @@ export class AsideHeader extends React.Component<AsideHeaderInnerProps> {
                     <div className={b('aside-popup-anchor')} ref={this.asideRef} />
                     <div className={b('aside-content')}>
                         {this.renderHeader()}
-                        <CompositeBar
-                            items={menuItems}
-                            compact={compact}
-                            enableCollapsing={true}
-                            dict={dict}
-                            onItemClick={this.onItemClick}
-                        />
+                        {menuItems?.length ? (
+                            <CompositeBar
+                                items={menuItems}
+                                compact={compact}
+                                enableCollapsing={true}
+                                dict={dict}
+                                onItemClick={this.onItemClick}
+                            />
+                        ) : (
+                            <div className={b('menu-items')} />
+                        )}
                         {this.renderFooter(size)}
                         {this.renderCollapseButton()}
                     </div>