Refactor API endpoint handling in admin and main JavaScript files to support explicit endpoint configuration. Update config.js to define a new API endpoint variable, enhancing flexibility in API integration.

Author: a-a-k

assets/js/admin.js

@@ -11,11 +11,26 @@ document.addEventListener('DOMContentLoaded', () => {
     const resetAuthButton = document.getElementById('reset-auth-button');
     const ADMIN_PASS_STORAGE_KEY = 'mb3r-admin-pass';
     const storage = window.MB3RStorage;
-    const apiBaseUrl = (window.__MB3R_API_BASE__ || '').replace(/\/$/, '');
-    const isApiConfigured = Boolean(apiBaseUrl);
+    const explicitEndpoint =
+        typeof window.__MB3R_API_ENDPOINT__ === 'string'
+            ? window.__MB3R_API_ENDPOINT__.trim().replace(/\/$/, '')
+            : '';
+    const apiBaseUrl =
+        typeof window.__MB3R_API_BASE__ === 'string'
+            ? window.__MB3R_API_BASE__.trim().replace(/\/$/, '')
+            : '';
+    const isApiConfigured = Boolean(explicitEndpoint || apiBaseUrl);
     const shouldFallbackToLocal = (status) =>
         !status || status >= 500 || status === 404 || status === 405 || !isApiConfigured;
-    const buildApiUrl = (path) => (isApiConfigured ? `${apiBaseUrl}${path}` : null);
+    const resolveEndpoint = (path) => {
+        if (explicitEndpoint) {
+            return explicitEndpoint;
+        }
+        if (apiBaseUrl) {
+            return `${apiBaseUrl}${path}`;
+        }
+        return null;
+    };
     let currentPassword = sessionStorage.getItem(ADMIN_PASS_STORAGE_KEY) || '';
     const userLocale = navigator.language || 'en-US';
 
@@ -121,7 +136,7 @@ document.addEventListener('DOMContentLoaded', () => {
             throw error;
         }
 
-        const endpoint = buildApiUrl('/applications');
+        const endpoint = resolveEndpoint('/applications');
 
         if (!endpoint) {
             const configError = new Error('API endpoint is not configured.');

assets/js/config.js

@@ -1,2 +1,4 @@
-window.__MB3R_API_BASE__ =
-    window.__MB3R_API_BASE__ || 'https://nkphoglftmnfikxzuyqr.supabase.co/functions/v1';
+window.__MB3R_API_ENDPOINT__ =
+    window.__MB3R_API_ENDPOINT__ ||
+    'https://nkphoglftmnfikxzuyqr.supabase.co/functions/v1/database-access';
+window.__MB3R_API_BASE__ = window.__MB3R_API_BASE__ || '';

assets/js/main.js

@@ -4,8 +4,15 @@ document.addEventListener('DOMContentLoaded', () => {
     const themeToggleButton = document.getElementById('theme-toggle');
     const currentTheme = localStorage.getItem('theme');
     const storage = window.MB3RStorage;
-    const apiBaseUrl = (window.__MB3R_API_BASE__ || '').replace(/\/$/, '');
-    const isApiConfigured = Boolean(apiBaseUrl);
+    const explicitEndpoint =
+        typeof window.__MB3R_API_ENDPOINT__ === 'string'
+            ? window.__MB3R_API_ENDPOINT__.trim().replace(/\/$/, '')
+            : '';
+    const apiBaseUrl =
+        typeof window.__MB3R_API_BASE__ === 'string'
+            ? window.__MB3R_API_BASE__.trim().replace(/\/$/, '')
+            : '';
+    const isApiConfigured = Boolean(explicitEndpoint || apiBaseUrl);
 
     const createLocalRecord = (payload, source = 'local') => ({
         id: `${source}-${Date.now()}`,
@@ -19,11 +26,19 @@ document.addEventListener('DOMContentLoaded', () => {
     const shouldFallbackToLocal = (status) =>
         !status || status >= 500 || status === 404 || status === 405 || !isApiConfigured;
 
-    const buildApiUrl = (path) => (isApiConfigured ? `${apiBaseUrl}${path}` : null);
+    const resolveEndpoint = (path) => {
+        if (explicitEndpoint) {
+            return explicitEndpoint;
+        }
+        if (apiBaseUrl) {
+            return `${apiBaseUrl}${path}`;
+        }
+        return null;
+    };
 
     if (!isApiConfigured) {
         console.warn(
-            '[mb3r] API base URL is not configured. Set window.__MB3R_API_BASE__ in assets/js/config.js.'
+            '[mb3r] API endpoint is not configured. Set window.__MB3R_API_ENDPOINT__ (or __MB3R_API_BASE__).'
         );
     }
 
@@ -150,7 +165,7 @@ document.addEventListener('DOMContentLoaded', () => {
     };
 
     const submitRequest = async (payload) => {
-        const endpoint = buildApiUrl('/applications');
+        const endpoint = resolveEndpoint('/applications');
 
         if (!endpoint) {
             const error = new Error('API endpoint is not configured.');