From d9e8adb9276024ad40a6a775cd59adcb7a8784bf Mon Sep 17 00:00:00 2001
From: angelg19 <angel.gs0317@gmail.com>
Date: Wed, 7 Aug 2024 11:27:37 -0700
Subject: [PATCH] Multiple checkboxes update

---
 src/tactic/react/table_layout.js  | 51 +++++++++++++++++++++++--
 src/tactic/react/table_layout.jsx | 63 ++++++++++++++++++++++++++++++-
 2 files changed, 109 insertions(+), 5 deletions(-)

diff --git a/src/tactic/react/table_layout.js b/src/tactic/react/table_layout.js
index 5ad5c84eb..2925f5194 100644
--- a/src/tactic/react/table_layout.js
+++ b/src/tactic/react/table_layout.js
@@ -837,7 +837,9 @@ class SelectEditor {
       }, helpers[index]))));
       return;
     } else if (mode == "checkbox") {
-      if (this.value == null) {
+      if (this.value == null && labels.length > 1) {
+        this.value = values[2];
+      } else if (this.value == null) {
         this.value = values[1];
       }
       this.el = React.createElement("div", {
@@ -852,7 +854,50 @@ class SelectEditor {
           display: "flex",
           alignItems: "center"
         }
-      }, React.createElement(Checkbox, {
+      }, labels.length > 1 ? React.createElement(React.Fragment, null, React.createElement(Checkbox, {
+        checked: this.value === values[0],
+        onChange: e => {
+          if (this.value === values[0]) {
+            this.value = values[2];
+          } else if (this.value === values[1]) {
+            this.value = values[0];
+          } else if (this.value === values[2]) {
+            this.value = values[0];
+          }
+          e.name = name;
+          if (params.onchange) {
+            params.onchange(e, this.value);
+          }
+        },
+        style: {
+          cursor: "pointer",
+          alignSelf: "flex-start"
+        }
+      }), React.createElement("div", {
+        style: {
+          fontSize: "0.8rem",
+          textAlign: "center"
+        }
+      }, labels[0]), React.createElement(Checkbox, {
+        checked: this.value === values[1],
+        onChange: e => {
+          if (this.value === values[0]) {
+            this.value = values[1];
+          } else if (this.value === values[1]) {
+            this.value = values[2];
+          } else if (this.value === values[2]) {
+            this.value = values[1];
+          }
+          e.name = name;
+          if (params.onchange) {
+            params.onchange(e, this.value);
+          }
+        },
+        style: {
+          cursor: "pointer",
+          alignSelf: "flex-start"
+        }
+      })) : React.createElement(Checkbox, {
         checked: this.value === values[0],
         onChange: e => {
           if (this.value === values[0]) {
@@ -874,7 +919,7 @@ class SelectEditor {
           fontSize: "0.8rem",
           textAlign: "center"
         }
-      }, labels[0])));
+      }, labels.length > 1 ? labels[1] : labels[0])));
       return;
     }
     this.el = React.createElement(TextField, {
diff --git a/src/tactic/react/table_layout.jsx b/src/tactic/react/table_layout.jsx
index e095f43c3..a6ee50790 100644
--- a/src/tactic/react/table_layout.jsx
+++ b/src/tactic/react/table_layout.jsx
@@ -1210,13 +1210,71 @@ class SelectEditor {
 
         else if (mode == "checkbox") {
             //Default to not checked
-            if (this.value == null) {
+            if (this.value == null && labels.length > 1) {
+                this.value = values[2];
+            }
+            else if (this.value == null) {
                 this.value = values[1];
             }
+            
+
+            
 
             this.el = (
                 <div style={{display: "flex", flexDirection: layout, gap: "20px"}}>
                     <div style={{width: "100%", display: "flex", alignItems: "center"}}>
+                        {labels.length > 1 ? <><Checkbox
+                            checked={this.value === values[0]}
+                            onChange={ e => {
+                                if (this.value === values[0]){
+                                    this.value = values[2];
+                                }
+                                else if (this.value === values[1]){
+                                    this.value = values[0];
+                                }
+                                else if (this.value === values[2]){
+                                    this.value = values[0];
+                                }
+                                // Need to add this
+                                e.name = name;
+        
+                                if (params.onchange) {
+                                    params.onchange(e, this.value);
+                                }
+                            }}
+                            style={{
+                                cursor: "pointer",
+                                alignSelf: "flex-start"
+                            }}
+                        /> 
+                        <div style={{
+                            fontSize: "0.8rem",
+                            textAlign: "center",
+                        }}>{labels[0]}</div>
+                        <Checkbox
+                            checked={this.value === values[1]}
+                            onChange={ e => {
+                                if (this.value === values[0]){
+                                    this.value = values[1];
+                                }
+                                else if (this.value === values[1]){
+                                    this.value = values[2];
+                                }
+                                else if (this.value === values[2]){
+                                    this.value = values[1];
+                                }
+                                // Need to add this
+                                e.name = name;
+        
+                                if (params.onchange) {
+                                    params.onchange(e, this.value);
+                                }
+                            }}
+                            style={{
+                                cursor: "pointer",
+                                alignSelf: "flex-start"
+                            }}
+                        /></>:
                         <Checkbox
                             checked={this.value === values[0]}
                             onChange={ e => {
@@ -1238,10 +1296,11 @@ class SelectEditor {
                                 alignSelf: "flex-start"
                             }}
                         />
+                    }
                         <div style={{
                             fontSize: "0.8rem",
                             textAlign: "center",
-                        }}>{labels[0]}</div>
+                        }}>{labels.length > 1 ? labels[1] : labels[0]}</div>
                     </div>
                 </div>
             )