ultimate-jekyll-manager 1.3.8 → 1.3.11

package/CHANGELOG.md

@@ -14,6 +14,39 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - `Fixed` for any bug fixes.
 - `Security` in case of vulnerabilities.
 
+---
+## [1.3.11] - 2026-05-24
+
+### Changed
+
+- **Account page UI polish.** Three small consistency fixes on `/account`: (1) Notifications "Save preferences" button now has the `floppy-disk` icon to match the profile section's "Save Changes" button. (2) Generate signin link modal no longer shows a redundant Cancel button in its footer — the X in the modal header already dismisses it. (3) Connections "Manage connections" card no longer renders a divider between the section title and the first item (dropped `list-group list-group-flush` from `#connections-list`); the per-item `border-top` already handles inter-item separation, matching the Sign-in methods card's pattern.
+
+---
+## [1.3.10] - 2026-05-24
+
+### Added
+
+- **Generate signin link** — advanced-user feature on `/account#security` that creates a temporary `/signin?authCustomToken=<token>` URL via `POST /backend-manager/user/token`. Centered text-link trigger sits under the Active sessions card (same Bootstrap utility classes as Cancel subscription: `btn btn-link btn-sm text-muted text-decoration-underline opacity-50`). Opens a danger-bordered modal with a typed-phrase gate (`I will not share this link`) that enables the red Generate button. On success, the warning view swaps in-place for the link inside a readonly monospaced input + Copy button, with a prominent 1-hour expiry warning. Token never persists outside the input — `show.bs.modal` resets state every open. Backend route already existed (`functions/routes/user/token/post.js`) and the existing `handleCustomTokenSignin` flow in `src/assets/js/libs/auth.js` consumes the resulting URL.
+
+### Changed
+
+- **Account-page marketing toggle now requires an explicit "Save preferences" button.** v1.3.9 made the toggle auto-submit on change. Cleaner UX: user flips the toggle, sees the new state visually, then clicks Save when they actually want to commit. Markup adds a `<button type="submit" class="btn btn-primary">Save preferences</button>` to the `#marketing-emails-form` (classy account template). JS drops the `addEventListener('change', () => formManager.submit())` line. On failure, the toggle stays where the user left it (no auto-revert) — they see the error message via FormManager and can hit Save again.
+
+### Removed
+
+- **`.cancel-trigger-link` SCSS class.** Replaced with Bootstrap utilities on both the existing Cancel subscription button and the new Generate signin link button (`text-muted opacity-50` instead of the custom `opacity: 0.7` + hover transition + `0.8125rem` font size). Avoids inventing project-specific classes when Bootstrap utilities cover the same styling.
+
+---
+## [1.3.9] - 2026-05-24
+
+### Fixed
+
+- **Account-page marketing toggle showed "Failed to update email preferences" even on successful unsubscribe.** Root cause: `pages/account/sections/notifications.js` was checking `response.data?.success !== true`, but `authorizedFetch` returns the JSON body directly (no `data` wrapper), and BEM's `assistant.respond({ success: true })` writes the object at the response root via `res.json(response)`. So `response.success === true` and `response.data?.success === undefined` — the check fired even though the backend had successfully written `consent.marketing.status = 'revoked'` AND removed the contact from SendGrid + Beehiiv. Frontend UX showed a danger toast and reverted the toggle, but server state was already correct, putting the UI out of sync with reality. Fix: check `response.success` at the root.
+
+### Changed
+
+- **`pages/account/sections/notifications.js` refactored to use FormManager**, matching the project rule that all user-driven API forms use form-manager for in-flight/success/error UX. The toggle is now wrapped in `<form id="marketing-emails-form">` (classy account template, `src/defaults/dist/_layouts/themes/classy/frontend/pages/account/index.html`), and the change event triggers `formManager.submit()`. Success notification uses `formManager.showSuccess()`; failure throws so FormManager surfaces the error toast and the JS reverts the toggle to its last-known-good state. Replaces the ad-hoc `addEventListener('change')` + raw `authorizedFetch` + manual `webManager.utilities().showNotification()` pattern.
+
 ---
 ## [1.3.8] - 2026-05-24
 

package/dist/assets/css/pages/account/index.scss

@@ -78,16 +78,6 @@
     background-color: var(--bs-tertiary-bg);
   }
 
-  .cancel-trigger-link {
-    font-size: 0.8125rem;
-    opacity: 0.7;
-    transition: opacity 0.2s;
-
-    &:hover {
-      opacity: 1;
-    }
-  }
-
   #cancel-subscription-btn {
     &:disabled {
       opacity: 0.5;

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

@@ -2,25 +2,71 @@
  * Notifications section — marketing email consent toggle.
  *
  * Reads consent.marketing.status from the user doc for the toggle's initial state.
- * On toggle, POSTs to /backend-manager/marketing/email-preferences with subscribe|unsubscribe.
+ * User flips the toggle then clicks Save; on submit, POSTs to
+ * /backend-manager/marketing/email-preferences with subscribe|unsubscribe.
  * The server writes consent.marketing to the user doc + syncs SendGrid + Beehiiv.
+ *
+ * Uses FormManager for standard in-flight/success/error UX. On failure, the
+ * error message is shown via FormManager and the toggle stays where the user
+ * left it — they can try Save again without re-flipping.
  */
 import authorizedFetch from '__main_assets__/js/libs/authorized-fetch.js';
+import { FormManager } from '__main_assets__/js/libs/form-manager.js';
 import webManager from 'web-manager';
 
+const FORM_ID = 'marketing-emails-form';
 const TOGGLE_ID = 'marketing-emails';
 const GRANT_DATE_ID = 'marketing-emails-grant-date';
 
+let formManager = null;
+
 export function init() {
-  const $toggle = document.getElementById(TOGGLE_ID);
-  if (!$toggle) {
+  const $form = document.getElementById(FORM_ID);
+  if (!$form) {
     return;
   }
-  $toggle.addEventListener('change', handleToggleChange);
+
+  formManager = new FormManager(`#${FORM_ID}`, {
+    autoReady: false,          // Wait for loadData() to populate the toggle
+    allowResubmit: true,       // Save → flip again → Save again is normal flow
+    warnOnUnsavedChanges: false, // Toggle changes are explicit-Save, not draft
+  });
+
+  formManager.on('submit', async ({ data }) => {
+    const action = data.enabled ? 'subscribe' : 'unsubscribe';
+
+    const response = await authorizedFetch(`${webManager.getApiUrl()}/backend-manager/marketing/email-preferences`, {
+      method: 'POST',
+      timeout: 60000,
+      response: 'json',
+      tries: 2,
+      body: { action },
+    });
+
+    if (!response?.success) {
+      throw new Error(response?.message || 'Failed to update email preferences. Please try again.');
+    }
+
+    formManager.showSuccess(
+      data.enabled
+        ? 'Subscribed to email updates.'
+        : 'Unsubscribed from email updates.'
+    );
+
+    // Hide the grant-date line on unsubscribe (the displayed date was the OLD grant;
+    // informational only). loadData() will repopulate it on the next page load if
+    // the user re-subscribes.
+    if (!data.enabled) {
+      const $date = document.getElementById(GRANT_DATE_ID);
+      if ($date) {
+        $date.classList.add('d-none');
+      }
+    }
+  });
 }
 
 export function loadData(account) {
-  if (!account) {
+  if (!account || !formManager) {
     return;
   }
 
@@ -42,54 +88,6 @@ export function loadData(account) {
       $date.classList.remove('d-none');
     }
   }
-}
-
-async function handleToggleChange(event) {
-  const $toggle = event.target;
-  const wasChecked = !$toggle.checked; // checkbox already flipped at this point
-  const isEnabled = $toggle.checked;
-  const action = isEnabled ? 'subscribe' : 'unsubscribe';
-
-  // Disable while in-flight so rapid clicks don't fire multiple requests
-  $toggle.disabled = true;
-
-  try {
-    const response = await authorizedFetch(`${webManager.getApiUrl()}/backend-manager/marketing/email-preferences`, {
-      method: 'POST',
-      timeout: 15000,
-      response: 'json',
-      tries: 2,
-      body: { action },
-    });
-
-    if (response.error || response.data?.success !== true) {
-      throw new Error(response.message || response.error || 'Failed to update email preferences.');
-    }
 
-    webManager.utilities().showNotification(
-      isEnabled ? 'Subscribed to email updates.' : 'Unsubscribed from email updates.',
-      { type: 'success' }
-    );
-
-    // Hide the grant-date line on unsubscribe (it was the OLD grant date — informational only).
-    // It'll get repopulated the next time loadData runs if the user re-subscribes.
-    if (!isEnabled) {
-      const $date = document.getElementById(GRANT_DATE_ID);
-      if ($date) {
-        $date.classList.add('d-none');
-      }
-    }
-  } catch (error) {
-    console.error('Failed to update marketing consent:', error);
-
-    // Revert toggle on failure so UI matches server state
-    $toggle.checked = wasChecked;
-
-    webManager.utilities().showNotification(
-      'Failed to update email preferences. Please try again.',
-      { type: 'danger' }
-    );
-  } finally {
-    $toggle.disabled = false;
-  }
+  formManager.ready();
 }

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

@@ -20,6 +20,7 @@ const useAuthPopup = url.searchParams.get('authPopup') === 'true' || window !==
 export function init() {
   initializeSigninMethods();
   initializeSignoutAllForm();
+  initializeSigninLinkGenerator();
 }
 
 // Load security data
@@ -401,6 +402,96 @@ function initializeSignoutAllForm() {
   }
 }
 
+// Initialize signin link generator (advanced feature).
+// Creates a temporary signin URL using a Firebase custom token. The link grants
+// full account access to anyone who holds it, so we gate it behind a typed
+// confirmation phrase before hitting BEM's /user/token route.
+function initializeSigninLinkGenerator() {
+  const $modal = document.getElementById('generate-signin-link-modal');
+  if (!$modal) {
+    return;
+  }
+
+  const $phrase = document.getElementById('signin-link-confirm-phrase');
+  const $input = document.getElementById('signin-link-confirm-input');
+  const $generateBtn = document.getElementById('signin-link-generate-btn');
+  const $warningView = document.getElementById('generate-signin-link-warning');
+  const $resultView = document.getElementById('generate-signin-link-result');
+  const $output = document.getElementById('signin-link-output');
+  const $copyBtn = document.getElementById('signin-link-copy-btn');
+
+  const expectedPhrase = $phrase.textContent.trim();
+
+  // Reset modal state every time it opens. The custom token is never persisted
+  // outside the input — closing the modal must drop it from the DOM.
+  $modal.addEventListener('show.bs.modal', () => {
+    $input.value = '';
+    $output.value = '';
+    $generateBtn.disabled = true;
+    $warningView.classList.remove('d-none');
+    $resultView.classList.add('d-none');
+  });
+
+  // Enable Generate only when the typed phrase matches exactly.
+  $input.addEventListener('input', () => {
+    $generateBtn.disabled = $input.value.trim() !== expectedPhrase;
+  });
+
+  $generateBtn.addEventListener('click', async () => {
+    // Defensive: the button is disabled until the phrase matches, but re-check
+    // in case anything bypassed the input handler.
+    if ($input.value.trim() !== expectedPhrase) {
+      return;
+    }
+
+    const originalText = $generateBtn.querySelector('.button-text').textContent;
+    $generateBtn.disabled = true;
+    $generateBtn.querySelector('.button-text').textContent = 'Generating...';
+
+    try {
+      const tokenURL = `${webManager.getApiUrl()}/backend-manager/user/token`;
+      const data = await authorizedFetch(tokenURL, {
+        method: 'POST',
+        timeout: 60000,
+        response: 'json',
+        tries: 2,
+      });
+
+      const token = data?.token;
+      if (!token) {
+        throw new Error('No token returned from server');
+      }
+
+      const signinURL = new URL('/signin', window.location.origin);
+      signinURL.searchParams.set('authCustomToken', token);
+
+      $output.value = signinURL.toString();
+      $warningView.classList.add('d-none');
+      $resultView.classList.remove('d-none');
+    } catch (error) {
+      console.error('[Security] Failed to generate signin link:', error);
+      webManager.utilities().showNotification(
+        `Failed to generate signin link: ${error.message || 'Unknown error'}`,
+        { type: 'danger', timeout: 8000 }
+      );
+      $generateBtn.disabled = false;
+    } finally {
+      $generateBtn.querySelector('.button-text').textContent = originalText;
+    }
+  });
+
+  $copyBtn.addEventListener('click', async () => {
+    try {
+      await navigator.clipboard.writeText($output.value);
+      webManager.utilities().showNotification('Signin link copied to clipboard', 'success');
+    } catch (error) {
+      $output.select();
+      document.execCommand('copy');
+      webManager.utilities().showNotification('Signin link copied to clipboard', 'success');
+    }
+  });
+}
+
 // Connect Google provider
 async function connectGoogleProvider() {
   // Dynamic import of Firebase auth methods

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/account/index.html

@@ -863,6 +863,72 @@ badges:
             </div>
           </div>
         </div>
+
+        <!-- Generate Signin Link (advanced) -->
+        <div id="generate-signin-link-trigger" class="text-center">
+          <button type="button" class="btn btn-link btn-sm text-muted text-decoration-underline opacity-50" data-bs-toggle="modal" data-bs-target="#generate-signin-link-modal">
+            Generate signin link
+          </button>
+        </div>
+
+        <!-- Generate Signin Link Modal -->
+        <div class="modal fade" id="generate-signin-link-modal" tabindex="-1" aria-labelledby="generate-signin-link-title" aria-hidden="true">
+          <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
+            <div class="modal-content border border-danger">
+              <div class="modal-header">
+                <h5 class="modal-title text-danger" id="generate-signin-link-title">
+                  {% uj_icon "triangle-exclamation", "fa-lg me-2" %}
+                  Generate signin link
+                </h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+              </div>
+              <div class="modal-body">
+                <!-- Warning view -->
+                <div id="generate-signin-link-warning">
+                  <div class="alert alert-danger">
+                    <strong>This is a dangerous feature for advanced users.</strong>
+                    <p class="mb-2 mt-2 small">
+                      Generating a signin link creates a single URL that lets <strong>anyone who has it</strong> sign in to your account — no password, no 2FA, no email verification.
+                    </p>
+                    <ul class="small mb-0">
+                      <li>Use it only to sign in to your own account on another browser or device.</li>
+                      <li><strong>Never share, message, email, or paste this link anywhere.</strong> Anyone with the link gets full access to your account.</li>
+                      <li>The link expires in 1 hour, but treat it as a live key until then.</li>
+                      <li>If you suspect the link was exposed, sign out of all sessions immediately.</li>
+                    </ul>
+                  </div>
+
+                  <p class="mb-2">Type the following phrase exactly to confirm you understand the risks:</p>
+                  <p class="mb-2"><code id="signin-link-confirm-phrase">I will not share this link</code></p>
+
+                  <input type="text" class="form-control" id="signin-link-confirm-input" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" placeholder="Type the phrase above">
+                </div>
+
+                <!-- Result view (hidden until generated) -->
+                <div id="generate-signin-link-result" class="d-none">
+                  <div class="alert alert-warning small mb-3">
+                    {% uj_icon "clock", "me-1" %}
+                    This link expires in <strong>1 hour</strong>. Use it immediately and do not share it.
+                  </div>
+                  <label for="signin-link-output" class="form-label small text-muted mb-1">Your signin link:</label>
+                  <div class="input-group">
+                    <input type="text" class="form-control font-monospace small" id="signin-link-output" readonly>
+                    <button type="button" class="btn btn-outline-primary" id="signin-link-copy-btn">
+                      {% uj_icon "copy", "me-1" %}
+                      <span class="button-text">Copy</span>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div class="modal-footer">
+                <button type="button" class="btn btn-danger" id="signin-link-generate-btn" disabled>
+                  {% uj_icon "key", "me-1" %}
+                  <span class="button-text">Generate link</span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
       </section>
 
       <!-- Connections Section -->
@@ -874,7 +940,7 @@ badges:
             <h5 class="card-title">Manage connections</h5>
             <p class="text-muted mb-0">Connect your external accounts to access additional features.</p>
 
-            <div id="connections-list" class="list-group list-group-flush">
+            <div id="connections-list">
               <!-- Loading state -->
               <div id="connections-loading" class="text-center py-3">
                 <div class="spinner-border spinner-border-sm text-primary" role="status">
@@ -1026,7 +1092,7 @@ badges:
 
         <!-- Cancel Subscription (only visible for paid users) -->
         <div id="cancel-subscription-trigger" class="text-center" data-wm-bind="@show billing.buttons.cancel" hidden>
-          <button type="button" class="btn btn-link btn-sm text-muted text-decoration-underline cancel-trigger-link" data-bs-toggle="collapse" data-bs-target="#cancel-subscription-accordion" aria-expanded="false" aria-controls="cancel-subscription-accordion">
+          <button type="button" class="btn btn-link btn-sm text-muted text-decoration-underline opacity-50" data-bs-toggle="collapse" data-bs-target="#cancel-subscription-accordion" aria-expanded="false" aria-controls="cancel-subscription-accordion">
             Cancel subscription
           </button>
         </div>
@@ -1195,14 +1261,20 @@ badges:
           <div class="card-body">
             <h5 class="card-title">Email preferences</h5>
 
-            <div class="form-check form-switch">
-              <input class="form-check-input" type="checkbox" id="marketing-emails">
-              <label class="form-check-label" for="marketing-emails">
-                Product updates, newsletters, and marketing communications
-                <small class="d-block text-muted">You can withdraw consent at any time.</small>
-                <small id="marketing-emails-grant-date" class="d-block text-muted d-none"></small>
-              </label>
-            </div>
+            <form id="marketing-emails-form" novalidate>
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input" type="checkbox" id="marketing-emails" name="enabled">
+                <label class="form-check-label" for="marketing-emails">
+                  Product updates, newsletters, and marketing communications
+                  <small class="d-block text-muted">You can withdraw consent at any time.</small>
+                  <small id="marketing-emails-grant-date" class="d-block text-muted d-none"></small>
+                </label>
+              </div>
+              <button type="submit" class="btn btn-primary">
+                {% uj_icon "floppy-disk", "me-2" %}
+                <span class="button-text">Save preferences</span>
+              </button>
+            </form>
           </div>
         </div>
       </section>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ultimate-jekyll-manager",
-  "version": "1.3.8",
+  "version": "1.3.11",
   "description": "Ultimate Jekyll dependency manager",
   "main": "dist/index.js",
   "exports": {