ultimate-jekyll-manager 0.0.119 → 0.0.120

package/dist/assets/js/pages/account/sections/api-keys.js

@@ -1,9 +1,12 @@
-// API Keys section module
+/**
+ * API Keys Section JavaScript
+ */
+
+// Libraries
 import { FormManager } from '__main_assets__/js/libs/form-manager.js';
 import authorizedFetch from '__main_assets__/js/libs/authorized-fetch.js';
 
 let webManager = null;
-let resetApiKeyFormManager = null;
 
 // Initialize API Keys section
 export function init(wm) {
@@ -14,7 +17,9 @@ export function init(wm) {
 
 // Load API Keys data
 export function loadData(account) {
-  if (!account) return;
+  if (!account) {
+    return;
+  }
 
   // Update API key display
   updateApiKey(account.api?.privateKey);
@@ -44,35 +49,44 @@ function setupButtons() {
 
 // Setup reset API key form
 function setupResetApiKeyForm() {
-  // Initialize FormManager
-  resetApiKeyFormManager = new FormManager('#reset-api-key-form', {
-    autoDisable: true,
-    showSpinner: true,
-    allowMultipleSubmissions: false,
-    submitButtonLoadingText: 'Resetting...'
+  const formManager = new FormManager('#reset-api-key-form', {
+    allowResubmit: false,
+    submittingText: 'Resetting...',
+    submittedText: 'Reset!',
   });
 
-  // Handle form submission
-  resetApiKeyFormManager.addEventListener('submit', async (event) => {
-    event.preventDefault();
-
-    // 1ms wait
+  formManager.on('submit', async () => {
+    // 1ms wait for dialog to appear properly
     await new Promise(resolve => setTimeout(resolve, 1));
 
     // Show confirmation dialog
     if (!confirm('Are you sure you want to reset your API key? This will invalidate your current key and any applications using it will stop working.')) {
-      return resetApiKeyFormManager.setFormState('ready');
+      throw new Error('API key reset cancelled.');
     }
 
-    try {
-      await handleResetApiKeySubmit();
-      // Success - FormManager will handle state automatically
-      resetApiKeyFormManager.setFormState('ready');
-    } catch (error) {
-      // Manually show error and reset form state
-      resetApiKeyFormManager.showError(error);
-      resetApiKeyFormManager.setFormState('ready');
+    // Get server API URL
+    const serverApiURL = webManager.getApiUrl() + '/backend-manager';
+
+    // Make API call to reset API key
+    const response = await authorizedFetch(serverApiURL, {
+      method: 'POST',
+      timeout: 30000,
+      response: 'json',
+      tries: 2,
+      body: {
+        command: 'user:regenerate-api-keys',
+      },
+    });
+
+    if (!response.privateKey) {
+      throw new Error(response.message || 'Failed to reset API key');
     }
+
+    // Update the displayed API key
+    updateApiKey(response.privateKey);
+
+    // Show success message
+    formManager.showSuccess('API key has been reset successfully!');
   });
 }
 
@@ -104,37 +118,8 @@ async function handleCopyApiKey() {
       $copyBtn.classList.remove('btn-success');
       $copyBtn.classList.add('btn-outline-adaptive');
     }, 2000);
-
   } catch (err) {
     console.error('Failed to copy API key:', err);
     webManager.utilities().showNotification('Failed to copy API key', 'danger');
   }
 }
-
-// Handle reset API key form submission
-async function handleResetApiKeySubmit() {
-  // Get server API URL
-  const serverApiURL = webManager.getApiUrl() + '/backend-manager';
-
-  // Make API call to reset API key
-  const response = await authorizedFetch(serverApiURL, {
-    method: 'POST',
-    timeout: 30000,
-    response: 'json',
-    tries: 2,
-    body: {
-      command: 'user:regenerate-api-keys',
-    },
-  });
-
-  if (response.privateKey) {
-    // Update the displayed API key
-    updateApiKey(response.privateKey);
-
-    // Show success message
-    webManager.utilities().showNotification('API key has been reset successfully', 'success');
-  } else {
-    throw new Error(response.message || 'Failed to reset API key');
-  }
-}
-

package/dist/assets/js/pages/account/sections/connections.js

@@ -1,6 +1,10 @@
-// Connections section module for OAuth account linking
+/**
+ * Connections Section JavaScript - OAuth account linking
+ */
+
+// Libraries
 import { FormManager } from '__main_assets__/js/libs/form-manager.js';
-import authorizedFetch from '__main_assets__/js/libs/authorized-fetch.js';;
+import authorizedFetch from '__main_assets__/js/libs/authorized-fetch.js';
 
 let webManager = null;
 let appData = null;
@@ -22,7 +26,9 @@ export async function init(wm) {
 
 // Load connections data
 export async function loadData(account, sharedAppData) {
-  if (!account) return;
+  if (!account) {
+    return;
+  }
 
   accountData = account;
   appData = sharedAppData;
@@ -133,7 +139,7 @@ function updateProviderStatus(providerId, userConnection, providerSettings) {
     $description: !!$description,
     $form: !!$form,
     $connectButton: !!$connectButton,
-    $disconnectButton: !!$disconnectButton
+    $disconnectButton: !!$disconnectButton,
   });
 
   const isConnected = userConnection && userConnection.identity;
@@ -146,7 +152,7 @@ function updateProviderStatus(providerId, userConnection, providerSettings) {
       discord: 'Connect to access Discord community features',
       github: 'Link your GitHub account for repository access',
       twitter: 'Share updates and connect with Twitter',
-      facebook: 'Connect your Facebook account for social features'
+      facebook: 'Connect your Facebook account for social features',
     };
 
     // Use provider description or fallback to default
@@ -167,7 +173,7 @@ function updateProviderStatus(providerId, userConnection, providerSettings) {
         const dateStr = date.toLocaleDateString('en-US', {
           month: 'short',
           day: 'numeric',
-          year: 'numeric'
+          year: 'numeric',
         });
         statusText = `${displayName} • ${dateStr}`;
       }
@@ -201,15 +207,17 @@ function updateProviderStatus(providerId, userConnection, providerSettings) {
 
 // Get display name for connection
 function getConnectionDisplayName(connection) {
-  if (!connection || !connection.identity) return 'Unknown';
+  if (!connection || !connection.identity) {
+    return 'Unknown';
+  }
 
   // Try different fields based on provider
-  return connection.identity.global_name ||
-         connection.identity.username ||
-         connection.identity.name ||
-         connection.identity.email ||
-         connection.identity.id ||
-         'Connected';
+  return connection.identity.global_name
+    || connection.identity.username
+    || connection.identity.name
+    || connection.identity.email
+    || connection.identity.id
+    || 'Connected';
 }
 
 // Initialize FormManager for a provider
@@ -230,22 +238,19 @@ function initializeProviderForm(providerId) {
 
   console.log(`Initializing FormManager for ${providerId}`);
 
-  // Create new FormManager
   const formManager = new FormManager(`#${formId}`, {
-    autoDisable: true,
-    showSpinner: true
+    submittingText: 'Connecting...',
   });
 
   // Store the FormManager instance
   connectionForms.set(providerId, formManager);
 
   // Listen for state changes to update button after FormManager is ready
-  formManager.addEventListener('statechange', (event) => {
-    const { status } = event.detail;
-    console.log(`[DEBUG] ${providerId} - FormManager state changed to:`, status);
+  formManager.on('statechange', ({ state }) => {
+    console.log(`[DEBUG] ${providerId} - FormManager state changed to:`, state);
 
     // When FormManager transitions to ready, update the button status
-    if (status === 'ready') {
+    if (state === 'ready') {
       console.log(`[DEBUG] ${providerId} - FormManager is ready, updating button status`);
       const userConnection = accountData?.oauth2?.[providerId];
       const providerSettings = appData?.oauth2?.[providerId];
@@ -253,37 +258,23 @@ function initializeProviderForm(providerId) {
     }
   });
 
-  // Handle form submission
-  formManager.addEventListener('submit', async (event) => {
-    event.preventDefault();
-
-    const { data, submitButton } = event.detail;
+  formManager.on('submit', async ({ data, $submitButton }) => {
     const provider = data.provider;
 
     // Determine action from the clicked button's data-action attribute
-    const action = submitButton?.getAttribute('data-action');
+    const action = $submitButton?.getAttribute('data-action');
 
     console.log(`[DEBUG] ${providerId} - Form submitted. Action:`, action, 'Provider:', provider);
 
-    try {
-      if (action === 'connect') {
-        await handleConnect(provider);
-      } else if (action === 'disconnect') {
-        const success = await handleDisconnect(provider);
-        if (success) {
-          // Reset form state and update UI after successful disconnect
-          formManager.setFormState('ready');
-          // Get provider settings to pass for description display
-          const providerSettings = appData?.oauth2?.[provider];
-          updateProviderStatus(provider, null, providerSettings);
-        }
+    if (action === 'connect') {
+      await handleConnect(provider);
+    } else if (action === 'disconnect') {
+      const success = await handleDisconnect(provider);
+      if (success) {
+        // Get provider settings to pass for description display
+        const providerSettings = appData?.oauth2?.[provider];
+        updateProviderStatus(provider, null, providerSettings);
       }
-
-      // Success - FormManager will handle state automatically
-    } catch (error) {
-      // Show error and reset form state
-      formManager.showError(error);
-      formManager.setFormState('ready');
     }
   });
 }
@@ -311,7 +302,7 @@ async function handleConnect(providerId) {
         state: 'authorize',
         scope: scope,
         referrer: window.location.href,
-      }
+      },
     },
   });
 
@@ -354,7 +345,7 @@ async function handleDisconnect(providerId) {
         state: 'deauthorize',
         scope: scope,
         referrer: window.location.href,
-      }
+      },
     },
   });
 

package/dist/assets/js/pages/account/sections/delete.js

@@ -1,4 +1,8 @@
-// Delete account section module
+/**
+ * Delete Account Section JavaScript
+ */
+
+// Libraries
 import { FormManager } from '__main_assets__/js/libs/form-manager.js';
 import authorizedFetch from '__main_assets__/js/libs/authorized-fetch.js';
 
@@ -22,15 +26,10 @@ function setupDeleteAccountForm() {
     return;
   }
 
-  // Initialize FormManager
   formManager = new FormManager('#delete-account-form', {
-    autoDisable: true,
-    showSpinner: true,
-    validateOnSubmit: false, // We'll handle validation manually due to custom confirmation flow
-    allowMultipleSubmissions: false,
-    resetOnSuccess: false,
-    submitButtonLoadingText: 'Deleting account...',
-    initialState: 'ready',
+    allowResubmit: false,
+    submittingText: 'Deleting account...',
+    submittedText: 'Account Deleted!',
   });
 
   // Enable/disable delete button based on checkbox
@@ -46,44 +45,30 @@ function setupDeleteAccountForm() {
     });
   }
 
-  // Listen to FormManager submit event
-  formManager.addEventListener('submit', handleFormSubmit);
-}
-
-// Handle form submission
-async function handleFormSubmit(event) {
-  // Prevent default FormManager submission
-  event.preventDefault();
-
-  const formData = event.detail.data;
-  const $checkbox = document.getElementById('delete-confirm-checkbox');
+  formManager.on('submit', async ({ data }) => {
+    // Check if checkbox is checked
+    if (!$checkbox.checked) {
+      throw new Error('Please confirm that you understand this action is permanent.');
+    }
 
-  // Check if checkbox is checked
-  if (!$checkbox.checked) {
-    formManager.showError('Please confirm that you understand this action is permanent.');
-    formManager.setFormState('ready');
-    return;
-  }
+    // 1ms wait for dialog to appear properly
+    await new Promise(resolve => setTimeout(resolve, 1));
 
-  // Show confirmation dialog
-  const confirmMessage = `Are you absolutely sure you want to delete your account?\n\nThis action CANNOT be undone.\n\nType "DELETE" to confirm:`;
-  const userInput = prompt(confirmMessage);
+    // Show confirmation dialog
+    const confirmMessage = `Are you absolutely sure you want to delete your account?\n\nThis action CANNOT be undone.\n\nType "DELETE" to confirm:`;
+    const userInput = prompt(confirmMessage);
 
-  if (userInput !== 'DELETE') {
-    formManager.showError('Account deletion cancelled. You must type "DELETE" exactly to confirm.');
-    formManager.setFormState('ready');
-    return;
-  }
+    if (userInput !== 'DELETE') {
+      throw new Error('Account deletion cancelled. You must type "DELETE" exactly to confirm.');
+    }
 
-  // Final confirmation
-  const finalConfirm = confirm('This is your last chance to cancel.\n\nAre you sure you want to permanently delete your account?');
+    // Final confirmation
+    const finalConfirm = confirm('This is your last chance to cancel.\n\nAre you sure you want to permanently delete your account?');
 
-  if (!finalConfirm) {
-    formManager.setFormState('ready');
-    return;
-  }
+    if (!finalConfirm) {
+      throw new Error('Account deletion cancelled.');
+    }
 
-  try {
     // Send delete request to server
     const response = await authorizedFetch(webManager.getApiUrl(), {
       method: 'POST',
@@ -93,42 +78,37 @@ async function handleFormSubmit(event) {
       body: {
         command: 'user:delete',
         payload: {
-          reason: formData.reason || '',
-          confirmed: true
-        }
-      }
+          reason: data.reason || '',
+          confirmed: true,
+        },
+      },
     });
 
     console.log('Delete account response:', response);
 
-    if (response.success) {
-      // Show success message
-      formManager.showSuccess('Your account has been successfully deleted. You will now be signed out.');
-
-      // Sign out the user
-      await webManager.auth().signOut();
-
-      // Redirect to home page
-      setTimeout(() => {
-        window.location.href = '/';
-      }, 1500);
-    } else {
+    if (!response.success) {
       throw new Error(response.message || 'Failed to delete account');
     }
-  } catch (error) {
-    console.error('Failed to delete account:', error);
-    formManager.showError(`Failed to delete account: ${error.message}`);
-    formManager.setFormState('ready');
-  }
+
+    // Show success message
+    formManager.showSuccess('Your account has been successfully deleted. You will now be signed out.');
+
+    // Sign out the user
+    await webManager.auth().signOut();
+
+    // Redirect to home page
+    setTimeout(() => {
+      window.location.href = '/';
+    }, 1500);
+  });
 }
 
 // Load delete section data (if needed)
-export async function loadData(account) {
+export async function loadData() {
   // No specific data to load for delete section
-  // Could potentially show account age or other info here
 }
 
 // Called when section is shown
 export function onShow() {
-
-}
+  // Nothing needed
+}

package/dist/assets/js/pages/account/sections/profile.js

@@ -1,4 +1,8 @@
-// Profile section module
+/**
+ * Profile Section JavaScript
+ */
+
+// Libraries
 import { FormManager } from '__main_assets__/js/libs/form-manager.js';
 
 let formManager = null;
@@ -13,7 +17,9 @@ export function init(wm) {
 
 // Load profile data
 export function loadData(account, user) {
-  if (!account) return;
+  if (!account) {
+    return;
+  }
 
   // Format birthday if it exists
   let birthdayValue = '';
@@ -33,34 +39,31 @@ export function loadData(account, user) {
   const formData = {
     auth: {
       email: account.auth?.email || user?.email || '',
-      uid: user?.uid || account.auth?.uid || ''
+      uid: user?.uid || account.auth?.uid || '',
     },
     personal: {
       name: {
         first: account.personal?.name?.first || '',
-        last: account.personal?.name?.last || ''
+        last: account.personal?.name?.last || '',
       },
       birthday: birthdayValue,
       gender: account.personal?.gender || '',
       location: {
         country: account.personal?.location?.country || '',
         region: account.personal?.location?.region || '',
-        city: account.personal?.location?.city || ''
+        city: account.personal?.location?.city || '',
       },
       telephone: {
         countryCode: phoneCountryCode,
-        national: account.personal?.telephone?.national?.toString() || ''
-      }
-    }
+        national: account.personal?.telephone?.national?.toString() || '',
+      },
+    },
   };
 
-  formManager.setValues(formData);
+  formManager.setData(formData);
 
   // Set form to ready state now that data is loaded
-  formManager.setFormState('ready');
-
-  // Avatar and display name are now handled by data-wm-bind in HTML
-  // since photoURL and displayName are always available from getUser()
+  formManager.ready();
 
   // Update join date
   updateJoinDate(user);
@@ -72,29 +75,16 @@ export function loadData(account, user) {
 // Setup profile form
 function setupProfileForm() {
   formManager = new FormManager('#profile-form', {
-    autoDisable: true,
-    showSpinner: true,
-    allowMultipleSubmissions: true,
-    submitButtonLoadingText: 'Saving...',
-    initialState: 'loading' // Start in loading state until data loads
+    autoReady: false, // Start in initializing state until data loads
+    submittingText: 'Saving...',
   });
 
-  // Handle form submission
-  formManager.addEventListener('submit', async (event) => {
-    const { data } = event.detail;
-
-    try {
-      // Update user profile
-      await updateUserProfile(data);
+  formManager.on('submit', async ({ data }) => {
+    // Update user profile
+    await updateUserProfile(data);
 
-      // Show success message
-      webManager.utilities().showNotification('Profile updated successfully', 'success');
-
-    } catch (error) {
-      console.error('Failed to update profile:', error);
-      webManager.utilities().showNotification('Failed to update profile. Please try again.', 'danger');
-      throw error; // Re-throw to trigger FormManager's error handling
-    }
+    // Show success message
+    formManager.showSuccess('Profile updated successfully!');
   });
 }
 
@@ -117,12 +107,12 @@ async function updateUserProfile(data) {
     const date = new Date(data.personal.birthday);
     data.personal.birthday = {
       timestamp: date.toISOString(),
-      timestampUNIX: Math.floor(date.getTime() / 1000)
+      timestampUNIX: Math.floor(date.getTime() / 1000),
     };
   } else {
     data.personal.birthday = {
-      timestamp: "1970-01-01T00:00:00.000Z",
-      timestampUNIX: 0
+      timestamp: '1970-01-01T00:00:00.000Z',
+      timestampUNIX: 0,
     };
   }
 
@@ -151,21 +141,16 @@ async function updateUserProfile(data) {
   await userDocRef.set(data, { merge: true });
 
   console.log('Profile successfully updated in Firestore');
-
-  // Avatar updates automatically via data-wm-bind
 }
 
-// Avatar functionality removed - photoURL is always available from getUser()
-// and is handled via data-wm-bind in the HTML template
-
-
-
 // Handle copy UID
 async function handleCopyUid() {
   const $uidInput = document.getElementById('uid-input');
   const $copyBtn = document.getElementById('copy-uid-btn');
 
-  if (!$uidInput || !$uidInput.value) return;
+  if (!$uidInput || !$uidInput.value) {
+    return;
+  }
 
   try {
     // Use webManager's clipboard utility
@@ -185,29 +170,26 @@ async function handleCopyUid() {
       $copyBtn.classList.remove('btn-success');
       $copyBtn.classList.add('btn-outline-adaptive');
     }, 2000);
-
   } catch (err) {
     console.error('Failed to copy UID:', err);
   }
 }
 
-// Display name functionality removed - displayName is always available from getUser()
-// and is handled via data-wm-bind in the HTML template
-
 // Update join date from Firebase user
 function updateJoinDate(user) {
   const $joinDate = document.getElementById('profile-join-date');
-  if (!$joinDate) return;
+  if (!$joinDate) {
+    return;
+  }
 
   // Get creation time from Firebase user metadata
-  // The metadata object has creationTime as a string timestamp
   const creationTime = user?.metadata?.creationTime;
 
   if (creationTime) {
     const joinDate = new Date(creationTime);
     const formattedDate = joinDate.toLocaleDateString('en-US', {
       month: 'long',
-      year: 'numeric'
+      year: 'numeric',
     });
 
     $joinDate.textContent = `Member since ${formattedDate}`;
@@ -228,7 +210,7 @@ function updateRoleBadges(account) {
     developer: 'badge-coder',
     moderator: 'badge-moderator',
     betaTester: 'badge-beta',
-    vip: 'badge-vip'
+    vip: 'badge-vip',
   };
 
   // Show/hide role badges
@@ -246,9 +228,9 @@ function updateRoleBadges(account) {
   // Show premium badge if subscription is active
   const $premiumBadge = document.getElementById('badge-premium');
   if ($premiumBadge) {
-    const isActive = subscription?.status === 'active' ||
-                     subscription?.status === 'trialing' ||
-                     subscription?.active === true;
+    const isActive = subscription?.status === 'active'
+      || subscription?.status === 'trialing'
+      || subscription?.active === true;
 
     if (isActive) {
       $premiumBadge.classList.remove('d-none');
@@ -257,4 +239,3 @@ function updateRoleBadges(account) {
     }
   }
 }
-