refactor phase 7-8

frontend/src/pages/Sites/List.tsx

@@ -72,6 +72,10 @@ export default function SiteList() {
   const [selectedIndustry, setSelectedIndustry] = useState<string>('');
   const [selectedSectors, setSelectedSectors] = useState<string[]>([]);
   const [isSelectingSectors, setIsSelectingSectors] = useState(false);
+  const [userPreferences, setUserPreferences] = useState<{
+    selectedIndustry?: string;
+    selectedSectors?: string[];
+  } | null>(null);
   
   // Form state for site creation/editing
   const [formData, setFormData] = useState({
@@ -91,8 +95,25 @@ export default function SiteList() {
   useEffect(() => {
     loadSites();
     loadIndustries();
+    loadUserPreferences();
   }, []);
 
+  const loadUserPreferences = async () => {
+    try {
+      const { fetchAccountSetting } = await import('../../services/api');
+      const setting = await fetchAccountSetting('user_preferences');
+      const preferences = setting.config as { selectedIndustry?: string; selectedSectors?: string[] } | undefined;
+      if (preferences) {
+        setUserPreferences(preferences);
+      }
+    } catch (error: any) {
+      // 404 means preferences don't exist yet - that's fine
+      if (error.status !== 404) {
+        console.warn('Failed to load user preferences:', error);
+      }
+    }
+  };
+
   useEffect(() => {
     applyFilters();
   }, [sites, searchTerm, siteTypeFilter, hostingTypeFilter, statusFilter, integrationFilter]);
@@ -132,7 +153,26 @@ export default function SiteList() {
   const loadIndustries = async () => {
     try {
       const response = await fetchIndustries();
-      setIndustries(response.industries || []);
+      let allIndustries = response.industries || [];
+      
+      // Filter to show only user's pre-selected industries/sectors from account preferences
+      try {
+        const { fetchAccountSetting } = await import('../../services/api');
+        const setting = await fetchAccountSetting('user_preferences');
+        const preferences = setting.config as { selectedIndustry?: string; selectedSectors?: string[] } | undefined;
+        
+        if (preferences?.selectedIndustry) {
+          // Filter industries to only show the user's pre-selected industry
+          allIndustries = allIndustries.filter(i => i.slug === preferences.selectedIndustry);
+        }
+      } catch (error: any) {
+        // 404 means preferences don't exist yet - show all industries
+        if (error.status !== 404) {
+          console.warn('Failed to load user preferences for filtering:', error);
+        }
+      }
+      
+      setIndustries(allIndustries);
     } catch (error: any) {
       console.error('Failed to load industries:', error);
     }
@@ -387,7 +427,14 @@ export default function SiteList() {
   const getIndustrySectors = () => {
     if (!selectedIndustry) return [];
     const industry = industries.find(i => i.slug === selectedIndustry);
-    return industry?.sectors || [];
+    let sectors = industry?.sectors || [];
+    
+    // Filter to show only user's pre-selected sectors from account preferences
+    if (userPreferences?.selectedSectors && userPreferences.selectedSectors.length > 0) {
+      sectors = sectors.filter(s => userPreferences.selectedSectors!.includes(s.slug));
+    }
+    
+    return sectors;
   };
 
   const clearFilters = () => {