fix: tauri cell update (#2124)

* test: subscribe text cell change

* test: add edit url cell test

frontend/appflowy_tauri/src/appflowy_app/components/tests/DatabaseTestHelper.ts

@@ -16,6 +16,7 @@ import {
   NumberCellController,
   SelectOptionCellController,
   TextCellController,
+  URLCellController,
 } from '../../stores/effects/database/cell/controller_builder';
 import { None, Option, Some } from 'ts-results';
 import { TypeOptionBackendService } from '../../stores/effects/database/field/type_option/type_option_bd_svc';
@@ -125,6 +126,17 @@ export async function makeDateCellController(
   return Some(builder.build() as DateCellController);
 }
 
+export async function makeURLCellController(
+  fieldId: string,
+  rowInfo: RowInfo,
+  databaseController: DatabaseController
+): Promise<Option<URLCellController>> {
+  const builder = await makeCellControllerBuilder(fieldId, rowInfo, FieldType.DateTime, databaseController).then(
+    (result) => result.unwrap()
+  );
+  return Some(builder.build() as URLCellController);
+}
+
 export async function makeCellControllerBuilder(
   fieldId: string,
   rowInfo: RowInfo,

frontend/appflowy_tauri/src/appflowy_app/components/tests/TestAPI.tsx

@@ -9,6 +9,8 @@ import {
   TestDeleteRow,
   TestEditCell,
   TestEditField,
+  TestEditTextCell,
+  TestEditURLCell,
   TestGetSingleSelectFieldData,
   TestSwitchFromMultiSelectToText,
   TestSwitchFromSingleSelectToNumber,
@@ -33,6 +35,8 @@ export const TestAPI = () => {
         <TestCreateRow></TestCreateRow>
         <TestDeleteRow></TestDeleteRow>
         <TestEditCell></TestEditCell>
+        <TestEditTextCell></TestEditTextCell>
+        <TestEditURLCell></TestEditURLCell>
         <TestCreateSelectOptionInCell></TestCreateSelectOptionInCell>
         <TestGetSingleSelectFieldData></TestGetSingleSelectFieldData>
         <TestEditField></TestEditField>

frontend/appflowy_tauri/src/appflowy_app/components/tests/TestGrid.tsx

@@ -5,8 +5,8 @@ import {
   NumberTypeOptionPB,
   SelectOptionCellDataPB,
   ViewLayoutTypePB,
-} from '../../../services/backend';
+} from '@/services/backend';
-import { Log } from '../../utils/log';
+import { Log } from '$app/utils/log';
 import {
   assertFieldName,
   assertNumberOfFields,
@@ -19,18 +19,19 @@ import {
   makeMultiSelectCellController,
   makeSingleSelectCellController,
   makeTextCellController,
+  makeURLCellController,
   openTestDatabase,
 } from './DatabaseTestHelper';
-import { SelectOptionCellBackendService } from '../../stores/effects/database/cell/select_option_bd_svc';
+import { SelectOptionCellBackendService } from '$app/stores/effects/database/cell/select_option_bd_svc';
-import { TypeOptionController } from '../../stores/effects/database/field/type_option/type_option_controller';
+import { TypeOptionController } from '$app/stores/effects/database/field/type_option/type_option_controller';
 import { None, Some } from 'ts-results';
-import { RowBackendService } from '../../stores/effects/database/row/row_bd_svc';
+import { RowBackendService } from '$app/stores/effects/database/row/row_bd_svc';
-import { makeNumberTypeOptionContext } from '../../stores/effects/database/field/type_option/type_option_context';
+import { makeNumberTypeOptionContext } from '$app/stores/effects/database/field/type_option/type_option_context';
 
 export const RunAllGridTests = () => {
   async function run() {
     await createBuildInGrid();
-    await testEditGridRow();
+    await testEditGridCell();
     await testCreateRow();
     await testDeleteRow();
     await testCreateOptionInCell();
@@ -75,7 +76,7 @@ async function createBuildInGrid() {
   await databaseController.dispose();
 }
 
-async function testEditGridRow() {
+async function testEditGridCell() {
   const view = await createTestDatabaseView(ViewLayoutTypePB.Grid);
   const databaseController = await openTestDatabase(view.id);
   await databaseController.open().then((result) => result.unwrap());
@@ -88,6 +89,55 @@ async function testEditGridRow() {
   }
 }
 
+async function testEditTextCell() {
+  const view = await createTestDatabaseView(ViewLayoutTypePB.Grid);
+  const databaseController = await openTestDatabase(view.id);
+  await databaseController.open().then((result) => result.unwrap());
+
+  const row = databaseController.databaseViewCache.rowInfos[0];
+  const textField = findFirstFieldInfoWithFieldType(row, FieldType.RichText).unwrap();
+  const textCellController = await makeTextCellController(textField.field.id, row, databaseController).then((result) =>
+    result.unwrap()
+  );
+
+  textCellController.subscribeChanged({
+    onCellChanged: (content) => {
+      Log.info('Receive text:', content);
+    },
+  });
+
+  await textCellController.saveCellData('hello react');
+  await new Promise((resolve) => setTimeout(resolve, 200));
+  await databaseController.dispose();
+}
+
+async function testEditURLCell() {
+  const view = await createTestDatabaseView(ViewLayoutTypePB.Grid);
+  const databaseController = await openTestDatabase(view.id);
+  await databaseController.open().then((result) => result.unwrap());
+
+  const typeOptionController = new TypeOptionController(view.id, None, FieldType.URL);
+  await typeOptionController.initialize();
+
+  const row = databaseController.databaseViewCache.rowInfos[0];
+  const urlCellController = await makeURLCellController(typeOptionController.fieldId, row, databaseController).then(
+    (result) => result.unwrap()
+  );
+
+  urlCellController.subscribeChanged({
+    onCellChanged: (content) => {
+      const pb = content.unwrap();
+      Log.info('Receive url data:', pb.url, pb.content);
+    },
+  });
+
+  await urlCellController.saveCellData('hello react');
+  await new Promise((resolve) => setTimeout(resolve, 200));
+
+  await urlCellController.saveCellData('appflowy.io');
+  await new Promise((resolve) => setTimeout(resolve, 200));
+}
+
 async function testCreateRow() {
   const view = await createTestDatabaseView(ViewLayoutTypePB.Grid);
   const databaseController = await openTestDatabase(view.id);
@@ -129,6 +179,7 @@ async function testCreateOptionInCell() {
       const cellController = await makeSingleSelectCellController(fieldInfo.field.id, row, databaseController).then(
         (result) => result.unwrap()
       );
+      // eslint-disable-next-line @typescript-eslint/await-thenable
       await cellController.subscribeChanged({
         onCellChanged: (value) => {
           if (value.some) {
@@ -299,9 +350,16 @@ export const TestCreateGrid = () => {
 };
 
 export const TestEditCell = () => {
-  return TestButton('Test editing cell', testEditGridRow);
+  return TestButton('Test editing cell', testEditGridCell);
 };
 
+export const TestEditTextCell = () => {
+  return TestButton('Test editing text cell', testEditTextCell);
+};
+
+export const TestEditURLCell = () => {
+  return TestButton('Test editing URL cell', testEditURLCell);
+};
 export const TestCreateRow = () => {
   return TestButton('Test create row', testCreateRow);
 };