From 122240d311c4ede02b13bb83c5681de9e8ef422c Mon Sep 17 00:00:00 2001 From: Kjetil Date: Sat, 28 Mar 2026 08:40:01 +0100 Subject: [PATCH] fix(payments): remove Stripe branding from card flows Use generic card and wallet copy in the payment and saved-card UI so users do not infer that a Stripe account is required. Add focused specs for the updated saved-card copy and transaction label. #1435 --- .../account-transactions.component.spec.ts | 35 +++++++++++ .../account-transactions.component.ts | 2 +- .../credit-cards/credit-cards.component.html | 2 +- .../credit-cards.component.spec.ts | 60 +++++++++++++++++++ .../stripe-add-card-dialog.component.html | 6 +- .../stripe-payment-dialog.component.html | 2 +- .../stripe-payment-dialog.component.ts | 8 +-- 7 files changed, 105 insertions(+), 10 deletions(-) create mode 100644 src/app/account-app/account-transactions.component.spec.ts create mode 100644 src/app/account-app/credit-cards/credit-cards.component.spec.ts diff --git a/src/app/account-app/account-transactions.component.spec.ts b/src/app/account-app/account-transactions.component.spec.ts new file mode 100644 index 000000000..5e91e54d0 --- /dev/null +++ b/src/app/account-app/account-transactions.component.spec.ts @@ -0,0 +1,35 @@ +// --------- BEGIN RUNBOX LICENSE --------- +// Copyright (C) 2016-2026 Runbox Solutions AS (runbox.com). +// +// This file is part of Runbox 7. +// +// Runbox 7 is free software: You can redistribute it and/or modify it +// under the terms of the GNU General Public License as published by the +// Free Software Foundation, either version 3 of the License, or (at your +// option) any later version. +// +// Runbox 7 is distributed in the hope that it will be useful, but +// WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Runbox 7. If not, see . +// ---------- END RUNBOX LICENSE ---------- + +import { of } from 'rxjs'; + +import { AccountTransactionsComponent } from './account-transactions.component'; +import { MobileQueryService } from '../mobile-query.service'; +import { RunboxWebmailAPI } from '../rmmapi/rbwebmail'; + +describe('AccountTransactionsComponent', () => { + it('shows a generic label for card-or-wallet transactions', () => { + const component = new AccountTransactionsComponent( + { matches: false, changed: of(false) } as MobileQueryService, + {} as RunboxWebmailAPI, + ); + + expect(component.methods.stripe).toBe('Card or wallet'); + }); +}); diff --git a/src/app/account-app/account-transactions.component.ts b/src/app/account-app/account-transactions.component.ts index bf260f62d..544bc4255 100644 --- a/src/app/account-app/account-transactions.component.ts +++ b/src/app/account-app/account-transactions.component.ts @@ -53,7 +53,7 @@ export class AccountTransactionsComponent implements OnInit { creditcard: 'Netaxept', giro: 'Offline', paypal: 'PayPal', - stripe: 'Stripe', + stripe: 'Card or wallet', }; statuses = { diff --git a/src/app/account-app/credit-cards/credit-cards.component.html b/src/app/account-app/credit-cards/credit-cards.component.html index a3b302b8f..2d291087b 100644 --- a/src/app/account-app/credit-cards/credit-cards.component.html +++ b/src/app/account-app/credit-cards/credit-cards.component.html @@ -14,7 +14,7 @@

Payment Cards

Here are the payment cards currently associated with your account.

-

The details of your payment cards are securely stored and processed by Stripe.

+

Your payment card details are handled securely through our card payment provider.

Runbox accepts a number of payment methods including credit and debit cards, PayPal, cryptocurrencies, and bank transfers. For details, please see Payment Methods.

diff --git a/src/app/account-app/credit-cards/credit-cards.component.spec.ts b/src/app/account-app/credit-cards/credit-cards.component.spec.ts new file mode 100644 index 000000000..ed2c881a9 --- /dev/null +++ b/src/app/account-app/credit-cards/credit-cards.component.spec.ts @@ -0,0 +1,60 @@ +// --------- BEGIN RUNBOX LICENSE --------- +// Copyright (C) 2016-2026 Runbox Solutions AS (runbox.com). +// +// This file is part of Runbox 7. +// +// Runbox 7 is free software: You can redistribute it and/or modify it +// under the terms of the GNU General Public License as published by the +// Free Software Foundation, either version 3 of the License, or (at your +// option) any later version. +// +// Runbox 7 is distributed in the hope that it will be useful, but +// WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU +// General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with Runbox 7. If not, see . +// ---------- END RUNBOX LICENSE ---------- + +import { NO_ERRORS_SCHEMA } from '@angular/core'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { of } from 'rxjs'; + +import { CreditCardsComponent } from './credit-cards.component'; +import { RunboxWebmailAPI } from '../../rmmapi/rbwebmail'; +import { RunboxContactSupportSnackBar } from '../../common/contact-support-snackbar.service'; +import { MatDialog } from '@angular/material/dialog'; + +describe('CreditCardsComponent', () => { + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [CreditCardsComponent], + providers: [ + { provide: MatDialog, useValue: { open: jasmine.createSpy('open') } }, + { + provide: RunboxWebmailAPI, + useValue: { + getCreditCards: () => of({ payment_methods: [], default: null }), + }, + }, + { provide: RunboxContactSupportSnackBar, useValue: { open: jasmine.createSpy('open') } }, + ], + schemas: [NO_ERRORS_SCHEMA], + }).compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(CreditCardsComponent); + fixture.detectChanges(); + }); + + it('describes card handling without naming Stripe', () => { + const text = fixture.nativeElement.textContent; + + expect(text).toContain('handled securely through our card payment provider'); + expect(text).not.toContain('Stripe'); + }); +}); diff --git a/src/app/account-app/credit-cards/stripe-add-card-dialog.component.html b/src/app/account-app/credit-cards/stripe-add-card-dialog.component.html index fa6038444..44eef7d65 100644 --- a/src/app/account-app/credit-cards/stripe-add-card-dialog.component.html +++ b/src/app/account-app/credit-cards/stripe-add-card-dialog.component.html @@ -31,13 +31,13 @@ } -

Credit card setup via Stripe

+

Add a payment card

Form not loading?

- Make sure your browser extensions are not blocking access to stripe.com. + Make sure your browser extensions are not blocking the payment form.

@@ -51,7 +51,7 @@

Credit card setup via Stripe

-
Loading Stripe form...
+
Loading payment form...
diff --git a/src/app/account-app/stripe-payment-dialog.component.html b/src/app/account-app/stripe-payment-dialog.component.html index 44fdd5801..7a224ba4d 100644 --- a/src/app/account-app/stripe-payment-dialog.component.html +++ b/src/app/account-app/stripe-payment-dialog.component.html @@ -11,7 +11,7 @@

Card or wallet payment

-
Loading Stripe payment form...
+
Loading payment form...
diff --git a/src/app/account-app/stripe-payment-dialog.component.ts b/src/app/account-app/stripe-payment-dialog.component.ts index 75bbd3c69..53c23a0c8 100644 --- a/src/app/account-app/stripe-payment-dialog.component.ts +++ b/src/app/account-app/stripe-payment-dialog.component.ts @@ -143,12 +143,12 @@ export class StripePaymentDialogComponent implements AfterViewInit { } } catch (err) { console.error(err); - this.stripeError = 'Stripe validate failed'; + this.stripeError = 'Unable to validate your payment details.'; this.state = 'failure'; return; } - this.processing_message = 'Sending details to Stripe .. '; + this.processing_message = 'Sending your payment details...'; try { const confirmed = await this.stripe.createConfirmationToken({ 'elements': this.elements}); @@ -169,7 +169,7 @@ export class StripePaymentDialogComponent implements AfterViewInit { }); } catch (err) { console.error(err); - this.stripeError = 'Stripe submit failed'; + this.stripeError = 'Unable to submit your payment details.'; this.state = 'failure'; return; } @@ -178,7 +178,7 @@ export class StripePaymentDialogComponent implements AfterViewInit { handleConfirmationToken(cId: string) { return new Promise((resolve, reject) => { - this.processing_message = 'Confirming payment with Stripe .. '; + this.processing_message = 'Submitting your payment...'; this.paymentsservice.submitStripePayment(this.tid, cId).subscribe(res => { if (res.status === 'requires_action') { this.processing_message = 'Updating payment after redirect .. ';