chore(demos): update various react demos#12586
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (7)
WalkthroughReact Table demos now use PatternFly ChangesTable label status migration
Notification badge variants
Estimated code review effort: 2 (Simple) | ~10 minutes Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/react-table/src/demos/examples/TableCompact.tsx`:
- Around line 117-123: Normalize the Needs Maintenance switch case to the
sample-data key Needs maintenance so the label renders correctly. Apply this
change in the status renderers at
packages/react-table/src/demos/examples/TableCompact.tsx#L117-L123,
TableSortableResponsive.tsx#L124-L130, TableStaticBottomPagination.tsx#L71-L89,
and TableStickyHeader.tsx#L10-L16; leave the associated label statuses
unchanged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: cdcbf011-5583-47eb-96c9-2adcf12b81bf
📒 Files selected for processing (8)
packages/react-table/src/demos/examples/TableColumnManagement.tsxpackages/react-table/src/demos/examples/TableColumnManagementWithDraggable.tsxpackages/react-table/src/demos/examples/TableCompact.tsxpackages/react-table/src/demos/examples/TableExpandCollapseAll.tsxpackages/react-table/src/demos/examples/TableFilterable.tsxpackages/react-table/src/demos/examples/TableSortableResponsive.tsxpackages/react-table/src/demos/examples/TableStaticBottomPagination.tsxpackages/react-table/src/demos/examples/TableStickyHeader.tsx
| return <Label status={LabelStatus.success}>{labelText}</Label>; | ||
| case 'Stopped': | ||
| return <Label color="orange">{labelText}</Label>; | ||
| return <Label status={LabelStatus.warning}>{labelText}</Label>; | ||
| case 'Needs Maintenance': | ||
| return <Label color="blue">{labelText}</Label>; | ||
| return <Label status={LabelStatus.info}>{labelText}</Label>; | ||
| case 'Down': | ||
| return <Label color="red">{labelText}</Label>; | ||
| return <Label status={LabelStatus.danger}>{labelText}</Label>; |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
echo "Locate demo files and searches:"
for f in \
packages/react-table/src/demos/examples/TableCompact.tsx \
packages/react-table/src/demos/examples/TableSortableResponsive.tsx \
packages/react-table/src/demos/examples/TableStaticBottomPagination.tsx \
packages/react-table/src/demos/examples/TableStickyHeader.tsx
do
echo "===== $f ($(wc -l < "$f") lines) ====="
ast-grep outline "$f" --view compact 2>/dev/null || true
printf "\n"
sed -n '1,180p' "$f"
printf "\n"
done
echo "Search for row.status/status data values:"
rg -n "status|Needs Maintenance|Needs maintenance|Down|Stopped" packages/react-table/src/demos/examples packages -g '*.tsx' -g '*.ts' | head -n 200Repository: patternfly/patternfly-react
Length of output: 42910
Normalize the Needs maintenance status key across these demos.
These renderers receive row.status from packages/react-table/src/demos/sampleData.tsx, where the status value is Needs maintenance with a lowercase m. The Needs Maintenance switch cases fall through to the empty default/result and won’t render the label in these examples.
packages/react-table/src/demos/examples/TableCompact.tsx#L120packages/react-table/src/demos/examples/TableSortableResponsive.tsx#L127packages/react-table/src/demos/examples/TableStaticBottomPagination.tsx#L83packages/react-table/src/demos/examples/TableStickyHeader.tsx#L13
📍 Affects 4 files
packages/react-table/src/demos/examples/TableCompact.tsx#L117-L123(this comment)packages/react-table/src/demos/examples/TableSortableResponsive.tsx#L124-L130packages/react-table/src/demos/examples/TableStaticBottomPagination.tsx#L71-L89packages/react-table/src/demos/examples/TableStickyHeader.tsx#L10-L16
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/react-table/src/demos/examples/TableCompact.tsx` around lines 117 -
123, Normalize the Needs Maintenance switch case to the sample-data key Needs
maintenance so the label renders correctly. Apply this change in the status
renderers at packages/react-table/src/demos/examples/TableCompact.tsx#L117-L123,
TableSortableResponsive.tsx#L124-L130, TableStaticBottomPagination.tsx#L71-L89,
and TableStickyHeader.tsx#L10-L16; leave the associated label statuses
unchanged.
Closes #12528 AND patternfly/patternfly-design#1683
Summary by CodeRabbit
Summary by CodeRabbit
Bug Fixes
LabelStatusstyling (success/warning/info/danger) instead of legacy label color mappings.Chores
NotificationBadgeVariant.plainvariant for consistent visual/semantic styling.