From 9a464e8cc8e76e7384f1daeda0fdf40b9e73aebc Mon Sep 17 00:00:00 2001
From: Connor Yoh <connor@stirlingpdf.com>
Date: Mon, 24 Nov 2025 14:34:33 +0000
Subject: [PATCH] Auto detect currency

---
 .../shared/stripeCheckout/StripeCheckout.tsx  |  3 ---
 .../stripeCheckout/stages/PaymentStage.tsx    | 24 +------------------
 .../stages/PlanSelectionStage.tsx             |  7 ++----
 .../proprietary/utils/protocolDetection.ts    |  8 +++----
 4 files changed, 7 insertions(+), 35 deletions(-)

diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
index bdfd396ebc..e0cac1a80e 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
@@ -236,9 +236,6 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
           <PaymentStage
             clientSecret={checkoutState.state.clientSecret || null}
             selectedPlan={checkoutState.selectedPlan}
-            selectedPeriod={checkoutState.selectedPeriod}
-            planName={planGroup.name}
-            loading={checkoutState.state.loading || false}
             onPaymentComplete={session.handlePaymentComplete}
           />
         );
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
index dcf5dd1182..9cee1983cd 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Stack, Button, Paper, Group, Text, Loader } from '@mantine/core';
+import { Stack, Text, Loader } from '@mantine/core';
 import { useTranslation } from 'react-i18next';
 import { loadStripe } from '@stripe/stripe-js';
 import { EmbeddedCheckoutProvider, EmbeddedCheckout } from '@stripe/react-stripe-js';
@@ -12,18 +12,12 @@ const stripePromise = STRIPE_KEY ? loadStripe(STRIPE_KEY) : null;
 interface PaymentStageProps {
   clientSecret: string | null;
   selectedPlan: PlanTier | null;
-  selectedPeriod: 'monthly' | 'yearly';
-  planName: string;
-  loading: boolean;
   onPaymentComplete: () => void;
 }
 
 export const PaymentStage: React.FC<PaymentStageProps> = ({
   clientSecret,
   selectedPlan,
-  selectedPeriod,
-  planName,
-  loading,
   onPaymentComplete,
 }) => {
   const { t } = useTranslation();
@@ -50,22 +44,6 @@ export const PaymentStage: React.FC<PaymentStageProps> = ({
 
   return (
     <Stack gap="md">
-      {/* Selected plan summary */}
-      <Paper withBorder p="md" radius="md" bg="gray.0">
-        <Group justify="space-between">
-          <div>
-            <Text size="sm" c="dimmed">
-              {t('payment.paymentStage.selectedPlan', 'Selected Plan')}
-            </Text>
-            <Text size="lg" fw={600}>
-              {planName} - {selectedPeriod === 'yearly' ? t('payment.yearly', 'Yearly') : t('payment.monthly', 'Monthly')}
-            </Text>
-          </div>
-          <Text size="xl" fw={700}>
-            {selectedPlan.currency}{selectedPlan.price.toFixed(2)}
-          </Text>
-        </Group>
-      </Paper>
 
       {/* Stripe Embedded Checkout */}
       <EmbeddedCheckoutProvider
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
index 967a27adef..f7a6fdb34b 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
@@ -6,7 +6,7 @@ import { SavingsCalculation } from '@app/components/shared/stripeCheckout/types/
 import { PricingBadge } from '@app/components/shared/stripeCheckout/components/PricingBadge';
 import { PriceDisplay } from '@app/components/shared/stripeCheckout/components/PriceDisplay';
 import { formatPrice, calculateMonthlyEquivalent, calculateTotalWithSeats } from '@app/components/shared/stripeCheckout/utils/pricingUtils';
-import { getClickablePaperStyle, PRICE_FONT_WEIGHT } from '@app/components/shared/stripeCheckout/utils/cardStyles';
+import { getClickablePaperStyle } from '@app/components/shared/stripeCheckout/utils/cardStyles';
 
 interface PlanSelectionStageProps {
   planGroup: PlanTierGroup;
@@ -118,10 +118,7 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                     <Text size="sm" c="dimmed">
                       {t('payment.planStage.billedYearly', 'Billed yearly at {{currency}}{{amount}}', {
                         currency: planGroup.yearly.currency,
-                        amount: formatPrice(
-                          calculateTotalWithSeats(planGroup.yearly.price, planGroup.yearly.seatPrice, seatCount),
-                          planGroup.yearly.currency
-                        )
+                        amount: calculateTotalWithSeats(planGroup.yearly.price, planGroup.yearly.seatPrice, seatCount).toFixed(2)
                       })}
                     </Text>
                   </Stack>
diff --git a/frontend/src/proprietary/utils/protocolDetection.ts b/frontend/src/proprietary/utils/protocolDetection.ts
index 9bd9ce03b7..4b97f38bb8 100644
--- a/frontend/src/proprietary/utils/protocolDetection.ts
+++ b/frontend/src/proprietary/utils/protocolDetection.ts
@@ -10,13 +10,13 @@
 export function isSecureContext(): boolean {
   // Allow localhost for development (works with both HTTP and HTTPS)
   if (typeof window !== 'undefined') {
-    // const hostname = window.location.hostname;
     const protocol = window.location.protocol;
 
     // Localhost is considered secure for development
-    // if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '[::1]') {
-    //   return true;
-    // }
+    const hostname = window.location.hostname;
+    if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '[::1]') {
+      return true;
+    }
 
     // Check if HTTPS
     return protocol === 'https:';