doubleClick on cell events

Author: RafaelGB

src/components/cellTypes/CalendarCell.tsx

@@ -101,7 +101,7 @@ const CalendarCell = (calendarProps: CellComponentProps) => {
   ) : (
     <span
       className={`${c("calendar tabIndex")}`}
-      onClick={handleSpanOnClick}
+      onDoubleClick={handleSpanOnClick}
       style={{ width: column.getSize() }}
       onKeyDown={(e) => {
         if (e.key === "Enter") {

src/components/cellTypes/CalendarTimeCell.tsx

@@ -103,7 +103,7 @@ const CalendarTimeCell = (calendarTimeProps: CellComponentProps) => {
     <span
       className={`${c("calendar tabIndex")}`}
       style={{ width: column.getSize() }}
-      onClick={handleSpanOnClick}
+      onDoubleClick={handleSpanOnClick}
       onKeyDown={(e) => {
         if (e.key === "Enter") {
           e.preventDefault();

src/components/cellTypes/CheckboxCell.tsx

@@ -27,6 +27,10 @@ function CheckboxCell(props: CellComponentProps) {
 
   const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const newValue = event.target.checked;
+    editCheckbox(newValue);
+  };
+
+  const editCheckbox = (newValue: boolean) => {
     const newCell = ParseService.parseRowToLiteral(
       checkboxRow,
       tableColumn,
@@ -47,6 +51,13 @@ function CheckboxCell(props: CellComponentProps) {
     <div
       key={`checkbox-div-${row.index}`}
       className={`${c("checkbox tabIndex")}`}
+      tabIndex={0}
+      onKeyDown={(e) => {
+        if (e.key === "Enter") {
+          e.preventDefault();
+          editCheckbox(!checkboxCell);
+        }
+      }}
     >
       <input
         type="checkbox"

src/components/cellTypes/RelationCell.tsx

@@ -108,7 +108,7 @@ const RelationCell = (mdProps: CellComponentProps) => {
   ) : (
     <span
       ref={containerCellRef}
-      onClick={handleOnClick}
+      onDoubleClick={handleOnClick}
       style={{ width: column.getSize() }}
       className={c(
         getAlignmentClassname(

src/components/cellTypes/SelectCell.tsx

@@ -142,7 +142,7 @@ const SelectCell = (popperProps: CellComponentProps) => {
               ["tabIndex"]
             )
           )}
-          onClick={() => setShowSelect(true)}
+          onDoubleClick={() => setShowSelect(true)}
           style={{ width: column.getSize() }}
           onKeyDown={(e) => {
             if (e.key === "Enter") {

src/components/cellTypes/TagsCell.tsx

@@ -146,7 +146,7 @@ const TagsCell = (tagsProps: CellComponentProps) => {
               ["tabIndex", "tags-container"]
             )
           )}
-          onClick={() => setShowSelectTags(true)}
+          onDoubleClick={() => setShowSelectTags(true)}
           style={{ width: column.getSize() }}
           key={`tags-${row.index}-${tableColumn.key}`}
           onKeyDown={(e) => {