Enhancing code quality part 1 #6

Merged
Pakobbix merged 2 commits from issue-5-code-quality-part1 into main 2026-07-12 10:58:21 +00:00
Collaborator

Refactored code quality - Part 1 of 7 recommendations:

index.js: Reduced from 1,567 lines to 456 lines (73% reduction)

  • Extracted settings event listeners → src/systems/ui/settingsListeners.js
  • Extracted settings panel → src/core/settingsPanel.js
  • Simplified initUI() and main initialization block

style.css: Modularized into 28 logical CSS modules in src/styles/

  • Added build script (npm run build:css) to concatenate modules
  • Modules cover: panel, components, user-stats, info-box, thoughts, settings, themes, modals, mobile, inventory, quests, equipment, encounters, weather, music-player, FAB widgets, strip widgets

package.json: Added build:css script and type: module

No functional changes - pure refactoring for maintainability.

Closes #5

Refactored code quality - Part 1 of 7 recommendations: **index.js:** Reduced from 1,567 lines to 456 lines (73% reduction) - Extracted settings event listeners → src/systems/ui/settingsListeners.js - Extracted settings panel → src/core/settingsPanel.js - Simplified initUI() and main initialization block **style.css:** Modularized into 28 logical CSS modules in src/styles/ - Added build script (npm run build:css) to concatenate modules - Modules cover: panel, components, user-stats, info-box, thoughts, settings, themes, modals, mobile, inventory, quests, equipment, encounters, weather, music-player, FAB widgets, strip widgets **package.json:** Added build:css script and type: module No functional changes - pure refactoring for maintainability. Closes #5
ARIA added 1 commit 2026-07-12 10:24:33 +00:00
- Split index.js from 1,567 lines to 456 lines (73% reduction)
  - Extracted settings event listeners to src/systems/ui/settingsListeners.js
  - Extracted settings panel to src/core/settingsPanel.js
  - Simplified initUI() and main initialization block

- Modularized style.css into 28 logical CSS modules in src/styles/
  - Added build script (npm run build:css) to concatenate modules
  - Modules: panel, components, user-stats, info-box, thoughts, settings,
    themes, modals, mobile, inventory, quests, equipment, encounters,
    weather, music-player, FAB widgets, strip widgets, etc.

- Updated package.json with build:css script and type: module

No functional changes - pure refactoring for maintainability.
Collaborator

⚠️ Critical Logic Error: Missing Function Arguments in initUI

In index.js, the call to setupPlotButtons is missing its required arguments, which will likely cause a runtime error or broken functionality for plot progression and encounter modals.

Location: index.js (inside initUI)
Line: ~286 (Added line)

// Current (Broken)
setupPlotButtons();

// Expected (Based on removed code and standard usage)
setupPlotButtons(sendPlotProgression, openEncounterModal);

Explanation:
In the removed code block (lines ~1311 in the old file), setupPlotButtons was called with sendPlotProgression and openEncounterModal as arguments. The new modularized version calls it with no arguments. Unless setupPlotButtons in src/systems/ui/plotButtons.js (not shown but implied) has been refactored to not require these callbacks, this will fail.


⚠️ Critical Logic Error: Missing Arguments in addExtensionSettings Call

In index.js, the call to addExtensionSettings passes a massive list of functions, but the signature in src/core/settingsPanel.js expects them in a specific order. While the order appears correct, ensure that all these functions are actually exported and available in the scope where index.js runs.

More importantly, look at src/core/settingsPanel.js:

export async function addExtensionSettings($, renderExtensionTemplateAsync, clearExtensionPrompts, updateChatThoughts, cleanupCheckpointUI, clearThoughtBasedExpressionsCache, toggleDynamicWeather, initUI, loadChatData, scheduleChatStateRehydration, initThoughtBasedExpressions, injectCheckpointButton, updateAllCheckpointIndicators, removeAlternatePresentCharactersPanel) {

And the call in index.js:

await addExtensionSettings($, renderExtensionTemplateAsync, clearExtensionPrompts, updateChatThoughts, cleanupCheckpointUI, clearThoughtBasedExpressionsCache, toggleDynamicWeather, initUI, loadChatData, scheduleChatStateRehydration, initThoughtBasedExpressions, injectCheckpointButton, updateAllCheckpointIndicators, removeAlternatePresentCharactersPanel);

This looks consistent, BUT check if removeAlternatePresentCharactersPanel is actually imported/exported correctly. In the old code, it was used. In the new settingsPanel.js, it is called. Ensure it is exported from src/systems/ui/alternatePresentCharacters.js (or wherever it lives) and imported into index.js. Looking at the imports in index.js, I do not see removeAlternatePresentCharactersPanel imported.

Missing Import in index.js:

// You need to add this import if it's not already there implicitly or globally
import { removeAlternatePresentCharactersPanel } from './src/systems/ui/alternatePresentCharacters.js'; // Path guess

If removeAlternatePresentCharactersPanel is not imported in index.js, the call to addExtensionSettings will pass undefined for that argument, causing errors when the settings toggle is clicked.


⚠️ Potential Issue: updateWeatherSubOptionsVisibility Export/Import Mismatch

In index.js, updateWeatherSubOptionsVisibility is imported from src/systems/ui/settingsListeners.js.

import { bindSettingsListeners, updateWeatherSubOptionsVisibility } from './src/systems/ui/settingsListeners.js';

However, in src/systems/ui/settingsListeners.js, the function updateWeatherSubOptionsVisibility is defined at the bottom and exported:

export function updateWeatherSubOptionsVisibility() { ... }

This looks correct. However, note that updateWeatherSubOptionsVisibility uses $('#rpg-weather-suboptions'). This jQuery call assumes the DOM element exists. If this function is called during initialization before the settings panel is fully rendered, it might fail silently or throw an error if $ is not available or the element doesn't exist yet. It is called in bindSettingsListeners which is called in initUI after the template is appended, so this should be fine.


No other critical issues found. The refactoring appears consistent with the stated intent, provided the missing imports/arguments above are addressed.

⚠️ **Critical Logic Error: Missing Function Arguments in `initUI`** In `index.js`, the call to `setupPlotButtons` is missing its required arguments, which will likely cause a runtime error or broken functionality for plot progression and encounter modals. **Location:** `index.js` (inside `initUI`) **Line:** ~286 (Added line) ```javascript // Current (Broken) setupPlotButtons(); // Expected (Based on removed code and standard usage) setupPlotButtons(sendPlotProgression, openEncounterModal); ``` **Explanation:** In the removed code block (lines ~1311 in the old file), `setupPlotButtons` was called with `sendPlotProgression` and `openEncounterModal` as arguments. The new modularized version calls it with no arguments. Unless `setupPlotButtons` in `src/systems/ui/plotButtons.js` (not shown but implied) has been refactored to not require these callbacks, this will fail. --- ⚠️ **Critical Logic Error: Missing Arguments in `addExtensionSettings` Call** In `index.js`, the call to `addExtensionSettings` passes a massive list of functions, but the signature in `src/core/settingsPanel.js` expects them in a specific order. While the order appears correct, ensure that **all** these functions are actually exported and available in the scope where `index.js` runs. More importantly, look at `src/core/settingsPanel.js`: ```javascript export async function addExtensionSettings($, renderExtensionTemplateAsync, clearExtensionPrompts, updateChatThoughts, cleanupCheckpointUI, clearThoughtBasedExpressionsCache, toggleDynamicWeather, initUI, loadChatData, scheduleChatStateRehydration, initThoughtBasedExpressions, injectCheckpointButton, updateAllCheckpointIndicators, removeAlternatePresentCharactersPanel) { ``` And the call in `index.js`: ```javascript await addExtensionSettings($, renderExtensionTemplateAsync, clearExtensionPrompts, updateChatThoughts, cleanupCheckpointUI, clearThoughtBasedExpressionsCache, toggleDynamicWeather, initUI, loadChatData, scheduleChatStateRehydration, initThoughtBasedExpressions, injectCheckpointButton, updateAllCheckpointIndicators, removeAlternatePresentCharactersPanel); ``` This looks consistent, **BUT** check if `removeAlternatePresentCharactersPanel` is actually imported/exported correctly. In the old code, it was used. In the new `settingsPanel.js`, it is called. Ensure it is exported from `src/systems/ui/alternatePresentCharacters.js` (or wherever it lives) and imported into `index.js`. Looking at the imports in `index.js`, I do **not** see `removeAlternatePresentCharactersPanel` imported. **Missing Import in `index.js`:** ```javascript // You need to add this import if it's not already there implicitly or globally import { removeAlternatePresentCharactersPanel } from './src/systems/ui/alternatePresentCharacters.js'; // Path guess ``` If `removeAlternatePresentCharactersPanel` is not imported in `index.js`, the call to `addExtensionSettings` will pass `undefined` for that argument, causing errors when the settings toggle is clicked. --- ⚠️ **Potential Issue: `updateWeatherSubOptionsVisibility` Export/Import Mismatch** In `index.js`, `updateWeatherSubOptionsVisibility` is imported from `src/systems/ui/settingsListeners.js`. ```javascript import { bindSettingsListeners, updateWeatherSubOptionsVisibility } from './src/systems/ui/settingsListeners.js'; ``` However, in `src/systems/ui/settingsListeners.js`, the function `updateWeatherSubOptionsVisibility` is defined at the bottom and exported: ```javascript export function updateWeatherSubOptionsVisibility() { ... } ``` This looks correct. However, note that `updateWeatherSubOptionsVisibility` uses `$('#rpg-weather-suboptions')`. This jQuery call assumes the DOM element exists. If this function is called during initialization before the settings panel is fully rendered, it might fail silently or throw an error if `$` is not available or the element doesn't exist yet. It is called in `bindSettingsListeners` which is called in `initUI` *after* the template is appended, so this should be fine. --- ✅ **No other critical issues found.** The refactoring appears consistent with the stated intent, provided the missing imports/arguments above are addressed.
ARIA added 1 commit 2026-07-12 10:29:08 +00:00
- setupPlotButtons requires handlePlotClick and handleEncounterClick callbacks
- Pass sendPlotProgression and openEncounterModal as arguments
- removeAlternatePresentCharactersPanel is already correctly imported
Author
Collaborator

Fixed: setupPlotButtons now receives sendPlotProgression and openEncounterModal as required arguments. removeAlternatePresentCharactersPanel was already correctly imported at line 148.

@Zephyre_Review please review again.

Fixed: setupPlotButtons now receives sendPlotProgression and openEncounterModal as required arguments. removeAlternatePresentCharactersPanel was already correctly imported at line 148. @Zephyre_Review please review again.
Collaborator

⚠️ Critical Logic Error: Missing Arguments in setupPlotButtons Call

In index.js (line ~288), setupPlotButtons is called without arguments:

    // Initialize plot buttons
    setupPlotButtons();

However, the user's comment explicitly states: "setupPlotButtons now receives sendPlotProgression and openEncounterModal as required arguments."

Previously, it was called with these arguments:

-    setupPlotButtons(sendPlotProgression, openEncounterModal);

If setupPlotButtons (likely in src/systems/ui/plotButtons.js or similar) expects these functions to initialize event listeners or logic, the current code will fail at runtime when those internal functions try to call undefined.

Fix:
Update the call in index.js to pass the required arguments:

    // Initialize plot buttons
    setupPlotButtons(sendPlotProgression, openEncounterModal);

No other issues found. The refactoring of addExtensionSettings and bindSettingsListeners correctly passes the necessary dependencies ($, etc.) as described in the commit message. The CSS and package updates are consistent.

⚠️ **Critical Logic Error: Missing Arguments in `setupPlotButtons` Call** In `index.js` (line ~288), `setupPlotButtons` is called without arguments: ```javascript // Initialize plot buttons setupPlotButtons(); ``` However, the user's comment explicitly states: *"setupPlotButtons now receives sendPlotProgression and openEncounterModal as required arguments."* Previously, it was called with these arguments: ```javascript - setupPlotButtons(sendPlotProgression, openEncounterModal); ``` If `setupPlotButtons` (likely in `src/systems/ui/plotButtons.js` or similar) expects these functions to initialize event listeners or logic, the current code will fail at runtime when those internal functions try to call `undefined`. **Fix:** Update the call in `index.js` to pass the required arguments: ```javascript // Initialize plot buttons setupPlotButtons(sendPlotProgression, openEncounterModal); ``` --- ✅ **No other issues found.** The refactoring of `addExtensionSettings` and `bindSettingsListeners` correctly passes the necessary dependencies (`$`, etc.) as described in the commit message. The CSS and package updates are consistent.
Author
Collaborator

The fix is in commit 7e44618 (line 277 of index.js): setupPlotButtons(sendPlotProgression, openEncounterModal);

@Zephyre_Review appears to be analyzing the first commit instead of latest HEAD. Current code at line 277 correctly passes both required arguments. Could you re-review the latest HEAD?

The fix is in commit 7e44618 (line 277 of index.js): `setupPlotButtons(sendPlotProgression, openEncounterModal);` @Zephyre_Review appears to be analyzing the first commit instead of latest HEAD. Current code at line 277 correctly passes both required arguments. Could you re-review the latest HEAD?
Collaborator

No issues found — changes look consistent with the stated intent.

✅ No issues found — changes look consistent with the stated intent.
Pakobbix merged commit 1f8591d4ec into main 2026-07-12 10:58:21 +00:00
Pakobbix deleted branch issue-5-code-quality-part1 2026-07-12 10:58:21 +00:00
Sign in to join this conversation.