···

       
397
       
397
       
 
       
              >

     

       
398
       
398
       
 
       
                {(authority) => {

     

       
399
       
399
       
 
       
                  const reversedDomain = authority.split(".").reverse().join(".");

     

       
400
       
400
       
-
       
                  const [faviconError, setFaviconError] = createSignal(false);

     

       
400
       
400
       
+
       
                  const [faviconLoaded, setFaviconLoaded] = createSignal(false);

     

       
401
       
401
       
 
       


     

       
402
       
402
       
 
       
                  return (

     

       
403
       
403
       
 
       
                    <div class="dark:hover:bg-dark-200 flex items-start gap-2 rounded-lg p-1 hover:bg-neutral-200">

     

       
404
       
404
       
 
       
                      <div class="flex h-5 w-4 shrink-0 items-center justify-center">

     

       
405
       
405
       
-
       
                        <Show

     

       
406
       
406
       
-
       
                          when={!faviconError()}

     

       
407
       
407
       
-
       
                          fallback={

     

       
408
       
408
       
-
       
                            <span class="iconify lucide--globe size-4 text-neutral-400 dark:text-neutral-500" />

     

       
409
       
409
       
-
       
                          }

     

       
410
       
410
       
-
       
                        >

     

       
411
       
411
       
-
       
                          <img

     

       
412
       
412
       
-
       
                            src={

     

       
413
       
413
       
-
       
                              reversedDomain === "bsky.app" ?

     

       
414
       
414
       
-
       
                                "https://web-cdn.bsky.app/static/apple-touch-icon.png"

     

       
415
       
415
       
-
       
                              : `https://${reversedDomain}/favicon.ico`

     

       
416
       
416
       
-
       
                            }

     

       
417
       
417
       
-
       
                            alt={`${reversedDomain} favicon`}

     

       
418
       
418
       
-
       
                            class="h-4 w-4"

     

       
419
       
419
       
-
       
                            onError={() => setFaviconError(true)}

     

       
420
       
420
       
-
       
                          />

     

       
405
       
405
       
+
       
                        <Show when={!faviconLoaded()}>

     

       
406
       
406
       
+
       
                          <span class="iconify lucide--globe size-4 text-neutral-400 dark:text-neutral-500" />

     

       
421
       
407
       
 
       
                        </Show>

     

       
408
       
408
       
+
       
                        <img

     

       
409
       
409
       
+
       
                          src={

     

       
410
       
410
       
+
       
                            reversedDomain === "bsky.app" ?

     

       
411
       
411
       
+
       
                              "https://web-cdn.bsky.app/static/apple-touch-icon.png"

     

       
412
       
412
       
+
       
                            : `https://${reversedDomain}/favicon.ico`

     

       
413
       
413
       
+
       
                          }

     

       
414
       
414
       
+
       
                          alt={`${reversedDomain} favicon`}

     

       
415
       
415
       
+
       
                          class="h-4 w-4"

     

       
416
       
416
       
+
       
                          classList={{ hidden: !faviconLoaded() }}

     

       
417
       
417
       
+
       
                          onLoad={() => setFaviconLoaded(true)}

     

       
418
       
418
       
+
       
                          onError={() => setFaviconLoaded(false)}

     

       
419
       
419
       
+
       
                        />

     

       
422
       
420
       
 
       
                      </div>

     

       
423
       
421
       
 
       
                      <div class="flex flex-1 flex-col">

     

       
424
       
422
       
 
       
                        <For