🎨 Palette: エラー表示と非同期処理のアクセシビリティ改善 by is0692vs · Pull Request #856 · Hiroki-org/OpenShelf

is0692vs · 2026-05-19T06:00:30Z

💡 What:

apps/web/src/app/upload/page.tsx および apps/web/src/app/settings/page.tsx の非同期処理ボタン（「アップロードする」「保存」など）にあるインラインのスピナー要素を、共通の <Spinner /> コンポーネントに置き換えました。
上記画面におけるエラーメッセージ、またはステータスメッセージ（成功/エラー）のラッパー要素に対して、エラーの場合は role="alert" を、それ以外の場合は role="status" を追加しました。

🎯 Why:

非同期処理中のスピナーに aria-hidden="true" を指定することで、スクリーンリーダーユーザーにとって不要なDOMの読み上げを防ぐため（<Spinner /> コンポーネントを使用することでこれが自動的に適用されます）。
フォーム送信時のエラー表示や結果メッセージがDOMに追加された際、スクリーンリーダーユーザーに対して状態変化を即座に通知し、フォーカスを移動させなくても結果を把握できるようにするためです。

♿ Accessibility:

スピナー要素の不要な読み上げの防止。
動的メッセージ領域に対する role="alert" および role="status" の付与によるフィードバックの改善。

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

Greptile Summary

アップロードページとセッティングページのアクセシビリティを改善するPRです。インラインスピナーを共通の <Spinner /> コンポーネント（aria-hidden="true" 付き）に統一し、動的なエラー/ステータスメッセージ要素に role="alert" または role="status" を付与しています。

upload/page.tsx: エラー表示 <div> に role="alert" を追加し、ボタン内スピナーを <Spinner /> に置き換え
settings/page.tsx: メッセージ要素に role={messageType === "error" ? "alert" : "status"} を動的付与し、スピナーを <Spinner /> に置き換え
その他のファイル変更はほぼ整形（Prettier による長行の折り返し）とテストの CSS セレクタ更新（animate-spin → motion-safe:animate-spin）のみ

Confidence Score: 5/5

アクセシビリティ属性の追加と共通コンポーネントへの置き換えのみで、既存ロジックへの影響はなく安全にマージ可能。

変更は role="alert" / role="status" の付与と <Spinner /> コンポーネントへの置き換えに限定されており、ビジネスロジックには触れていない。テストも CSS セレクタ (motion-safe:animate-spin) の更新を含め適切に追従している。

特になし。upload/page.tsx と settings/page.tsx の変更はいずれも正しいパターンで実装されている。

Important Files Changed

Filename	Overview
apps/web/src/app/upload/page.tsx	エラー表示 div に `role="alert"` を追加し、インラインスピナーを共通 `<Spinner />` コンポーネントに置き換え。どちらの変更も正しい実装。
apps/web/src/app/settings/page.tsx	メッセージ要素に `role="alert"` / `role="status"` を動的に付与し、スピナーを `<Spinner />` に置き換え。条件付きレンダリングによりDOMへの挿入時にスクリーンリーダーへ通知される正しいパターン。
apps/web/src/app/tests/settings-page.test.tsx	`Spinner` の CSS クラスが `animate-spin` から `motion-safe:animate-spin` に変わったことを正しくテストに反映。
apps/web/src/app/papers/[id]/cite-button.tsx	sr-only スパンの改行を整形のみ。機能変更なし。
apps/web/src/app/upload/tests/page.test.tsx	長い行の整形のみ。機能的な変更なし。
.Jules/palette.md	アクセシビリティ改善に関する学習ログを追記。

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[フォーム送信] --> B{処理中?}
    B -- Yes --> C["<Spinner aria-hidden=true />\n+ テキスト表示\n(ボタン disabled)"]
    B -- No --> D[通常ボタンテキスト表示]
    C --> E{結果}
    E -- エラー --> F["role=alert の要素をDOMに挿入\nスクリーンリーダーが即座にアナウンス"]
    E -- 成功 --> G["role=status の要素をDOMに挿入\nスクリーンリーダーが割り込まずアナウンス"]
    F --> H[メッセージ表示]
    G --> H

_{Reviews (3): Last reviewed commit: "fix(a11y): remove redundant spinner sizi..." | Re-trigger Greptile}

- 非同期処理ボタンのインラインスピナーをアクセシブルな `<Spinner />` コンポーネントに置き換え (`aria-hidden="true"` が自動付与されます) - フォームのエラー表示およびステータス表示コンテナに `role="alert"` または `role="status"` を追加し、スクリーンリーダー向けに即座に通知されるよう修正 - 関連するテストコードを新しい実装（`motion-safe:animate-spin`）に合わせて更新 Co-authored-by: is0692vs <135803462+is0692vs@users.noreply.github.com>

google-labs-jules · 2026-05-19T06:00:32Z

👋 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-05-19T06:00:32Z

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

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
open-shelf	Ignored		May 19, 2026 7:40am

qodo-code-review · 2026-05-19T06:00:34Z

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-05-19T06:00:36Z

Warning

Rate limit exceeded

@is0692vs has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 10 minutes and 52 seconds before requesting another review.

You’ve run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 131b54e6-1dc7-46fe-8095-6998c2f64669

📥 Commits

Reviewing files that changed from the base of the PR and between e6e8deb and 714cd46.

⛔ Files ignored due to path filters (1)

package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (22)

.Jules/palette.md
apps/api/package.json
apps/api/src/routes/__tests__/collections.test.ts
apps/api/src/routes/__tests__/invites.test.ts
apps/api/src/routes/__tests__/papers.test.ts
apps/api/src/routes/invites.ts
apps/api/src/routes/papers.ts
apps/api/src/utils/__tests__/citation.test.ts
apps/web/package.json
apps/web/src/app/__tests__/home.test.tsx
apps/web/src/app/__tests__/paper-edit-page.test.tsx
apps/web/src/app/__tests__/settings-page.test.tsx
apps/web/src/app/orgs/[slug]/__tests__/org-page-client.test.tsx
apps/web/src/app/papers/[id]/__tests__/page-metadata.test.tsx
apps/web/src/app/papers/[id]/__tests__/paper-detail-client.test.tsx
apps/web/src/app/papers/[id]/cite-button.tsx
apps/web/src/app/settings/page.tsx
apps/web/src/app/upload/__tests__/page.test.tsx
apps/web/src/app/upload/page.tsx
apps/web/src/components/__tests__/feed-button.test.tsx
apps/web/src/hooks/__tests__/use-focus-trap.test.tsx
package.json

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch jules-8025347833555353357-89545574

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-05-19T06:01:10Z

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

codecov · 2026-05-19T06:02:01Z

Codecov Report

❌ Patch coverage is 69.23077% with 8 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
apps/api/src/routes/papers.ts	57.89%	6 Missing and 2 partials ⚠️

📢 Thoughts on this report? Let us know!

gemini-code-assist

Code Review

This pull request improves accessibility across the application by implementing ARIA roles (role="alert" and role="status") for feedback messages and standardizing loading indicators using a shared Spinner component. It also includes documentation updates regarding accessible error states and extensive code formatting across various test files. Review feedback suggests removing redundant size classes from the Spinner component and ensuring accessible labels are provided via sr-only text when buttons are in a loading state.

vercel · 2026-05-19T08:30:39Z

Deployment failed with the following error:

Resource is limited - try again in 24 hours (more than 100, code: "api-deployments-free-per-day").

Learn More: https://vercel.com/hirokis-projects-afd618c7?upgradeToPro=build-rate-limit

is0692vs · 2026-05-19T08:31:00Z

@greptile review

google-labs-jules · 2026-05-19T08:33:24Z

@greptile review

Acknowledged.

- 非同期処理ボタンのインラインスピナーをアクセシブルな `<Spinner />` コンポーネントに置き換え (`aria-hidden="true"` が自動付与されます) - フォームのエラー表示およびステータス表示コンテナに `role="alert"` または `role="status"` を追加し、スクリーンリーダー向けに即座に通知されるよう修正 - 関連するテストコードを新しい実装（`motion-safe:animate-spin`）に合わせて更新 Co-authored-by: is0692vs <135803462+is0692vs@users.noreply.github.com>

vercel · 2026-05-19T08:37:04Z

Deployment failed with the following error:

Resource is limited - try again in 1 day (more than 100, code: "api-deployments-free-per-day").

Learn More: https://vercel.com/hirokis-projects-afd618c7?upgradeToPro=build-rate-limit

pull-request-size Bot added the size/L label May 19, 2026

dosubot Bot added enhancement New feature or request javascript Pull requests that update javascript code labels May 19, 2026

github-actions Bot changed the base branch from main to staging May 19, 2026 06:01

greptile-apps Bot reviewed May 19, 2026

View reviewed changes

Comment thread apps/web/src/app/upload/page.tsx

gemini-code-assist Bot reviewed May 19, 2026

View reviewed changes

Comment thread apps/web/src/app/settings/page.tsx

Comment thread apps/web/src/app/upload/page.tsx

is0692vs and others added 2 commits May 19, 2026 16:40

Merge branch 'staging' into jules-8025347833555353357-89545574

27d9c6d

fix(a11y): remove redundant spinner sizing

fd0b356

pull-request-size Bot added size/XXL and removed size/L labels May 19, 2026

Merge branch 'staging' into jules-8025347833555353357-89545574

714cd46

Conversation

is0692vs commented May 19, 2026 • edited by greptile-apps Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Greptile Summary

Confidence Score: 5/5

Important Files Changed

Flowchart

Uh oh!

google-labs-jules Bot commented May 19, 2026

Uh oh!

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

Uh oh!

Uh oh!

qodo-code-review Bot commented May 19, 2026

Qodo reviews are paused for this user.

Uh oh!

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

Uh oh!

Rate limit exceeded

Uh oh!

github-actions Bot commented May 19, 2026

Uh oh!

codecov Bot commented May 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

Uh oh!

vercel Bot commented May 19, 2026

Uh oh!

is0692vs commented May 19, 2026

Uh oh!

google-labs-jules Bot commented May 19, 2026

Uh oh!

vercel Bot commented May 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

is0692vs commented May 19, 2026 •

edited by greptile-apps Bot

Loading

vercel Bot commented May 19, 2026 •

edited

Loading

coderabbitai Bot commented May 19, 2026 •

edited

Loading

codecov Bot commented May 19, 2026 •

edited

Loading