// 1. Shared Service (modal.service.ts) import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { BehaviorSubject, Observable } from 'rxjs'; @Injectable({ providedIn: 'root', }) export class PaymentService { private modalVisibleSubject = new BehaviorSubject(false); modalVisible$: Observable = this.modalVisibleSubject.asObservable(); private resolvePromise!: (value: boolean) => void; constructor(private http: HttpClient) {} openPaymentModal() { this.modalVisibleSubject.next(true); return new Promise(resolve => { this.resolvePromise = resolve; }); } accept(): void { this.modalVisibleSubject.next(false); this.resolvePromise(true); } reject(): void { this.modalVisibleSubject.next(false); this.resolvePromise(false); } processPayment(token: string): Observable { return this.http.post('/api/subscription', { token }); } }