Skip to content

Improve image lightbox controls#1084

Merged
klopez4212 merged 8 commits into
mainfrom
kennylopez-image-lightbox-overlay
Jun 17, 2026
Merged

Improve image lightbox controls#1084
klopez4212 merged 8 commits into
mainfrom
kennylopez-image-lightbox-overlay

Conversation

@klopez4212

Copy link
Copy Markdown
Contributor

Summary

  • Replace image previews with a source-rect animated overlay.
  • Add glassy bottom controls for download and zoom.
  • Smooth close behavior, reduce accidental slider-release closes, and support trackpad zoom.

Checks

  • git diff --cached --check
  • ../node_modules/.bin/biome check --config-path=./biome.json src/shared/ui/markdown.tsx src/shared/styles/globals.css
  • ./node_modules/.bin/tsc --noEmit (blocked by existing animatedAvatarCapture.ts / @mediapipe/tasks-vision errors in this checkout)

@klopez4212 klopez4212 marked this pull request as ready for review June 17, 2026 16:24
@klopez4212 klopez4212 requested a review from a team June 17, 2026 16:24
klopez4212 added a commit that referenced this pull request Jun 17, 2026

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: f457ae73df

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/ui/markdown.tsx
@klopez4212 klopez4212 force-pushed the kennylopez-image-lightbox-overlay branch from f457ae7 to a8e062a Compare June 17, 2026 16:32
@klopez4212

Copy link
Copy Markdown
Contributor Author

🤖 Screenshot for the updated image lightbox overlay.

image-lightbox-overlay

klopez4212 added a commit that referenced this pull request Jun 17, 2026

@wesbillman wesbillman left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Thorough review focused on usefulness vs. over-engineering.

Overall: Genuinely useful change and mostly not over-engineered. The source-rect "grow from where it sits" animation + glassy download/zoom bar is a clear UX upgrade over the old fixed-box Radix dialog, and it deliberately mirrors the established VideoPlayer.tsx overlay pattern (same createPortal, double-requestAnimationFrame enter, same backdrop-blur-xl backdrop-saturate-150 bg-black/35 glass bar). Accessibility is handled (role=dialog, aria-modal, sr-only description, focus, Escape, body scroll lock).

A few places where complexity could be trimmed — inline comments below. The only hard ask is the duplicated reduced-motion hook; the rest are judgment calls.

Not blockers: tsc --noEmit is blocked by pre-existing animatedAvatarCapture.ts / @mediapipe errors on main — confirmed unrelated to this PR.

Comment thread desktop/src/shared/ui/markdown.tsx Outdated
Comment thread desktop/src/shared/ui/markdown.tsx
Comment thread desktop/src/shared/ui/markdown.tsx
Comment thread desktop/src/shared/ui/markdown.tsx
@klopez4212 klopez4212 requested a review from wesbillman June 17, 2026 17:00

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 7743e2f637

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/ui/markdown.tsx

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 3cf8198958

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/ui/markdown.tsx Outdated
Comment thread desktop/src/shared/ui/markdown.tsx Outdated

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 99f9866ace

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/ui/markdown.tsx Outdated

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: deed14c88c

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/styles/globals.css

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 81af89671c

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread desktop/src/shared/ui/markdown.tsx
@klopez4212 klopez4212 merged commit bb9b667 into main Jun 17, 2026
23 checks passed
@klopez4212 klopez4212 deleted the kennylopez-image-lightbox-overlay branch June 17, 2026 18:54
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.

2 participants