Show Creem webhook callback URL

[asdv23]

Summary

• add a payment webhook URL helper with focused tests
• show the Creem webhook callback URL in the settings page
• localize the webhook label and use a caller-provided fallback base label

Test Plan

• node --test web/src/helpers/paymentWebhook.test.mjs
• npx eslint src/helpers/paymentWebhook.js src/helpers/paymentWebhook.test.mjs src/pages/Setting/Payment/SettingsPaymentGatewayCreem.jsx

Summary by CodeRabbit

• New Features

  • Added webhook URL functionality to payment gateway settings, with automatic generation and fallback handling for different server configurations.
  • Webhook URL is now displayed in the Creem payment settings interface.

• Localization

  • Added webhook label translations for English, French, Japanese, Russian, Vietnamese, Simplified Chinese, and Traditional Chinese.

• Tests

  • Added comprehensive test coverage for webhook URL generation with various configuration scenarios.

[coderabbitai]

Walkthrough

Adds a payment webhook URL helper function that constructs normalized URLs for payment providers and integrates it into the Creem payment gateway settings UI. Includes unit tests and translation entries across six locales for the new "Webhook" label.

Changes

Cohort / File(s)	Summary
Webhook URL Helper web/src/helpers/paymentWebhook.js, web/src/helpers/paymentWebhook.test.mjs	New utility function getPaymentWebhookUrl() that normalizes server addresses, handles fallback labels, and constructs standardized webhook URLs. Comprehensive unit tests verify URL construction, fallback logic, trailing slash normalization, and relative path defaults.
Localization Entries web/src/i18n/locales/en.json, fr.json, ja.json, ru.json, vi.json, zh-CN.json, zh-TW.json	Added translation entry for "Webhook 填：" label across 7 locale files with localized equivalents (e.g., "Webhook:" in English, "Webhook :" in French).
Payment Gateway Settings UI web/src/pages/Setting/Payment/SettingsPaymentGatewayCreem.jsx	Integrated webhook URL helper; now calls getPaymentWebhookUrl() with server address and fallback label, then displays the computed webhook URL in a Banner component within the Creem settings form.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• 新增 creem 支付 #1823 — Implements Creem payment gateway endpoints and settings component; this PR adds the webhook URL helper and display that complements the Creem integration foundation.

Suggested reviewers

• seefs001

Poem

🐰 A helper hops to build the hook,
With fallback charm and tested look,
Webhooks now dance in seven tongues,
While settings sing of URLs strung! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title accurately summarizes the main change: adding display of the Creem webhook callback URL on the settings page, which is the primary purpose of the changeset.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

📝 Coding Plan

• Generate coding plan for human review comments

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@web/src/i18n/locales/vi.json`:
- Line 2667: The Vietnamese translation for the key "Webhook 填：" should preserve
the "fill in" action to match other prompts; update the value for the string
"Webhook 填：" to a consistent phrase such as "Điền Webhook:" or "Điền vào
Webhook:" so it aligns with existing "Điền …" prompts in the locale file.

In `@web/src/i18n/locales/zh-TW.json`:
- Line 1928: Replace the current zh-TW translation value "Webhook 填：" with a
neutral, read-only label such as "Webhook：" (or "Webhook（只讀）：" if you want to
explicitly indicate read-only); locate the "Webhook 填：" entry in the zh-TW.json
file and update the value accordingly so the displayed callback URL no longer
implies user input.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 92033ca6-34f4-4819-8704-6110784e6820

📥 Commits

Reviewing files that changed from the base of the PR and between 4e1b05e and 0079b8f.

📒 Files selected for processing (10)

• web/src/helpers/paymentWebhook.js
• web/src/helpers/paymentWebhook.test.mjs
• web/src/i18n/locales/en.json
• web/src/i18n/locales/fr.json
• web/src/i18n/locales/ja.json
• web/src/i18n/locales/ru.json
• web/src/i18n/locales/vi.json
• web/src/i18n/locales/zh-CN.json
• web/src/i18n/locales/zh-TW.json
• web/src/pages/Setting/Payment/SettingsPaymentGatewayCreem.jsx