From 903bb7c5eed4cb8f2692ccfd99667c4a8dc79182 Mon Sep 17 00:00:00 2001
From: toddnief <todd.nief@gmail.com>
Date: Fri, 2 Aug 2024 13:52:10 -0500
Subject: [PATCH 1/3] remove commented code

---
 dashboard-react/components/CheckboxMenu.js    | 37 ++++++-------------
 .../components/RadioSingleSelect.js           | 23 ------------
 2 files changed, 12 insertions(+), 48 deletions(-)

diff --git a/dashboard-react/components/CheckboxMenu.js b/dashboard-react/components/CheckboxMenu.js
index 7892810..06fda0d 100644
--- a/dashboard-react/components/CheckboxMenu.js
+++ b/dashboard-react/components/CheckboxMenu.js
@@ -11,8 +11,6 @@ export default function CheckboxMenu({
   title,
 }) {
   const snap = useSnapshot(state);
-  // Note: Use local state for the expanded state of the menu
-  const [expanded, setExpanded] = useState(false);
 
   const handleCheckboxChange = (key, value) => (event) => {
     const checked = event.target.checked;
@@ -41,30 +39,19 @@ export default function CheckboxMenu({
 
   return (
     <div className="my-4">
-      <div className="flex flex-center justify-center mx-auto">
-        <h3>{title}</h3>
-        <div
-          className="tooltip tooltip-primary tooltip-left mx-.75"
-          data-tip={infoText}
-        >
-          <span className="cursor-pointer text-primary">
-            <InformationCircleIcon className="h-5 w-5 text-primary" />
-          </span>
-        </div>
+      <div className="inline-flex">
+        <h3>
+          <span className="inline">{title}</span>
+          <div
+            className="tooltip tooltip-primary tooltip-left ml-2 inline-flex"
+            data-tip={infoText}
+          >
+            <span className="cursor-pointer text-primary">
+              <InformationCircleIcon className="h-5 w-5 text-primary" />
+            </span>
+          </div>
+        </h3>
       </div>
-      {/* <div className="flex justify-center mt-3">
-        <button
-          className="btn btn-sm normal-case"
-          onClick={() => setExpanded((e) => !e)}
-        >
-          {expanded ? `Collapse Menu` : `Show Menu`}
-        </button>
-      </div> */}
-      {/* <div
-        className={`overflow-auto flex-grow px-4 ${
-          expanded ? "max-h-[150px]" : "h-0"
-        }`}
-      > */}
       <div className={"overflow-auto flex-grow px-4 h-[150px]"}>
         <ul className="menu dropdown-content bg-base-100 rounded-box z-[1] w-52 p-2 mx-auto shadow">
           {options?.map((option) => (
diff --git a/dashboard-react/components/RadioSingleSelect.js b/dashboard-react/components/RadioSingleSelect.js
index f0633c9..78a29ec 100644
--- a/dashboard-react/components/RadioSingleSelect.js
+++ b/dashboard-react/components/RadioSingleSelect.js
@@ -29,28 +29,5 @@ export default function RadioSingleSelect({ options, title, filterKey }) {
         ))}
       </div>
     </div>
-    // <>
-    //   <div className="flex flex-wrap">
-    //     <h3>{title}</h3>
-    //     <div className="flex space-x-10">
-    //       {Object.entries(options).map(([key, value]) => (
-    //         <label
-    //           key={key}
-    //           className="label cursor-pointer flex items-center space-x-2 w-1/3 md:w-1/4 lg:w-1/5 space-y-2"
-    //         >
-    //           <input
-    //             type="radio"
-    //             name={filterKey}
-    //             value={value}
-    //             checked={snap.filters[filterKey] === value}
-    //             onChange={() => handleSingleSelectChange(filterKey, value)}
-    //             className="radio radio-primary"
-    //           />
-    //           <span className="label-text align-top items-start">{key}</span>
-    //         </label>
-    //       ))}
-    //     </div>
-    //   </div>
-    // </>
   );
 }

From 206370900d5172787f8ffccaca0930ee6c4ce1f0 Mon Sep 17 00:00:00 2001
From: toddnief <todd.nief@gmail.com>
Date: Fri, 2 Aug 2024 13:55:01 -0500
Subject: [PATCH 2/3] center titles

---
 dashboard-react/components/CheckboxMenu.js    | 26 ++++++++++---------
 .../components/DashboardFilterControls.js     | 15 ++++-------
 2 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/dashboard-react/components/CheckboxMenu.js b/dashboard-react/components/CheckboxMenu.js
index 06fda0d..e1f7c4d 100644
--- a/dashboard-react/components/CheckboxMenu.js
+++ b/dashboard-react/components/CheckboxMenu.js
@@ -39,18 +39,20 @@ export default function CheckboxMenu({
 
   return (
     <div className="my-4">
-      <div className="inline-flex">
-        <h3>
-          <span className="inline">{title}</span>
-          <div
-            className="tooltip tooltip-primary tooltip-left ml-2 inline-flex"
-            data-tip={infoText}
-          >
-            <span className="cursor-pointer text-primary">
-              <InformationCircleIcon className="h-5 w-5 text-primary" />
-            </span>
-          </div>
-        </h3>
+      <div className="flex justify-center mx-auto">
+        <div className="inline-flex">
+          <h3>
+            <span className="inline">{title}</span>
+            <div
+              className="tooltip tooltip-primary tooltip-left ml-2 inline-flex"
+              data-tip={infoText}
+            >
+              <span className="cursor-pointer text-primary">
+                <InformationCircleIcon className="h-5 w-5 text-primary" />
+              </span>
+            </div>
+          </h3>
+        </div>
       </div>
       <div className={"overflow-auto flex-grow px-4 h-[150px]"}>
         <ul className="menu dropdown-content bg-base-100 rounded-box z-[1] w-52 p-2 mx-auto shadow">
diff --git a/dashboard-react/components/DashboardFilterControls.js b/dashboard-react/components/DashboardFilterControls.js
index 4189015..0a89ee3 100644
--- a/dashboard-react/components/DashboardFilterControls.js
+++ b/dashboard-react/components/DashboardFilterControls.js
@@ -20,36 +20,31 @@ export default function DashboardFilterControls() {
             options={snap.options["Technology"]}
             selectedOptions={snap.filters.selectedTechnologies}
             filterKey="selectedTechnologies"
-            title="Select Technology(ies)"
+            title="Select Technology"
           />
           <CheckboxMenu
             options={snap.options["Material Class II"]}
             selectedOptions={snap.filters.selectedMaterialTypes}
             filterKey="selectedMaterialTypes"
-            title="Select Material Type(s)"
+            title="Select Material Type"
           />
-          {/* </div> */}
-          {/* </div>
-      <div className="flex-1 mx-2 w-full">
-        <h2 className="text-center">Operating Conditions Filters</h2>
-        <div className="flex flex-row"> */}
           <CheckboxMenu
             options={Object.keys(temperatureFilterDict)}
             selectedOptions={snap.filters.selectedTemperatureLevels}
             filterKey="selectedTemperatureLevels"
-            title="Select Temperature Range(s)"
+            title="Select Temperature Range"
           />
           <CheckboxMenu
             options={Object.keys(moistureFilterDict)}
             selectedOptions={snap.filters.selectedMoistureLevels}
             filterKey="selectedMoistureLevels"
-            title="Select Moisture Content Range(s)"
+            title="Select Moisture Content Range"
           />
           <CheckboxMenu
             options={Object.keys(trialDurationDict)}
             selectedOptions={snap.filters.selectedTrialDurations}
             filterKey="selectedTrialDurations"
-            title="Select Trial Duration Range(s)"
+            title="Select Trial Duration Range"
           />
         </div>
       </div>

From 7e5183a6996a57d9679a8dfd6d817b81d8fd9a6e Mon Sep 17 00:00:00 2001
From: toddnief <todd.nief@gmail.com>
Date: Fri, 2 Aug 2024 14:05:33 -0500
Subject: [PATCH 3/3] style checkbox menus more

---
 dashboard-react/components/CheckboxMenu.js | 40 +++++++++++-----------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/dashboard-react/components/CheckboxMenu.js b/dashboard-react/components/CheckboxMenu.js
index e1f7c4d..3c559da 100644
--- a/dashboard-react/components/CheckboxMenu.js
+++ b/dashboard-react/components/CheckboxMenu.js
@@ -54,8 +54,27 @@ export default function CheckboxMenu({
           </h3>
         </div>
       </div>
+      <div className="flex join mt-1 justify-center">
+        <button
+          className={`btn join-item btn-sm normal-case hover:bg-secondary ${
+            allSelected ? "bg-primary" : ""
+          }`}
+          onClick={selectAll}
+        >
+          All
+        </button>
+        <button
+          className={`btn join-item btn-sm normal-case hover:bg-secondary ${
+            noneSelected ? "bg-primary" : ""
+          }`}
+          onClick={selectNone}
+        >
+          None
+        </button>
+      </div>
+      <div className="divider my-1"></div>
       <div className={"overflow-auto flex-grow px-4 h-[150px]"}>
-        <ul className="menu dropdown-content bg-base-100 rounded-box z-[1] w-52 p-2 mx-auto shadow">
+        <ul className="menu dropdown-content bg-base-100 rounded-box z-[1] w-52 p-2 mb-2 mx-auto shadow-lg">
           {options?.map((option) => (
             <li key={option}>
               <label className="label cursor-pointer">
@@ -73,25 +92,6 @@ export default function CheckboxMenu({
           ))}
         </ul>
       </div>
-      <div className="mt-2 flex join justify-center">
-        <button
-          className={`btn join-item btn-sm normal-case hover:bg-secondary ${
-            allSelected ? "bg-primary" : ""
-          }`}
-          onClick={selectAll}
-        >
-          All
-        </button>
-        <button
-          className={`btn join-item btn-sm normal-case hover:bg-secondary ${
-            noneSelected ? "bg-primary" : ""
-          }`}
-          onClick={selectNone}
-        >
-          None
-        </button>
-      </div>
-      <div className="divider m-0"></div>
     </div>
   );
 }