added style, fixed login issue

backend/cmd/api/main.go

@@ -61,7 +61,7 @@ func main() {
 	notifConfigHandler := handlers.NewNotificationConfigHandler(notifConfigModel, userModel, cfg)
 	emailDigestHandler := handlers.NewEmailDigestHandler(emailDigestSvc, notifConfigModel)
 	statusHandler := handlers.NewStatusHandler(checkpointModel)
-	stripeHandler := handlers.NewStripeHandler(userModel, alertRuleModel, cfg)
+	stripeHandler := handlers.NewStripeHandler(userModel, cfg)
 	accountHandler := handlers.NewAccountHandler(userModel, addressModel, cfg)
 
 	authenticate := middleware.Authenticate(userModel)

backend/cmd/subscription-sweep/main.go

@@ -1,68 +0,0 @@
-// Package main runs a daily (cron-invoked) job: for paid tiers without an
-// active or trialling Stripe subscription, disable Firebase login and turn
-// off all alert rules until billing is restored via Stripe webhook / checkout.
-package main
-
-import (
-	"context"
-	"log"
-
-	"github.com/joho/godotenv"
-
-	"github.com/kjannette/koin-ping/backend/internal/config"
-	"github.com/kjannette/koin-ping/backend/internal/database"
-	"github.com/kjannette/koin-ping/backend/internal/firebase"
-	"github.com/kjannette/koin-ping/backend/internal/models"
-)
-
-func main() {
-	_ = godotenv.Load()
-
-	cfg, err := config.Load()
-	if err != nil {
-		log.Fatalf("Failed to load config: %v", err)
-	}
-
-	if err := firebase.Init(cfg.FirebaseProjectID); err != nil {
-		log.Fatalf("Failed to initialize Firebase: %v", err)
-	}
-
-	pool, connErr := database.Connect(cfg.DSN())
-	if connErr != nil {
-		log.Fatalf("Failed to connect to database: %v", connErr)
-	}
-
-	defer database.Close()
-
-	ctx := context.Background()
-	userModel := models.NewUserModel(pool)
-	alertModel := models.NewAlertRuleModel(pool)
-
-	users, listErr := userModel.ListPaidUsersWithoutActiveSubscription(ctx)
-	if listErr != nil {
-		log.Fatalf("Failed to list lapsed subscriptions: %v", listErr)
-	}
-
-	if len(users) == 0 {
-		log.Println("Subscription sweep: no lapsed paid users")
-		return
-	}
-
-	for _, u := range users {
-		if disableErr := firebase.SetUserDisabled(ctx, u.FirebaseUID, true); disableErr != nil {
-			log.Printf("Subscription sweep: Firebase disable failed user %s: %v", u.ID, disableErr)
-			continue
-		}
-
-		n, rulesErr := alertModel.DisableAllForUser(ctx, u.ID)
-		if rulesErr != nil {
-			log.Printf("Subscription sweep: disabling alerts failed for user %s: %v", u.ID, rulesErr)
-			continue
-		}
-
-		log.Printf(
-			"Subscription sweep: suspended user %s (%s tier, status=%s), disabled %d alert rules",
-			u.ID, u.SubscriptionTier, u.SubscriptionStatus, n,
-		)
-	}
-}

backend/internal/config/config.go

@@ -36,8 +36,6 @@ type Config struct {
 	StripeWebhookSecret    string
 	StripePriceIDPremium   string
 	StripePriceIDPro       string
-	StripePriceIDPremiumAnnual   string
-	StripePriceIDProAnnual       string
 	StripePublishableKey   string
 	FrontendURL            string
 }
@@ -64,8 +62,6 @@ func Load() (*Config, error) {
 		StripeWebhookSecret:    os.Getenv("STRIPE_WEBHOOK_SECRET"),
 		StripePriceIDPremium:   os.Getenv("STRIPE_PRICE_ID_PREMIUM"),
 		StripePriceIDPro:       os.Getenv("STRIPE_PRICE_ID_PRO"),
-		StripePriceIDPremiumAnnual:   os.Getenv("STRIPE_PRICE_ID_PREMIUM_ANNUAL"),
-		StripePriceIDProAnnual:       os.Getenv("STRIPE_PRICE_ID_PRO_ANNUAL"),
 		StripePublishableKey:   os.Getenv("STRIPE_PUBLISHABLE_KEY"),
 		FrontendURL:          getEnv("FRONTEND_URL", "http://localhost:3000"),
 	}
@@ -101,13 +97,10 @@ func (c *Config) DSN() string {
 // TierForPriceID maps a Stripe price ID back to the corresponding
 // subscription tier. Returns empty string if the price is unrecognised.
 func (c *Config) TierForPriceID(priceID string) string {
-	if priceID == "" {
-		return ""
-	}
 	switch priceID {
-	case c.StripePriceIDPremium, c.StripePriceIDPremiumAnnual:
+	case c.StripePriceIDPremium:
 		return "premium"
-	case c.StripePriceIDPro, c.StripePriceIDProAnnual:
+	case c.StripePriceIDPro:
 		return "pro"
 	default:
 		return ""

backend/internal/config/config_test.go

@@ -8,8 +8,6 @@ func TestTierForPriceID(t *testing.T) {
 	cfg := &Config{
 		StripePriceIDPremium: "price_premium_123",
 		StripePriceIDPro:     "price_pro_456",
-		StripePriceIDPremiumAnnual: "price_premium_yr",
-		StripePriceIDProAnnual:     "price_pro_yr",
 	}
 
 	tests := []struct {
@@ -18,8 +16,6 @@ func TestTierForPriceID(t *testing.T) {
 	}{
 		{"price_premium_123", "premium"},
 		{"price_pro_456", "pro"},
-		{"price_premium_yr", "premium"},
-		{"price_pro_yr", "pro"},
 		{"price_unknown", ""},
 		{"", ""},
 	}

backend/internal/firebase/users.go

@@ -1,22 +0,0 @@
-package firebase
-
-import (
-	"context"
-	"fmt"
-
-	"firebase.google.com/go/v4/auth"
-)
-
-// SetUserDisabled updates the Firebase user record's disabled flag.
-func SetUserDisabled(ctx context.Context, uid string, disabled bool) error {
-	if authClient == nil {
-		return fmt.Errorf("firebase auth not initialized") //nolint:err113
-	}
-	if uid == "" {
-		return nil
-	}
-
-	params := (&auth.UserToUpdate{}).Disabled(disabled)
-	_, err := authClient.UpdateUser(ctx, uid, params)
-	return err
-}

backend/internal/handlers/account.go

@@ -38,8 +38,8 @@ type accountResponse struct {
 
 var tierPlanLabels = map[domain.SubscriptionTier]string{ //nolint:gochecknoglobals
 	domain.TierFree:    "Free Trial",
-	domain.TierPremium: "Premium / $8.78 mo",
+	domain.TierPremium: "Premium / $1.99 mo",
-	domain.TierPro:     "Pro / $16.78 mo",
+	domain.TierPro:     "Pro / $11.99 mo",
 }
 
 func (h *AccountHandler) GetAccount(w http.ResponseWriter, r *http.Request) {

backend/internal/handlers/stripe.go

@@ -1,86 +1,36 @@
 package handlers
 
 import (
-	"context"
 	"encoding/json"
 	"fmt"
 	"io"
 	"log"
 	"net/http"
 
-	kpfirebase "github.com/kjannette/koin-ping/backend/internal/firebase"
-	"github.com/kjannette/koin-ping/backend/internal/config"
-	"github.com/kjannette/koin-ping/backend/internal/domain"
-	"github.com/kjannette/koin-ping/backend/internal/middleware"
-	"github.com/kjannette/koin-ping/backend/internal/models"
 	"github.com/stripe/stripe-go/v82"
 	portalsession "github.com/stripe/stripe-go/v82/billingportal/session"
 	checkoutsession "github.com/stripe/stripe-go/v82/checkout/session"
 	"github.com/stripe/stripe-go/v82/webhook"
+
+	"github.com/kjannette/koin-ping/backend/internal/config"
+	"github.com/kjannette/koin-ping/backend/internal/domain"
+	"github.com/kjannette/koin-ping/backend/internal/middleware"
+	"github.com/kjannette/koin-ping/backend/internal/models"
 )
 
 const webhookMaxBodyBytes = 65536
 
 type StripeHandler struct {
 	users *models.UserModel
-	alerts *models.AlertRuleModel
 	cfg   *config.Config
 }
 
-func NewStripeHandler(users *models.UserModel, alerts *models.AlertRuleModel, cfg *config.Config) *StripeHandler {
+func NewStripeHandler(users *models.UserModel, cfg *config.Config) *StripeHandler {
 	stripe.Key = cfg.StripeSecretKey
-	return &StripeHandler{users: users, alerts: alerts, cfg: cfg}
+	return &StripeHandler{users: users, cfg: cfg}
 }
 
-func (h *StripeHandler) ensureUserFirebaseAndAlertsEnabled(ctx context.Context, localUserID string) {
+func (h *StripeHandler) priceIDForTier(tier domain.SubscriptionTier) (string, error) {
-	user, err := h.users.GetByID(ctx, localUserID)
-	if err != nil || user == nil || user.FirebaseUID == "" {
-		return
-	}
-	if firebaseErr := kpfirebase.SetUserDisabled(ctx, user.FirebaseUID, false); firebaseErr != nil {
-		log.Printf("Billing access restore: firebase enable failed for user %s: %v", localUserID, firebaseErr)
-
-		return
-	}
-
-	n, alertsErr := h.alerts.EnableAllForUser(ctx, localUserID)
-	if alertsErr != nil {
-		log.Printf("Billing access restore: enable alerts failed for user %s: %v", localUserID, alertsErr)
-
-		return
-	}
-
-	log.Printf("Billing access restored: user %s, %d alert rules enabled", localUserID, n)
-}
-
-func (h *StripeHandler) restorePaidSubscriptionAccess(ctx context.Context, stripeCustomerID, status string) {
-	if stripeCustomerID == "" || (status != "active" && status != "trialing") {
-		return
-	}
-
-	u, err := h.users.GetByStripeCustomerID(ctx, stripeCustomerID)
-	if err != nil || u == nil {
-		if err != nil {
-			log.Printf("restorePaidSubscriptionAccess: lookup %s: %v", stripeCustomerID, err)
-		}
-
-		return
-	}
-
-	h.ensureUserFirebaseAndAlertsEnabled(ctx, u.ID)
-}
-
-func (h *StripeHandler) priceIDForTier(tier domain.SubscriptionTier, interval string) (string, error) {
-	if interval == "annual" {
-		switch tier {
-		case domain.TierPremium:
-			return h.cfg.StripePriceIDPremiumAnnual, nil
-		case domain.TierPro:
-			return h.cfg.StripePriceIDProAnnual, nil
-		default:
-			return "", fmt.Errorf("no Stripe price for tier %q", tier) //nolint:err113
-		}
-	}
 	switch tier {
 	case domain.TierPremium:
 		return h.cfg.StripePriceIDPremium, nil
@@ -97,7 +47,6 @@ func (h *StripeHandler) CreateCheckoutSession(w http.ResponseWriter, r *http.Req
 
 	var body struct {
 		Tier string `json:"tier"`
-		Interval string `json:"interval"`
 	}
 	if err := json.NewDecoder(r.Body).Decode(&body); err != nil {
 		writeError(w, http.StatusBadRequest, "BAD_REQUEST", "Invalid request body")
@@ -107,9 +56,6 @@ func (h *StripeHandler) CreateCheckoutSession(w http.ResponseWriter, r *http.Req
 	if body.Tier == "" {
 		body.Tier = "premium"
 	}
-	if body.Interval == "" {
-		body.Interval = "annual"
-	}
 
 	tier := domain.SubscriptionTier(body.Tier)
 	if tier != domain.TierPremium && tier != domain.TierPro {
@@ -117,7 +63,7 @@ func (h *StripeHandler) CreateCheckoutSession(w http.ResponseWriter, r *http.Req
 		return
 	}
 
-	priceID, err := h.priceIDForTier(tier, body.Interval)
+	priceID, err := h.priceIDForTier(tier)
 	if err != nil {
 		writeError(w, http.StatusBadRequest, "VALIDATION_ERROR", err.Error())
 		return
@@ -231,8 +177,6 @@ func (h *StripeHandler) VerifyCheckoutSession(w http.ResponseWriter, r *http.Req
 	if subscriptionID != "" && customerID != "" {
 		if err := h.users.ActivateSubscription(r.Context(), customerID, subscriptionID, "active", tier); err != nil {
 			log.Printf("VerifyCheckout: failed to activate subscription: %v", err)
-		} else {
-			h.restorePaidSubscriptionAccess(r.Context(), customerID, "active")
 		}
 	}
 
@@ -253,8 +197,6 @@ func (h *StripeHandler) ActivateFreeTier(w http.ResponseWriter, r *http.Request)
 		return
 	}
 
-	h.ensureUserFirebaseAndAlertsEnabled(r.Context(), userID)
-
 	log.Printf("Free tier activated for user %s", userID)
 	writeJSON(w, http.StatusOK, map[string]string{
 		"subscription_status": "active",
@@ -269,7 +211,6 @@ func (h *StripeHandler) CreateOnboardingCheckout(w http.ResponseWriter, r *http.
 	var body struct {
 		Email string `json:"email"`
 		Tier  string `json:"tier"`
-		Interval string `json:"interval"`
 	}
 	if err := json.NewDecoder(r.Body).Decode(&body); err != nil {
 		writeError(w, http.StatusBadRequest, "BAD_REQUEST", "Invalid request body")
@@ -284,9 +225,6 @@ func (h *StripeHandler) CreateOnboardingCheckout(w http.ResponseWriter, r *http.
 	if body.Tier == "" {
 		body.Tier = "premium"
 	}
-	if body.Interval == "" {
-		body.Interval = "annual"
-	}
 
 	tier := domain.SubscriptionTier(body.Tier)
 	if tier != domain.TierPremium && tier != domain.TierPro {
@@ -294,7 +232,7 @@ func (h *StripeHandler) CreateOnboardingCheckout(w http.ResponseWriter, r *http.
 		return
 	}
 
-	priceID, err := h.priceIDForTier(tier, body.Interval)
+	priceID, err := h.priceIDForTier(tier)
 	if err != nil {
 		writeError(w, http.StatusBadRequest, "VALIDATION_ERROR", err.Error())
 		return
@@ -424,8 +362,6 @@ func (h *StripeHandler) handleCheckoutCompleted(r *http.Request, event stripe.Ev
 	if subscriptionID != "" && customerID != "" {
 		if err := h.users.ActivateSubscription(r.Context(), customerID, subscriptionID, "active", tier); err != nil {
 			log.Printf("Failed to activate subscription: %v", err)
-		} else {
-			h.restorePaidSubscriptionAccess(r.Context(), customerID, "active")
 		}
 	}
 
@@ -465,12 +401,8 @@ func (h *StripeHandler) handleSubscriptionUpdated(r *http.Request, event stripe.
 
 	if err := h.users.ActivateSubscription(r.Context(), customerID, sub.ID, status, tier); err != nil {
 		log.Printf("Failed to update subscription: %v", err)
-
-		return
 	}
 
-	h.restorePaidSubscriptionAccess(r.Context(), customerID, status)
-
 	log.Printf("Subscription %s updated to %s (tier %s) for customer %s", sub.ID, status, tier, customerID)
 }
 

backend/internal/models/alert_rule.go

@@ -140,33 +140,3 @@ func (m *AlertRuleModel) Remove(ctx context.Context, id int) (bool, error) {
 	}
 	return tag.RowsAffected() > 0, nil
 }
-
-// DisableAllForUser sets enabled = false on every alert rule owned by addresses of userID.
-func (m *AlertRuleModel) DisableAllForUser(ctx context.Context, userID string) (int64, error) {
-	tag, err := m.pool.Exec(ctx,
-		`UPDATE alert_rules ar
-		 SET enabled = FALSE
-		 FROM addresses a
-		 WHERE ar.address_id = a.id AND a.user_id = $1`,
-		userID,
-	)
-	if err != nil {
-		return 0, err
-	}
-	return tag.RowsAffected(), nil
-}
-
-// EnableAllForUser sets enabled = true on every alert rule owned by addresses of userID.
-func (m *AlertRuleModel) EnableAllForUser(ctx context.Context, userID string) (int64, error) {
-	tag, err := m.pool.Exec(ctx,
-		`UPDATE alert_rules ar
-		 SET enabled = TRUE
-		 FROM addresses a
-		 WHERE ar.address_id = a.id AND a.user_id = $1`,
-		userID,
-	)
-	if err != nil {
-		return 0, err
-	}
-	return tag.RowsAffected(), nil
-}

backend/internal/models/user.go

@@ -130,46 +130,6 @@ func (m *UserModel) GetByID(ctx context.Context, id string) (*domain.User, error
 	return scanUser(row)
 }
 
-// GetByStripeCustomerID loads a user by their Stripe Customer ID if set.
-func (m *UserModel) GetByStripeCustomerID(ctx context.Context, stripeCustomerID string) (*domain.User, error) {
-	row := m.pool.QueryRow(ctx,
-		`SELECT `+userColumns+` FROM users WHERE stripe_customer_id = $1`,
-		stripeCustomerID,
-	)
-	return scanUser(row)
-}
-
-// ListPaidUsersWithoutActiveSubscription finds paid-tier rows whose Stripe
-// subscription is not active or trialing. Used by the periodic billing sweep.
-func (m *UserModel) ListPaidUsersWithoutActiveSubscription(ctx context.Context) ([]domain.User, error) {
-	rows, err := m.pool.Query(ctx,
-		`SELECT `+userColumns+` FROM users
-		 WHERE subscription_tier IN ('premium', 'pro')
-		   AND subscription_status NOT IN ('active', 'trialing')
-		   AND COALESCE(trim(firebase_uid), '') <> ''`,
-	)
-	if err != nil {
-		return nil, err
-	}
-	defer rows.Close()
-
-	out := []domain.User{}
-	for rows.Next() {
-		var u domain.User
-		rowErr := rows.Scan(
-			&u.ID, &u.FirebaseUID, &u.Email, &u.DisplayName,
-			&u.StripeCustomerID, &u.StripeSubscriptionID, &u.SubscriptionStatus,
-			&u.SubscriptionTier, &u.SubscriptionCreatedAt, &u.CreatedAt, &u.UpdatedAt,
-		)
-		if rowErr != nil {
-			return nil, rowErr
-		}
-		out = append(out, u)
-	}
-
-	return out, rows.Err()
-}
-
 func (m *UserModel) UpdateStripeCustomer(ctx context.Context, userID, stripeCustomerID string) error {
 	_, err := m.pool.Exec(ctx,
 		`UPDATE users SET stripe_customer_id = $2, updated_at = NOW() WHERE id = $1`,

frontend/src/App.jsx

@@ -11,7 +11,9 @@ import AlertHistory from "./pages/alertHistory/AlertHistory";
 import Account from "./pages/user_account/Account";
 
 export default function App() {
-  const { currentUser, isSubscribed } = useAuth();
+  const { currentUser, isSubscribed, loading } = useAuth();
+
+  if (loading) return null;
 
   if (!currentUser) {
     return (

frontend/src/api/stripe.jsx

@@ -1,12 +1,12 @@
 import { getAuthHeaders } from "./authHeaders";
 import { API_BASE } from "./config";
 
-export async function createCheckoutSession(tier = "premium", interval = "annual") {
+export async function createCheckoutSession(tier = "premium") {
     const headers = await getAuthHeaders();
     const res = await fetch(`${API_BASE}/stripe/create-checkout-session`, {
         method: "POST",
         headers: { ...headers, "Content-Type": "application/json" },
-        body: JSON.stringify({ tier, interval }),
+        body: JSON.stringify({ tier }),
     });
     if (!res.ok) {
         const data = await res.json();

frontend/src/components/TierPicker.css

@@ -1,45 +1,4 @@
 .tier-picker {
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-}
-
-.tier-picker__toggle {
-  display: flex;
-  justify-content: center;
-  gap: 0;
-}
-
-.tier-picker__toggle-btn {
-  padding: 0.75rem 1.5rem;
-  border: 1px solid var(--color-border);
-  background: transparent;
-  color: var(--color-text-dimmed);
-  cursor: pointer;
-  transition: all 0.2s;
-  font-weight: 500;
-}
-
-.tier-picker__toggle-btn:first-child {
-  border-radius: 8px 0 0 8px;
-}
-
-.tier-picker__toggle-btn:last-child {
-  border-radius: 0 8px 8px 0;
-  border-left: none;
-}
-
-.tier-picker__toggle-btn--active {
-  background: var(--color-primary);
-  color: white;
-  border-color: var(--color-primary);
-}
-
-.tier-picker__toggle-btn:last-child.tier-picker__toggle-btn--active {
-  border-left: 1px solid var(--color-primary);
-}
-
-.tier-picker__cards {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 1rem;
@@ -153,7 +112,7 @@
 }
 
 @media (max-width: 768px) {
-  .tier-picker__cards {
+  .tier-picker {
     grid-template-columns: 1fr;
     max-width: 400px;
     margin: 0 auto;

frontend/src/components/TierPicker.jsx

@@ -1,12 +1,11 @@
-import { useState } from "react";
 import "./TierPicker.css";
 
 const TIERS = [
   {
     id: "free",
     name: "Trial Monitoring",
-    price: { monthly: "$0", annual: "$0" },
+    price: "$0",
-    period: { monthly: "", annual: "" },
+    period: "",
     features: [
       "Monitor 1 blockchain address 24/7",
       "Configure alerts to fire on trigger events",
@@ -17,8 +16,8 @@ const TIERS = [
   {
     id: "premium",
     name: "Premium Monitoring",
-    price: { monthly: "$8.78", annual: "$94.78" },
+    price: "$1.99",
-    period: { monthly: "/month", annual: "/year" },
+    period: "/month",
     features: [
       "Monitor 3 blockchain addresses",
       "Configure two types of rule-based alerts to fire on trigger events for each of the three addresses",
@@ -32,8 +31,8 @@ const TIERS = [
   {
     id: "pro",
     name: "Professional Monitoring",
-    price: { monthly: "$16.78", annual: "$181.78" },
+    price: "$11.99",
-    period: { monthly: "/month", annual: "/year" },
+    period: "/month",
     features: [
       "Monitor unlimited blockchain addresses",
       "Configure unlimited alert rules to fire on unlimited events on any address",
@@ -48,26 +47,8 @@ const TIERS = [
 ];
 
 export default function TierPicker({ onSelect, selectedTier }) {
-  const [isAnnual, setIsAnnual] = useState(true);
-
   return (
     <div className="tier-picker">
-      <div className="tier-picker__toggle">
-        <button
-          className={`tier-picker__toggle-btn${!isAnnual ? " tier-picker__toggle-btn--active" : ""}`}
-          onClick={() => setIsAnnual(false)}
-        >
-          Monthly
-        </button>
-        <button
-          className={`tier-picker__toggle-btn${isAnnual ? " tier-picker__toggle-btn--active" : ""}`}
-          onClick={() => setIsAnnual(true)}
-        >
-          Annual
-        </button>
-      </div>
-
-      <div className="tier-picker__cards">
       {TIERS.map((tier) => (
         <div
           key={tier.id}
@@ -78,13 +59,9 @@ export default function TierPicker({ onSelect, selectedTier }) {
           )}
           <h3 className="tier-picker__name">{tier.name}</h3>
           <div className="tier-picker__price">
-              <span className="tier-picker__amount">
+            <span className="tier-picker__amount">{tier.price}</span>
-                {isAnnual ? tier.price.annual : tier.price.monthly}
+            {tier.period && (
-              </span>
+              <span className="tier-picker__period">{tier.period}</span>
-              {(isAnnual ? tier.period.annual : tier.period.monthly) && (
-                <span className="tier-picker__period">
-                  {isAnnual ? tier.period.annual : tier.period.monthly}
-                </span>
             )}
           </div>
           <ul className="tier-picker__features">
@@ -101,13 +78,12 @@ export default function TierPicker({ onSelect, selectedTier }) {
           </ul>
           <button
             className={`btn tier-picker__btn${selectedTier === tier.id ? " tier-picker__btn--selected" : ""}`}
-              onClick={() => onSelect(tier.id, isAnnual ? "annual" : "monthly")}
+            onClick={() => onSelect(tier.id)}
           >
             {selectedTier === tier.id ? "Selected" : "Select"}
           </button>
         </div>
       ))}
     </div>
-    </div>
   );
 }

frontend/src/contexts/AuthContext.jsx

@@ -1,4 +1,4 @@
-import { createContext, useContext, useSyncExternalStore } from "react";
+import { createContext, useContext, useState, useEffect, useCallback } from "react";
 import {
   onAuthStateChanged,
   signInWithEmailAndPassword,
@@ -17,98 +17,90 @@ const DEFAULT_TIER_LIMITS = {
   allowed_channels: ["email"],
 };
 
-// External auth store - lives outside React
+export function AuthProvider({ children }) {
-const createAuthStore = () => {
+  const [currentUser, setCurrentUser] = useState(null);
-  let state = {
+  const [userTier, setUserTier] = useState("free");
-    currentUser: null,
+  const [tierLimits, setTierLimits] = useState(DEFAULT_TIER_LIMITS);
-    userTier: "free",
+  const [isSubscribed, setIsSubscribed] = useState(false);
-    tierLimits: DEFAULT_TIER_LIMITS,
+  const [loading, setLoading] = useState(true);
-    isSubscribed: false,
-    loading: true,
-  };
-  const listeners = new Set();
 
-  const notify = () => listeners.forEach((fn) => fn());
+  const fetchAccount = useCallback(async () => {
-
-  const setState = (partial) => {
-    state = { ...state, ...partial };
-    notify();
-  };
-
-  const fetchAccount = async () => {
     try {
       const data = await getAccount();
-      setState({
+      setUserTier(data.subscription_tier || "free");
-        userTier: data.subscription_tier || "free",
+      setTierLimits(data.tier_limits || DEFAULT_TIER_LIMITS);
-        tierLimits: data.tier_limits || DEFAULT_TIER_LIMITS,
+      setIsSubscribed(
-        isSubscribed:
         data.subscription_status === "active" ||
           data.subscription_status === "trialing",
-      });
+      );
     } catch {
-      setState({ isSubscribed: false });
+      setUserTier("free");
+      setTierLimits(DEFAULT_TIER_LIMITS);
+      setIsSubscribed(false);
     }
-  };
+  }, []);
 
-  // Set up Firebase listener once, outside of React
+  useEffect(() => {
-  onAuthStateChanged(auth, async (user) => {
+    const unsubscribe = onAuthStateChanged(auth, async (user) => {
-    setState({ loading: true, currentUser: user });
       if (user) {
+        setLoading(true);
+        setCurrentUser(user);
         await fetchAccount();
       } else {
-      setState({ isSubscribed: false, userTier: "free", tierLimits: DEFAULT_TIER_LIMITS });
+        setCurrentUser(null);
+        setUserTier("free");
+        setTierLimits(DEFAULT_TIER_LIMITS);
+        setIsSubscribed(false);
       }
-    setState({ loading: false });
+      setLoading(false);
     });
+    return unsubscribe;
+  }, [fetchAccount]);
 
-  return {
+  async function signup(email, password) {
-    subscribe: (listener) => {
+    const cred = await createUserWithEmailAndPassword(auth, email, password);
-      listeners.add(listener);
+    return cred.user;
-      return () => listeners.delete(listener);
-    },
-    getSnapshot: () => state,
-    refreshAccount: fetchAccount,
-  };
-};
-
-const authStore = createAuthStore();
-
-export function AuthProvider({ children }) {
-  const state = useSyncExternalStore(authStore.subscribe, authStore.getSnapshot);
-
-  const signup = (email, password) => createUserWithEmailAndPassword(auth, email, password);
-  const login = (email, password) => signInWithEmailAndPassword(auth, email, password);
-  const logout = () => signOut(auth);
-
-  const sendEmailVerification = () => {
-    if (auth.currentUser) {
-      return firebaseSendEmailVerification(auth.currentUser);
   }
-  };
 
-  const reloadUser = async () => {
+  async function login(email, password) {
+    const cred = await signInWithEmailAndPassword(auth, email, password);
+    return cred.user;
+  }
+
+  async function logout() {
+    await signOut(auth);
+  }
+
+  async function sendEmailVerification() {
+    if (auth.currentUser) {
+      await firebaseSendEmailVerification(auth.currentUser);
+    }
+  }
+
+  async function reloadUser() {
     if (auth.currentUser) {
       await auth.currentUser.reload();
+      setCurrentUser({ ...auth.currentUser });
       return auth.currentUser;
     }
     return null;
-  };
+  }
 
   const value = {
-    ...state,
+    currentUser,
+    userTier,
+    tierLimits,
+    isSubscribed,
+    loading,
     signup,
     login,
     logout,
     sendEmailVerification,
     reloadUser,
-    refreshAccount: authStore.refreshAccount,
+    refreshAccount: fetchAccount,
   };
 
-  return (
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
-    <AuthContext.Provider value={value}>
-      {!state.loading && children}
-    </AuthContext.Provider>
-  );
 }
 
 export function useAuth() {

frontend/src/index.css

@@ -82,8 +82,10 @@ button {
 
 .page {
   max-width: 800px;
+  height: 100%;
   margin: 0 auto;
   padding: 2rem;
+  background-color: red;
 }
 
 .page--wide {
@@ -412,8 +414,6 @@ button {
   }
 
   .page {
-    background-color: var(--color-bg);
-    height: 920px;
     padding: 1rem 0.75rem;
   }
 

frontend/src/pages/addresses/Addresses.css

@@ -33,9 +33,8 @@
 
 @media (max-width: 480px) {
   .address__remove {
-    padding: 0rem 0.9rem;
+    margin-left: 0.5rem;
+    padding: 0.25rem 0.5rem;
     font-size: 0.8rem;
-    margin-left: -3rem;
-    margin-bottom: 2rem;
   }
 }

frontend/src/pages/subscribe/Subscribe.jsx

@@ -39,7 +39,6 @@ export default function Subscribe() {
     password: "",
     confirmPassword: "",
     selectedTier: null,
-    billingInterval: "annual",
   });
   const [error, setError] = useState(
     searchParams.get("payment") === "cancelled"
@@ -127,7 +126,7 @@ export default function Subscribe() {
         await refreshAccount();
         navigate("/addresses", { replace: true });
       } else {
-        const { url } = await createCheckoutSession(data.selectedTier, data.billingInterval);
+        const { url } = await createCheckoutSession(data.selectedTier);
         window.location.href = url;
       }
     } catch (err) {
@@ -246,10 +245,7 @@ export default function Subscribe() {
           Select the plan that works best for you. You can upgrade anytime.
         </p>
         <TierPicker
-          onSelect={(tier, interval) => {
+          onSelect={(tier) => set("selectedTier", tier)}
-            set("selectedTier", tier);
-            set("billingInterval", interval);
-          }}
           selectedTier={data.selectedTier}
         />
       </>