Skip to content

feat: optimize Stripe subscription management UI#4793

Merged
DIYgod merged 2 commits intodevfrom
DIYgod/pattaya
Jan 1, 2026
Merged

feat: optimize Stripe subscription management UI#4793
DIYgod merged 2 commits intodevfrom
DIYgod/pattaya

Conversation

@DIYgod
Copy link
Member

@DIYgod DIYgod commented Jan 1, 2026

Summary

Implements login-free Stripe Billing Portal Session for subscription management and enables canceled subscriptions to display status/expiration information. Updates both desktop and mobile UIs with subscription status indicators.

Changes

  • Replace static billing portal link with dynamic Stripe Billing Portal Session API integration
  • Support canceled subscriptions with valid period end dates in subscription queries
  • Add subscription status display with color-coded indicators (green/blue/yellow)
  • Update UI layout: status info above manage button
  • Add i18n translations for subscription status messages (en, zh-CN, zh-TW, ja)

PR Type

  • Feature
  • Bugfix
  • Hotfix
  • Other

- Replace static billing portal link with dynamic Stripe Billing Portal Session API
- Allow canceled subscriptions to display status and expiration date
- Show subscription status indicator with color coding (green/blue/yellow)
- Move status info above manage button for better layout
- Update UI for both desktop and mobile platforms
- Add translations for subscription status messages

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
@safedep
Copy link

safedep bot commented Jan 1, 2026

SafeDep Report Summary

Green Malicious Packages Badge Green Vulnerable Packages Badge Green Risky License Badge

No dependency changes detected. Nothing to scan.

This report is generated by SafeDep Github App

Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

@DIYgod
Copy link
Member Author

DIYgod commented Jan 1, 2026

Fixed in bc854d6 - replaced raw fetch with followClient.request() which properly injects the authentication cookie and required headers (X-Client-Id, X-Session-Id, User-Agent, etc.) on React Native.

@DIYgod
Copy link
Member Author

DIYgod commented Jan 1, 2026

@codex review

Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Replace raw fetch with followClient.request() to properly inject
authentication cookie and required headers on React Native.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
@DIYgod
Copy link
Member Author

DIYgod commented Jan 1, 2026

Fixed - changed body: JSON.stringify({ returnUrl: proxyEnv.WEB_URL }) to body: { returnUrl: proxyEnv.WEB_URL }. The HttpClient.processRequestBody in the SDK already handles JSON stringification for non-FormData bodies.

@DIYgod
Copy link
Member Author

DIYgod commented Jan 1, 2026

@codex review

Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment on lines +131 to +135
body: JSON.stringify({ returnUrl }),
})
const data = await res.json()
if (data.code === 0 && data.data?.url) {
window.open(data.data.url, "_blank")

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 Badge Avoid popup blockers when opening billing portal

On the web (non‑Electron) path, window.open runs only after awaiting the portal API response; most browsers treat that as not directly user‑initiated and will block the popup, so “Manage Subscription” silently does nothing for users with popup blocking enabled. Consider opening a blank tab synchronously on click and setting its location after the fetch (or redirecting the current tab) to keep it within the user‑gesture window.

Useful? React with 👍 / 👎.

@DIYgod DIYgod merged commit a86b2c6 into dev Jan 1, 2026
10 checks passed
@DIYgod DIYgod deleted the DIYgod/pattaya branch January 1, 2026 11:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant