fix: make sure burger menu appears when header has links

pubkeyapp · Jan 13, 2024 · dc1dc82 · dc1dc82
1 parent e2cac97
commit dc1dc82
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 8 deletions.
diff --git a/packages/core/src/lib/ui-header/ui-header.tsx b/packages/core/src/lib/ui-header/ui-header.tsx
@@ -25,12 +25,9 @@ export interface UiHeaderLink {
 export function UiHeader(props: UiHeaderProps) {
   const { pathname } = useLocation()
   const [drawerOpened, { toggle: drawerToggle }] = useDisclosure(false)
-  const burger = props.toggle ? <Burger opened={props.opened} onClick={props.toggle} size="sm" hiddenFrom="md" /> : null
   const opened = props.opened ?? drawerOpened
   const toggle = props.toggle ?? drawerToggle
-  const close = () => {
-    if (opened && props.toggle) props.toggle()
-  }
+  const burger = props.links?.length ? <Burger opened={opened} onClick={toggle} size="sm" hiddenFrom="md" /> : null
 
   const items = props.links?.map((link) => (
     <Anchor
@@ -44,6 +41,11 @@ export function UiHeader(props: UiHeaderProps) {
     </Anchor>
   ))
 
+  function close() {
+    if (!opened || !props.toggle) return
+    props.toggle()
+  }
+
   return (
     <header className={classes.header}>
       <div className={classes.inner}>

diff --git a/...s/generators/src/generators/component/files/header/__prefixFileName__-header.tsx.template b/...s/generators/src/generators/component/files/header/__prefixFileName__-header.tsx.template
@@ -25,12 +25,9 @@ export interface <%= prefix.className %>HeaderLink {
 export function <%= prefix.className %>Header(props: <%= prefix.className %>HeaderProps) {
   const { pathname } = useLocation()
   const [drawerOpened, { toggle: drawerToggle }] = useDisclosure(false)
-  const burger = props.toggle ? <Burger opened={props.opened} onClick={props.toggle} size="sm" hiddenFrom="md" /> : null
   const opened = props.opened ?? drawerOpened
   const toggle = props.toggle ?? drawerToggle
-  const close = () => {
-    if (opened && props.toggle) props.toggle()
-  }
+  const burger = props.links?.length ? <Burger opened={opened} onClick={toggle} size="sm" hiddenFrom="md" /> : null
 
   const items = props.links?.map((link) => (
     <Anchor
@@ -44,6 +41,11 @@ export function <%= prefix.className %>Header(props: <%= prefix.className %>Head
     </Anchor>
   ))
 
+  function close() {
+    if (!opened || !props.toggle) return
+    props.toggle()
+  }
+
   return (
     <header className={classes.header}>
       <div className={classes.inner}>