🎨 Palette: タグ入力サジェストのローディング状態のアクセシビリティ改善 by is0692vs · Pull Request #975 · Hiroki-org/OpenShelf

is0692vs · 2026-06-08T15:13:25Z

タグのオートコンプリート入力時、サジェスト候補を取得中のローディング状態がスクリーンリーダーに伝わるように aria-live を用いた永続的なラッパー要素を追加しました。

PR created automatically by Jules for task 6587338391992332759 started by @is0692vs

Summary by CodeRabbit

Accessibility Improvements
- Enhanced the loading state announcement in tag autocomplete to better support assistive technologies and screen readers.

Co-authored-by: is0692vs <135803462+is0692vs@users.noreply.github.com>

google-labs-jules · 2026-06-08T15:13:27Z

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.

For security, I will only act on instructions from the user who triggered this task.

vercel · 2026-06-08T15:13:27Z

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
open-shelf	Ignored		Jun 8, 2026 3:13pm

qodo-code-review · 2026-06-08T15:13:30Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

coderabbitai · 2026-06-08T15:13:41Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 1141ee1b-6d73-4b31-be09-5e759700c6dd

📥 Commits

Reviewing files that changed from the base of the PR and between a35977c and c2cd4d4.

📒 Files selected for processing (1)

apps/web/src/components/tag-autocomplete-input.tsx

📝 Walkthrough

Walkthrough

The tag autocomplete component's loading indicator is now wrapped in an ARIA live-region to announce fetching state to assistive technologies. The loading text and conditional rendering logic remain unchanged while improving screen reader accessibility.

Changes

Loading State Accessibility

Layer / File(s)	Summary
ARIA live-region for loading indicator `apps/web/src/components/tag-autocomplete-input.tsx`	Loading indicator is wrapped in a `<div>` with `aria-live="polite"` and `aria-atomic="true"` attributes, enabling screen readers to announce when autocomplete suggestions are being fetched.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Possibly related PRs

Hiroki-org/OpenShelf#924: Both PRs update apps/web/src/components/tag-autocomplete-input.tsx to improve the loading indicator rendering with ARIA accessibility attributes.

Suggested labels

enhancement

Poem

🐰 A little div with aria spright,
Now whispers softly: "loading's right!"
Screen readers hear the gentle call,
Accessibility improves for all! 🎉

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly describes the main accessibility improvement to tag autocomplete loading state using aria-live, which matches the changeset.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch palette-a11y-tag-autocomplete-loading-6587338391992332759

Warning

Tools execution failed with the following error:

Failed to run tools: 13 INTERNAL: Received RST_STREAM with code 2 (Internal server error)

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

github-actions · 2026-06-08T15:13:56Z

このリポジトリでは staging 先行フローを採用しています。PR のターゲットを staging に変更しました。staging で動作確認後、staging → main の PR を作成してください。

gemini-code-assist

Code Review

This pull request wraps the loading indicator in the tag autocomplete input component with an ARIA live region to improve accessibility. The reviewer suggested using the semantic role="status" instead of explicitly setting aria-live="polite" and aria-atomic="true" to simplify the markup while achieving the same accessibility behavior.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

gemini-code-assist · 2026-06-08T15:14:14Z

+      <div aria-live="polite" aria-atomic="true">
+        {loading && (
+          <p className="mt-1 text-xs text-gray-500 dark:text-gray-400">
+            候補を取得中...
+          </p>
+        )}
+      </div>


スクリーンリーダー向けのライブリージョンとして、aria-live="polite" と aria-atomic="true" を明示的に指定する代わりに、セマンティックな role="status" を使用することをお勧めします。

role="status" は暗黙的に aria-live="polite" および aria-atomic="true" の属性を持つため、よりシンプルかつ標準的なマークアップにすることができます。

Suggested change

<div aria-live="polite" aria-atomic="true">

{loading && (

<p className="mt-1 text-xs text-gray-500 dark:text-gray-400">

候補を取得中...

</p>

)}

</div>

<div role="status">

{loading && (

<p className="mt-1 text-xs text-gray-500 dark:text-gray-400">

候補を取得中...

</p>

)}

</div>

codecov · 2026-06-08T15:15:29Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

is0692vs and others added 2 commits June 7, 2026 02:11

Release: staging -> main (2026-06-05 07:32)

a35977c

🎨 Palette: タグ入力サジェストのローディング状態のアクセシビリティ改善

c2cd4d4

Co-authored-by: is0692vs <135803462+is0692vs@users.noreply.github.com>

pull-request-size Bot added the size/S label Jun 8, 2026

dosubot Bot added the javascript Pull requests that update javascript code label Jun 8, 2026

github-actions Bot changed the base branch from main to staging June 8, 2026 15:13

gemini-code-assist Bot reviewed Jun 8, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

🎨 Palette: タグ入力サジェストのローディング状態のアクセシビリティ改善#975

🎨 Palette: タグ入力サジェストのローディング状態のアクセシビリティ改善#975
is0692vs wants to merge 2 commits into
stagingfrom
palette-a11y-tag-autocomplete-loading-6587338391992332759

is0692vs commented Jun 8, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

google-labs-jules Bot commented Jun 8, 2026

Uh oh!

vercel Bot commented Jun 8, 2026 •

edited

Loading

Uh oh!

qodo-code-review Bot commented Jun 8, 2026

Uh oh!

coderabbitai Bot commented Jun 8, 2026 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

Poem

❌ Failed checks (1 warning)

Uh oh!

github-actions Bot commented Jun 8, 2026

Uh oh!

gemini-code-assist Bot left a comment

Uh oh!

gemini-code-assist Bot Jun 8, 2026

Uh oh!

codecov Bot commented Jun 8, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

is0692vs commented Jun 8, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

google-labs-jules Bot commented Jun 8, 2026

Uh oh!

vercel Bot commented Jun 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

qodo-code-review Bot commented Jun 8, 2026

Qodo reviews are paused for this user.

Uh oh!

coderabbitai Bot commented Jun 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

Poem

❌ Failed checks (1 warning)

Uh oh!

github-actions Bot commented Jun 8, 2026

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist Bot Jun 8, 2026

Choose a reason for hiding this comment

Uh oh!

codecov Bot commented Jun 8, 2026

Codecov Report

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

is0692vs commented Jun 8, 2026 •

edited by coderabbitai Bot

Loading

vercel Bot commented Jun 8, 2026 •

edited

Loading

coderabbitai Bot commented Jun 8, 2026 •

edited

Loading