frontend/src/features/subscription/api/subscription.api.ts

@@ -1,8 +1,9 @@
 import { apiClient } from '../../../core/api/client';
-import type { CheckoutRequest, PaymentMethodUpdateRequest, DowngradeRequest } from '../types/subscription.types';
+import type { CheckoutRequest, PaymentMethodUpdateRequest, DowngradeRequest, NeedsVehicleSelectionResponse } from '../types/subscription.types';
 
 export const subscriptionApi = {
   getSubscription: () => apiClient.get('/subscriptions'),
+  needsVehicleSelection: () => apiClient.get<NeedsVehicleSelectionResponse>('/subscriptions/needs-vehicle-selection'),
   checkout: (data: CheckoutRequest) => apiClient.post('/subscriptions/checkout', data),
   cancel: () => apiClient.post('/subscriptions/cancel'),
   reactivate: () => apiClient.post('/subscriptions/reactivate'),

frontend/src/features/subscription/hooks/useSubscription.ts

@@ -19,6 +19,17 @@ export const useSubscription = () => {
   });
 };
 
+export const useNeedsVehicleSelection = () => {
+  const { isAuthenticated, isLoading } = useAuth0();
+
+  return useQuery({
+    queryKey: ['needs-vehicle-selection'],
+    queryFn: () => subscriptionApi.needsVehicleSelection(),
+    enabled: isAuthenticated && !isLoading,
+    staleTime: 0, // Always fetch fresh on login
+  });
+};
+
 export const useCheckout = () => {
   const queryClient = useQueryClient();
   return useMutation({

frontend/src/features/subscription/types/subscription.types.ts

@@ -41,3 +41,9 @@ export interface DowngradeRequest {
   targetTier: SubscriptionTier;
   vehicleIdsToKeep: string[];
 }
+
+export interface NeedsVehicleSelectionResponse {
+  needsSelection: boolean;
+  vehicleCount: number;
+  maxAllowed: number;
+}