chore: save and get checkbox cell

frontend/appflowy_tauri/src/appflowy_app/components/_shared/EditRow/EditCellWrapper.tsx

@@ -76,7 +76,10 @@ export const EditCellWrapper = ({
               )}
 
             {cellIdentifier.fieldType === FieldType.Checkbox && cellController && (
-              <EditCheckboxCell data={data as boolean | undefined} cellController={cellController}></EditCheckboxCell>
+              <EditCheckboxCell
+                data={data as 'Yes' | 'No' | undefined}
+                cellController={cellController}
+              ></EditCheckboxCell>
             )}
 
             {cellIdentifier.fieldType === FieldType.DateTime && (

frontend/appflowy_tauri/src/appflowy_app/components/_shared/EditRow/EditCheckboxCell.tsx

@@ -1,22 +1,26 @@
 import { EditorCheckSvg } from '$app/components/_shared/svg/EditorCheckSvg';
 import { EditorUncheckSvg } from '$app/components/_shared/svg/EditorUncheckSvg';
-import { CellController } from '$app/stores/effects/database/cell/cell_controller';
+import { CheckboxCellController } from '$app/stores/effects/database/cell/controller_builder';
 
 export const EditCheckboxCell = ({
   data,
   cellController,
 }: {
-  data: boolean | undefined;
-  cellController: CellController<any, any>;
+  data: 'Yes' | 'No' | undefined;
+  cellController: CheckboxCellController;
 }) => {
   const toggleValue = async () => {
-    await cellController?.saveCellData(!data);
+    if (data === 'Yes') {
+      await cellController?.saveCellData('No');
+    } else {
+      await cellController?.saveCellData('Yes');
+    }
   };
 
   return (
     <div onClick={() => toggleValue()} className={'block px-4 py-2'}>
       <button className={'h-5 w-5'}>
-        {data ? <EditorCheckSvg></EditorCheckSvg> : <EditorUncheckSvg></EditorUncheckSvg>}
+        {data === 'Yes' ? <EditorCheckSvg></EditorCheckSvg> : <EditorUncheckSvg></EditorUncheckSvg>}
       </button>
     </div>
   );

frontend/appflowy_tauri/src/appflowy_app/components/board/BoardCell.tsx

@@ -6,6 +6,7 @@ import { BoardOptionsCell } from './BoardOptionsCell';
 import { BoardDateCell } from './BoardDateCell';
 import { BoardTextCell } from './BoardTextCell';
 import { BoardUrlCell } from '$app/components/board/BoardUrlCell';
+import { BoardCheckboxCell } from '$app/components/board/BoardCheckboxCell';
 
 export const BoardCell = ({
   cellIdentifier,
@@ -38,6 +39,12 @@ export const BoardCell = ({
           cellCache={cellCache}
           fieldController={fieldController}
         ></BoardUrlCell>
+      ) : cellIdentifier.fieldType === FieldType.Checkbox ? (
+        <BoardCheckboxCell
+          cellIdentifier={cellIdentifier}
+          cellCache={cellCache}
+          fieldController={fieldController}
+        ></BoardCheckboxCell>
       ) : (
         <BoardTextCell
           cellIdentifier={cellIdentifier}

frontend/appflowy_tauri/src/appflowy_app/components/board/BoardCheckboxCell.tsx

@@ -0,0 +1,23 @@
+import { EditorCheckSvg } from '$app/components/_shared/svg/EditorCheckSvg';
+import { EditorUncheckSvg } from '$app/components/_shared/svg/EditorUncheckSvg';
+import { CellIdentifier } from '$app/stores/effects/database/cell/cell_bd_svc';
+import { CellCache } from '$app/stores/effects/database/cell/cell_cache';
+import { FieldController } from '$app/stores/effects/database/field/field_controller';
+import { useCell } from '$app/components/_shared/database-hooks/useCell';
+
+export const BoardCheckboxCell = ({
+  cellIdentifier,
+  cellCache,
+  fieldController,
+}: {
+  cellIdentifier: CellIdentifier;
+  cellCache: CellCache;
+  fieldController: FieldController;
+}) => {
+  const { data } = useCell(cellIdentifier, cellCache, fieldController);
+  return (
+    <i className={'h-5 w-5'}>
+      {data === 'Yes' ? <EditorCheckSvg></EditorCheckSvg> : <EditorUncheckSvg></EditorUncheckSvg>}
+    </i>
+  );
+};