[WIP] Fix CSS display property and add error handling to UISystem

[Copilot]

Thanks for asking me to work on this. I will get started on it and keep this PR's description up to date as I form a plan and make progress.

Original prompt

Issues to Fix

1. CSS Missing Display Property

The .tax-production-window class in src/UI/components/TaxProductionWindow.css is missing the display: block; property, causing the window to be invisible even when isVisible state is true.

Current (Line 1-14):

.tax-production-window {
    position: fixed;
    top: 110px;
    left: 60px;
    width: 360px;
    background: rgba(15, 22, 30, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    color: #e0e0e0;
    font-family: sans-serif;
    font-size: 13px;
    z-index: 998;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
}

Fix: Add display: block; after position: fixed;

---

2. C# UISystem Missing Error Handling

The src/Systems/TaxProductionUISystem.cs file lacks:

• Try-catch blocks for error handling
• Proper OnUpdate() method implementation
• Logging for debugging state changes

Current issues:

• Lines 36-55: Methods have no error handling
• Lines 70-73: Logging exists but not comprehensive
• Missing OnUpdate() method

Fix: Wrap all methods in try-catch blocks and add proper error handling.

---

Expected Results

After fixes:

1. ✅ Window becomes visible when isVisible = true
2. ✅ All state changes are safely handled with error logging
3. ✅ Mod maintains stability even if unexpected errors occur
4. ✅ Better debugging with comprehensive logging

The following is the prior conversation context from the user's chat exploration (may be truncated):

Assistant: I found the CityForge repository and retrieved some information about it. Let me provide you with what I've learned about the project and why windows aren't opening.

CityForge Project Overview

CityForge is a modding framework for Cities: Skylines 2 that provides UI integration using React and TypeScript. It's built as a Cities Skylines 2 mod with both C# backend (CityForgeUISystem) and TypeScript/React frontend components.

Key Architecture:

1. C# Backend (CityForgeUISystem.cs):

   • Extends UISystemBase
   • Uses ValueBinding to communicate state between C# and UI
   • Manages UI visibility through _panelVisible binding

2. React Frontend (Cityforge/UI/src/index.tsx):

   • Uses React JSX elements for UI composition
   • Two main components:
     • CityForgeToolbarButton: Toolbar button in GameTopLeft area
     • CityForgePanel: Main panel in Game area
   • Registered via ModRegistrar interface

Why Windows Can't Open

Based on the code structure, the windows likely aren't opening due to one or more of these issues:

1. Panel Visibility Not Toggling: The _panelVisible binding needs to properly control whether the panel renders. Check if the toggle logic is correctly implemented in the button click handler.

2. ModRegistrar Not Properly Registered: The register function must be correctly exported as the default export and the module registry must be receiving the components properly:

   const register: ModRegistrar = (moduleRegistry) => {
     moduleRegistry.append("GameTopLeft", CityForgeToolbarButton);
     moduleRegistry.append("Game", CityForgePanel);
   };
   export default register;

3. Missing Module Entry Points: Ensure the webpack config correctly points to src/index.tsx as the entry point for the mod ID.

4. C# Bindings Not Initialized: The CityForgeUISystem needs to properly initialize the bindings so the C# side can communicate with the UI.

5. UI System Not Instantiated: The mod system may not be creating or instantiating the CityForgeUISystem properly.

What You Should Check:

• Verify the mod.json configuration properly references the compiled DLL
• Ensure the mod's C# entry point is correctly wired to create the CityForgeUISystem
• Check the browser console/debug output for React/binding errors
• Confirm the panel visibility state is being set to true when the button is clicked
• Verify the CSS/styling isn't hiding elements (check MIN_H, MIN_W constants)

Would you like me to help you examine the specific CityForgePanel implementation or the C# OnCreate() initialization to debug further?

User: fix the problem

Assistant: I'll help you fix the window opening problem. Let me first examine the current implementation to understand what's broken.

Assistant: Now let me check the structure of the repository to understand the full layout:

Assistant: Now I see the issue! Looking at the code structure, there's a critical mismatch. The src/index.tsx is importing components that don't exist:

import TaxMod from "mods/TaxMod";
import TaxWindow from "mods/TaxWindow";

But these files don't exist in the repository. Let me check what files are actually available:

Assistant: Now I can see the issue! The problem is in the TaxProductionWindow.tsx component. The window is rendered inside a <> (fragment), but it's missing proper CSS styling and layout that wo...

This pull request was created from Copilot chat.

---

🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.