From d2ac44797cafa6415882fbe641e0f65100f80bd8 Mon Sep 17 00:00:00 2001
From: Sam Gibbs <34915414+iamsamgibbs@users.noreply.github.com>
Date: Wed, 27 Nov 2024 09:50:17 +0000
Subject: [PATCH] Fix: Multi-sig custom settings should open by default if they
 have been adjusted

---
 .../MultiSigSettings/MultiSigSettings.tsx     | 28 +++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/components/frame/Extensions/pages/ExtensionDetailsPage/partials/ExtensionSettings/MultiSigSettings/MultiSigSettings.tsx b/src/components/frame/Extensions/pages/ExtensionDetailsPage/partials/ExtensionSettings/MultiSigSettings/MultiSigSettings.tsx
index cd66221af00..97f374345f9 100644
--- a/src/components/frame/Extensions/pages/ExtensionDetailsPage/partials/ExtensionSettings/MultiSigSettings/MultiSigSettings.tsx
+++ b/src/components/frame/Extensions/pages/ExtensionDetailsPage/partials/ExtensionSettings/MultiSigSettings/MultiSigSettings.tsx
@@ -1,11 +1,12 @@
 import { CaretDown } from '@phosphor-icons/react';
-import React, { type FC } from 'react';
+import React, { useEffect, type FC } from 'react';
 import { defineMessages } from 'react-intl';
 
 import { InputGroup } from '~common/Extensions/Fields/InputGroup/InputGroup.tsx';
 import RadioBase from '~common/Extensions/Fields/RadioList/RadioBase.tsx';
 import { useExtensionDetailsPageContext } from '~frame/Extensions/pages/ExtensionDetailsPage/context/ExtensionDetailsPageContext.ts';
 import useToggle from '~hooks/useToggle/index.ts';
+import { isInstalledExtensionData } from '~utils/extensions.ts';
 import { formatText } from '~utils/intl.ts';
 import Select from '~v5/common/Fields/Select/Select.tsx';
 import AccordionItem from '~v5/shared/Accordion/partials/AccordionItem/index.ts';
@@ -105,9 +106,32 @@ const MultiSigSettings: FC = () => {
     handleGlobalThresholdTypeChange,
   } = useThresholdData(extensionData);
 
-  const [isCustomSettingsVisible, { toggle: toggleCustomSettings }] =
+  const [isCustomSettingsVisible, { toggle: toggleCustomSettings, toggleOn }] =
     useToggle();
 
+  useEffect(() => {
+    const multiSigConfig = isInstalledExtensionData(extensionData)
+      ? extensionData.params?.multiSig || null
+      : null;
+
+    const { colonyThreshold, domainThresholds } = multiSigConfig || {};
+
+    if (!domainThresholds) {
+      return;
+    }
+
+    // If any custom settings have been adjusted, show the custom thresholds accordion on load
+    const shouldShowCustomSettings = domainThresholds.some((domain) => {
+      const { domainThreshold } = domain || {};
+
+      return domainThreshold !== colonyThreshold;
+    });
+
+    if (shouldShowCustomSettings) {
+      toggleOn();
+    }
+  }, [extensionData, toggleOn]);
+
   const handleOnKeyDown = (e) => {
     if (['.', ','].includes(e.key)) {
       e.preventDefault();