fix: hide breadcrumb where not needed

getAlby · Jul 4, 2024 · c4420e6 · c4420e6
1 parent 1d46d8d
commit c4420e6
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 4 deletions.
diff --git a/frontend/src/components/AppHeader.tsx b/frontend/src/components/AppHeader.tsx
@@ -5,12 +5,18 @@ type Props = {
   title: string | ReactElement;
   description: string | ReactElement;
   contentRight?: React.ReactNode;
+  breadcrumb?: boolean;
 };
 
-function AppHeader({ title, description, contentRight }: Props) {
+function AppHeader({
+  title,
+  description,
+  contentRight,
+  breadcrumb = true,
+}: Props) {
   return (
     <>
-      <Breadcrumbs />
+      {breadcrumb && <Breadcrumbs />}
       <div className="flex justify-between border-b border-border pb-3 lg:pb-6">
         <div className="flex-1">
           <h1 className="text-xl lg:text-3xl font-semibold">{title}</h1>

diff --git a/frontend/src/components/Breadcrumbs.tsx b/frontend/src/components/Breadcrumbs.tsx
@@ -39,7 +39,7 @@ function Breadcrumbs() {
   const filteredCrumbs = isIndexRoute ? crumbs.slice(0, -1) : crumbs;
 
   // Don't render anything if there is only one item
-  if (filteredCrumbs.length < 2) {
+  if (filteredCrumbs.length < 3) {
     return null;
   }
 

diff --git a/frontend/src/components/layouts/SettingsLayout.tsx b/frontend/src/components/layouts/SettingsLayout.tsx
@@ -62,6 +62,7 @@ export default function SettingsLayout() {
       <AppHeader
         title="Settings"
         description="Manage your Alby Hub settings."
+        breadcrumb={false}
         contentRight={
           <AlertDialog>
             <AlertDialogTrigger asChild>

diff --git a/frontend/src/screens/appstore/AppStore.tsx b/frontend/src/screens/appstore/AppStore.tsx
@@ -7,7 +7,7 @@ function AppStore() {
   return (
     <>
       <AppHeader
-        title="Apps"
+        title="App Store"
         description="Apps that you can connect your wallet to"
         contentRight={
           <>