Add fallback prop to note favicon

lumen-notes · Oct 3, 2023 · 2dd288e · 2dd288e
1 parent 1507ae4
commit 2dd288e
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/src/components/markdown.tsx b/src/components/markdown.tsx
@@ -650,7 +650,11 @@ function NoteLink({ id, text }: NoteLinkProps) {
       <HoverCard.Trigger asChild>
         <Link ref={ref} target="_blank" to={`/${id}`}>
           {isFirst && note ? (
-            <NoteFavicon note={note} className="mr-2 align-sub [h1>a>&]:align-baseline" />
+            <NoteFavicon
+              note={note}
+              className="mr-2 align-sub [h1>a>&]:align-baseline"
+              fallback={null}
+            />
           ) : null}
           {text}
         </Link>

diff --git a/src/components/note-favicon.tsx b/src/components/note-favicon.tsx
@@ -6,10 +6,16 @@ import { WebsiteFavicon } from "./website-favicon"
 
 type NoteFaviconProps = React.ComponentPropsWithoutRef<"span"> & {
   note: Note
+  fallback?: React.ReactNode
 }
 
-export function NoteFavicon({ note, className, ...props }: NoteFaviconProps) {
-  let icon = <NoteIcon16 data-testid="favicon-default" />
+export function NoteFavicon({
+  note,
+  className,
+  fallback = <NoteIcon16 data-testid="favicon-default" />,
+  ...props
+}: NoteFaviconProps) {
+  let icon = fallback
 
   // GitHub
   if (typeof note.frontmatter.github === "string") {
@@ -46,6 +52,10 @@ export function NoteFavicon({ note, className, ...props }: NoteFaviconProps) {
     icon = <NoteTemplateIcon16 data-testid="favicon-template" />
   }
 
+  if (!icon) {
+    return null
+  }
+
   return (
     <span
       className={cx("inline-grid h-4 w-4 place-items-center text-text-secondary", className)}