Visitar URL original
v0.9.38: favicon service, docs improvements by waleedlatif1 · Pull Request #9500 · simstudioai/sim · GitHub
Skip to content
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix(favicons): let a mounted icon retry once its failure ages out (#9501
)

A failed load set per-instance state that pinned the icon to its fallback until it
unmounted, so the five-minute miss window never reached an icon already on screen. The
module-level miss cache is now the only failure record; a reducer only re-renders on
error, so the next render after the entry expires asks again (a confirmed miss is still
answered from the HTTP cache).
  • Loading branch information
waleedlatif1 authored Oct 31, 2026
commit a5fba63a558c41995280da50ebeac654b65fa4de
15 changes: 8 additions & 7 deletions apps/sim/components/favicon.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
'use client'

import { type ReactNode, useState } from 'react'
import { type ReactNode, useReducer } from 'react'
import { cn } from '@sim/emcn'
import { LRUCache } from 'lru-cache'
import { faviconSrc } from '@/lib/favicon/url'

/**
* Hosts whose icon just failed, so an icon that mounts again renders its fallback at once
* instead of an empty slot first. An `<img>` can't tell no icon from a provider outage, so this
* lasts only as long as the route retries an outage; a confirmed miss stays in the HTTP cache.
* Hosts whose icon failed recently: the only failure record, so mounted and remounted icons
* render the fallback at once instead of an empty slot. An `<img>` can't tell no icon from a
* provider outage, so an entry lasts only as long as the route retries an outage; the next render
* after that asks again, and a confirmed miss stays in the HTTP cache.
*/
const knownMisses = new LRUCache<string, true>({ max: 500, ttl: 5 * 60 * 1000 })

Expand All @@ -27,8 +28,8 @@ interface FaviconProps {
* of a provider's placeholder.
*/
export function Favicon({ host, fallback, className }: FaviconProps) {
const [failedHost, setFailedHost] = useState<string | null>(null)
if (!host || failedHost === host || knownMisses.has(host)) return fallback
const [, rerender] = useReducer((failures: number) => failures + 1, 0)
if (!host || knownMisses.has(host)) return fallback
return (
<img
src={faviconSrc(host)}
Expand All @@ -38,7 +39,7 @@ export function Favicon({ host, fallback, className }: FaviconProps) {
className={cn('rounded-sm', className)}
onError={() => {
knownMisses.set(host, true)
setFailedHost(host)
rerender()
}}
/>
)
Expand Down
Loading