From 26c1615848b23b6d83fdfa3a7d46bd76e3183375 Mon Sep 17 00:00:00 2001
From: mgtennant <100305096+mgtennant@users.noreply.github.com>
Date: Thu, 29 Aug 2024 13:56:07 -0700
Subject: [PATCH] always display provisions/variables collapsibles

---
 .../src/app/components/common/Collapsible.tsx |  9 ++++----
 .../src/app/content/pages/LandingPage.tsx     | 23 +++++++++----------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/frontend/src/app/components/common/Collapsible.tsx b/frontend/src/app/components/common/Collapsible.tsx
index 7efe15ae..6dfa6ea4 100644
--- a/frontend/src/app/components/common/Collapsible.tsx
+++ b/frontend/src/app/components/common/Collapsible.tsx
@@ -8,14 +8,15 @@ interface CollapsibleProps {
   title: string;
   children: React.ReactNode;
   isOpen: boolean;
+  enabled?: boolean;
 }
 
-const Collapsible: FC<CollapsibleProps> = ({ title, children, isOpen }) => {
+const Collapsible: FC<CollapsibleProps> = ({ title, children, isOpen, enabled = true }) => {
   const [isOpenonClick, setIsOpenOnClick] = useState(isOpen);
   const icon = isOpenonClick ? faMinus : (faPlus as IconProp);
 
   const contentStyle = {
-    display: isOpenonClick ? 'block' : 'none',
+    display: enabled ? (isOpenonClick ? 'block' : 'none') : 'none',
   };
 
   const toggleCollapsibleOnClick = () => {
@@ -31,10 +32,10 @@ const Collapsible: FC<CollapsibleProps> = ({ title, children, isOpen }) => {
       <div className="mb-2 d-flex align-items-center">
         <FontAwesomeIcon
           icon={icon as IconProp}
-          className="inlineDiv collapsibleTitle"
+          className={`inlineDiv collapsibleTitle`}
           onClick={toggleCollapsibleOnClick}
         />
-        <div className="ml-2 inlineDiv collapsibleTitle boldText" onClick={toggleCollapsibleOnClick}>
+        <div className={`ml-2 inlineDiv collapsibleTitle boldText`} onClick={toggleCollapsibleOnClick}>
           {title}
         </div>
       </div>
diff --git a/frontend/src/app/content/pages/LandingPage.tsx b/frontend/src/app/content/pages/LandingPage.tsx
index 693f8865..af78866b 100644
--- a/frontend/src/app/content/pages/LandingPage.tsx
+++ b/frontend/src/app/content/pages/LandingPage.tsx
@@ -476,19 +476,18 @@ const LandingPage: FC = () => {
         {data ? <InterestedParties data={data!} /> : <Skeleton />}
       </Collapsible>
 
-      {provisionGroups && dtid && documentType ? (
-        <>
-          <Collapsible title="Provisions" isOpen={false}>
-            <Provisions dtid={dtid} documentType={documentType} provisionGroups={provisionGroups} />
-          </Collapsible>
+      <Collapsible title="Provisions" isOpen={false} enabled={provisionGroups && dtid && documentType ? true : false}>
+        {provisionGroups && dtid && documentType ? (
+          <Provisions dtid={dtid} documentType={documentType} provisionGroups={provisionGroups} />
+        ) : (
+          <></>
+        )}
+      </Collapsible>
+
+      <Collapsible title="Variables" isOpen={false} enabled={provisionGroups && dtid && documentType ? true : false}>
+        {provisionGroups && dtid && documentType ? <VariablesTable onVariableEdit={handleVariableEdit} /> : <></>}
+      </Collapsible>
 
-          <Collapsible title="Variables" isOpen={false}>
-            <VariablesTable onVariableEdit={handleVariableEdit} />
-          </Collapsible>
-        </>
-      ) : (
-        <></>
-      )}
       <>
         {' '}
         {showGenerateError && (