Skip to content

More small bug fixes#438

Merged
jgw96 merged 2 commits into
mainfrom
more-small-bug-fixes
Jun 28, 2026
Merged

More small bug fixes#438
jgw96 merged 2 commits into
mainfrom
more-small-bug-fixes

Conversation

@jgw96

@jgw96 jgw96 commented May 23, 2026

Copy link
Copy Markdown
Owner

fixes #436
fixes #433

Copilot AI review requested due to automatic review settings May 23, 2026 07:13

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR introduces small UI/UX fixes around loading states and media fade-in behavior, improving perceived responsiveness and accessibility in the Coho PWA’s Lit-based UI components.

Changes:

  • Add a loading skeleton state to the hashtag timeline page while the hashtag timeline data is undefined.
  • Improve media fade-in behavior in image-grid (tweak transitions, respect reduced-motion, and handle cached images that don’t fire load reliably).
  • Replace setTimeout-based “loaded” class toggling with requestAnimationFrame for images/videos.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File Description
src/pages/app-hashtags.ts Shows md-skeleton-card placeholders while hashtag timeline data is loading.
src/components/image-grid.ts Refines media fade-in transitions, adds reduced-motion handling, and marks cached images as loaded post-render.

Comment thread src/pages/app-hashtags.ts
Comment on lines +158 to +168
${this.data === undefined
? html`<div class="skeletons">
<md-skeleton-card count="5"></md-skeleton-card>
</div>`
: html`<app-timeline
.data=${this.data}
.header=${false}
.autoLoad=${false}
@open="${(e: CustomEvent<{ tweet: Post }>) =>
this.handleOpenPost(e.detail.tweet)}"
></app-timeline>`}
Comment on lines +226 to +232
private _markCachedImagesLoaded() {
const imgs = this.shadowRoot?.querySelectorAll<HTMLImageElement>(
'.media-cell img:not(.blurhash-canvas)'
);
if (!imgs) return;
for (const img of imgs) {
if (img.complete && img.naturalWidth > 0) {
@github-actions

Copy link
Copy Markdown

Visit the preview URL for this PR (updated for commit e651b56):

https://coho-mastodon--pr438-more-small-bug-fixes-0418snwo.web.app

(expires Sat, 30 May 2026 07:22:20 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: 22a5c1adab53191fa6702e9454dee7bd02b2edd7

@jgw96 jgw96 merged commit f1de146 into main Jun 28, 2026
13 checks passed
@jgw96 jgw96 deleted the more-small-bug-fixes branch June 28, 2026 04:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] images in timeline pop in when they load [BUG] Hashtags page needs skeleton screen for the list

2 participants