refactor: define LEGACY_KEYFRAMES_RULE_TYPE constant at module level and extract millisecondsToSeconds helper

Copilot · PDowney · web-flow · commit 6e6532f7294a · 2026-04-11T03:51:00.000Z
Agent-Logs-Url: https://github.com/EngineScript/EngineScript/sessions/8e7ceb0f-90ab-40c3-99dd-7bca95e3085a Co-authored-by: PDowney <11467177+PDowney@users.noreply.github.com>
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,13 @@ Changes are organized by date, with the most recent changes listed first.
 
 ## 2026-04-11
 
+### 🔧 EXTERNAL SERVICES CODE QUALITY IMPROVEMENTS
+
+- Extracted `LEGACY_KEYFRAMES_RULE_TYPE = 7` to a named module-level constant in `external-services.js`, replacing the magic number defined inside `hasAnimationKeyframes()` to improve maintainability and make the value reusable.
+- Added `millisecondsToSeconds()` helper method to `ExternalServicesManager` in `external-services.js`, replacing the inline `/ 1000` conversion in `scheduleNotificationRemoval()` to eliminate duplication and clarify intent.
+
+## 2026-04-11
+
 ### 🔧 VHOST IMPORT BUG FIXES & IMPROVEMENTS
 
 - Updated the single-zip database file detection in `scripts/functions/vhost/vhost-import.sh` to search for both `*.sql` and `*.sql.gz` patterns, so compressed database dumps are correctly found and imported instead of failing silently.
diff --git a/config/var/www/admin/control-panel/external-services/external-services.js b/config/var/www/admin/control-panel/external-services/external-services.js
@@ -18,6 +18,9 @@ const CATEGORY_ORDER = [
   'Security'
 ];
 
+// Standard CSSOM numeric value for KEYFRAMES_RULE, used when CSSRule.KEYFRAMES_RULE is unavailable (legacy browsers).
+const LEGACY_KEYFRAMES_RULE_TYPE = 7;
+
 const ERROR_LOADING_EXTERNAL_SERVICES_MESSAGE = "Failed to fetch external service status. Check your internet connection and refresh the page. If the problem continues, check the browser console for details or contact your administrator.";
 
 const SETTINGS_INSTRUCTION_TEXT = 'Toggle services to show/hide on the dashboard. Drag service cards to reorder them, or use the keyboard: press Enter to activate reorder mode and use arrow keys to move cards. Click "Save Changes" to apply. Services are organized by category.';
@@ -1767,8 +1770,6 @@ export class ExternalServicesManager {
    */
   hasAnimationKeyframes(animationName) {
     const styleSheets = Array.from(document.styleSheets || []);
-    // Standard CSSOM numeric value for KEYFRAMES_RULE, used when CSSRule.KEYFRAMES_RULE is unavailable (legacy browsers).
-    const LEGACY_KEYFRAMES_RULE_TYPE = 7;
     const keyframesType = typeof CSSRule !== 'undefined' ? CSSRule.KEYFRAMES_RULE : LEGACY_KEYFRAMES_RULE_TYPE;
 
     for (const styleSheet of styleSheets) {
@@ -1785,6 +1786,15 @@ export class ExternalServicesManager {
     return false;
   }
 
+  /**
+   * Convert milliseconds to seconds for CSS time values.
+   * @param {number} durationMs
+   * @returns {number}
+   */
+  millisecondsToSeconds(durationMs) {
+    return durationMs / 1000;
+  }
+
   /**
    * Schedule notification slide-out and removal.
    * Uses two-stage timing: display duration first, then animation duration before DOM removal.
@@ -1794,7 +1804,7 @@ export class ExternalServicesManager {
   scheduleNotificationRemoval(notification) {
     setTimeout(() => {
       if (this.hasAnimationKeyframes(this.notificationSlideOutAnimationName)) {
-        notification.style.animation = `${this.notificationSlideOutAnimationName} ${this.notificationAnimationDurationMs / 1000}s ease`;
+        notification.style.animation = `${this.notificationSlideOutAnimationName} ${this.millisecondsToSeconds(this.notificationAnimationDurationMs)}s ease`;
       }
       setTimeout(() => notification.remove(), this.notificationAnimationDurationMs);
     }, this.notificationDurationMs);
