feat: update apsara to 1.0.0-rc.5#1594
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughSummary by CodeRabbitRelease Notes
WalkthroughThis PR updates the ChangesApsara v1 Dependency & Component System Migration
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 2✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 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: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
web/sdk/react/views-new/billing/components/upcoming-billing-cycle.tsx (1)
174-202:⚠️ Potential issue | 🔴 Critical | ⚡ Quick winFix invalid HTML structure: nested
<p>elements created by removingas="span".The code nests
Textcomponents without theasprop at lines 174, 191, 196, and 202. Since Apsara's Text component defaults to rendering as a<p>element, these changes produce invalid HTML:<p><p>Label</p></p>.To fix, either:
- Add
as="span"back to the innerTextelements (labels), or- Add
as="div"to the outerTextelements.The pattern appears in all four label/value sections (Plan, Next billing, Users, Amount).
🧹 Nitpick comments (1)
web/sdk/react/utils/transform-query.ts (1)
25-25: ⚡ Quick winConsider documenting the
unknownparameter type.The widening from a specific union to
unknownreduces compile-time type safety. Since the function now accepts any value, it would be helpful to document what types are expected in practice and how non-primitive types are handled (converted viaString()).📝 Suggested JSDoc addition
/** * Converts a filter value to the appropriate RQLFilter value format + * `@param` value - Filter value of any type; primitives (boolean, number, string) are + * preserved with type information, while objects/arrays are stringified */ function convertFilterValue(value: unknown): RQLFilter["value"] {
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 43db9027-729f-43c1-8271-d759544e9a0d
⛔ Files ignored due to path filters (1)
web/pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (27)
web/sdk/package.jsonweb/sdk/react/utils/transform-query.tsweb/sdk/react/views-new/auth/magic-link-verify/magic-link-verify-view.tsxweb/sdk/react/views-new/auth/magic-link/magic-link-view.tsxweb/sdk/react/views-new/auth/subscribe/subscribe-view.tsxweb/sdk/react/views-new/billing/components/confirm-cycle-switch-dialog.tsxweb/sdk/react/views-new/billing/components/upcoming-billing-cycle.tsxweb/sdk/react/views-new/create-organization/create-organization-view.tsxweb/sdk/react/views-new/general/components/delete-organization-dialog.tsxweb/sdk/react/views-new/general/general-view.tsxweb/sdk/react/views-new/members/components/invite-member-dialog.tsxweb/sdk/react/views-new/members/components/member-columns.tsxweb/sdk/react/views-new/pat/components/pat-created-dialog.tsxweb/sdk/react/views-new/pat/components/pat-form-dialog.tsxweb/sdk/react/views-new/pat/components/pat-project-chips.tsxweb/sdk/react/views-new/plans/components/confirm-plan-change-dialog.tsxweb/sdk/react/views-new/profile/profile-view.tsxweb/sdk/react/views-new/projects/components/add-project-dialog.tsxweb/sdk/react/views-new/projects/components/edit-project-dialog.tsxweb/sdk/react/views-new/security/components/add-domain-dialog.tsxweb/sdk/react/views-new/security/components/delete-domain-dialog.tsxweb/sdk/react/views-new/security/components/verify-domain-dialog.tsxweb/sdk/react/views-new/service-accounts/components/add-service-account-dialog.tsxweb/sdk/react/views-new/service-accounts/components/add-token-form.tsxweb/sdk/react/views-new/teams/components/add-team-dialog.tsxweb/sdk/react/views-new/teams/components/edit-team-dialog.tsxweb/sdk/react/views-new/tokens/components/add-tokens-dialog.tsx
| "@connectrpc/connect-web": "2.1.1", | ||
| "@hookform/resolvers": "^3.10.0", | ||
| "@raystack/apsara-v1": "npm:@raystack/apsara@1.0.0-rc.2", | ||
| "@raystack/apsara-v1": "npm:@raystack/apsara@1.0.0-rc.5", |
There was a problem hiding this comment.
🧩 Analysis chain
🌐 Web query:
What are the breaking changes in @raystack/apsara version 1.0.0-rc.3, 1.0.0-rc.4, and 1.0.0-rc.5?
💡 Result:
No specific breaking changes documented for @raystack/apsara versions 1.0.0-rc.3, 1.0.0-rc.4, or 1.0.0-rc.5 in available sources. The latest release found is v1.0.0-rc.2 on 2026-03-30 [1]. Ongoing work includes modernizing to React 19, dropping React 18 support by removing deprecated forwardRef wrappers from 63 components, updating peer deps to react@^19, and removing displayName assignments, noted as a breaking change requiring React upgrade [2]. TypeScript improvements like eliminating any types and @ts-ignore also in progress, potentially breaking for type consumers [3]. npm shows versions up to 0.56.6, no 1.0 rc listings [4]. Check GitHub releases https://github.com/raystack/apsara/releases and issues for latest [1].
Citations:
- 1: https://github.com/raystack/apsara
- 2: Modernize React APIs and adopt current best practices apsara#649
- 3: TypeScript strictness: eliminate any, @ts-ignore, and export prop types apsara#675
- 4: https://registry.npmjs.org/%40raystack%2Fapsara
🏁 Script executed:
# First, let's check the actual package.json file to confirm the version being used
cat web/sdk/package.json | grep -A 2 -B 2 "apsara"Repository: raystack/frontier
Length of output: 640
🌐 Web query:
@raystack/apsara npm releases rc.3 rc.4 rc.5
💡 Result:
I couldn’t find evidence that @raystack/apsara has npm prerelease versions literally named rc.3, rc.4, and rc.5 (for example, 1.0.0-rc.3 / 1.0.0-rc.4 / 1.0.0-rc.5). What I can confirm from npm’s registry page is that the package has prerelease versions using the “-rc” suffix, and that as of the version-history table it includes a range like “0.55.0-rc.1 - 0.55.0-rc.4” (no rc.5 shown in the snippet I can access) and the latest published version listed there is v0.56.6 [1]. On the GitHub repository page, the “Latest release” shown there is “v1.0.0-rc.2” (prerelease), which again doesn’t demonstrate rc.3/rc.4/rc.5 specifically [2]. If you tell me what version line you mean (e.g., “0.55.x rc.3/rc.4/rc.5” vs “1.0.0-rc.3/rc.4/rc.5”), I can rerun the search with the exact version strings.
Citations:
🏁 Script executed:
# Check if there are any CHANGELOG or release notes in the repo that document version changes
find . -type f -name "CHANGELOG*" -o -name "RELEASES*" -o -name "HISTORY*" | head -20Repository: raystack/frontier
Length of output: 84
🏁 Script executed:
# Check the CHANGELOG for version history
head -100 web/sdk/CHANGELOG.mdRepository: raystack/frontier
Length of output: 584
🏁 Script executed:
# Search GitHub directly for `@raystack/apsara` releases with rc versions
# Use curl to query GitHub releases API
curl -s "https://api.github.com/repos/raystack/apsara/releases?per_page=100" | jq -r '.[] | select(.prerelease == true) | .tag_name' | grep "1.0.0-rc" | sort -VRepository: raystack/frontier
Length of output: 133
🏁 Script executed:
# Get detailed release notes for rc.3, rc.4, and rc.5
curl -s "https://api.github.com/repos/raystack/apsara/releases?per_page=100" | jq -r '.[] | select(.tag_name | test("1.0.0-rc.(3|4|5)")) | "Tag: \(.tag_name)\nBody:\n\(.body)\n---"'Repository: raystack/frontier
Length of output: 5973
Check for breaking changes in rc.3, rc.4, and rc.5.
The PR migrates from rc.2 to rc.5, skipping rc.3 and rc.4. While the InputField → Field + Input migration is already handled, the release notes document additional breaking changes:
- rc.4:
asprop replaced withrenderprop in Text and Headline components; Command component migrated to Base UI; Textarea size/variant API changes - rc.5: Color system migrated from HEX to OKLCH (affecting theme tokens);
overlay-base-primarytoken removed; Input component improvements
Verify that these changes are accounted for in the codebase integrations.
| return { case: "stringValue", value }; | ||
| default: | ||
| return { case: "stringValue", value: value ?? "" }; | ||
| return { case: "stringValue", value: value == null ? "" : String(value) }; |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Find usages of DataTableQuery filters and test coverage for convertFilterValue
# Check for test files covering this utility
fd -e test.ts -e test.tsx -e spec.ts | xargs rg -l 'convertFilterValue|transformDataTableQueryToRQLRequest'
# Look for actual filter.value usage patterns in the codebase
rg -n -C3 'filters.*value' --type=ts --type=tsx -g '!node_modules' -g '!dist'
# Check DataTableFilter type definition from Apsara (if locally installed)
rg -n 'export.*DataTableFilter' --type=ts -g '**/apsara*/**'Repository: raystack/frontier
Length of output: 238
🏁 Script executed:
#!/bin/bash
# Find test files and search for test coverage
echo "=== Test files mentioning transform-query or convertFilterValue ==="
find web -name "*test*" -o -name "*spec*" | head -20
echo "=== Search for tests covering this transformation ==="
rg -n "convertFilterValue|transformDataTableQueryToRQLRequest" web --type ts -g "*.test.ts" -g "*.spec.ts"
echo "=== Look for DataTableFilter type definition ==="
rg -n "interface DataTableFilter|type DataTableFilter|export.*DataTableFilter" web --type ts
echo "=== Check actual filter.value usage patterns ==="
rg -n "filter\.value|filters\[.*\]\.value" web --type ts -A2 -B2
echo "=== Examine the transform-query.ts file to understand context ==="
cat -n web/sdk/react/utils/transform-query.ts | head -50Repository: raystack/frontier
Length of output: 3731
🏁 Script executed:
#!/bin/bash
echo "=== Check if Apsara is installed and find its types ==="
find web -path "*/node_modules/@raystack/apsara*" -name "*.d.ts" 2>/dev/null | head -5
echo "=== Search for examples of filter creation/usage with specific types ==="
rg -n "DataTableFilter|filters.*:" web --type ts -B2 -A2 | head -60
echo "=== Look for any object or array being passed as filter value ==="
rg -n "value:.*\{|\[.*\]" web --type ts -g "!node_modules" | head -30
echo "=== Check if there are date range or date filters documented ==="
rg -n "dateValue|DateRange|dateRange|date.*filter" web --type ts -i | head -20
echo "=== Search for how filters are actually created in the frontend ==="
fd -e test.ts -e test.tsx | xargs rg -l "filter" 2>/dev/null | head -5
echo "=== Look at the admin app transform-query for more context ==="
head -70 web/apps/admin/src/utils/transform-query.tsRepository: raystack/frontier
Length of output: 9224
🏁 Script executed:
#!/bin/bash
echo "=== Compare both versions side-by-side ==="
echo "Admin app version (web/apps/admin/src/utils/transform-query.ts lines 24-30):"
sed -n '24,30p' web/apps/admin/src/utils/transform-query.ts
echo ""
echo "React SDK version (web/sdk/react/utils/transform-query.ts lines 25-35):"
sed -n '25,35p' web/sdk/react/utils/transform-query.ts
echo ""
echo "=== Check SDK utils version ==="
sed -n '25,35p' web/sdk/utils/transform-query.ts
echo ""
echo "=== Search for any test files that might test this conversion ==="
find web -name "*.test.ts" -o -name "*.test.tsx" | xargs grep -l "convertFilterValue\|transformDataTableQuery" 2>/dev/null
echo ""
echo "=== Look for usage of filter.value with complex types ==="
rg -n "filter\.value\s*=" web --type ts -B3 -A3Repository: raystack/frontier
Length of output: 1328
Verify type safety regression in convertFilterValue.
The function's parameter type was changed from string | number | boolean | null | undefined (in web/sdk/utils/ and web/apps/admin/) to unknown, but the default case still uses String() which produces unhelpful results for objects and arrays. This removes type safety that exists in other versions of the same function across the codebase.
Align this with the other implementations by either:
- Restoring the explicit parameter type to match
web/sdk/utils/transform-query.ts, or - Adding proper handling for non-primitive types if they're legitimately expected (though the other implementations suggest they're not).
Coverage Report for CI Build 25598071871Coverage remained the same at 41.963%Details
Uncovered ChangesNo uncovered changes found. Coverage RegressionsNo coverage regressions found. Coverage Stats
💛 - Coveralls |
Summary
@raystack/apsarafrom1.0.0-rc.2to1.0.0-rc.5in the SDK package.InputFieldusages acrossviews-new(auth, billing, profile, projects, security, members, teams, tokens, PATs, create-organization, general) to the newField+Inputcomposition exposed by Apsara.pat-form-dialog'sSelect.Valuerender so visible/remaining chip computation lives outside the render prop, matching the updatedSelectAPI.convertFilterValueintransform-query.tsto acceptunknownand stringify non-primitive values safely.