diff --git a/src/features/decks/deck-column.tsx b/src/features/decks/deck-column.tsx
index a1fd5a3..5719af0 100644
--- a/src/features/decks/deck-column.tsx
+++ b/src/features/decks/deck-column.tsx
@@ -16,6 +16,7 @@ import { PlatformIcon } from "../platforms/platform-icon";
import { type ColumnRegistry, useRegisterColumn } from "./column-tools";
import type { DeckColumn } from "./model";
import { ResearchPostCard } from "./research-post-card";
+import { ResearchPostSkeleton } from "./research-post-skeleton";
import { describeSource } from "./source-description";
export function ResearchColumn({
@@ -129,6 +130,7 @@ export function ResearchColumn({
// oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- Make the scrolling feed keyboard-accessible.
tabIndex={0}
aria-label={`Posts in ${column.title}`}
+ aria-busy={query.isFetching}
>
{visiblePosts.map((post) => (
{error.message}
diff --git a/src/features/decks/decks.css b/src/features/decks/decks.css index a895e19..8e02389 100644 --- a/src/features/decks/decks.css +++ b/src/features/decks/decks.css @@ -117,6 +117,7 @@ .deck-column-results { min-height: 0; overflow-y: auto; + scrollbar-gutter: stable; flex: 1; overscroll-behavior-y: contain; scrollbar-width: thin; diff --git a/src/features/decks/research-post-skeleton.tsx b/src/features/decks/research-post-skeleton.tsx new file mode 100644 index 0000000..18604e9 --- /dev/null +++ b/src/features/decks/research-post-skeleton.tsx @@ -0,0 +1,21 @@ +import { Skeleton } from "#/components/ui/skeleton"; + +export function ResearchPostSkeleton() { + return ( + + ); +}