fix: update phone_numbers RLS policy and add browser country detection #97

- Updated RLS policy to allow all authenticated users to view available phone numbers
- Added browser-based country detection using navigator.language and timezone
- Auto-selects user's country from profile or browser detection
- Fixes issue where countries list was empty due to restrictive RLS policy

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

shopcall.ai-main/src/pages/IntegrationsRedirect.tsx

@@ -183,6 +183,50 @@ export default function IntegrationsRedirect() {
     validateAndSetup();
   }, [searchParams, t]);
 
+  // Detect browser/user country using various methods
+  const detectBrowserCountry = (): string | null => {
+    try {
+      // Method 1: Try to get from browser's navigator.language
+      const browserLang = navigator.language || (navigator as any).userLanguage;
+      if (browserLang) {
+        // Extract country code from locale (e.g., 'en-US' -> 'US', 'hu-HU' -> 'HU')
+        const parts = browserLang.split('-');
+        if (parts.length >= 2) {
+          return parts[1].toUpperCase();
+        }
+      }
+
+      // Method 2: Try Intl.DateTimeFormat
+      const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+      // Common timezone to country mappings
+      const timezoneCountryMap: { [key: string]: string } = {
+        'Europe/Budapest': 'HU',
+        'Europe/London': 'GB',
+        'America/New_York': 'US',
+        'America/Los_Angeles': 'US',
+        'America/Chicago': 'US',
+        'Europe/Berlin': 'DE',
+        'Europe/Paris': 'FR',
+        'Europe/Rome': 'IT',
+        'Europe/Madrid': 'ES',
+        'Europe/Vienna': 'AT',
+        'Europe/Brussels': 'BE',
+        'Europe/Amsterdam': 'NL',
+        'Europe/Warsaw': 'PL',
+        'America/Toronto': 'CA',
+        'America/Vancouver': 'CA'
+      };
+
+      if (timezone && timezoneCountryMap[timezone]) {
+        return timezoneCountryMap[timezone];
+      }
+    } catch (err) {
+      console.error('Error detecting browser country:', err);
+    }
+
+    return null;
+  };
+
   // Fetch available countries when user is authenticated
   useEffect(() => {
     const fetchCountries = async () => {
@@ -205,15 +249,24 @@ export default function IntegrationsRedirect() {
         if (response.ok) {
           const data = await response.json();
           setCountries(data.countries || []);
-          // Auto-select user's country if available
-          if (data.user_country) {
-            setUserCountry(data.user_country);
-            // Check if user's country is in the available countries list
-            const hasUserCountry = (data.countries || []).some(
-              (c: Country) => c.country_code === data.user_country
+
+          // Determine which country to auto-select
+          let countryToSelect = data.user_country;
+
+          // If user doesn't have a country set, try browser detection
+          if (!countryToSelect) {
+            countryToSelect = detectBrowserCountry();
+            console.log('[Integrations] Browser detected country:', countryToSelect);
+          }
+
+          if (countryToSelect) {
+            setUserCountry(countryToSelect);
+            // Check if the country is in the available countries list
+            const hasCountry = (data.countries || []).some(
+              (c: Country) => c.country_code === countryToSelect
             );
-            if (hasUserCountry) {
-              setSelectedCountry(data.user_country);
+            if (hasCountry) {
+              setSelectedCountry(countryToSelect);
             }
           }
         } else {