feat: Upgrade cozy-ui and cozy-ui-plus in cozy-search and cozy-sharing#2968
feat: Upgrade cozy-ui and cozy-ui-plus in cozy-search and cozy-sharing#2968
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (7)
✅ Files skipped from review due to trivial changes (1)
🚧 Files skipped from review as they are similar to previous changes (5)
WalkthroughThis PR bumps cozy-ui versions and cozy-ui-plus peer minimums in multiple packages, removes cozy-bar from cozy-search, replaces several Card/Banner wrappers with Box/Alert components (moving class-based styles into Box props and Alert actions), adds responsive Alert behavior via useBreakpoints, updates a test to include BreakpointsProvider, and adjusts related Stylus rules for public banner markup. No exported public API signatures were changed. Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
packages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsx (1)
116-154: Add PropTypes forSharingBannerByLink.
SharingBannerByLinkreceives theonCloseprop but lacks PropTypes definition. For consistency withSharingBannerCozyToCozy(lines 155-160) and to document the component's API, consider adding PropTypes.📝 Proposed PropTypes for SharingBannerByLink
} SharingBannerCozyToCozy.propTypes = { sharing: PropTypes.object.isRequired, isSharingShortcutCreated: PropTypes.bool.isRequired, addSharingLink: PropTypes.string.isRequired, onClose: PropTypes.func.isRequired } +SharingBannerByLink.propTypes = { + onClose: PropTypes.func.isRequired +} export { SharingBannerCozyToCozy, SharingBannerByLink }🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsx` around lines 116 - 154, Add PropTypes for the SharingBannerByLink component by importing PropTypes and declaring SharingBannerByLink.propTypes = { onClose: PropTypes.func.isRequired } (or .func if optional) immediately after the SharingBannerByLink function, matching the pattern used by SharingBannerCozyToCozy; ensure the PropTypes import is added if missing and use the same required/optional choice as the similar component to keep API documentation consistent.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@packages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsx`:
- Around line 71-74: In PublicBanner.jsx the Alert component is being passed a
raw CSS variable via the color prop (color="var(--defaultBackgroundColor)"),
which is unsupported; replace the color prop with one of the semantic values
(primary, secondary, success, error, warning, info) or remove the color prop and
apply your custom CSS variable via the Alert's sx prop (e.g., sx={{
backgroundColor: 'var(--defaultBackgroundColor)' }}) so styling is applied
correctly while keeping the existing square and block={isMobile} props intact.
---
Nitpick comments:
In
`@packages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsx`:
- Around line 116-154: Add PropTypes for the SharingBannerByLink component by
importing PropTypes and declaring SharingBannerByLink.propTypes = { onClose:
PropTypes.func.isRequired } (or .func if optional) immediately after the
SharingBannerByLink function, matching the pattern used by
SharingBannerCozyToCozy; ensure the PropTypes import is added if missing and use
the same required/optional choice as the similar component to keep API
documentation consistent.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 8bce00de-93c5-4c73-a69e-e4ed117454e5
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (6)
packages/cozy-search/package.jsonpackages/cozy-search/src/components/CreateAssistantSteps/ApiKeyStep.jsxpackages/cozy-search/src/components/Messages/UserMessage.jsxpackages/cozy-sharing/package.jsonpackages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsxpackages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.spec.jsx
| <Alert | ||
| color="var(--defaultBackgroundColor)" | ||
| square | ||
| block={isMobile} |
There was a problem hiding this comment.
🧩 Analysis chain
🌐 Web query:
cozy-ui Alert component color prop documentation
💡 Result:
The Cozy UI Alert component supports a color prop that changes the alert's color scheme. Possible values are: primary, secondary, success, error, warning, info. This is stated in the official Cozy UI guidelines documentation. Cozy UI defines corresponding semantic theme colors (e.g., --successColor, --errorColor, --warningColor, --infoColor) used for theming components like alerts. The styleguide mentions alert-specific z-index values ($alert-index), confirming the existence of alert components. The React components documentation is hosted at https://cozy.github.io/cozy-ui/react/ (referenced in the GitHub repo), which serves as the styleguidist for viewing component props and examples, though direct text snippets were not captured in search results. Cozy UI is based on Material-UI v4, where the Alert component natively supports a color prop with these exact values.
Citations:
- 1: https://docs.cozy.io/en/cozy-ui/guidelines/
- 2: https://docs.cozy.io/cozy-ui/styleguide/section-settings.html
- 3: https://docs.cozy.io/en/cozy-ui/
- 4: https://github.com/cozy/cozy-ui
Replace color="var(--defaultBackgroundColor)" with a supported semantic color value.
The Alert component only accepts semantic color values: primary, secondary, success, error, warning, or info. Passing a CSS variable string will not apply the expected styling. Use one of the supported values or apply custom styling via the sx prop if a custom color is needed.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In
`@packages/cozy-sharing/src/components/SharingBanner/components/PublicBanner.jsx`
around lines 71 - 74, In PublicBanner.jsx the Alert component is being passed a
raw CSS variable via the color prop (color="var(--defaultBackgroundColor)"),
which is unsupported; replace the color prop with one of the semantic values
(primary, secondary, success, error, warning, info) or remove the color prop and
apply your custom CSS variable via the Alert's sx prop (e.g., sx={{
backgroundColor: 'var(--defaultBackgroundColor)' }}) so styling is applied
correctly while keeping the existing square and block={isMobile} props intact.
BREAKING CHANGE: You must have `cozy-ui >= 138.1.0 and cozy-ui-plus >= 6.0.0`
2 participants
BREAKING CHANGE: You must have
cozy-ui >= 138.1.0 and cozy-ui-plus >= 6.0.0Summary by CodeRabbit
New Features
Refactor
Chores