| 153 | // Fetch authentication status on component mount |
| 154 | useEffect(() => { |
| 155 | const fetchAuthStatus = async () => { |
| 156 | try { |
| 157 | setIsAuthLoading(true); |
| 158 | const response = await fetch('/api/auth/status'); |
| 159 | if (!response.ok) { |
| 160 | throw new Error(`HTTP error! status: ${response.status}`); |
| 161 | } |
| 162 | const data = await response.json(); |
| 163 | setAuthRequired(data.auth_required); |
| 164 | } catch (err) { |
| 165 | console.error("Failed to fetch auth status:", err); |
| 166 | // Assuming auth is required if fetch fails to avoid blocking UI for safety |
| 167 | setAuthRequired(true); |
| 168 | } finally { |
| 169 | setIsAuthLoading(false); |
| 170 | } |
| 171 | }; |
| 172 | |
| 173 | fetchAuthStatus(); |
| 174 | }, []); |