From 9038e9aaff69daafa08e6487be5e07f5a13a1aca Mon Sep 17 00:00:00 2001
From: Oleg Lokhvitsky <olegbl@gmail.com>
Date: Fri, 29 Nov 2024 11:32:07 -0800
Subject: [PATCH] Add "visible" option to mod settings sections (partially
 addresses #31)

---
 src/bridge/ModConfig.d.ts                          | 10 +++++-----
 src/renderer/react/settings/ModSettingsSection.tsx | 12 +++++++++++-
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/bridge/ModConfig.d.ts b/src/bridge/ModConfig.d.ts
index d6d5978..2b8df8e 100644
--- a/src/bridge/ModConfig.d.ts
+++ b/src/bridge/ModConfig.d.ts
@@ -69,6 +69,11 @@ export interface ModConfigBase {
    * The unique identifier of the configuration element.
    */
   id: string;
+
+  /**
+   * Determines if the field is visible or not.
+   */
+  visible?: Binding<boolean>;
 }
 
 /**
@@ -110,11 +115,6 @@ export interface ModConfigFieldBase extends ModConfigBase {
    * The name of the field.
    */
   name: string;
-
-  /**
-   * Determines if the field is visible or not.
-   */
-  visible?: Binding<boolean>;
 }
 
 /**
diff --git a/src/renderer/react/settings/ModSettingsSection.tsx b/src/renderer/react/settings/ModSettingsSection.tsx
index b1abf9a..754fb79 100644
--- a/src/renderer/react/settings/ModSettingsSection.tsx
+++ b/src/renderer/react/settings/ModSettingsSection.tsx
@@ -4,6 +4,7 @@ import type {
   ModConfigFieldOrSection,
   ModConfigSection,
 } from 'bridge/ModConfig';
+import { parseBinding } from 'renderer/react/BindingsParser';
 import { useSetModConfig } from 'renderer/react/context/ModsContext';
 import ModSettingsField from 'renderer/react/settings/ModSettingsField';
 import { MouseEvent, useCallback } from 'react';
@@ -93,8 +94,13 @@ export default function ModSettingsSection({
     [descendants, mod.config, mod.id, setModConfig],
   );
 
+  const isShown =
+    section.visible == null ||
+    parseBinding<boolean>(section.visible, mod.config);
+
   const areAllDescendantsCheckboxes =
-    descendants.every((child) => child.type === 'checkbox') ?? false;
+    descendants.length > 0 &&
+    (descendants.every((child) => child.type === 'checkbox') ?? false);
 
   const areAllDescendantsChecked =
     areAllDescendantsCheckboxes &&
@@ -118,6 +124,10 @@ export default function ModSettingsSection({
     [setModConfig, mod.id, mod.config, descendants, areAllDescendantsChecked],
   );
 
+  if (!isShown) {
+    return null;
+  }
+
   return (
     <StyledAccordion
       key={section.id ?? 'default'}