-
Notifications
You must be signed in to change notification settings - Fork 374
chore(clerk-js, types): Cleanup naming inconsistencies in billing dates #6513
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
--- | ||
'@clerk/clerk-js': minor | ||
'@clerk/types': minor | ||
--- | ||
|
||
[Billing Beta] Cleanup naming inconsistencies in billing dates. | ||
|
||
## Migration | ||
- subscriptionItem.periodStartDate → subscriptionItem.periodStart | ||
- subscriptionItem.periodEndDate → subscriptionItem.periodEnd | ||
- subscriptionItem.canceledAtDate → subscriptionItem.canceledAt |
Original file line number | Diff line number | Diff line change | ||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
@@ -129,7 +129,7 @@ export const usePlansContext = () => { | |||||||||||||||||||||||||||||||||||||||||||
// should the default plan be shown as active | ||||||||||||||||||||||||||||||||||||||||||||
const isDefaultPlanImplicitlyActiveOrUpcoming = useMemo(() => { | ||||||||||||||||||||||||||||||||||||||||||||
// are there no subscriptions or are all subscriptions canceled | ||||||||||||||||||||||||||||||||||||||||||||
return subscriptionItems.length === 0 || !subscriptionItems.some(subscription => !subscription.canceledAtDate); | ||||||||||||||||||||||||||||||||||||||||||||
return subscriptionItems.length === 0 || !subscriptionItems.some(subscription => !subscription.canceledAt); | ||||||||||||||||||||||||||||||||||||||||||||
}, [subscriptionItems]); | ||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||
// return the active or upcoming subscription for a plan if it exists | ||||||||||||||||||||||||||||||||||||||||||||
|
@@ -178,7 +178,7 @@ export const usePlansContext = () => { | |||||||||||||||||||||||||||||||||||||||||||
({ plan, subscription: sub }: { plan?: CommercePlanResource; subscription?: CommerceSubscriptionItemResource }) => { | ||||||||||||||||||||||||||||||||||||||||||||
const subscription = sub ?? (plan ? activeOrUpcomingSubscription(plan) : undefined); | ||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||
return !subscription || !subscription.canceledAtDate; | ||||||||||||||||||||||||||||||||||||||||||||
return !subscription || !subscription.canceledAt; | ||||||||||||||||||||||||||||||||||||||||||||
}, | ||||||||||||||||||||||||||||||||||||||||||||
[activeOrUpcomingSubscription], | ||||||||||||||||||||||||||||||||||||||||||||
); | ||||||||||||||||||||||||||||||||||||||||||||
|
@@ -214,7 +214,7 @@ export const usePlansContext = () => { | |||||||||||||||||||||||||||||||||||||||||||
const getLocalizationKey = () => { | ||||||||||||||||||||||||||||||||||||||||||||
// Handle subscription cases | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription) { | ||||||||||||||||||||||||||||||||||||||||||||
if (_selectedPlanPeriod !== subscription.planPeriod && subscription.canceledAtDate) { | ||||||||||||||||||||||||||||||||||||||||||||
if (_selectedPlanPeriod !== subscription.planPeriod && subscription.canceledAt) { | ||||||||||||||||||||||||||||||||||||||||||||
if (_selectedPlanPeriod === 'month') { | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('commerce.switchToMonthly'); | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
|
@@ -224,7 +224,7 @@ export const usePlansContext = () => { | |||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||
if (subscription.canceledAtDate) { | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription.canceledAt) { | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('commerce.reSubscribe'); | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||
|
@@ -268,14 +268,14 @@ export const usePlansContext = () => { | |||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||||||||||||||
if (subscription.status === 'upcoming') { | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__startsAt', { date: subscription.periodStartDate }); | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__startsAt', { date: subscription.periodStart }); | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription.canceledAtDate) { | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription.canceledAt) { | ||||||||||||||||||||||||||||||||||||||||||||
// @ts-expect-error `periodEndDate` is always defined when `canceledAtDate` exists | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__canceledEndsAt', { date: subscription.periodEndDate }); | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__canceledEndsAt', { date: subscription.periodEnd }); | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription.periodEndDate) { | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__renewsAt', { date: subscription.periodEndDate }); | ||||||||||||||||||||||||||||||||||||||||||||
if (subscription.periodEnd) { | ||||||||||||||||||||||||||||||||||||||||||||
return localizationKeys('badge__renewsAt', { date: subscription.periodEnd }); | ||||||||||||||||||||||||||||||||||||||||||||
} | ||||||||||||||||||||||||||||||||||||||||||||
Comment on lines
+271
to
279
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 🛠️ Refactor suggestion Remove stale ts-expect-error and add a type-safe guard The Apply: - if (subscription.canceledAt) {
- // @ts-expect-error `periodEndDate` is always defined when `canceledAtDate` exists
- return localizationKeys('badge__canceledEndsAt', { date: subscription.periodEnd });
- }
+ if (subscription.canceledAt && subscription.periodEnd) {
+ return localizationKeys('badge__canceledEndsAt', { date: subscription.periodEnd });
+ } This reflects the new invariant and keeps the code type-safe. 📝 Committable suggestion
Suggested change
🤖 Prompt for AI Agents
|
||||||||||||||||||||||||||||||||||||||||||||
return; | ||||||||||||||||||||||||||||||||||||||||||||
}, []); | ||||||||||||||||||||||||||||||||||||||||||||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Verification agent
🧩 Analysis chain
Public API rename: add JSDoc, confirm breaking-change handling
Great move consolidating to Date-based fields. Since these are public properties, please:
Apply JSDoc locally:
If you want temporary runtime back-compat, add in this class (types remain removed):
🏁 Script executed:
Length of output: 1125
Add JSDoc, update changeset, and docs for renamed subscription fields
Please apply the following to fully cover this public-API change:
• In
packages/clerk-js/src/core/resources/CommerceSubscription.ts
(around lines 65–67), add JSDoc to the new Date fields:• Ensure you’ve created or updated a
.changeset/…md
entry underpackages/clerk-js
that calls out the breaking-change of these property renames and type updates.• Update any public documentation or API reference to use
periodStart
,periodEnd
, andcanceledAt
instead of the old fields.Optional, for smoother migration you can add deprecated runtime getters:
🤖 Prompt for AI Agents