🎨 Palette: [접근성] 세그먼트 컨트롤 접근성 개선 (DateRangePicker, SortPicker)#177
🎨 Palette: [접근성] 세그먼트 컨트롤 접근성 개선 (DateRangePicker, SortPicker)#177seonghobae wants to merge 14 commits into
Conversation
…licate calculation `buildTimelineGroups` was calculated redundantly inside both `EventList` and `SessionActivityRibbon` inside `useMemo` hooks. This commit moves the `useMemo` computation into the parent `page.tsx` component and passes down `groups` as a prop to its children, preventing duplicate O(n) array iterations per `events` change.
Replace chained `.reduce()` and `Object.values()` with a single `for...of` loop over `Object.keys()` to avoid unnecessary intermediate array allocations and improve iteration performance during report aggregation.
overview-stats 컴포넌트의 설명 텍스트를 펼치거나 접는 버튼에 키보드 포커스 스타일이 누락되어 있어, 키보드 내비게이션 사용자에게 현재 포커스 위치를 명확히 보여주지 못하는 문제를 수정했습니다. Tailwind CSS의 `focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm` 클래스를 추가하여 탭(Tab) 키 이동 시 포커스 링이 보이도록 접근성을 개선했습니다.
- `TokenUsageChart`와 `WeeklyFlowChart`의 데이터 변환 로직에 `useMemo`를 적용하여 불필요한 리렌더링 최적화.
…y-improvements-7782421783208925042
…data-8534904799192449677
…tats-focus-1138085163110647654
…-loops-in-reports-11490543380196529130
…line-groups-memo-10280015208843955185
- `role="group"` 및 `aria-label`을 추가하여 버튼 그룹의 의미를 명확히 함 - 선택된 상태를 `aria-pressed`로 스크린 리더에 전달 - `focus-visible` 클래스를 활용해 키보드 탭 이동 시 시각적 피드백 제공
|
👋 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 New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
There was a problem hiding this comment.
Pull request overview
DateRangePicker와 세션 목록의 SortPicker에서 커스텀 세그먼트(버튼) 컨트롤의 스크린리더/키보드 접근성을 개선해, 현재 선택 상태를 보조기술에 노출하고 키보드 포커스 링을 제공하는 변경입니다.
Changes:
- 날짜 프리셋 버튼 그룹에
role="group",aria-label,aria-pressed추가 - 정렬 옵션 버튼 그룹에
role="group",aria-label,aria-pressed추가 - 두 컴포넌트의 세그먼트 버튼에
focus-visible기반 포커스 링 스타일 추가
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| packages/web/src/components/dashboard/date-range-picker.tsx | 날짜 프리셋 세그먼트 컨트롤에 그룹/선택 상태 ARIA 및 키보드 포커스 링을 추가 |
| packages/web/src/app/dashboard/[orgSlug]/sessions/page.tsx | 정렬 옵션 세그먼트 컨트롤에 그룹/선택 상태 ARIA 및 키보드 포커스 링을 추가 |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
OpenCode cannot approve yet because required coverage evidence did not pass.
Review outcome
1. HIGH .github/workflows/opencode-review.yml:1 - Coverage evidence did not prove required test/docstring evidence
-
Problem: The required coverage-evidence job result was
failure, so OpenCode cannot establish approval sufficiency for this head. -
Root cause: Automated approval is only valid when the same-head coverage-evidence job proves supported repository test suites passed and configured docstring gates passed or were advisory, or reports not applicable because no supported source files or package manifests exist. Missing, failed, skipped, unavailable, or unsupported-tooling test evidence is a blocker.
-
Fix: Install or configure the repository test/docstring evidence tooling when source files or package manifests exist, rerun the current-head coverage-evidence job, and approve only after it reports
successwith required evidence or explicit no-source not-applicable evidence. -
Regression test: Keep the approval branch checking
needs.coverage-evidence.result == successbefore posting APPROVE, and publish REQUEST_CHANGES when coverage-evidence blocker states such as cancelled, skipped, failed, unsupported-tooling, or below-100 evidence are present. -
Result: REQUEST_CHANGES
-
Reason: coverage-evidence result was
failure, so required test/docstring evidence was not proven for current headb446b760646b300743a13d898525dff79eb0111e. -
Head SHA:
b446b760646b300743a13d898525dff79eb0111e -
Workflow run: 28551359054
-
Workflow attempt: 1
Coverage evidence
Coverage Evidence
- Head SHA:
b446b760646b300743a13d898525dff79eb0111e - Required test evidence: supported repository test suites must pass.
- Required docstring evidence: repository-owned docstring gates must pass when configured; otherwise docstring coverage is advisory.
JavaScript/TypeScript dependencies (npm install)
added 110 packages, and audited 111 packages in 7s
38 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
- Result: PASS
JavaScript/TypeScript docstring coverage
- Result: PASS
- Reason: package.json exists, but no check:python-docstrings, docstring:coverage, or docs:coverage script is defined; docstring coverage is advisory.
JavaScript/TypeScript test coverage
- Result: FAIL
- Reason: package.json exists, but no coverage or test script is defined.
Coverage Decision
- Result: FAIL
- Test evidence: not proven passing
- Docstring evidence: not proven passing when configured
- Failure count: 1
Changed-File Evidence Map
flowchart LR
PR["PR changed files"] --> Evidence["OpenCode bounded evidence"]
Evidence --> S1["Changed file (2 files)"]
S1 --> I1["repository behavior"]
I1 --> R1["Review risk: Changed file (2 files)"]
R1 --> V1["required checks"]
OpenCode Review Overview
Pull request overviewOpenCode cannot approve yet because required coverage evidence did not pass. Review outcome1. HIGH .github/workflows/opencode-review.yml:1 - Coverage evidence did not prove required test/docstring evidence
Coverage evidenceCoverage Evidence
JavaScript/TypeScript dependencies (npm install)
JavaScript/TypeScript docstring coverage
JavaScript/TypeScript coverage script
JavaScript/TypeScript coverage threshold
Coverage Decision
Changed-File Evidence Mapflowchart LR
PR["PR changed files"] --> Evidence["OpenCode bounded evidence"]
Evidence --> S1["Changed file (9 files)"]
S1 --> I1["repository behavior"]
I1 --> R1["Review risk: Changed file (9 files)"]
R1 --> V1["required checks"]
|
- `role="group"` 및 `aria-label`을 추가하여 버튼 그룹의 의미를 명확히 함 - 선택된 상태를 `aria-pressed`로 스크린 리더에 전달 - `focus-visible` 클래스를 활용해 키보드 탭 이동 시 시각적 피드백 제공 - `package.json` 과 `turbo.json` 에 `coverage` 추가
There was a problem hiding this comment.
Pull request overview
OpenCode cannot approve yet because required coverage evidence did not pass.
Review outcome
1. HIGH .github/workflows/opencode-review.yml:1 - Coverage evidence did not prove required test/docstring evidence
-
Problem: The required coverage-evidence job result was
failure, so OpenCode cannot establish approval sufficiency for this head. -
Root cause: Automated approval is only valid when the same-head coverage-evidence job proves supported repository test suites passed and configured docstring gates passed or were advisory, or reports not applicable because no supported source files or package manifests exist. Missing, failed, skipped, unavailable, or unsupported-tooling test evidence is a blocker.
-
Fix: Install or configure the repository test/docstring evidence tooling when source files or package manifests exist, rerun the current-head coverage-evidence job, and approve only after it reports
successwith required evidence or explicit no-source not-applicable evidence. -
Regression test: Keep the approval branch checking
needs.coverage-evidence.result == successbefore posting APPROVE, and publish REQUEST_CHANGES when coverage-evidence blocker states such as cancelled, skipped, failed, unsupported-tooling, or below-100 evidence are present. -
Result: REQUEST_CHANGES
-
Reason: coverage-evidence result was
failure, so required test/docstring evidence was not proven for current head486c2dc43980f1f20f5d69c1fb6cd536b4fc4f21. -
Head SHA:
486c2dc43980f1f20f5d69c1fb6cd536b4fc4f21 -
Workflow run: 28551983344
-
Workflow attempt: 1
Coverage evidence
Coverage Evidence
- Head SHA:
486c2dc43980f1f20f5d69c1fb6cd536b4fc4f21 - Required test evidence: supported repository test suites must pass.
- Required docstring evidence: repository-owned docstring gates must pass when configured; otherwise docstring coverage is advisory.
JavaScript/TypeScript dependencies (npm install)
npm warn deprecated glob@10.5.0: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
added 209 packages, and audited 210 packages in 12s
65 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
- Result: PASS
JavaScript/TypeScript docstring coverage
- Result: PASS
- Reason: package.json exists, but no check:python-docstrings, docstring:coverage, or docs:coverage script is defined; docstring coverage is advisory.
JavaScript/TypeScript coverage script
> coverage
> turbo test -- --coverage
Attention:
Turborepo now collects completely anonymous telemetry regarding usage.
This information is used to shape the Turborepo roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://turborepo.dev/docs/telemetry
• Packages in scope: @argos/shared, @argos/web, argos-ai
• Running test in 3 packages
• Remote caching disabled
x Unable to find package manager binary: cannot find binary path
`-> cannot find binary path
- Result: FAIL (exit 1)
JavaScript/TypeScript coverage threshold
- Result: FAIL
- Reason: JavaScript/TypeScript coverage ran, but no coverage summary files were produced.
Coverage Decision
- Result: FAIL
- Test evidence: not proven passing
- Docstring evidence: not proven passing when configured
- Failure count: 2
Changed-File Evidence Map
flowchart LR
PR["PR changed files"] --> Evidence["OpenCode bounded evidence"]
Evidence --> S1["Changed file (6 files)"]
S1 --> I1["repository behavior"]
I1 --> R1["Review risk: Changed file (6 files)"]
R1 --> V1["required checks"]
- `role="group"` 및 `aria-label`을 추가하여 버튼 그룹의 의미를 명확히 함 - 선택된 상태를 `aria-pressed`로 스크린 리더에 전달 - `focus-visible` 클래스를 활용해 키보드 탭 이동 시 시각적 피드백 제공 - CI coverage script 를 위해 package.json 과 turbo.json 에 설정 추가
There was a problem hiding this comment.
Pull request overview
OpenCode cannot approve yet because required coverage evidence did not pass.
Review outcome
1. HIGH .github/workflows/opencode-review.yml:1 - Coverage evidence did not prove required test/docstring evidence
-
Problem: The required coverage-evidence job result was
failure, so OpenCode cannot establish approval sufficiency for this head. -
Root cause: Automated approval is only valid when the same-head coverage-evidence job proves supported repository test suites passed and configured docstring gates passed or were advisory, or reports not applicable because no supported source files or package manifests exist. Missing, failed, skipped, unavailable, or unsupported-tooling test evidence is a blocker.
-
Fix: Install or configure the repository test/docstring evidence tooling when source files or package manifests exist, rerun the current-head coverage-evidence job, and approve only after it reports
successwith required evidence or explicit no-source not-applicable evidence. -
Regression test: Keep the approval branch checking
needs.coverage-evidence.result == successbefore posting APPROVE, and publish REQUEST_CHANGES when coverage-evidence blocker states such as cancelled, skipped, failed, unsupported-tooling, or below-100 evidence are present. -
Result: REQUEST_CHANGES
-
Reason: coverage-evidence result was
failure, so required test/docstring evidence was not proven for current head81b2a1bb4ddd3a14a3ce6ed5b8f098bbb603a8c9. -
Head SHA:
81b2a1bb4ddd3a14a3ce6ed5b8f098bbb603a8c9 -
Workflow run: 28554181952
-
Workflow attempt: 1
Coverage evidence
Coverage Evidence
- Head SHA:
81b2a1bb4ddd3a14a3ce6ed5b8f098bbb603a8c9 - Required test evidence: supported repository test suites must pass.
- Required docstring evidence: repository-owned docstring gates must pass when configured; otherwise docstring coverage is advisory.
JavaScript/TypeScript dependencies (npm install)
npm warn deprecated glob@10.5.0: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
added 209 packages, and audited 210 packages in 13s
65 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
- Result: PASS
JavaScript/TypeScript docstring coverage
- Result: PASS
- Reason: package.json exists, but no check:python-docstrings, docstring:coverage, or docs:coverage script is defined; docstring coverage is advisory.
JavaScript/TypeScript coverage script
> coverage
> turbo run test -- --coverage
Attention:
Turborepo now collects completely anonymous telemetry regarding usage.
This information is used to shape the Turborepo roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://turborepo.dev/docs/telemetry
• Packages in scope: @argos/shared, @argos/web, argos-ai
• Running test in 3 packages
• Remote caching disabled
x Unable to find package manager binary: cannot find binary path
`-> cannot find binary path
- Result: FAIL (exit 1)
JavaScript/TypeScript coverage threshold
- Result: FAIL
- Reason: JavaScript/TypeScript coverage ran, but no coverage summary files were produced.
Coverage Decision
- Result: FAIL
- Test evidence: not proven passing
- Docstring evidence: not proven passing when configured
- Failure count: 2
Changed-File Evidence Map
flowchart LR
PR["PR changed files"] --> Evidence["OpenCode bounded evidence"]
Evidence --> S1["Changed file (9 files)"]
S1 --> I1["repository behavior"]
I1 --> R1["Review risk: Changed file (9 files)"]
R1 --> V1["required checks"]
- `role="group"` 및 `aria-label`을 추가하여 버튼 그룹의 의미를 명확히 함 - 선택된 상태를 `aria-pressed`로 스크린 리더에 전달 - `focus-visible` 클래스를 활용해 키보드 탭 이동 시 시각적 피드백 제공 - CI coverage script 를 위해 package.json 과 turbo.json 에 설정 추가
There was a problem hiding this comment.
Pull request overview
OpenCode cannot approve yet because required coverage evidence did not pass.
Review outcome
1. HIGH .github/workflows/opencode-review.yml:1 - Coverage evidence did not prove required test/docstring evidence
-
Problem: The required coverage-evidence job result was
failure, so OpenCode cannot establish approval sufficiency for this head. -
Root cause: Automated approval is only valid when the same-head coverage-evidence job proves supported repository test suites passed and configured docstring gates passed or were advisory, or reports not applicable because no supported source files or package manifests exist. Missing, failed, skipped, unavailable, or unsupported-tooling test evidence is a blocker.
-
Fix: Install or configure the repository test/docstring evidence tooling when source files or package manifests exist, rerun the current-head coverage-evidence job, and approve only after it reports
successwith required evidence or explicit no-source not-applicable evidence. -
Regression test: Keep the approval branch checking
needs.coverage-evidence.result == successbefore posting APPROVE, and publish REQUEST_CHANGES when coverage-evidence blocker states such as cancelled, skipped, failed, unsupported-tooling, or below-100 evidence are present. -
Result: REQUEST_CHANGES
-
Reason: coverage-evidence result was
failure, so required test/docstring evidence was not proven for current head216d47a72c321f2e56588264d0a7c3d238fdd6a0. -
Head SHA:
216d47a72c321f2e56588264d0a7c3d238fdd6a0 -
Workflow run: 28555088637
-
Workflow attempt: 1
Coverage evidence
Coverage Evidence
- Head SHA:
216d47a72c321f2e56588264d0a7c3d238fdd6a0 - Required test evidence: supported repository test suites must pass.
- Required docstring evidence: repository-owned docstring gates must pass when configured; otherwise docstring coverage is advisory.
JavaScript/TypeScript dependencies (npm install)
npm warn deprecated glob@10.5.0: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
added 209 packages, and audited 210 packages in 15s
65 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
- Result: PASS
JavaScript/TypeScript docstring coverage
- Result: PASS
- Reason: package.json exists, but no check:python-docstrings, docstring:coverage, or docs:coverage script is defined; docstring coverage is advisory.
JavaScript/TypeScript coverage script
> coverage
> turbo run test -- --coverage
Attention:
Turborepo now collects completely anonymous telemetry regarding usage.
This information is used to shape the Turborepo roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://turborepo.dev/docs/telemetry
• Packages in scope: @argos/shared, @argos/web, argos-ai
• Running test in 3 packages
• Remote caching disabled
x Unable to find package manager binary: cannot find binary path
`-> cannot find binary path
- Result: FAIL (exit 1)
JavaScript/TypeScript coverage threshold
- Result: FAIL
- Reason: JavaScript/TypeScript coverage ran, but no coverage summary files were produced.
Coverage Decision
- Result: FAIL
- Test evidence: not proven passing
- Docstring evidence: not proven passing when configured
- Failure count: 2
Changed-File Evidence Map
flowchart LR
PR["PR changed files"] --> Evidence["OpenCode bounded evidence"]
Evidence --> S1["Changed file (9 files)"]
S1 --> I1["repository behavior"]
I1 --> R1["Review risk: Changed file (9 files)"]
R1 --> V1["required checks"]
|
Closing as superseded during org-wide PR triage. Keeping #213 as the canonical PR for the same overlapping topic: date range picker/accessibility. This PR is stale/conflicted or has review blockers, so retaining one current PR reduces duplicated review and merge conflict work. |
Understood. Acknowledging that this work is now obsolete and stopping work on this task. |
💡 What:
DateRangePicker와SortPicker의 커스텀 세그먼트 컨트롤 버튼(날짜 프리셋, 정렬 옵션)에 접근성 향상을 위한 ARIA 속성 및 키보드 포커스 스타일(focus-visible)을 추가했습니다.🎯 Why: 기존에는 스크린 리더 사용자가 해당 버튼 그룹이 어떤 역할을 하는지, 어떤 버튼이 현재 선택되어 있는지 알기 어려웠으며, 키보드 사용자(Tab 키 이동)를 위한 명확한 시각적 포커스 링이 부재하여 사용성이 떨어졌습니다.
♿ Accessibility:
role="group",aria-label,aria-pressed,focus-visible속성 추가를 통해 시각 장애인 및 키보드 사용자의 사용 편의성을 크게 개선했습니다.PR created automatically by Jules for task 4459187396678848783 started by @seonghobae