Skip to content

[FEATURE] Add loading skeleton cards during search #172

@ascender1729

Description

@ascender1729

Description

Show animated skeleton placeholder cards while issues are being fetched.

Why Needed

  • Better perceived performance
  • Indicates content is loading
  • Modern UX pattern (vs spinning loader)

Implementation Details

  • Create SkeletonCard component
  • Show 3-6 skeleton cards during loading
  • Animate with shimmer/pulse effect
  • Match actual card dimensions

Files to Create/Modify

  • src/components/shared/SkeletonCard.svelte (new)
  • src/components/results/ResultsContainer.svelte

Code Example

{#if isLoading}
  {#each Array(4) as _}
    <SkeletonCard />
  {/each}
{:else}
  {#each issues as issue}
    <IssueCard {issue} />
  {/each}
{/if}

Acceptance Criteria

  • Skeleton cards shown during loading
  • Smooth animation effect
  • Matches real card layout
  • Graceful transition to real content

Time Estimates

  • With AI: 70 minutes
  • Without AI: 450 minutes

Metadata

Metadata

Assignees

Labels

enhancementNew feature or request

Type

No type
No fields configured for issues without a type.

Projects

Status
Done

Relationships

None yet

Development

No branches or pull requests

Issue actions