atmosphere explorer
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Added fallback when no collections where found

authored by

5jiji and committed by
Tangled
cdb7e811 00e5344c

+68 -63
+68 -63
src/views/repo.tsx
··· 404 404 /> 405 405 </Show> 406 406 <div class="flex flex-col text-sm wrap-anywhere" classList={{ "-mt-1": !showFilter() }}> 407 - <For 408 - each={Object.keys(nsids() ?? {}).filter((authority) => 409 - filter() ? 410 - authority.includes(filter()!) || 411 - nsids()?.[authority].nsids.some((nsid) => 412 - `${authority}.${nsid}`.includes(filter()!), 413 - ) 414 - : true, 415 - )} 407 + <Show 408 + when={Object.keys(nsids() ?? {}).length != 0} 409 + fallback={<span class="text-center text-base mt-3">No collections found.</span>} 416 410 > 417 - {(authority) => { 418 - const reversedDomain = authority.split(".").reverse().join("."); 419 - const [faviconLoaded, setFaviconLoaded] = createSignal(false); 411 + <For 412 + each={Object.keys(nsids() ?? {}).filter((authority) => 413 + filter() ? 414 + authority.includes(filter()!) || 415 + nsids()?.[authority].nsids.some((nsid) => 416 + `${authority}.${nsid}`.includes(filter()!), 417 + ) 418 + : true, 419 + )} 420 + > 421 + {(authority) => { 422 + const reversedDomain = authority.split(".").reverse().join("."); 423 + const [faviconLoaded, setFaviconLoaded] = createSignal(false); 420 424 421 - const isHighlighted = () => location.hash === `#collections:${authority}`; 425 + const isHighlighted = () => location.hash === `#collections:${authority}`; 422 426 423 - return ( 424 - <div 425 - id={`collection-${authority}`} 426 - class="group flex items-start gap-2 rounded-lg p-1 transition-colors" 427 - classList={{ 428 - "dark:hover:bg-dark-200 hover:bg-neutral-200": !isHighlighted(), 429 - "bg-blue-100 dark:bg-blue-500/25": isHighlighted(), 430 - }} 431 - > 432 - <a 433 - href={`#collections:${authority}`} 434 - class="relative flex h-5 w-4 shrink-0 items-center justify-center hover:opacity-70" 427 + return ( 428 + <div 429 + id={`collection-${authority}`} 430 + class="group flex items-start gap-2 rounded-lg p-1 transition-colors" 431 + classList={{ 432 + "dark:hover:bg-dark-200 hover:bg-neutral-200": !isHighlighted(), 433 + "bg-blue-100 dark:bg-blue-500/25": isHighlighted(), 434 + }} 435 435 > 436 - <span class="absolute top-1/2 -left-5 flex -translate-y-1/2 items-center text-base opacity-0 transition-opacity group-hover:opacity-100"> 437 - <span class="iconify lucide--link absolute -left-2 w-7"></span> 438 - </span> 439 - <Show when={!faviconLoaded()}> 440 - <span class="iconify lucide--globe size-4 text-neutral-400 dark:text-neutral-500" /> 441 - </Show> 442 - <img 443 - src={ 444 - ["bsky.app", "bsky.chat"].includes(reversedDomain) ? 445 - "https://web-cdn.bsky.app/static/apple-touch-icon.png" 446 - : `https://${reversedDomain}/favicon.ico` 447 - } 448 - alt={`${reversedDomain} favicon`} 449 - class="h-4 w-4" 450 - classList={{ hidden: !faviconLoaded() }} 451 - onLoad={() => setFaviconLoaded(true)} 452 - onError={() => setFaviconLoaded(false)} 453 - /> 454 - </a> 455 - <div class="flex flex-1 flex-col"> 456 - <For 457 - each={nsids()?.[authority].nsids.filter((nsid) => 458 - filter() ? `${authority}.${nsid}`.includes(filter()!) : true, 459 - )} 436 + <a 437 + href={`#collections:${authority}`} 438 + class="relative flex h-5 w-4 shrink-0 items-center justify-center hover:opacity-70" 460 439 > 461 - {(nsid) => ( 462 - <A 463 - href={`/at://${did}/${authority}.${nsid}`} 464 - class="hover:underline active:underline" 465 - > 466 - <span>{authority}</span> 467 - <span class="text-neutral-500 dark:text-neutral-400">.{nsid}</span> 468 - </A> 469 - )} 470 - </For> 440 + <span class="absolute top-1/2 -left-5 flex -translate-y-1/2 items-center text-base opacity-0 transition-opacity group-hover:opacity-100"> 441 + <span class="iconify lucide--link absolute -left-2 w-7"></span> 442 + </span> 443 + <Show when={!faviconLoaded()}> 444 + <span class="iconify lucide--globe size-4 text-neutral-400 dark:text-neutral-500" /> 445 + </Show> 446 + <img 447 + src={ 448 + ["bsky.app", "bsky.chat"].includes(reversedDomain) ? 449 + "https://web-cdn.bsky.app/static/apple-touch-icon.png" 450 + : `https://${reversedDomain}/favicon.ico` 451 + } 452 + alt={`${reversedDomain} favicon`} 453 + class="h-4 w-4" 454 + classList={{ hidden: !faviconLoaded() }} 455 + onLoad={() => setFaviconLoaded(true)} 456 + onError={() => setFaviconLoaded(false)} 457 + /> 458 + </a> 459 + <div class="flex flex-1 flex-col"> 460 + <For 461 + each={nsids()?.[authority].nsids.filter((nsid) => 462 + filter() ? `${authority}.${nsid}`.includes(filter()!) : true, 463 + )} 464 + > 465 + {(nsid) => ( 466 + <A 467 + href={`/at://${did}/${authority}.${nsid}`} 468 + class="hover:underline active:underline" 469 + > 470 + <span>{authority}</span> 471 + <span class="text-neutral-500 dark:text-neutral-400">.{nsid}</span> 472 + </A> 473 + )} 474 + </For> 475 + </div> 471 476 </div> 472 - </div> 473 - ); 474 - }} 475 - </For> 477 + ); 478 + }} 479 + </For> 480 + </Show> 476 481 </div> 477 482 </Show> 478 483 <Show when={location.hash === "#identity" || (error() && !location.hash)}>