@claude that doesnt explain why the user was reporting stale data for his wallpapers

Claude finished @jagrat7's task in 1m 29s —— View job

Analysis: Stale Wallpaper Data

Good question — the PR only fixes the visual feedback. The stale data issue is a separate problem rooted in the backend cache not being bypassed on manual refresh.

Here's what's happening:

The Root Cause

src/main/services/wallpaper/wallpaper.ts has an in-memory cache with a 5-minute TTL:

private wallpaperCache: Wallpaper[] | null = null
private cacheTimestamp: number | null = null
const CACHE_TTL = 5 * 60 * 1000 // 5 minutes

The getWallpapers method accepts a refresh flag that bypasses this cache:

async getWallpapers(options: GetWallpapersOptions = {}): Promise<Wallpaper[]> {
  const { search, refresh = false } = options
  if (refresh || !this.wallpaperCache || cacheExpired) {
    this.wallpaperCache = await this.scanWallpapers()
  }
}

The tRPC procedure also exposes this flag:

// src/main/trpc/routes/wallpaper.ts
getWallpapers: trpc.procedure
  .input(z.object({
    search: z.string().optional(),
    refresh: z.boolean().default(false),  // ← exists but unused
  }))
  .query(async ({ input }) => wallpaperService.getWallpapers(input))

However, the frontend never passes refresh: true. When a user clicks the Refresh button, refetch() is called, which re-runs the tRPC query — but with the same { search } input. The backend gets the request, sees its in-memory cache is still valid, and returns the same stale data. The 5-minute cache is never busted.

The Fix

In src/renderer/hooks/use-wallpapers.ts, the query needs a way to force the backend to bypass its cache. One approach: track a forceRefresh flag in the query input.

// use-wallpapers.ts
const [forceRefresh, setForceRefresh] = useState(false)

const { data, isFetching, refetch } = trpc.wallpaper.getWallpapers.useQuery(
  { search: debouncedSearch, refresh: forceRefresh },
  { ... }
)

const refresh = useCallback(async () => {
  setForceRefresh(true)
  await refetch()
  setForceRefresh(false)
}, [refetch])

Or more simply, pass refresh: true directly when constructing a manual refetch by using queryClient.fetchQuery with refresh: true, or by switching from useQuery to a pattern that passes the flag on demand.

Additional Contributing Factors

• No file system watching: There's no chokidar/fs.watch on the Steam Workshop directory, so newly installed wallpapers are invisible until the cache expires — regardless of clicking Refresh.
• Frontend staleTime is 30s, backend cache is 5min: React Query may think data is stale and refetch, but it still gets cached backend data.

Fix this →