an independent Bluesky client using Constellation, PDS Queries, and other services
reddwarf.app
frontend
spa
bluesky
reddwarf
microcosm
client
app
proper feed names
+44
-33
+44
-33
src/routes/index.tsx
+44
-33
src/routes/index.tsx
···
359
359
>
360
360
{!isAuthRestoring && savedFeeds.length > 0 ? (
361
361
<div className={`flex items-center px-4 py-2 h-[52px] sticky top-0 bg-[var(--header-bg-light)] dark:bg-[var(--header-bg-dark)] ${!isAtTop && "shadow-sm"} sm:shadow-none sm:bg-white sm:dark:bg-gray-950 z-10 border-0 sm:border-b border-gray-200 dark:border-gray-700 overflow-x-auto overflow-y-hidden scroll-thin`}>
362
-
{savedFeeds.map((item: any, idx: number) => {
363
-
const label = item.value.split("/").pop() || item.value;
364
-
const isActive = selectedFeed === item.value;
365
-
return (
366
-
<button
367
-
key={item.value || idx}
368
-
className={`px-3 py-1 rounded-full whitespace-nowrap font-medium transition-colors ${
369
-
isActive
370
-
? "text-gray-900 dark:text-gray-100 hover:bg-gray-300 dark:bg-gray-700 bg-gray-200 hover:dark:bg-gray-600"
371
-
: "text-gray-600 dark:text-gray-400 hover:bg-gray-100 hover:dark:bg-gray-800"
372
-
// ? "bg-gray-500 text-white"
373
-
// : item.pinned
374
-
// ? "bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-200"
375
-
// : "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-200"
376
-
}`}
377
-
onClick={() => setSelectedFeed(item.value)}
378
-
title={item.value}
379
-
>
380
-
{label}
381
-
{item.pinned && (
382
-
<span
383
-
className={`ml-1 text-xs ${
384
-
isActive
385
-
? "text-gray-900 dark:text-gray-100"
386
-
: "text-gray-600 dark:text-gray-400"
387
-
}`}
388
-
>
389
-
★
390
-
</span>
391
-
)}
392
-
</button>
393
-
);
394
-
})}
362
+
{savedFeeds.map((item: any, idx: number) => {return <FeedTabOnTop key={item} item={item} idx={idx} />})}
395
363
</div>
396
364
) : (
397
365
// <span className="text-xl font-bold ml-2">Home</span>
···
435
403
</div>
436
404
);
437
405
}
406
+
407
+
408
+
// todo please use types this is dangerous very dangerous.
409
+
// todo fix this whenever proper preferences is handled
410
+
function FeedTabOnTop({item, idx}:{item: any, idx: number}) {
411
+
const [persistentSelectedFeed, setPersistentSelectedFeed] = useAtom(selectedFeedUriAtom);
412
+
const selectedFeed = persistentSelectedFeed
413
+
const setSelectedFeed = setPersistentSelectedFeed
414
+
const rkey = item.value.split("/").pop() || item.value;
415
+
const isActive = selectedFeed === item.value;
416
+
const { data: feedrecord } = useQueryArbitrary(item.value)
417
+
const label = feedrecord?.value?.displayName || rkey
418
+
return (
419
+
<button
420
+
key={item.value || idx}
421
+
className={`px-3 py-1 rounded-full whitespace-nowrap font-medium transition-colors ${
422
+
isActive
423
+
? "text-gray-900 dark:text-gray-100 hover:bg-gray-300 dark:bg-gray-700 bg-gray-200 hover:dark:bg-gray-600"
424
+
: "text-gray-600 dark:text-gray-400 hover:bg-gray-100 hover:dark:bg-gray-800"
425
+
// ? "bg-gray-500 text-white"
426
+
// : item.pinned
427
+
// ? "bg-gray-200 text-gray-700 dark:bg-gray-700 dark:text-gray-200"
428
+
// : "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-200"
429
+
}`}
430
+
onClick={() => setSelectedFeed(item.value)}
431
+
title={item.value}
432
+
>
433
+
{label}
434
+
{item.pinned && (
435
+
<span
436
+
className={`ml-1 text-xs ${
437
+
isActive
438
+
? "text-gray-900 dark:text-gray-100"
439
+
: "text-gray-600 dark:text-gray-400"
440
+
}`}
441
+
>
442
+
★
443
+
</span>
444
+
)}
445
+
</button>
446
+
);
447
+
}
448
+
438
449
// not even used lmaooo
439
450
440
451
// export async function cachedResolveDIDWEBDOC({