diff --git a/.github/workflows/flutter_ci.yaml b/.github/workflows/flutter_ci.yaml
index 72e169ca708a..4d931a1fbec9 100644
--- a/.github/workflows/flutter_ci.yaml
+++ b/.github/workflows/flutter_ci.yaml
@@ -22,15 +22,17 @@ on:
       - "!frontend/appflowy_tauri/**"
 
 env:
+  CARGO_TERM_COLOR: always
   FLUTTER_VERSION: "3.10.1"
   RUST_TOOLCHAIN: "1.70"
+  CARGO_MAKE_VERSION: "0.36.6"
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
   cancel-in-progress: true
 
 jobs:
-  build:
+  prepare:
     if: github.event.pull_request.draft != true
     strategy:
       fail-fast: false
@@ -83,21 +85,20 @@ jobs:
           prefix-key: ${{ matrix.os }}
           workspaces: |
             frontend/rust-lib
+          cache-all-crates: true
 
-      - uses: davidB/rust-cargo-make@v1
+      - uses: taiki-e/install-action@v2
         with:
-          version: '0.36.6'
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}, duckscript_cli
 
       - name: Install prerequisites
         working-directory: frontend
         run: |
-          cargo install --force duckscript_cli
           if [ "$RUNNER_OS" == "Linux" ]; then
             sudo wget -qO /etc/apt/trusted.gpg.d/dart_linux_signing_key.asc https://dl-ssl.google.com/linux/linux_signing_key.pub
             sudo wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list
             sudo apt-get update
-            sudo apt-get install -y dart curl build-essential libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev
-            sudo apt-get install keybinder-3.0 libnotify-dev
+            sudo apt-get install -y dart curl build-essential libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev keybinder-3.0 libnotify-dev
           elif [ "$RUNNER_OS" == "Windows" ]; then
             vcpkg integrate install
           elif [ "$RUNNER_OS" == "macOS" ]; then
@@ -106,6 +107,171 @@ jobs:
           cargo make appflowy-flutter-deps-tools
         shell: bash
 
+      - name: Build AppFlowy
+        working-directory: frontend
+        run: |
+          cargo make --profile ${{ matrix.flutter_profile }} appflowy-core-dev
+
+      - name: Run code generation
+        working-directory: frontend
+        run: |
+          cargo make code_generation
+
+      - name: Flutter Analyzer
+        working-directory: frontend/appflowy_flutter
+        run: |
+          flutter analyze .
+
+      - name: Compress appflowy_flutter
+        run: tar -czf appflowy_flutter.tar.gz frontend/appflowy_flutter
+
+      - uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.run_id }}-${{ matrix.os }}
+          path: appflowy_flutter.tar.gz
+
+  unit_test:
+    needs: [prepare]
+    if: github.event.pull_request.draft != true
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+          - os: macos-latest
+            flutter_profile: development-mac-x86_64
+            target: x86_64-apple-darwin
+          - os: windows-latest
+            flutter_profile: development-windows-x86
+            target: x86_64-pc-windows-msvc
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: Checkout source code
+        uses: actions/checkout@v2
+
+      - name: Install Rust toolchain
+        id: rust_toolchain
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: ${{ env.RUST_TOOLCHAIN }}
+          target: ${{ matrix.target }}
+          override: true
+          profile: minimal
+
+      - name: Install flutter
+        id: flutter
+        uses: subosito/flutter-action@v2
+        with:
+          channel: "stable"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+          cache: true
+
+      - uses: Swatinem/rust-cache@v2
+        with:
+          prefix-key: ${{ matrix.os }}
+          workspaces: |
+            frontend/rust-lib
+          cache-all-crates: true
+
+      - uses: taiki-e/install-action@v2
+        with:
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}, duckscript_cli
+
+      - name: Install prerequisites
+        working-directory: frontend
+        run: |
+          if [ "$RUNNER_OS" == "macOS" ]; then
+            cargo make appflowy-flutter-deps-tools
+          fi
+        shell: bash
+
+      - uses: actions/download-artifact@v3
+        with:
+          name: ${{ github.run_id }}-${{ matrix.os }}
+
+      - name: Uncompress appflowy_flutter
+        run: tar -xf appflowy_flutter.tar.gz
+
+      - name: Run Flutter unit tests
+        working-directory: frontend
+        run: |
+          if [ "$RUNNER_OS" == "macOS" ]; then
+            cargo make dart_unit_test
+          else
+            cargo make dart_unit_test_no_build
+          fi
+        shell: bash
+
+      - name: Upload coverage to Codecov
+        uses: Wandalen/wretry.action@v1.0.36
+        with:
+          action: codecov/codecov-action@v3
+          with: |
+            name: appflowy
+            flags: appflowy_flutter_unit_test
+            fail_ci_if_error: true
+            verbose: true
+            os: ${{ matrix.os }}
+            token: ${{ secrets.CODECOV_TOKEN }}
+          attempt_limit: 20
+          attempt_delay: 10000
+
+  integration_test:
+    needs: [prepare]
+    if: github.event.pull_request.draft != true
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest,windows-latest]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+          - os: windows-latest
+            flutter_profile: development-windows-x86
+            target: x86_64-pc-windows-msvc
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: Checkout source code
+        uses: actions/checkout@v2
+
+      - name: Install Rust toolchain
+        id: rust_toolchain
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: ${{ env.RUST_TOOLCHAIN }}
+          target: ${{ matrix.target }}
+          override: true
+          profile: minimal
+
+      - name: Install flutter
+        id: flutter
+        uses: subosito/flutter-action@v2
+        with:
+          channel: "stable"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+          cache: true
+
+      - uses: taiki-e/install-action@v2
+        with:
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}
+
+      - name: Install prerequisites
+        working-directory: frontend
+        run: |
+          if [ "$RUNNER_OS" == "Linux" ]; then
+            sudo wget -qO /etc/apt/trusted.gpg.d/dart_linux_signing_key.asc https://dl-ssl.google.com/linux/linux_signing_key.pub
+            sudo wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list
+            sudo apt-get update
+            sudo apt-get install -y dart curl build-essential libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev keybinder-3.0 libnotify-dev
+          fi
+        shell: bash
+
       - name: Enable Flutter Desktop
         run: |
           if [ "$RUNNER_OS" == "Linux" ]; then
@@ -118,20 +284,33 @@ jobs:
           fi
         shell: bash
 
-      - name: Build AppFlowy
+      - uses: actions/download-artifact@v3
+        with:
+          name: ${{ github.run_id }}-${{ matrix.os }}
+
+      - name: Uncompress appflowy_flutter
+        run: tar -xf appflowy_flutter.tar.gz
+
+      - name: Run code generation
+        if: matrix.os == 'windows-latest'
         working-directory: frontend
         run: |
-          cargo make --profile ${{ matrix.flutter_profile }} appflowy-dev
+          cargo make code_generation
 
-      - name: Flutter Analyzer
+      - name: Run Flutter integration tests
         working-directory: frontend/appflowy_flutter
         run: |
-          flutter analyze .
-
-      - name: Run Flutter unit tests
-        working-directory: frontend
-        run: |
-          cargo make dart_unit_test
+          if [ "$RUNNER_OS" == "Linux" ]; then
+            export DISPLAY=:99
+            sudo Xvfb -ac :99 -screen 0 1280x1024x24 > /dev/null 2>&1 &
+            sudo apt-get install network-manager
+            flutter test integration_test/runner.dart -d Linux --coverage
+          elif [ "$RUNNER_OS" == "macOS" ]; then
+            flutter test integration_test/runner.dart -d macOS --coverage
+          elif [ "$RUNNER_OS" == "Windows" ]; then
+            flutter test integration_test/runner.dart -d Windows --coverage
+          fi
+        shell: bash
 
       - name: Upload coverage to Codecov
         uses: Wandalen/wretry.action@v1.0.36
@@ -139,7 +318,7 @@ jobs:
           action: codecov/codecov-action@v3
           with: |
             name: appflowy
-            flags: appflowy_flutter_unit_test
+            flags: appflowy_flutter_integrateion_test
             fail_ci_if_error: true
             verbose: true
             os: ${{ matrix.os }}
@@ -147,3 +326,87 @@ jobs:
           attempt_limit: 20
           attempt_delay: 10000
 
+  build:
+    needs: [prepare]
+    if: github.event.pull_request.draft != true
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+          - os: macos-latest
+            flutter_profile: development-mac-x86_64
+            target: x86_64-apple-darwin
+          - os: windows-latest
+            flutter_profile: development-windows-x86
+            target: x86_64-pc-windows-msvc
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: Checkout source code
+        uses: actions/checkout@v2
+
+      - name: Install Rust toolchain
+        id: rust_toolchain
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: ${{ env.RUST_TOOLCHAIN }}
+          target: ${{ matrix.target }}
+          override: true
+          profile: minimal
+
+      - name: Install flutter
+        id: flutter
+        uses: subosito/flutter-action@v2
+        with:
+          channel: "stable"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+          cache: true
+
+      - uses: taiki-e/install-action@v2
+        with:
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}
+
+      - name: Install prerequisites
+        working-directory: frontend
+        run: |
+          if [ "$RUNNER_OS" == "Linux" ]; then
+            sudo wget -qO /etc/apt/trusted.gpg.d/dart_linux_signing_key.asc https://dl-ssl.google.com/linux/linux_signing_key.pub
+            sudo wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list
+            sudo apt-get update
+            sudo apt-get install -y dart curl build-essential libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev keybinder-3.0 libnotify-dev
+          fi
+        shell: bash
+
+      - name: Enable Flutter Desktop
+        run: |
+          if [ "$RUNNER_OS" == "Linux" ]; then
+            flutter config --enable-linux-desktop
+          elif [ "$RUNNER_OS" == "macOS" ]; then
+            flutter config --enable-macos-desktop
+          elif [ "$RUNNER_OS" == "Windows" ]; then
+            git config --system core.longpaths true
+            flutter config --enable-windows-desktop
+          fi
+        shell: bash
+
+      - uses: actions/download-artifact@v3
+        with:
+          name: ${{ github.run_id }}-${{ matrix.os }}
+
+      - name: Uncompress appflowy_flutter
+        run: tar -xf appflowy_flutter.tar.gz
+
+      - name: Run code generation
+        if: matrix.os == 'windows-latest'
+        working-directory: frontend
+        run: |
+          cargo make code_generation
+
+      - name: Build flutter product
+        working-directory: frontend
+        run: |
+          cargo make --profile ${{ matrix.flutter_profile }} appflowy-make-product-dev
diff --git a/.github/workflows/integration_test.yml b/.github/workflows/integration_test.yml
deleted file mode 100644
index 76460117222b..000000000000
--- a/.github/workflows/integration_test.yml
+++ /dev/null
@@ -1,150 +0,0 @@
-name: integration test
-
-on:
-  push:
-    branches:
-      - "main"
-      - "release/*"
-    paths:
-      - ".github/workflows/integration_test.yml"
-      - "frontend/**"
-      - "!frontend/appflowy_tauri/**"
-
-  pull_request:
-    branches:
-      - "main"
-      - "release/*"
-    paths:
-      - ".github/workflows/integration_test.yml"
-      - "frontend/**"
-      - "!frontend/appflowy_tauri/**"
-
-env:
-  CARGO_TERM_COLOR: always
-  FLUTTER_VERSION: "3.10.1"
-  RUST_TOOLCHAIN: "1.70"
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  build:
-    if: github.event.pull_request.draft != true
-    strategy:
-      fail-fast: false
-      matrix:
-        os: [ubuntu-latest, windows-latest]
-        include:
-          - os: ubuntu-latest
-            flutter_profile: development-linux-x86_64
-            target: x86_64-unknown-linux-gnu
-          - os: windows-latest
-            flutter_profile: development-windows-x86
-            target: x86_64-pc-windows-msvc
-    runs-on: ${{ matrix.os }}
-
-    steps:
-      # the following step is required to avoid running out of space
-      - name: Maximize build space
-        if: matrix.os == 'ubuntu-latest'
-        run: |
-          sudo rm -rf /usr/share/dotnet
-          sudo rm -rf /opt/ghc
-          sudo rm -rf /usr/local/share/boost
-          df -h
-
-      - name: Checkout source code
-        uses: actions/checkout@v2
-
-      - name: Install Rust toolchain
-        id: rust_toolchain
-        uses: actions-rs/toolchain@v1
-        with:
-          toolchain: ${{ env.RUST_TOOLCHAIN }}
-          target: ${{ matrix.target }}
-          override: true
-          profile: minimal
-
-      - name: Install flutter
-        id: flutter
-        uses: subosito/flutter-action@v2
-        with:
-          channel: "stable"
-          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true
-
-      - uses: Swatinem/rust-cache@v2
-        with:
-          prefix-key: ${{ matrix.os }}
-          workspaces: |
-            frontend/rust-lib
-          cache-all-crates: true
-
-      - uses: davidB/rust-cargo-make@v1
-        with:
-          version: '0.36.6'
-
-      - name: Install prerequisites
-        working-directory: frontend
-        run: |
-          cargo install --force duckscript_cli
-          if [ "$RUNNER_OS" == "Linux" ]; then
-            sudo wget -qO /etc/apt/trusted.gpg.d/dart_linux_signing_key.asc https://dl-ssl.google.com/linux/linux_signing_key.pub
-            sudo wget -qO /etc/apt/sources.list.d/dart_stable.list https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list
-            sudo apt-get update
-            sudo apt-get install -y dart curl build-essential libssl-dev clang cmake ninja-build pkg-config libgtk-3-dev
-            sudo apt-get install keybinder-3.0 libnotify-dev
-          elif [ "$RUNNER_OS" == "Windows" ]; then
-            vcpkg integrate install
-          elif [ "$RUNNER_OS" == "macOS" ]; then
-            echo 'do nothing'
-          fi
-          cargo make appflowy-flutter-deps-tools
-        shell: bash
-
-      - name: Enable Flutter Desktop
-        run: |
-          if [ "$RUNNER_OS" == "Linux" ]; then
-            flutter config --enable-linux-desktop
-          elif [ "$RUNNER_OS" == "macOS" ]; then
-            flutter config --enable-macos-desktop
-          elif [ "$RUNNER_OS" == "Windows" ]; then
-            git config --system core.longpaths true
-            flutter config --enable-windows-desktop
-          fi
-        shell: bash
-
-      - name: Build AppFlowy
-        working-directory: frontend
-        run: |
-          cargo make --profile ${{ matrix.flutter_profile }} appflowy-dev
-
-      - name: Run Flutter integration tests
-        working-directory: frontend/appflowy_flutter
-        run: |
-          if [ "$RUNNER_OS" == "Linux" ]; then
-            export DISPLAY=:99
-            sudo Xvfb -ac :99 -screen 0 1280x1024x24 > /dev/null 2>&1 &
-            sudo apt-get install network-manager
-            flutter test integration_test/runner.dart -d Linux --coverage
-          elif [ "$RUNNER_OS" == "macOS" ]; then
-            flutter test integration_test/runner.dart -d macOS --coverage
-          elif [ "$RUNNER_OS" == "Windows" ]; then
-            flutter test integration_test/runner.dart -d Windows --coverage
-          fi
-        shell: bash
-
-      - name: Upload coverage to Codecov
-        uses: Wandalen/wretry.action@v1.0.36
-        with:
-          action: codecov/codecov-action@v3
-          with: |
-            name: appflowy
-            flags: appflowy_flutter_integrateion_test
-            fail_ci_if_error: true
-            verbose: true
-            os: ${{ matrix.os }}
-            token: ${{ secrets.CODECOV_TOKEN }}
-          attempt_limit: 20
-          attempt_delay: 10000
\ No newline at end of file
diff --git a/.run/ProtoBuf_Gen.run.xml b/.run/ProtoBuf_Gen.run.xml
deleted file mode 100644
index 13d9202183f9..000000000000
--- a/.run/ProtoBuf_Gen.run.xml
+++ /dev/null
@@ -1,23 +0,0 @@
-<component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="ProtoBuf_Gen" type="CargoCommandRunConfiguration" factoryName="Cargo Command">
-    <option name="command" value="run --manifest-path ${flowy_tool} -- pb-gen --rust_sources=${rust_lib},${shared_lib}  --derive_meta=${derive_meta}  --flutter_package_lib=${flutter_package_lib}" />
-    <option name="workingDirectory" value="file://$PROJECT_DIR$/frontend" />
-    <option name="channel" value="DEFAULT" />
-    <option name="allFeatures" value="false" />
-    <option name="emulateTerminal" value="false" />
-    <option name="backtrace" value="SHORT" />
-    <envs>
-      <env name="flowy_tool" value="${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/scripts/flowy-tool/Cargo.toml" />
-      <env name="rust_lib" value="${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/rust-lib/" />
-      <env name="shared_lib" value="${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/../shared_lib" />
-      <env name="flutter_lib" value="${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/appflowy_flutter/packages" />
-      <env name="derive_meta" value="${shared_lib}/flowy-derive/src/derive_cache/derive_cache.rs" />
-      <env name="flutter_package_lib" value="${flutter_lib}/flowy_sdk/lib" />
-    </envs>
-    <option name="isRedirectInput" value="false" />
-    <option name="redirectInputPath" value="" />
-    <method v="2">
-      <option name="CARGO.BUILD_TASK_PROVIDER" enabled="true" />
-    </method>
-  </configuration>
-</component>
\ No newline at end of file
diff --git a/.run/Run backend.run.xml b/.run/Run backend.run.xml
deleted file mode 100644
index 840a367809c6..000000000000
--- a/.run/Run backend.run.xml	
+++ /dev/null
@@ -1,18 +0,0 @@
-<component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="Run backend" type="CargoCommandRunConfiguration" factoryName="Cargo Command">
-    <option name="command" value="run --package backend --bin backend" />
-    <option name="workingDirectory" value="file://$PROJECT_DIR$/backend" />
-    <option name="channel" value="DEFAULT" />
-    <option name="allFeatures" value="false" />
-    <option name="emulateTerminal" value="false" />
-    <option name="backtrace" value="SHORT" />
-    <envs>
-      <env name="APP_ENVIRONMENT" value="production" />
-    </envs>
-    <option name="isRedirectInput" value="false" />
-    <option name="redirectInputPath" value="" />
-    <method v="2">
-      <option name="CARGO.BUILD_TASK_PROVIDER" enabled="true" />
-    </method>
-  </configuration>
-</component>
\ No newline at end of file
diff --git a/.run/dart-event.run.xml b/.run/dart-event.run.xml
deleted file mode 100644
index c64ee9bf57cf..000000000000
--- a/.run/dart-event.run.xml
+++ /dev/null
@@ -1,16 +0,0 @@
-<component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="dart-event" type="CargoCommandRunConfiguration" factoryName="Cargo Command">
-    <option name="command" value="run --manifest-path $PROJECT_DIR$/scripts/flowy-tool/Cargo.toml -- dart-event --rust_source=$PROJECT_DIR$/rust-lib/  --output=$PROJECT_DIR$/appflowy_flutter/packages/flowy_sdk/lib/dispatch/dart_event.dart" />
-    <option name="workingDirectory" value="file://$PROJECT_DIR$" />
-    <option name="channel" value="DEFAULT" />
-    <option name="allFeatures" value="false" />
-    <option name="emulateTerminal" value="false" />
-    <option name="backtrace" value="SHORT" />
-    <envs />
-    <option name="isRedirectInput" value="false" />
-    <option name="redirectInputPath" value="" />
-    <method v="2">
-      <option name="CARGO.BUILD_TASK_PROVIDER" enabled="true" />
-    </method>
-  </configuration>
-</component>
\ No newline at end of file
diff --git a/frontend/.vscode/launch.json b/frontend/.vscode/launch.json
index 9d7a00c4497f..34866a9537ce 100644
--- a/frontend/.vscode/launch.json
+++ b/frontend/.vscode/launch.json
@@ -67,11 +67,11 @@
             "cwd": "${workspaceRoot}/appflowy_flutter"
         },
         {
-            "name": "AF-Android-Simlator: Clean + Rebuild All",
+            "name": "AF-Android: Clean + Rebuild All",
             "request": "launch",
             "program": "./lib/main.dart",
             "type": "dart",
-            "preLaunchTask": "AF: Clean + Rebuild All (Android Simulator)",
+            "preLaunchTask": "AF: Clean + Rebuild All (Android)",
             "env": {
                 "RUST_LOG": "trace"
             },
diff --git a/frontend/Makefile.toml b/frontend/Makefile.toml
index bcd71b472d48..ebfa6f121cbb 100644
--- a/frontend/Makefile.toml
+++ b/frontend/Makefile.toml
@@ -186,6 +186,14 @@ RUST_COMPILE_TARGET = "aarch64-apple-ios"
 BUILD_ARCHS = "arm64"
 CRATE_TYPE = "staticlib"
 
+[env.production-ios-arm64]
+BUILD_FLAG = "release"
+TARGET_OS = "ios"
+FLUTTER_OUTPUT_DIR = "Release"
+RUST_COMPILE_TARGET = "aarch64-apple-ios"
+BUILD_ARCHS = "arm64"
+CRATE_TYPE = "staticlib"
+
 [env.development-android]
 BUILD_FLAG = "debug"
 TARGET_OS = "android"
diff --git a/frontend/appflowy_flutter/android/app/src/main/AndroidManifest.xml b/frontend/appflowy_flutter/android/app/src/main/AndroidManifest.xml
index 03eb9bc4dacf..43f4005b72ec 100644
--- a/frontend/appflowy_flutter/android/app/src/main/AndroidManifest.xml
+++ b/frontend/appflowy_flutter/android/app/src/main/AndroidManifest.xml
@@ -1,5 +1,5 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android">
-  <application android:label="appflowy_flutter" android:icon="@mipmap/ic_launcher"
+  <application android:label="AppFlowy" android:icon="@mipmap/ic_launcher"
     android:name="${applicationName}">
     <activity android:name=".MainActivity"
       android:exported="true"
@@ -28,6 +28,16 @@
         <action android:name="android.intent.action.MAIN" />
         <category android:name="android.intent.category.LAUNCHER" />
       </intent-filter>
+      <meta-data android:name="flutter_deeplinking_enabled" android:value="true" />
+      <intent-filter android:autoVerify="true">
+        <action android:name="android.intent.action.VIEW" />
+        <category android:name="android.intent.category.DEFAULT" />
+        <category android:name="android.intent.category.BROWSABLE" />
+        <data android:scheme="http" />
+        <data android:scheme="https" />
+        <data android:scheme="appflowy-flutter" />
+        <!-- <data android:host="login-callback" /> -->
+      </intent-filter>
     </activity>
     <!--
 		Don't delete the meta-data below.
diff --git a/frontend/appflowy_flutter/android/app/src/main/CMakeLists.txt b/frontend/appflowy_flutter/android/app/src/main/CMakeLists.txt
index 4e6d2e3c08c6..3df7d13ed022 100644
--- a/frontend/appflowy_flutter/android/app/src/main/CMakeLists.txt
+++ b/frontend/appflowy_flutter/android/app/src/main/CMakeLists.txt
@@ -1,6 +1,6 @@
 cmake_minimum_required(VERSION 3.10.0)
 
-project(appflowy_flutter)
+project(AppFlowy)
 
 # arm64-v8a
 file(COPY
diff --git a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-hdpi/ic_launcher.png b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
index db77bb4b7b09..545f2d1d335c 100644
Binary files a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-hdpi/ic_launcher.png and b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-hdpi/ic_launcher.png differ
diff --git a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-mdpi/ic_launcher.png b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
index 17987b79bb8a..0cd1474456d2 100644
Binary files a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-mdpi/ic_launcher.png and b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-mdpi/ic_launcher.png differ
diff --git a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
index 09d4391482be..48d76394b25d 100644
Binary files a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png and b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png differ
diff --git a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
index d5f1c8d34e7a..1ae7096376ef 100644
Binary files a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png and b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png differ
diff --git a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
index 4d6372eebdb2..c0f7d5cf561f 100644
Binary files a/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png and b/frontend/appflowy_flutter/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png differ
diff --git a/frontend/appflowy_flutter/cargokit_options.yaml b/frontend/appflowy_flutter/cargokit_options.yaml
new file mode 100644
index 000000000000..70d10df337dd
--- /dev/null
+++ b/frontend/appflowy_flutter/cargokit_options.yaml
@@ -0,0 +1 @@
+use_precompiled_binaries: true
diff --git a/frontend/appflowy_flutter/integration_test/database_calendar_test.dart b/frontend/appflowy_flutter/integration_test/database_calendar_test.dart
index ad2fdcb33482..ce7d6163aeab 100644
--- a/frontend/appflowy_flutter/integration_test/database_calendar_test.dart
+++ b/frontend/appflowy_flutter/integration_test/database_calendar_test.dart
@@ -174,25 +174,23 @@ void main() {
       await tester.openCalendarEvent(index: 0, date: sameDayNextWeek);
       await tester.deleteEventFromEventEditor();
 
-      // Create a new event in today's calendar cell
-      await tester.scrollToToday();
-      await tester.doubleClickCalendarCell(today);
+      // Create another event on the 5th of this month
+      final fifthOfThisMonth = DateTime(today.year, today.month, 5);
+      await tester.doubleClickCalendarCell(fifthOfThisMonth);
       await tester.dismissEventEditor();
 
-      // Make sure that the event is today
-      tester.assertNumberOfEventsOnSpecificDay(1, today);
+      // Make sure that the event is on the 4t
+      tester.assertNumberOfEventsOnSpecificDay(1, fifthOfThisMonth);
 
       // Click on the event
-      await tester.openCalendarEvent(index: 0);
+      await tester.openCalendarEvent(index: 0, date: fifthOfThisMonth);
 
       // Open the date editor of the event
       await tester.tapDateCellInRowDetailPage();
       await tester.findDateEditor(findsOneWidget);
 
-      // Edit the event's date. To avoid selecting a day outside of the current month, the new date will be one day closer to the middle of the month.
-      final newDate = today.day < 15
-          ? today.add(const Duration(days: 1))
-          : today.subtract(const Duration(days: 1));
+      // Edit the event's date
+      final newDate = fifthOfThisMonth.add(const Duration(days: 1));
       await tester.selectDay(content: newDate.day);
       await tester.dismissCellEditor();
 
diff --git a/frontend/appflowy_flutter/integration_test/util/database_test_op.dart b/frontend/appflowy_flutter/integration_test/util/database_test_op.dart
index 4458b3adad4f..c1c9734c708c 100644
--- a/frontend/appflowy_flutter/integration_test/util/database_test_op.dart
+++ b/frontend/appflowy_flutter/integration_test/util/database_test_op.dart
@@ -38,7 +38,7 @@ import 'package:appflowy/plugins/database_view/grid/presentation/widgets/toolbar
 import 'package:appflowy/plugins/database_view/tar_bar/tab_bar_header.dart';
 import 'package:appflowy/plugins/database_view/tar_bar/tar_bar_add_button.dart';
 import 'package:appflowy/plugins/database_view/widgets/database_layout_ext.dart';
-import 'package:appflowy/plugins/database_view/widgets/field/grid_property.dart';
+import 'package:appflowy/plugins/database_view/widgets/setting/setting_property_list.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/accessory/cell_accessory.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/cells/cells.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor.dart';
@@ -52,7 +52,6 @@ import 'package:appflowy/plugins/database_view/widgets/row/row_banner.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/row_detail.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/row_document.dart';
 import 'package:appflowy/plugins/database_view/widgets/row/row_property.dart';
-import 'package:appflowy/plugins/database_view/widgets/setting/database_setting.dart';
 import 'package:appflowy/plugins/database_view/widgets/setting/setting_button.dart';
 import 'package:appflowy/workspace/presentation/settings/widgets/emoji_picker/emoji_menu_item.dart';
 import 'package:appflowy/workspace/presentation/widgets/dialogs.dart';
@@ -530,7 +529,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
 
     final widget = this.widget<ChecklistItem>(task);
     assert(
-      widget.option.data.name == name && widget.option.isSelected == isChecked,
+      widget.task.data.name == name && widget.task.isSelected == isChecked,
     );
   }
 
@@ -1132,7 +1131,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
 
   /// Should call [tapDatabaseSettingButton] first.
   Future<void> tapViewPropertiesButton() async {
-    final findSettingItem = find.byType(DatabaseSettingItem);
+    final findSettingItem = find.byType(DatabaseSettingListPopover);
     final findLayoutButton = find.byWidgetPredicate(
       (widget) =>
           widget is FlowyText &&
@@ -1149,7 +1148,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
 
   /// Should call [tapDatabaseSettingButton] first.
   Future<void> tapDatabaseLayoutButton() async {
-    final findSettingItem = find.byType(DatabaseSettingItem);
+    final findSettingItem = find.byType(DatabaseSettingListPopover);
     final findLayoutButton = find.byWidgetPredicate(
       (widget) =>
           widget is FlowyText &&
@@ -1165,7 +1164,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
   }
 
   Future<void> tapCalendarLayoutSettingButton() async {
-    final findSettingItem = find.byType(DatabaseSettingItem);
+    final findSettingItem = find.byType(DatabaseSettingListPopover);
     final findLayoutButton = find.byWidgetPredicate(
       (widget) =>
           widget is FlowyText &&
@@ -1302,7 +1301,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
     await doubleTapAt(location);
   }
 
-  Future<void> openCalendarEvent({required index, DateTime? date}) async {
+  Future<void> openCalendarEvent({required int index, DateTime? date}) async {
     final findDayCell = find.byWidgetPredicate(
       (widget) =>
           widget is CalendarDayCard &&
@@ -1505,7 +1504,7 @@ extension AppFlowyDatabaseTest on WidgetTester {
   ) async {
     final field = find.byWidgetPredicate(
       (widget) =>
-          widget is GridPropertyCell && widget.fieldInfo.name == fieldName,
+          widget is DatabasePropertyCell && widget.fieldInfo.name == fieldName,
     );
     final toggleVisibilityButton =
         find.descendant(of: field, matching: find.byType(FlowyIconButton));
diff --git a/frontend/appflowy_flutter/ios/Podfile.lock b/frontend/appflowy_flutter/ios/Podfile.lock
index 877bca694806..9500e5c4f747 100644
--- a/frontend/appflowy_flutter/ios/Podfile.lock
+++ b/frontend/appflowy_flutter/ios/Podfile.lock
@@ -164,7 +164,7 @@ SPEC CHECKSUMS:
   SDWebImage: b9a731e1d6307f44ca703b3976d18c24ca561e84
   shared_preferences_foundation: e2dae3258e06f44cc55f49d42024fd8dd03c590c
   sign_in_with_apple: f3bf75217ea4c2c8b91823f225d70230119b8440
-  super_native_extensions: 49e897b6039bb784226e7354e502a3c68e1659b5
+  super_native_extensions: 4916b3c627a9c7fffdc48a23a9eca0b1ac228fa7
   SwiftyGif: 6c3eafd0ce693cad58bb63d2b2fb9bacb8552780
   Toast: 91b396c56ee72a5790816f40d3a94dd357abc196
   url_launcher_ios: 08a3dfac5fb39e8759aeb0abbd5d9480f30fc8b4
diff --git a/frontend/appflowy_flutter/ios/Runner.xcodeproj/project.pbxproj b/frontend/appflowy_flutter/ios/Runner.xcodeproj/project.pbxproj
index b66e03648f89..a3d9b4d790e4 100644
--- a/frontend/appflowy_flutter/ios/Runner.xcodeproj/project.pbxproj
+++ b/frontend/appflowy_flutter/ios/Runner.xcodeproj/project.pbxproj
@@ -13,22 +13,9 @@
 		97C146FC1CF9000F007C117D /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FA1CF9000F007C117D /* Main.storyboard */; };
 		97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FD1CF9000F007C117D /* Assets.xcassets */; };
 		97C147011CF9000F007C117D /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FF1CF9000F007C117D /* LaunchScreen.storyboard */; };
-		9D1D47ADD7F5DE8237063BCA /* Pods_Runner.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 197F72694BED43249F1523E8 /* Pods_Runner.framework */; };
+		FB3C2A642AE0D57700490715 /* Pods_Runner.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 197F72694BED43249F1523E8 /* Pods_Runner.framework */; };
 /* End PBXBuildFile section */
 
-/* Begin PBXCopyFilesBuildPhase section */
-		9705A1C41CF9048500538489 /* Embed Frameworks */ = {
-			isa = PBXCopyFilesBuildPhase;
-			buildActionMask = 2147483647;
-			dstPath = "";
-			dstSubfolderSpec = 10;
-			files = (
-			);
-			name = "Embed Frameworks";
-			runOnlyForDeploymentPostprocessing = 0;
-		};
-/* End PBXCopyFilesBuildPhase section */
-
 /* Begin PBXFileReference section */
 		1498D2321E8E86230040F4C2 /* GeneratedPluginRegistrant.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = GeneratedPluginRegistrant.h; sourceTree = "<group>"; };
 		1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = GeneratedPluginRegistrant.m; sourceTree = "<group>"; };
@@ -54,7 +41,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				9D1D47ADD7F5DE8237063BCA /* Pods_Runner.framework in Frameworks */,
+				FB3C2A642AE0D57700490715 /* Pods_Runner.framework in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -121,7 +108,6 @@
 				580A1ED8E012CA1552E5EFD3 /* Pods-Runner.release.xcconfig */,
 				4C2CB38DA64605A62D45B098 /* Pods-Runner.profile.xcconfig */,
 			);
-			name = Pods;
 			path = Pods;
 			sourceTree = "<group>";
 		};
@@ -137,7 +123,6 @@
 				97C146EA1CF9000F007C117D /* Sources */,
 				97C146EB1CF9000F007C117D /* Frameworks */,
 				97C146EC1CF9000F007C117D /* Resources */,
-				9705A1C41CF9048500538489 /* Embed Frameworks */,
 				3B06AD1E1E4923F5004D2608 /* Thin Binary */,
 				08FAA63113168DEC7FB74204 /* [CP] Embed Pods Frameworks */,
 			);
@@ -359,11 +344,18 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				DEAD_CODE_STRIPPING = NO;
+				DEVELOPMENT_TEAM = "";
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
 				PRODUCT_BUNDLE_IDENTIFIER = io.appflowy.appflowy;
 				PRODUCT_NAME = "$(TARGET_NAME)";
+				STRIP_STYLE = "non-global";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
 				VERSIONING_SYSTEM = "apple-generic";
@@ -483,11 +475,18 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				DEAD_CODE_STRIPPING = NO;
+				DEVELOPMENT_TEAM = "";
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
 				PRODUCT_BUNDLE_IDENTIFIER = io.appflowy.appflowy;
 				PRODUCT_NAME = "$(TARGET_NAME)";
+				STRIP_STYLE = "non-global";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
 				SWIFT_VERSION = 5.0;
@@ -502,11 +501,18 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				DEAD_CODE_STRIPPING = NO;
+				DEVELOPMENT_TEAM = "";
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				IPHONEOS_DEPLOYMENT_TARGET = 12.0;
+				LD_RUNPATH_SEARCH_PATHS = (
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
 				PRODUCT_BUNDLE_IDENTIFIER = io.appflowy.appflowy;
 				PRODUCT_NAME = "$(TARGET_NAME)";
+				STRIP_STYLE = "non-global";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
 				VERSIONING_SYSTEM = "apple-generic";
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png
new file mode 100644
index 000000000000..7112d6e103ae
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png
new file mode 100644
index 000000000000..f34332a39582
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png
new file mode 100644
index 000000000000..f0a856f084fd
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png
new file mode 100644
index 000000000000..790a36365bd7
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png
new file mode 100644
index 000000000000..9a624fed6df7
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png
new file mode 100644
index 000000000000..9442038057ed
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png
new file mode 100644
index 000000000000..7d46538ace8c
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png
new file mode 100644
index 000000000000..6940391fec8e
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png
new file mode 100644
index 000000000000..2b0198fb3484
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png
new file mode 100644
index 000000000000..faf3c774ff84
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png
new file mode 100644
index 000000000000..eb697e0b1eb7
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png
new file mode 100644
index 000000000000..4fd559430eaa
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png
new file mode 100644
index 000000000000..ada952ed8c38
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png
new file mode 100644
index 000000000000..079067fc57eb
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png
new file mode 100644
index 000000000000..879ee8d379c4
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png
new file mode 100644
index 000000000000..cf34028ae4e5
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png
new file mode 100644
index 000000000000..85818631e1e3
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png
new file mode 100644
index 000000000000..401907b89386
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png
new file mode 100644
index 000000000000..b2534d06bfdd
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png
new file mode 100644
index 000000000000..039cbd2a87b1
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png
new file mode 100644
index 000000000000..883cc226b22b
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png
new file mode 100644
index 000000000000..e6a096782234
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png
new file mode 100644
index 000000000000..7d0678a68527
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png
new file mode 100644
index 000000000000..c295da4a52f7
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png
new file mode 100644
index 000000000000..374c290a58fa
Binary files /dev/null and b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
index d36b1fab2d9d..bbf91d18f87f 100644
--- a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
+++ b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
@@ -1,122 +1,218 @@
 {
   "images" : [
     {
-      "size" : "20x20",
+      "filename" : "40.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-20x20@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "20x20"
     },
     {
-      "size" : "20x20",
+      "filename" : "60.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-20x20@3x.png",
-      "scale" : "3x"
+      "scale" : "3x",
+      "size" : "20x20"
     },
     {
-      "size" : "29x29",
+      "filename" : "29.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-29x29@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "29x29"
     },
     {
-      "size" : "29x29",
+      "filename" : "58.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-29x29@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "29x29"
     },
     {
-      "size" : "29x29",
+      "filename" : "87.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-29x29@3x.png",
-      "scale" : "3x"
+      "scale" : "3x",
+      "size" : "29x29"
     },
     {
-      "size" : "40x40",
+      "filename" : "80.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-40x40@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "40x40"
     },
     {
-      "size" : "40x40",
+      "filename" : "120.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-40x40@3x.png",
-      "scale" : "3x"
+      "scale" : "3x",
+      "size" : "40x40"
     },
     {
-      "size" : "60x60",
+      "filename" : "57.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-60x60@2x.png",
-      "scale" : "2x"
+      "scale" : "1x",
+      "size" : "57x57"
     },
     {
-      "size" : "60x60",
+      "filename" : "114.png",
       "idiom" : "iphone",
-      "filename" : "Icon-App-60x60@3x.png",
-      "scale" : "3x"
+      "scale" : "2x",
+      "size" : "57x57"
     },
     {
-      "size" : "20x20",
+      "filename" : "120.png",
+      "idiom" : "iphone",
+      "scale" : "2x",
+      "size" : "60x60"
+    },
+    {
+      "filename" : "180.png",
+      "idiom" : "iphone",
+      "scale" : "3x",
+      "size" : "60x60"
+    },
+    {
+      "filename" : "20.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-20x20@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "20x20"
     },
     {
-      "size" : "20x20",
+      "filename" : "40.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-20x20@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "20x20"
     },
     {
-      "size" : "29x29",
+      "filename" : "29.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-29x29@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "29x29"
     },
     {
-      "size" : "29x29",
+      "filename" : "58.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-29x29@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "29x29"
     },
     {
-      "size" : "40x40",
+      "filename" : "40.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-40x40@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "40x40"
     },
     {
-      "size" : "40x40",
+      "filename" : "80.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-40x40@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "40x40"
     },
     {
-      "size" : "76x76",
+      "filename" : "50.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-76x76@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "50x50"
     },
     {
-      "size" : "76x76",
+      "filename" : "100.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-76x76@2x.png",
-      "scale" : "2x"
+      "scale" : "2x",
+      "size" : "50x50"
     },
     {
-      "size" : "83.5x83.5",
+      "filename" : "72.png",
       "idiom" : "ipad",
-      "filename" : "Icon-App-83.5x83.5@2x.png",
-      "scale" : "2x"
+      "scale" : "1x",
+      "size" : "72x72"
     },
     {
-      "size" : "1024x1024",
+      "filename" : "144.png",
+      "idiom" : "ipad",
+      "scale" : "2x",
+      "size" : "72x72"
+    },
+    {
+      "filename" : "76.png",
+      "idiom" : "ipad",
+      "scale" : "1x",
+      "size" : "76x76"
+    },
+    {
+      "filename" : "152.png",
+      "idiom" : "ipad",
+      "scale" : "2x",
+      "size" : "76x76"
+    },
+    {
+      "filename" : "167.png",
+      "idiom" : "ipad",
+      "scale" : "2x",
+      "size" : "83.5x83.5"
+    },
+    {
+      "filename" : "1024.png",
       "idiom" : "ios-marketing",
-      "filename" : "Icon-App-1024x1024@1x.png",
-      "scale" : "1x"
+      "scale" : "1x",
+      "size" : "1024x1024"
+    },
+    {
+      "filename" : "16.png",
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "16x16"
+    },
+    {
+      "filename" : "32.png",
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "16x16"
+    },
+    {
+      "filename" : "32.png",
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "32x32"
+    },
+    {
+      "filename" : "64.png",
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "32x32"
+    },
+    {
+      "filename" : "128.png",
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "128x128"
+    },
+    {
+      "filename" : "256.png",
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "128x128"
+    },
+    {
+      "filename" : "256.png",
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "256x256"
+    },
+    {
+      "filename" : "512.png",
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "256x256"
+    },
+    {
+      "filename" : "512.png",
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "512x512"
+    },
+    {
+      "filename" : "1024.png",
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "512x512"
     }
   ],
   "info" : {
-    "version" : 1,
-    "author" : "xcode"
+    "author" : "xcode",
+    "version" : 1
   }
 }
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-1024x1024@1x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-1024x1024@1x.png
deleted file mode 100644
index dc9ada4725e9..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-1024x1024@1x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@1x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@1x.png
deleted file mode 100644
index 28c6bf03016f..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@1x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@2x.png
deleted file mode 100644
index 2ccbfd967d96..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@3x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@3x.png
deleted file mode 100644
index f091b6b0bca8..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@3x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@1x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@1x.png
deleted file mode 100644
index 4cde12118dda..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@1x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@2x.png
deleted file mode 100644
index d0ef06e7edb8..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@3x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@3x.png
deleted file mode 100644
index dcdc2306c285..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@3x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@1x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@1x.png
deleted file mode 100644
index 2ccbfd967d96..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@1x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@2x.png
deleted file mode 100644
index c8f9ed8f5cee..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@3x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@3x.png
deleted file mode 100644
index a6d6b8609df0..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@3x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@2x.png
deleted file mode 100644
index a6d6b8609df0..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@3x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@3x.png
deleted file mode 100644
index 75b2d164a5a9..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@3x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@1x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@1x.png
deleted file mode 100644
index c4df70d39da7..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@1x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@2x.png
deleted file mode 100644
index 6a84f41e14e2..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-83.5x83.5@2x.png b/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-83.5x83.5@2x.png
deleted file mode 100644
index d0e1f5853602..000000000000
Binary files a/frontend/appflowy_flutter/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-83.5x83.5@2x.png and /dev/null differ
diff --git a/frontend/appflowy_flutter/ios/Runner/Info.plist b/frontend/appflowy_flutter/ios/Runner/Info.plist
index 034799be9e34..5c2fe0a3a745 100644
--- a/frontend/appflowy_flutter/ios/Runner/Info.plist
+++ b/frontend/appflowy_flutter/ios/Runner/Info.plist
@@ -11,7 +11,7 @@
 	<key>CFBundleInfoDictionaryVersion</key>
 	<string>6.0</string>
 	<key>CFBundleName</key>
-	<string>appflowy_flutter</string>
+	<string>AppFlowy</string>
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
diff --git a/frontend/appflowy_flutter/lib/mobile/application/mobile_router.dart b/frontend/appflowy_flutter/lib/mobile/application/mobile_router.dart
new file mode 100644
index 000000000000..c32463c7d8b6
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/application/mobile_router.dart
@@ -0,0 +1,64 @@
+import 'package:appflowy/mobile/presentation/database/mobile_board_screen.dart';
+import 'package:appflowy/mobile/presentation/database/mobile_calendar_screen.dart';
+import 'package:appflowy/mobile/presentation/database/mobile_grid_screen.dart';
+import 'package:appflowy/mobile/presentation/presentation.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+extension MobileRouter on BuildContext {
+  Future<void> pushView(ViewPB view) async {
+    push(
+      Uri(
+        path: view.routeName,
+        queryParameters: view.queryParameters,
+      ).toString(),
+    );
+  }
+}
+
+extension on ViewPB {
+  String get routeName {
+    switch (layout) {
+      case ViewLayoutPB.Document:
+        return MobileEditorScreen.routeName;
+      case ViewLayoutPB.Grid:
+        return MobileGridScreen.routeName;
+      case ViewLayoutPB.Calendar:
+        return MobileCalendarScreen.routeName;
+      case ViewLayoutPB.Board:
+        return MobileBoardScreen.routeName;
+      default:
+        throw UnimplementedError('routeName for $this is not implemented');
+    }
+  }
+
+  Map<String, dynamic> get queryParameters {
+    switch (layout) {
+      case ViewLayoutPB.Document:
+        return {
+          MobileEditorScreen.viewId: id,
+          MobileEditorScreen.viewTitle: name,
+        };
+      case ViewLayoutPB.Grid:
+        return {
+          MobileGridScreen.viewId: id,
+          MobileGridScreen.viewTitle: name,
+        };
+      case ViewLayoutPB.Calendar:
+        return {
+          MobileCalendarScreen.viewId: id,
+          MobileCalendarScreen.viewTitle: name,
+        };
+      case ViewLayoutPB.Board:
+        return {
+          MobileBoardScreen.viewId: id,
+          MobileBoardScreen.viewTitle: name,
+        };
+      default:
+        throw UnimplementedError(
+          'queryParameters for $this is not implemented',
+        );
+    }
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/application/mobile_theme_data.dart b/frontend/appflowy_flutter/lib/mobile/application/mobile_theme_data.dart
index 8117a144ff15..5f14f8605525 100644
--- a/frontend/appflowy_flutter/lib/mobile/application/mobile_theme_data.dart
+++ b/frontend/appflowy_flutter/lib/mobile/application/mobile_theme_data.dart
@@ -1,7 +1,9 @@
 // ThemeData in mobile
 import 'package:flutter/material.dart';
 
-ThemeData getMobileThemeData() {
+ThemeData getMobileThemeData(
+  Theme theme,
+) {
   const mobileColorTheme = ColorScheme(
     brightness: Brightness.light,
     primary: Color(0xFF2DA2F6), //primary 100
@@ -106,7 +108,7 @@ ThemeData getMobileThemeData() {
       ),
       // body2 14 Regular
       bodyMedium: TextStyle(
-        color: Color(0xFFC5C7CB),
+        color: Colors.black,
         fontSize: 14,
         fontWeight: FontWeight.w400,
         height: 1.20,
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/base/mobile_view_page.dart b/frontend/appflowy_flutter/lib/mobile/presentation/base/mobile_view_page.dart
new file mode 100644
index 000000000000..04f0953a6dfa
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/base/mobile_view_page.dart
@@ -0,0 +1,83 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/mobile/presentation/error/error_page.dart';
+import 'package:appflowy/workspace/application/view/view_ext.dart';
+import 'package:appflowy/workspace/application/view/view_service.dart';
+import 'package:appflowy_backend/protobuf/flowy-error/errors.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:dartz/dartz.dart' hide State;
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+class MobileViewPage extends StatefulWidget {
+  const MobileViewPage({
+    super.key,
+    required this.id,
+    this.title,
+    required this.viewLayout,
+  });
+
+  /// view id
+  final String id;
+  final String? title;
+  final ViewLayoutPB viewLayout;
+
+  @override
+  State<MobileViewPage> createState() => _MobileViewPageState();
+}
+
+class _MobileViewPageState extends State<MobileViewPage> {
+  late final Future<Either<ViewPB, FlowyError>> future;
+
+  @override
+  void initState() {
+    super.initState();
+
+    future = ViewBackendService.getView(widget.id);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return FutureBuilder(
+      future: future,
+      builder: (context, state) {
+        Widget body;
+        String? title;
+        if (state.connectionState != ConnectionState.done) {
+          body = const Center(
+            child: CircularProgressIndicator(),
+          );
+        } else if (!state.hasData) {
+          body = MobileErrorPage(
+            message: LocaleKeys.error_loadingViewError.tr(),
+          );
+        } else {
+          body = state.data!.fold((view) {
+            title = view.name;
+            return view.plugin().widgetBuilder.buildWidget(shrinkWrap: false);
+          }, (error) {
+            return MobileErrorPage(
+              message: error.toString(),
+            );
+          });
+        }
+        return Scaffold(
+          appBar: AppBar(
+            titleSpacing: 0,
+            title: FlowyText(
+              title ?? widget.title ?? '',
+              fontSize: 14.0,
+            ),
+            leading: BackButton(
+              onPressed: () => context.pop(),
+            ),
+          ),
+          body: SafeArea(
+            child: body,
+          ),
+        );
+      },
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/default_mobile_action_pane.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/default_mobile_action_pane.dart
new file mode 100644
index 000000000000..7a402eabe240
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/default_mobile_action_pane.dart
@@ -0,0 +1,98 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/mobile_bottom_sheet.dart';
+import 'package:appflowy/mobile/presentation/page_item/mobile_slide_action_button.dart';
+import 'package:appflowy/workspace/application/favorite/favorite_bloc.dart';
+import 'package:appflowy/workspace/application/view/view_bloc.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_slidable/flutter_slidable.dart';
+
+enum MobilePaneActionType {
+  delete,
+  addToFavorites,
+  removeFromFavorites,
+  more;
+
+  MobileSlideActionButton actionButton(
+    BuildContext context,
+  ) {
+    switch (this) {
+      case MobilePaneActionType.delete:
+        return MobileSlideActionButton(
+          backgroundColor: Colors.red,
+          svg: FlowySvgs.delete_s,
+          size: 30.0,
+          onPressed: (context) =>
+              context.read<ViewBloc>().add(const ViewEvent.delete()),
+        );
+      case MobilePaneActionType.removeFromFavorites:
+        return MobileSlideActionButton(
+          backgroundColor: Colors.red,
+          svg: FlowySvgs.favorite_s,
+          onPressed: (context) => context
+              .read<FavoriteBloc>()
+              .add(FavoriteEvent.toggle(context.read<ViewBloc>().view)),
+        );
+      case MobilePaneActionType.addToFavorites:
+        return MobileSlideActionButton(
+          backgroundColor: Colors.orange,
+          svg: FlowySvgs.m_favorite_unselected_lg,
+          size: 34.0,
+          onPressed: (context) => context
+              .read<FavoriteBloc>()
+              .add(FavoriteEvent.toggle(context.read<ViewBloc>().view)),
+        );
+      case MobilePaneActionType.more:
+        return MobileSlideActionButton(
+          backgroundColor: Colors.grey,
+          svg: FlowySvgs.three_dots_vertical_s,
+          size: 28.0,
+          onPressed: (context) {
+            final viewBloc = context.read<ViewBloc>();
+            final favoriteBloc = context.read<FavoriteBloc>();
+            showModalBottomSheet(
+              context: context,
+              isScrollControlled: true,
+              enableDrag: true,
+              shape: const RoundedRectangleBorder(
+                borderRadius: BorderRadius.only(
+                  topLeft: Radius.circular(8.0),
+                  topRight: Radius.circular(8.0),
+                ),
+              ),
+              builder: (context) {
+                return MultiBlocProvider(
+                  providers: [
+                    BlocProvider.value(value: viewBloc),
+                    BlocProvider.value(value: favoriteBloc),
+                  ],
+                  child: BlocBuilder<ViewBloc, ViewState>(
+                    builder: (context, state) {
+                      return MobileViewItemBottomSheet(
+                        view: viewBloc.view,
+                      );
+                    },
+                  ),
+                );
+              },
+            );
+          },
+        );
+    }
+  }
+}
+
+ActionPane buildEndActionPane(
+  BuildContext context,
+  List<MobilePaneActionType> actions,
+) {
+  return ActionPane(
+    motion: const ScrollMotion(),
+    extentRatio: actions.length / 5,
+    children: actions
+        .map(
+          (action) => action.actionButton(context),
+        )
+        .toList(),
+  );
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet.dart
new file mode 100644
index 000000000000..77b3865c079e
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet.dart
@@ -0,0 +1,116 @@
+import 'package:appflowy/mobile/presentation/bottom_sheet/mobile_bottom_sheet_body.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/mobile_bottom_sheet_header.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/mobile_bottom_sheet_rename_widget.dart';
+import 'package:appflowy/workspace/application/favorite/favorite_bloc.dart';
+import 'package:appflowy/workspace/application/view/view_bloc.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+enum MobileBottomSheetType {
+  view,
+  rename,
+}
+
+class MobileViewItemBottomSheet extends StatefulWidget {
+  const MobileViewItemBottomSheet({
+    super.key,
+    required this.view,
+  });
+
+  final ViewPB view;
+
+  @override
+  State<MobileViewItemBottomSheet> createState() =>
+      _MobileViewItemBottomSheetState();
+}
+
+class _MobileViewItemBottomSheetState extends State<MobileViewItemBottomSheet> {
+  MobileBottomSheetType type = MobileBottomSheetType.view;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        // drag handler
+        Padding(
+          padding: const EdgeInsets.only(top: 12, bottom: 12.0),
+          child: Container(
+            width: 64,
+            height: 4,
+            decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(2.0),
+              color: Colors.grey,
+            ),
+          ),
+        ),
+
+        // header
+        MobileBottomSheetHeader(
+          showBackButton: type != MobileBottomSheetType.view,
+          view: widget.view,
+          onBack: () {
+            setState(() {
+              type = MobileBottomSheetType.view;
+            });
+          },
+        ),
+        const VSpace(8.0),
+        const Divider(),
+
+        // body
+        _buildBody(),
+        const VSpace(12.0),
+      ],
+    );
+  }
+
+  Widget _buildBody() {
+    switch (type) {
+      case MobileBottomSheetType.view:
+        return MobileViewItemBottomSheetBody(
+          isFavorite: widget.view.isFavorite,
+          onAction: (action) {
+            switch (action) {
+              case MobileViewItemBottomSheetBodyAction.rename:
+                setState(() {
+                  type = MobileBottomSheetType.rename;
+                });
+                break;
+              case MobileViewItemBottomSheetBodyAction.duplicate:
+                context.read<ViewBloc>().add(const ViewEvent.duplicate());
+                Navigator.pop(context);
+                break;
+              case MobileViewItemBottomSheetBodyAction.share:
+                // unimplemented
+                Navigator.pop(context);
+                break;
+              case MobileViewItemBottomSheetBodyAction.delete:
+                context.read<ViewBloc>().add(const ViewEvent.delete());
+                Navigator.pop(context);
+                break;
+              case MobileViewItemBottomSheetBodyAction.addToFavorites:
+              case MobileViewItemBottomSheetBodyAction.removeFromFavorites:
+                context
+                    .read<FavoriteBloc>()
+                    .add(FavoriteEvent.toggle(widget.view));
+                Navigator.pop(context);
+                break;
+            }
+          },
+        );
+      case MobileBottomSheetType.rename:
+        return MobileBottomSheetRenameWidget(
+          name: widget.view.name,
+          onRename: (name) {
+            if (name != widget.view.name) {
+              context.read<ViewBloc>().add(ViewEvent.rename(name));
+            }
+            Navigator.pop(context);
+          },
+        );
+    }
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_action_widget.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_action_widget.dart
new file mode 100644
index 000000000000..4dd4aecbe5a6
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_action_widget.dart
@@ -0,0 +1,53 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class BottomSheetActionWidget extends StatelessWidget {
+  const BottomSheetActionWidget({
+    super.key,
+    required this.svg,
+    required this.text,
+    required this.onTap,
+  });
+
+  final FlowySvgData svg;
+  final String text;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: const EdgeInsets.all(8.0),
+      decoration: BoxDecoration(
+        border: Border.all(
+          color: Colors.grey,
+        ),
+        borderRadius: BorderRadius.circular(8.0),
+      ),
+      child: InkWell(
+        onTap: onTap,
+        enableFeedback: true,
+        child: Padding(
+          padding: const EdgeInsets.symmetric(
+            vertical: 12.0,
+            horizontal: 16.0,
+          ),
+          child: Row(
+            mainAxisSize: MainAxisSize.min,
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              FlowySvg(
+                svg,
+                size: const Size.square(22.0),
+                blendMode: BlendMode.dst,
+              ),
+              const HSpace(6.0),
+              FlowyText(text),
+              const Spacer(),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_body.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_body.dart
new file mode 100644
index 000000000000..efba4ea031ea
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_body.dart
@@ -0,0 +1,100 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/mobile_bottom_sheet_action_widget.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+
+enum MobileViewItemBottomSheetBodyAction {
+  rename,
+  duplicate,
+  share,
+  delete,
+  addToFavorites,
+  removeFromFavorites,
+}
+
+class MobileViewItemBottomSheetBody extends StatelessWidget {
+  const MobileViewItemBottomSheetBody({
+    super.key,
+    this.isFavorite = false,
+    required this.onAction,
+  });
+
+  final bool isFavorite;
+  final void Function(MobileViewItemBottomSheetBodyAction action) onAction;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+      children: [
+        // rename, duplicate
+        Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Expanded(
+              child: BottomSheetActionWidget(
+                svg: FlowySvgs.m_rename_m,
+                text: LocaleKeys.button_rename.tr(),
+                onTap: () => onAction(
+                  MobileViewItemBottomSheetBodyAction.rename,
+                ),
+              ),
+            ),
+            Expanded(
+              child: BottomSheetActionWidget(
+                svg: FlowySvgs.m_duplicate_m,
+                text: LocaleKeys.button_duplicate.tr(),
+                onTap: () => onAction(
+                  MobileViewItemBottomSheetBodyAction.duplicate,
+                ),
+              ),
+            ),
+          ],
+        ),
+
+        // share, delete
+        Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Expanded(
+              child: BottomSheetActionWidget(
+                svg: FlowySvgs.m_share_m,
+                text: LocaleKeys.button_share.tr(),
+                onTap: () => onAction(
+                  MobileViewItemBottomSheetBodyAction.share,
+                ),
+              ),
+            ),
+            Expanded(
+              child: BottomSheetActionWidget(
+                svg: FlowySvgs.m_delete_m,
+                text: LocaleKeys.button_delete.tr(),
+                onTap: () => onAction(
+                  MobileViewItemBottomSheetBodyAction.delete,
+                ),
+              ),
+            ),
+          ],
+        ),
+
+        // remove from favorites
+
+        BottomSheetActionWidget(
+          svg: isFavorite
+              ? FlowySvgs.m_favorite_selected_lg
+              : FlowySvgs.m_favorite_unselected_lg,
+          text: isFavorite
+              ? LocaleKeys.button_removeFromFavorites.tr()
+              : LocaleKeys.button_addToFavorites.tr(),
+          onTap: () => onAction(
+            isFavorite
+                ? MobileViewItemBottomSheetBodyAction.removeFromFavorites
+                : MobileViewItemBottomSheetBodyAction.addToFavorites,
+          ),
+        )
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_header.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_header.dart
new file mode 100644
index 000000000000..94cefdca9b33
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_header.dart
@@ -0,0 +1,45 @@
+import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class MobileBottomSheetHeader extends StatelessWidget {
+  const MobileBottomSheetHeader({
+    super.key,
+    required this.view,
+    required this.showBackButton,
+    required this.onBack,
+  });
+
+  final ViewPB view;
+  final bool showBackButton;
+  final VoidCallback onBack;
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      children: [
+        // back button,
+        showBackButton
+            ? InkWell(
+                onTap: onBack,
+                child: const Padding(
+                  padding: EdgeInsets.symmetric(horizontal: 8.0),
+                  child: Icon(
+                    Icons.arrow_back_ios_new_rounded,
+                    size: 24.0,
+                  ),
+                ),
+              )
+            : const HSpace(40.0),
+        // title
+        FlowyText.regular(
+          view.name,
+          fontSize: 16.0,
+        ),
+        // placeholder, ensure the title is centered
+        const HSpace(40.0),
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_rename_widget.dart b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_rename_widget.dart
new file mode 100644
index 000000000000..e4be17616e5e
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/bottom_sheet/mobile_bottom_sheet_rename_widget.dart
@@ -0,0 +1,76 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class MobileBottomSheetRenameWidget extends StatefulWidget {
+  const MobileBottomSheetRenameWidget({
+    super.key,
+    required this.name,
+    required this.onRename,
+  });
+
+  final String name;
+  final void Function(String name) onRename;
+
+  @override
+  State<MobileBottomSheetRenameWidget> createState() =>
+      _MobileBottomSheetRenameWidgetState();
+}
+
+class _MobileBottomSheetRenameWidgetState
+    extends State<MobileBottomSheetRenameWidget> {
+  late final TextEditingController controller;
+
+  @override
+  void initState() {
+    super.initState();
+
+    controller = TextEditingController(text: widget.name);
+  }
+
+  @override
+  void dispose() {
+    controller.dispose();
+
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(
+        horizontal: 4.0,
+        vertical: 16.0,
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          const HSpace(8.0),
+          Expanded(
+            child: SizedBox(
+              height: 44.0,
+              child: FlowyTextField(
+                controller: controller,
+              ),
+            ),
+          ),
+          const HSpace(12.0),
+          FlowyTextButton(
+            LocaleKeys.button_edit.tr(),
+            padding: const EdgeInsets.symmetric(
+              vertical: 12.0,
+              horizontal: 16.0,
+            ),
+            fontColor: Colors.white,
+            fillColor: Colors.lightBlue.shade300,
+            onPressed: () {
+              widget.onRename(controller.text);
+            },
+          ),
+          const HSpace(8.0),
+        ],
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_board_screen.dart b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_board_screen.dart
new file mode 100644
index 000000000000..1537024e9c05
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_board_screen.dart
@@ -0,0 +1,28 @@
+import 'package:appflowy/mobile/presentation/base/mobile_view_page.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flutter/material.dart';
+
+class MobileBoardScreen extends StatelessWidget {
+  static const routeName = '/board';
+  static const viewId = 'id';
+  static const viewTitle = 'title';
+
+  const MobileBoardScreen({
+    super.key,
+    required this.id,
+    this.title,
+  });
+
+  /// view id
+  final String id;
+  final String? title;
+
+  @override
+  Widget build(BuildContext context) {
+    return MobileViewPage(
+      id: id,
+      title: title,
+      viewLayout: ViewLayoutPB.Document,
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_calendar_screen.dart b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_calendar_screen.dart
new file mode 100644
index 000000000000..4d72b4c8001f
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_calendar_screen.dart
@@ -0,0 +1,28 @@
+import 'package:appflowy/mobile/presentation/base/mobile_view_page.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flutter/material.dart';
+
+class MobileCalendarScreen extends StatelessWidget {
+  static const routeName = '/calendar';
+  static const viewId = 'id';
+  static const viewTitle = 'title';
+
+  const MobileCalendarScreen({
+    super.key,
+    required this.id,
+    this.title,
+  });
+
+  /// view id
+  final String id;
+  final String? title;
+
+  @override
+  Widget build(BuildContext context) {
+    return MobileViewPage(
+      id: id,
+      title: title,
+      viewLayout: ViewLayoutPB.Document,
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_grid_screen.dart b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_grid_screen.dart
new file mode 100644
index 000000000000..5045167c83d4
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/database/mobile_grid_screen.dart
@@ -0,0 +1,28 @@
+import 'package:appflowy/mobile/presentation/base/mobile_view_page.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flutter/material.dart';
+
+class MobileGridScreen extends StatelessWidget {
+  static const routeName = '/grid';
+  static const viewId = 'id';
+  static const viewTitle = 'title';
+
+  const MobileGridScreen({
+    super.key,
+    required this.id,
+    this.title,
+  });
+
+  /// view id
+  final String id;
+  final String? title;
+
+  @override
+  Widget build(BuildContext context) {
+    return MobileViewPage(
+      id: id,
+      title: title,
+      viewLayout: ViewLayoutPB.Document,
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/editor/mobile_editor_screen.dart b/frontend/appflowy_flutter/lib/mobile/presentation/editor/mobile_editor_screen.dart
new file mode 100644
index 000000000000..31bc880ae735
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/editor/mobile_editor_screen.dart
@@ -0,0 +1,28 @@
+import 'package:appflowy/mobile/presentation/base/mobile_view_page.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flutter/material.dart';
+
+class MobileEditorScreen extends StatelessWidget {
+  static const routeName = '/docs';
+  static const viewId = 'id';
+  static const viewTitle = 'title';
+
+  const MobileEditorScreen({
+    super.key,
+    required this.id,
+    this.title,
+  });
+
+  /// view id
+  final String id;
+  final String? title;
+
+  @override
+  Widget build(BuildContext context) {
+    return MobileViewPage(
+      id: id,
+      title: title,
+      viewLayout: ViewLayoutPB.Document,
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/error/error_page.dart b/frontend/appflowy_flutter/lib/mobile/presentation/error/error_page.dart
new file mode 100644
index 000000000000..09ef2cf62709
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/error/error_page.dart
@@ -0,0 +1,49 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class MobileErrorPage extends StatelessWidget {
+  const MobileErrorPage({
+    super.key,
+    this.header,
+    this.title,
+    required this.message,
+  });
+
+  final Widget? header;
+  final String? title;
+  final String message;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      mainAxisAlignment: MainAxisAlignment.center,
+      children: [
+        header != null
+            ? header!
+            : const FlowyText.semibold(
+                '😔',
+                fontSize: 50,
+              ),
+        const VSpace(14.0),
+        FlowyText.semibold(
+          title ?? LocaleKeys.error_weAreSorry.tr(),
+          fontSize: 32,
+          textAlign: TextAlign.center,
+        ),
+        const VSpace(4.0),
+        Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 24.0),
+          child: FlowyText.regular(
+            message,
+            fontSize: 16,
+            maxLines: 100,
+            color: Colors.grey, // FIXME: use theme color
+            textAlign: TextAlign.center,
+          ),
+        ),
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_folder.dart b/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_folder.dart
new file mode 100644
index 000000000000..2b194b5cf6cc
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_folder.dart
@@ -0,0 +1,71 @@
+import 'package:appflowy/mobile/application/mobile_router.dart';
+import 'package:appflowy/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder.dart';
+import 'package:appflowy/workspace/application/favorite/favorite_bloc.dart';
+import 'package:appflowy/workspace/application/menu/menu_bloc.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:appflowy_backend/protobuf/flowy-user/user_profile.pb.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_slidable/flutter_slidable.dart';
+
+class MobileFavoritePageFolder extends StatelessWidget {
+  const MobileFavoritePageFolder({
+    super.key,
+    required this.userProfile,
+    required this.workspaceSetting,
+  });
+
+  final UserProfilePB userProfile;
+  final WorkspaceSettingPB workspaceSetting;
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiBlocProvider(
+      providers: [
+        BlocProvider(
+          create: (_) => MenuBloc(
+            user: userProfile,
+            workspace: workspaceSetting.workspace,
+          )..add(const MenuEvent.initial()),
+        ),
+        BlocProvider(
+          create: (_) => FavoriteBloc()..add(const FavoriteEvent.initial()),
+        )
+      ],
+      child: MultiBlocListener(
+        listeners: [
+          BlocListener<MenuBloc, MenuState>(
+            listenWhen: (p, c) =>
+                p.lastCreatedView?.id != c.lastCreatedView?.id,
+            listener: (context, state) =>
+                context.pushView(state.lastCreatedView!),
+          ),
+        ],
+        child: Builder(
+          builder: (context) {
+            final favoriteState = context.watch<FavoriteBloc>().state;
+            if (favoriteState.views.isEmpty) {
+              return const Center(
+                // todo: i18n
+                child: FlowyText('No favorite pages'),
+              );
+            }
+            return SlidableAutoCloseBehavior(
+              child: Column(
+                children: [
+                  MobileFavoriteFolder(
+                    showHeader: false,
+                    forceExpanded: true,
+                    views: favoriteState.views,
+                  ),
+                  const VSpace(100.0),
+                ],
+              ),
+            );
+          },
+        ),
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_page.dart b/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_page.dart
new file mode 100644
index 000000000000..ad38dd87fc81
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/favorite/mobile_favorite_page.dart
@@ -0,0 +1,100 @@
+import 'package:appflowy/mobile/presentation/favorite/mobile_favorite_folder.dart';
+import 'package:appflowy/mobile/presentation/home/mobile_home_page_header.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/presentation/home/errors/workspace_failed_screen.dart';
+import 'package:appflowy_backend/dispatch/dispatch.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/workspace.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-user/protobuf.dart';
+import 'package:flutter/material.dart';
+
+class MobileFavoriteScreen extends StatelessWidget {
+  const MobileFavoriteScreen({
+    super.key,
+  });
+
+  static const routeName = '/favorite';
+
+  @override
+  Widget build(BuildContext context) {
+    return FutureBuilder(
+      future: Future.wait([
+        FolderEventGetCurrentWorkspace().send(),
+        getIt<AuthService>().getUser(),
+      ]),
+      builder: (context, snapshots) {
+        if (!snapshots.hasData) {
+          return const Center(child: CircularProgressIndicator.adaptive());
+        }
+
+        final workspaceSetting = snapshots.data?[0].fold(
+          (workspaceSettingPB) {
+            return workspaceSettingPB as WorkspaceSettingPB?;
+          },
+          (error) => null,
+        );
+        final userProfile =
+            snapshots.data?[1].fold((error) => null, (userProfilePB) {
+          return userProfilePB as UserProfilePB?;
+        });
+
+        // In the unlikely case either of the above is null, eg.
+        // when a workspace is already open this can happen.
+        if (workspaceSetting == null || userProfile == null) {
+          return const WorkspaceFailedScreen();
+        }
+
+        return Scaffold(
+          body: SafeArea(
+            child: MobileFavoritePage(
+              userProfile: userProfile,
+              workspaceSetting: workspaceSetting,
+            ),
+          ),
+        );
+      },
+    );
+  }
+}
+
+class MobileFavoritePage extends StatelessWidget {
+  const MobileFavoritePage({
+    super.key,
+    required this.userProfile,
+    required this.workspaceSetting,
+  });
+
+  final UserProfilePB userProfile;
+  final WorkspaceSettingPB workspaceSetting;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        // Header
+        Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 16),
+          child: MobileHomePageHeader(
+            userProfile: userProfile,
+          ),
+        ),
+        const Divider(),
+
+        // Folder
+        Expanded(
+          child: Scrollbar(
+            child: SingleChildScrollView(
+              child: Padding(
+                padding: const EdgeInsets.all(8.0),
+                child: MobileFavoritePageFolder(
+                  userProfile: userProfile,
+                  workspaceSetting: workspaceSetting,
+                ),
+              ),
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder.dart
new file mode 100644
index 000000000000..b6765ad8ecd3
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder.dart
@@ -0,0 +1,80 @@
+import 'package:appflowy/mobile/application/mobile_router.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/default_mobile_action_pane.dart';
+import 'package:appflowy/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder_header.dart';
+import 'package:appflowy/mobile/presentation/page_item/mobile_view_item.dart';
+import 'package:appflowy/workspace/application/sidebar/folder/folder_bloc.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+class MobileFavoriteFolder extends StatelessWidget {
+  const MobileFavoriteFolder({
+    super.key,
+    required this.views,
+    this.showHeader = true,
+    this.forceExpanded = false,
+  });
+
+  final bool showHeader;
+  final bool forceExpanded;
+  final List<ViewPB> views;
+
+  @override
+  Widget build(BuildContext context) {
+    if (views.isEmpty) {
+      return const SizedBox.shrink();
+    }
+
+    return BlocProvider<FolderBloc>(
+      create: (context) => FolderBloc(type: FolderCategoryType.favorite)
+        ..add(
+          const FolderEvent.initial(),
+        ),
+      child: BlocBuilder<FolderBloc, FolderState>(
+        builder: (context, state) {
+          return Column(
+            children: [
+              if (showHeader) ...[
+                MobileFavoriteFolderHeader(
+                  isExpanded: context.read<FolderBloc>().state.isExpanded,
+                  onPressed: () => context
+                      .read<FolderBloc>()
+                      .add(const FolderEvent.expandOrUnExpand()),
+                  onAdded: () => context.read<FolderBloc>().add(
+                        const FolderEvent.expandOrUnExpand(isExpanded: true),
+                      ),
+                ),
+                const VSpace(8.0),
+                const Divider(
+                  height: 1,
+                ),
+              ],
+              if (forceExpanded || state.isExpanded)
+                ...views.map(
+                  (view) => MobileViewItem(
+                    key: ValueKey(
+                      '${FolderCategoryType.favorite.name} ${view.id}',
+                    ),
+                    categoryType: FolderCategoryType.favorite,
+                    isDraggable: false,
+                    isFirstChild: view.id == views.first.id,
+                    isFeedback: false,
+                    view: view,
+                    level: 0,
+                    onSelected: (view) async {
+                      await context.pushView(view);
+                    },
+                    endActionPane: (context) => buildEndActionPane(context, [
+                      MobilePaneActionType.removeFromFavorites,
+                      MobilePaneActionType.more,
+                    ]),
+                  ),
+                ),
+            ],
+          );
+        },
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder_header.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder_header.dart
new file mode 100644
index 000000000000..997f6043ac63
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder_header.dart
@@ -0,0 +1,60 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class MobileFavoriteFolderHeader extends StatefulWidget {
+  const MobileFavoriteFolderHeader({
+    super.key,
+    required this.onPressed,
+    required this.onAdded,
+    required this.isExpanded,
+  });
+
+  final VoidCallback onPressed;
+  final VoidCallback onAdded;
+  final bool isExpanded;
+
+  @override
+  State<MobileFavoriteFolderHeader> createState() =>
+      _MobileFavoriteFolderHeaderState();
+}
+
+class _MobileFavoriteFolderHeaderState
+    extends State<MobileFavoriteFolderHeader> {
+  double _turns = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.center,
+      children: [
+        Expanded(
+          child: FlowyButton(
+            text: FlowyText.semibold(
+              LocaleKeys.sideBar_favorites.tr(),
+              fontSize: 20.0,
+            ),
+            margin: const EdgeInsets.symmetric(vertical: 8),
+            expandText: false,
+            mainAxisAlignment: MainAxisAlignment.start,
+            rightIcon: AnimatedRotation(
+              duration: const Duration(milliseconds: 200),
+              turns: _turns,
+              child: const Icon(
+                Icons.keyboard_arrow_down_rounded,
+                color: Colors.grey,
+              ),
+            ),
+            onTap: () {
+              setState(() {
+                _turns = widget.isExpanded ? -0.25 : 0;
+              });
+              widget.onPressed();
+            },
+          ),
+        ),
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_folders.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_folders.dart
new file mode 100644
index 000000000000..606206568278
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_folders.dart
@@ -0,0 +1,74 @@
+import 'package:appflowy/mobile/application/mobile_router.dart';
+import 'package:appflowy/mobile/presentation/home/favorite_folder/mobile_home_favorite_folder.dart';
+import 'package:appflowy/mobile/presentation/home/personal_folder/mobile_home_personal_folder.dart';
+import 'package:appflowy/workspace/application/favorite/favorite_bloc.dart';
+import 'package:appflowy/workspace/application/menu/menu_bloc.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:appflowy_backend/protobuf/flowy-user/user_profile.pb.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_slidable/flutter_slidable.dart';
+
+class MobileFolders extends StatelessWidget {
+  const MobileFolders({
+    super.key,
+    required this.user,
+    required this.workspaceSetting,
+    required this.showFavorite,
+  });
+
+  final UserProfilePB user;
+  final WorkspaceSettingPB workspaceSetting;
+  final bool showFavorite;
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiBlocProvider(
+      providers: [
+        BlocProvider(
+          create: (_) => MenuBloc(
+            user: user,
+            workspace: workspaceSetting.workspace,
+          )..add(const MenuEvent.initial()),
+        ),
+        BlocProvider(
+          create: (_) => FavoriteBloc()..add(const FavoriteEvent.initial()),
+        )
+      ],
+      child: MultiBlocListener(
+        listeners: [
+          BlocListener<MenuBloc, MenuState>(
+            listenWhen: (p, c) =>
+                p.lastCreatedView?.id != c.lastCreatedView?.id,
+            listener: (context, state) =>
+                context.pushView(state.lastCreatedView!),
+          ),
+        ],
+        child: Builder(
+          builder: (context) {
+            final menuState = context.watch<MenuBloc>().state;
+            final favoriteState = context.watch<FavoriteBloc>().state;
+            return SlidableAutoCloseBehavior(
+              child: Column(
+                children: [
+                  // TODO: Uncomment this when we have favorite folder in home page
+                  if (showFavorite && favoriteState.views.isNotEmpty) ...[
+                    MobileFavoriteFolder(
+                      views: favoriteState.views,
+                    ),
+                    const VSpace(18.0),
+                  ],
+                  MobilePersonalFolder(
+                    views: menuState.views,
+                  ),
+                  const VSpace(8.0),
+                ],
+              ),
+            );
+          },
+        ),
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page.dart
index e54c0dfe1f12..8c244a8ecdc9 100644
--- a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page.dart
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page.dart
@@ -1,12 +1,14 @@
-import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/mobile/presentation/home/mobile_folders.dart';
+import 'package:appflowy/mobile/presentation/home/mobile_home_page_header.dart';
+import 'package:appflowy/mobile/presentation/home/mobile_home_page_recent_files.dart';
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/presentation/home/errors/workspace_failed_screen.dart';
 import 'package:appflowy_backend/dispatch/dispatch.dart';
 import 'package:appflowy_backend/protobuf/flowy-folder2/workspace.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-user/protobuf.dart';
 import 'package:flutter/material.dart';
 
-// TODO(yijing): This is just a placeholder for now.
 class MobileHomeScreen extends StatelessWidget {
   const MobileHomeScreen({super.key});
 
@@ -34,47 +36,80 @@ class MobileHomeScreen extends StatelessWidget {
             snapshots.data?[1].fold((error) => null, (userProfilePB) {
           return userProfilePB as UserProfilePB?;
         });
-        // TODO(yijing): implement home page later
+
+        // In the unlikely case either of the above is null, eg.
+        // when a workspace is already open this can happen.
+        if (workspaceSetting == null || userProfile == null) {
+          return const WorkspaceFailedScreen();
+        }
+
         return Scaffold(
-          key: ValueKey(userProfile?.id),
-          // TODO(yijing):Need to change to workspace when it is ready
-          appBar: AppBar(
-            title: Text(
-              userProfile?.email.toString() ?? 'No email found',
+          body: SafeArea(
+            child: MobileHomePage(
+              userProfile: userProfile,
+              workspaceSetting: workspaceSetting,
             ),
-            actions: [
-              IconButton(
-                onPressed: () {
-                  // TODO(yijing): Navigate to setting page
-                },
-                icon: const FlowySvg(
-                  FlowySvgs.m_setting_m,
-                ),
-              )
-            ],
           ),
-          body: Center(
-            child: Column(
-              children: [
-                const Text(
-                  'User',
-                ),
-                Text(
-                  userProfile.toString(),
+        );
+      },
+    );
+  }
+}
+
+class MobileHomePage extends StatelessWidget {
+  const MobileHomePage({
+    super.key,
+    required this.userProfile,
+    required this.workspaceSetting,
+  });
+
+  final UserProfilePB userProfile;
+  final WorkspaceSettingPB workspaceSetting;
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        // TODO: header + option icon button
+        // Header
+        Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 16),
+          child: MobileHomePageHeader(
+            userProfile: userProfile,
+          ),
+        ),
+        const Divider(),
+
+        // Folder
+        Expanded(
+          child: Scrollbar(
+            child: SingleChildScrollView(
+              child: Padding(
+                padding: const EdgeInsets.all(8.0),
+                child: Column(
+                  children: [
+                    // Recent files
+                    const MobileHomePageRecentFilesWidget(),
+                    const Divider(),
+
+                    // Folders
+                    Padding(
+                      padding: const EdgeInsets.symmetric(horizontal: 16),
+                      child: MobileFolders(
+                        showFavorite: false,
+                        user: userProfile,
+                        workspaceSetting: workspaceSetting,
+                      ),
+                    ),
+                  ],
                 ),
-                Text('Workspace name: ${workspaceSetting?.workspace.name}'),
-                ElevatedButton(
-                  onPressed: () async {
-                    await getIt<AuthService>().signOut();
-                    runAppFlowy();
-                  },
-                  child: const Text('Logout'),
-                )
-              ],
+              ),
             ),
           ),
-        );
-      },
+        ),
+
+        // TODO: Trash
+      ],
     );
   }
 }
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_header.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_header.dart
new file mode 100644
index 000000000000..dadd6ae2b5a9
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_header.dart
@@ -0,0 +1,50 @@
+import 'package:appflowy_backend/protobuf/flowy-user/user_profile.pb.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+class MobileHomePageHeader extends StatelessWidget {
+  const MobileHomePageHeader({
+    super.key,
+    required this.userProfile,
+  });
+
+  final UserProfilePB userProfile;
+
+  @override
+  Widget build(BuildContext context) {
+    // TODO: implement the details later.
+    return SizedBox(
+      height: 80,
+      child: Row(
+        children: [
+          const FlowyText(
+            '🐻',
+            fontSize: 26,
+          ),
+          const HSpace(14),
+          Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              const FlowyText.medium(
+                'AppFlowy',
+                fontSize: 18,
+              ),
+              const VSpace(4.0),
+              FlowyText.regular(
+                userProfile.email,
+                fontSize: 12,
+                color: Colors.grey,
+              )
+            ],
+          ),
+          const Spacer(),
+          IconButton(
+            icon: const Icon(Icons.more_horiz_outlined),
+            onPressed: () {},
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_recent_files.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_recent_files.dart
new file mode 100644
index 000000000000..427b5a98e4bd
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_recent_files.dart
@@ -0,0 +1,59 @@
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+const rainbowColors = <Color>[
+  Color(0xFFFF0064),
+  Color(0xFFFF7600),
+  Color(0xFFFFD500),
+  Color(0xFF8CFE00),
+  Color(0xFF00E86C),
+  Color(0xFF00F4F2),
+  Color(0xFF00CCFF),
+  Color(0xFF70A2FF),
+  Color(0xFFA96CFF),
+];
+
+class MobileHomePageRecentFilesWidget extends StatelessWidget {
+  const MobileHomePageRecentFilesWidget({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    // TODO: implement the details later.
+    return SizedBox(
+      height: 160,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          const Padding(
+            padding: EdgeInsets.symmetric(horizontal: 16),
+            child: FlowyText.semibold(
+              'Recent',
+              fontSize: 20.0,
+            ),
+          ),
+          Expanded(
+            child: ListView.separated(
+              separatorBuilder: (context, index) => const HSpace(20),
+              padding: const EdgeInsets.symmetric(
+                horizontal: 16,
+                vertical: 10,
+              ),
+              scrollDirection: Axis.horizontal,
+              itemCount: rainbowColors.length,
+              itemBuilder: (context, index) {
+                return Container(
+                  alignment: Alignment.center,
+                  width: 144,
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(8.0),
+                    color: rainbowColors[index],
+                  ),
+                );
+              },
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_ui.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_ui.dart
new file mode 100644
index 000000000000..8b137891791f
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/mobile_home_page_ui.dart
@@ -0,0 +1 @@
+
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder.dart
new file mode 100644
index 000000000000..a43559f4924a
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder.dart
@@ -0,0 +1,72 @@
+import 'package:appflowy/mobile/application/mobile_router.dart';
+import 'package:appflowy/mobile/presentation/bottom_sheet/default_mobile_action_pane.dart';
+import 'package:appflowy/mobile/presentation/home/personal_folder/mobile_home_personal_folder_header.dart';
+import 'package:appflowy/mobile/presentation/page_item/mobile_view_item.dart';
+import 'package:appflowy/workspace/application/sidebar/folder/folder_bloc.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+class MobilePersonalFolder extends StatelessWidget {
+  const MobilePersonalFolder({
+    super.key,
+    required this.views,
+  });
+
+  final List<ViewPB> views;
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider<FolderBloc>(
+      create: (context) => FolderBloc(type: FolderCategoryType.personal)
+        ..add(
+          const FolderEvent.initial(),
+        ),
+      child: BlocBuilder<FolderBloc, FolderState>(
+        builder: (context, state) {
+          return Column(
+            children: [
+              MobilePersonalFolderHeader(
+                isExpanded: context.read<FolderBloc>().state.isExpanded,
+                onPressed: () => context
+                    .read<FolderBloc>()
+                    .add(const FolderEvent.expandOrUnExpand()),
+                onAdded: () => context.read<FolderBloc>().add(
+                      const FolderEvent.expandOrUnExpand(isExpanded: true),
+                    ),
+              ),
+              const VSpace(8.0),
+              const Divider(
+                height: 1,
+              ),
+              if (state.isExpanded)
+                ...views.map(
+                  (view) => MobileViewItem(
+                    key: ValueKey(
+                      '${FolderCategoryType.personal.name} ${view.id}',
+                    ),
+                    isDraggable: false,
+                    categoryType: FolderCategoryType.personal,
+                    isFirstChild: view.id == views.first.id,
+                    view: view,
+                    level: 0,
+                    leftPadding: 16,
+                    isFeedback: false,
+                    onSelected: (view) async {
+                      await context.pushView(view);
+                    },
+                    endActionPane: (context) => buildEndActionPane(context, [
+                      MobilePaneActionType.delete,
+                      MobilePaneActionType.addToFavorites,
+                      MobilePaneActionType.more,
+                    ]),
+                  ),
+                )
+            ],
+          );
+        },
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder_header.dart b/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder_header.dart
new file mode 100644
index 000000000000..c8d4448fd3b1
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/home/personal_folder/mobile_home_personal_folder_header.dart
@@ -0,0 +1,82 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/workspace/application/menu/menu_bloc.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+class MobilePersonalFolderHeader extends StatefulWidget {
+  const MobilePersonalFolderHeader({
+    super.key,
+    required this.onPressed,
+    required this.onAdded,
+    required this.isExpanded,
+  });
+
+  final VoidCallback onPressed;
+  final VoidCallback onAdded;
+  final bool isExpanded;
+
+  @override
+  State<MobilePersonalFolderHeader> createState() =>
+      _MobilePersonalFolderHeaderState();
+}
+
+class _MobilePersonalFolderHeaderState
+    extends State<MobilePersonalFolderHeader> {
+  double _turns = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    const iconSize = 32.0;
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.center,
+      children: [
+        Expanded(
+          child: FlowyButton(
+            text: FlowyText.semibold(
+              LocaleKeys.sideBar_personal.tr(),
+              fontSize: 20.0,
+            ),
+            margin: const EdgeInsets.symmetric(vertical: 8),
+            expandText: false,
+            mainAxisAlignment: MainAxisAlignment.start,
+            rightIcon: AnimatedRotation(
+              duration: const Duration(milliseconds: 200),
+              turns: _turns,
+              child: const Icon(
+                Icons.keyboard_arrow_down_rounded,
+                color: Colors.grey,
+              ),
+            ),
+            onTap: () {
+              setState(() {
+                _turns = widget.isExpanded ? -0.25 : 0;
+              });
+              widget.onPressed();
+            },
+          ),
+        ),
+        FlowyIconButton(
+          hoverColor: Theme.of(context).colorScheme.secondaryContainer,
+          iconPadding: const EdgeInsets.all(2),
+          height: iconSize,
+          width: iconSize,
+          icon: const FlowySvg(
+            FlowySvgs.add_s,
+            size: Size.square(iconSize),
+          ),
+          onPressed: () {
+            context.read<MenuBloc>().add(
+                  MenuEvent.createApp(
+                    LocaleKeys.menuAppHeader_defaultNewPageName.tr(),
+                    index: 0,
+                  ),
+                );
+          },
+        ),
+      ],
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_slide_action_button.dart b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_slide_action_button.dart
new file mode 100644
index 000000000000..5aebb53100cb
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_slide_action_button.dart
@@ -0,0 +1,35 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_slidable/flutter_slidable.dart';
+
+class MobileSlideActionButton extends StatelessWidget {
+  const MobileSlideActionButton({
+    super.key,
+    required this.svg,
+    this.size = 32.0,
+    this.backgroundColor = Colors.transparent,
+    required this.onPressed,
+  });
+
+  final FlowySvgData svg;
+  final double size;
+  final Color backgroundColor;
+  final SlidableActionCallback onPressed;
+
+  @override
+  Widget build(BuildContext context) {
+    return CustomSlidableAction(
+      backgroundColor: backgroundColor,
+      onPressed: (context) {
+        HapticFeedback.mediumImpact();
+        onPressed(context);
+      },
+      child: FlowySvg(
+        svg,
+        size: Size.square(size),
+        color: Colors.white,
+      ),
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item.dart b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item.dart
new file mode 100644
index 000000000000..6ca7fbf68d1f
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item.dart
@@ -0,0 +1,417 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/mobile/application/mobile_router.dart';
+import 'package:appflowy/mobile/presentation/page_item/mobile_view_item_add_button.dart';
+import 'package:appflowy/workspace/application/sidebar/folder/folder_bloc.dart';
+import 'package:appflowy/workspace/application/view/view_bloc.dart';
+import 'package:appflowy/workspace/application/view/view_ext.dart';
+import 'package:appflowy/workspace/presentation/home/menu/view/draggable_view_item.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_slidable/flutter_slidable.dart';
+
+typedef ViewItemOnSelected = void Function(ViewPB);
+typedef ActionPaneBuilder = ActionPane Function(BuildContext context);
+
+const _itemHeight = 48.0;
+
+class MobileViewItem extends StatelessWidget {
+  const MobileViewItem({
+    super.key,
+    required this.view,
+    this.parentView,
+    required this.categoryType,
+    required this.level,
+    this.leftPadding = 10,
+    required this.onSelected,
+    this.isFirstChild = false,
+    this.isDraggable = true,
+    required this.isFeedback,
+    this.startActionPane,
+    this.endActionPane,
+  });
+
+  final ViewPB view;
+  final ViewPB? parentView;
+
+  final FolderCategoryType categoryType;
+
+  // indicate the level of the view item
+  // used to calculate the left padding
+  final int level;
+
+  // the left padding of the view item for each level
+  // the left padding of the each level = level * leftPadding
+  final double leftPadding;
+
+  // Selected by normal conventions
+  final ViewItemOnSelected onSelected;
+
+  // used for indicating the first child of the parent view, so that we can
+  // add top border to the first child
+  final bool isFirstChild;
+
+  // it should be false when it's rendered as feedback widget inside DraggableItem
+  final bool isDraggable;
+
+  // identify if the view item is rendered as feedback widget inside DraggableItem
+  final bool isFeedback;
+
+  // the actions of the view item, such as favorite, rename, delete, etc.
+  final ActionPaneBuilder? startActionPane;
+  final ActionPaneBuilder? endActionPane;
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => ViewBloc(view: view)..add(const ViewEvent.initial()),
+      child: BlocConsumer<ViewBloc, ViewState>(
+        listenWhen: (p, c) =>
+            c.lastCreatedView != null &&
+            p.lastCreatedView?.id != c.lastCreatedView!.id,
+        listener: (context, state) => context.pushView(state.lastCreatedView!),
+        builder: (context, state) {
+          // don't remove this code. it's related to the backend service.
+          view.childViews
+            ..clear()
+            ..addAll(state.childViews);
+          return InnerMobileViewItem(
+            view: state.view,
+            parentView: parentView,
+            childViews: state.childViews,
+            categoryType: categoryType,
+            level: level,
+            leftPadding: leftPadding,
+            showActions: true,
+            isExpanded: state.isExpanded,
+            onSelected: onSelected,
+            isFirstChild: isFirstChild,
+            isDraggable: isDraggable,
+            isFeedback: isFeedback,
+            startActionPane: startActionPane,
+            endActionPane: endActionPane,
+          );
+        },
+      ),
+    );
+  }
+}
+
+class InnerMobileViewItem extends StatelessWidget {
+  const InnerMobileViewItem({
+    super.key,
+    required this.view,
+    required this.parentView,
+    required this.childViews,
+    required this.categoryType,
+    this.isDraggable = true,
+    this.isExpanded = true,
+    required this.level,
+    required this.leftPadding,
+    required this.showActions,
+    required this.onSelected,
+    this.isFirstChild = false,
+    required this.isFeedback,
+    this.startActionPane,
+    this.endActionPane,
+  });
+
+  final ViewPB view;
+  final ViewPB? parentView;
+  final List<ViewPB> childViews;
+  final FolderCategoryType categoryType;
+
+  final bool isDraggable;
+  final bool isExpanded;
+  final bool isFirstChild;
+  // identify if the view item is rendered as feedback widget inside DraggableItem
+  final bool isFeedback;
+
+  final int level;
+  final double leftPadding;
+
+  final bool showActions;
+  final ViewItemOnSelected onSelected;
+
+  final ActionPaneBuilder? startActionPane;
+  final ActionPaneBuilder? endActionPane;
+
+  @override
+  Widget build(BuildContext context) {
+    Widget child = SingleMobileInnerViewItem(
+      key: ValueKey('${categoryType.name} ${view.id} $isExpanded'),
+      view: view,
+      parentView: parentView,
+      level: level,
+      showActions: showActions,
+      categoryType: categoryType,
+      onSelected: onSelected,
+      isExpanded: isExpanded,
+      isDraggable: isDraggable,
+      leftPadding: leftPadding,
+      isFeedback: isFeedback,
+      startActionPane: startActionPane,
+      endActionPane: endActionPane,
+    );
+
+    // if the view is expanded and has child views, render its child views
+    if (isExpanded) {
+      if (childViews.isNotEmpty) {
+        final children = childViews.map((childView) {
+          return MobileViewItem(
+            key: ValueKey('${categoryType.name} ${childView.id}'),
+            parentView: view,
+            categoryType: categoryType,
+            isFirstChild: childView.id == childViews.first.id,
+            view: childView,
+            level: level + 1,
+            onSelected: onSelected,
+            isDraggable: isDraggable,
+            leftPadding: leftPadding,
+            isFeedback: isFeedback,
+            startActionPane: startActionPane,
+            endActionPane: endActionPane,
+          );
+        }).toList();
+
+        child = Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            child,
+            const Divider(
+              height: 1,
+            ),
+            ...children,
+          ],
+        );
+      } else {
+        child = Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            child,
+            const Divider(
+              height: 1,
+            ),
+            Container(
+              height: _itemHeight,
+              alignment: Alignment.centerLeft,
+              child: Padding(
+                padding: EdgeInsets.only(left: (level + 2) * leftPadding),
+                child: FlowyText.medium(
+                  LocaleKeys.noPagesInside.tr(),
+                  color: Colors.grey,
+                ),
+              ),
+            ),
+            const Divider(
+              height: 1,
+            ),
+          ],
+        );
+      }
+    } else {
+      child = Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          child,
+          const Divider(
+            height: 1,
+          ),
+        ],
+      );
+    }
+
+    // wrap the child with DraggableItem if isDraggable is true
+    if (isDraggable && !isReferencedDatabaseView(view, parentView)) {
+      child = DraggableViewItem(
+        isFirstChild: isFirstChild,
+        view: view,
+        child: child,
+        feedback: (context) {
+          return MobileViewItem(
+            view: view,
+            parentView: parentView,
+            categoryType: categoryType,
+            level: level,
+            onSelected: onSelected,
+            isDraggable: false,
+            leftPadding: leftPadding,
+            isFeedback: true,
+            startActionPane: startActionPane,
+            endActionPane: endActionPane,
+          );
+        },
+      );
+    }
+
+    return child;
+  }
+}
+
+class SingleMobileInnerViewItem extends StatefulWidget {
+  const SingleMobileInnerViewItem({
+    super.key,
+    required this.view,
+    required this.parentView,
+    required this.isExpanded,
+    required this.level,
+    required this.leftPadding,
+    this.isDraggable = true,
+    required this.categoryType,
+    required this.showActions,
+    required this.onSelected,
+    required this.isFeedback,
+    this.startActionPane,
+    this.endActionPane,
+  });
+
+  final ViewPB view;
+  final ViewPB? parentView;
+  final bool isExpanded;
+  // identify if the view item is rendered as feedback widget inside DraggableItem
+  final bool isFeedback;
+
+  final int level;
+  final double leftPadding;
+
+  final bool isDraggable;
+  final bool showActions;
+  final ViewItemOnSelected onSelected;
+  final FolderCategoryType categoryType;
+  final ActionPaneBuilder? startActionPane;
+  final ActionPaneBuilder? endActionPane;
+
+  @override
+  State<SingleMobileInnerViewItem> createState() =>
+      _SingleMobileInnerViewItemState();
+}
+
+class _SingleMobileInnerViewItemState extends State<SingleMobileInnerViewItem> {
+  @override
+  Widget build(BuildContext context) {
+    final children = [
+      // expand icon
+      _buildLeftIcon(),
+      const HSpace(4),
+      // icon
+      SizedBox.square(
+        dimension: 22,
+        child: widget.view.defaultIcon(),
+      ),
+      const HSpace(12),
+      // title
+      Expanded(
+        child: FlowyText.regular(
+          widget.view.name,
+          fontSize: 18.0,
+          overflow: TextOverflow.ellipsis,
+        ),
+      )
+    ];
+
+    // hover action
+
+    // ··· more action button
+    // children.add(_buildViewMoreActionButton(context));
+    // only support add button for document layout
+    if (widget.view.layout == ViewLayoutPB.Document) {
+      // + button
+      children.add(_buildViewAddButton(context));
+    }
+
+    Widget child = GestureDetector(
+      behavior: HitTestBehavior.translucent,
+      onTap: () => widget.onSelected(widget.view),
+      child: SizedBox(
+        height: _itemHeight,
+        child: Padding(
+          padding: EdgeInsets.only(left: widget.level * widget.leftPadding),
+          child: Row(
+            children: children,
+          ),
+        ),
+      ),
+    );
+
+    if (widget.startActionPane != null || widget.endActionPane != null) {
+      child = Slidable(
+        // Specify a key if the Slidable is dismissible.
+        key: ValueKey(widget.view.id),
+        startActionPane: widget.startActionPane?.call(context),
+        endActionPane: widget.endActionPane?.call(context),
+        child: child,
+      );
+    }
+
+    return child;
+  }
+
+  // > button or · button
+  // show > if the view is expandable.
+  // show · if the view can't contain child views.
+  Widget _buildLeftIcon() {
+    if (isReferencedDatabaseView(widget.view, widget.parentView)) {
+      return const _DotIconWidget();
+    }
+
+    return GestureDetector(
+      child: AnimatedRotation(
+        duration: const Duration(milliseconds: 200),
+        turns: widget.isExpanded ? 0 : -0.25,
+        child: const Icon(
+          Icons.keyboard_arrow_down_rounded,
+          size: 28,
+        ),
+      ),
+      onTap: () {
+        context
+            .read<ViewBloc>()
+            .add(ViewEvent.setIsExpanded(!widget.isExpanded));
+      },
+    );
+  }
+
+  // + button
+  Widget _buildViewAddButton(BuildContext context) {
+    return MobileViewAddButton(
+      onPressed: () {
+        context.read<ViewBloc>().add(
+              ViewEvent.createView(
+                LocaleKeys.menuAppHeader_defaultNewPageName.tr(),
+                ViewLayoutPB.Document,
+              ),
+            );
+      },
+    );
+  }
+}
+
+class _DotIconWidget extends StatelessWidget {
+  const _DotIconWidget();
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(6.0),
+      child: Container(
+        width: 4,
+        height: 4,
+        decoration: BoxDecoration(
+          color: Theme.of(context).iconTheme.color,
+          borderRadius: BorderRadius.circular(2),
+        ),
+      ),
+    );
+  }
+}
+
+// workaround: we should use view.isEndPoint or something to check if the view can contain child views. But currently, we don't have that field.
+bool isReferencedDatabaseView(ViewPB view, ViewPB? parentView) {
+  if (parentView == null) {
+    return false;
+  }
+  return view.layout.isDatabaseView && parentView.layout.isDatabaseView;
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item_add_button.dart b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item_add_button.dart
new file mode 100644
index 000000000000..eb2f8ea9f887
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/page_item/mobile_view_item_add_button.dart
@@ -0,0 +1,28 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+
+const _iconSize = 32.0;
+
+class MobileViewAddButton extends StatelessWidget {
+  const MobileViewAddButton({
+    super.key,
+    required this.onPressed,
+  });
+
+  final VoidCallback onPressed;
+
+  @override
+  Widget build(BuildContext context) {
+    return FlowyIconButton(
+      iconPadding: const EdgeInsets.all(2),
+      width: _iconSize,
+      height: _iconSize,
+      icon: const FlowySvg(
+        FlowySvgs.add_s,
+        size: Size.square(_iconSize),
+      ),
+      onPressed: onPressed,
+    );
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/mobile/presentation/presentation.dart b/frontend/appflowy_flutter/lib/mobile/presentation/presentation.dart
index fedc53004c18..72514a3a4c18 100644
--- a/frontend/appflowy_flutter/lib/mobile/presentation/presentation.dart
+++ b/frontend/appflowy_flutter/lib/mobile/presentation/presentation.dart
@@ -1,4 +1,5 @@
-export 'home/home.dart';
-export 'root_placeholder_page.dart';
 export 'details_placeholder_page.dart';
+export 'editor/mobile_editor_screen.dart';
+export 'home/home.dart';
 export 'mobile_bottom_navigation_bar.dart';
+export 'root_placeholder_page.dart';
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/application/cell/checklist_cell_service.dart b/frontend/appflowy_flutter/lib/plugins/database_view/application/cell/checklist_cell_service.dart
index dfb9670669b8..3e43d67f3168 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/application/cell/checklist_cell_service.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/application/cell/checklist_cell_service.dart
@@ -1,5 +1,4 @@
 import 'package:appflowy_backend/dispatch/dispatch.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/cell_entities.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/checklist_entities.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/select_option.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-error/errors.pb.dart';
@@ -69,13 +68,4 @@ class ChecklistCellBackendService {
 
     return DatabaseEventUpdateChecklistCell(payload).send();
   }
-
-  Future<Either<ChecklistCellDataPB, FlowyError>> getCellData() {
-    final payload = CellIdPB.create()
-      ..viewId = viewId
-      ..fieldId = fieldId
-      ..rowId = rowId;
-
-    return DatabaseEventGetChecklistCellData(payload).send();
-  }
 }
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/application/setting/property_bloc.dart b/frontend/appflowy_flutter/lib/plugins/database_view/application/setting/property_bloc.dart
index bbef6db8943a..658c43358374 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/application/setting/property_bloc.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/application/setting/property_bloc.dart
@@ -25,34 +25,44 @@ class DatabasePropertyBloc
         ) {
     on<DatabasePropertyEvent>(
       (event, emit) async {
-        await event.map(
-          initial: (_Initial value) {
+        await event.when(
+          initial: () {
             _startListening();
           },
-          setFieldVisibility: (_SetFieldVisibility value) async {
+          setFieldVisibility: (fieldId, visibility) async {
             final fieldSettingsSvc = FieldSettingsBackendService(
               viewId: viewId,
             );
 
             final result = await fieldSettingsSvc.updateFieldSettings(
-              fieldId: value.fieldId,
-              fieldVisibility: value.visibility,
+              fieldId: fieldId,
+              fieldVisibility: visibility,
             );
 
             result.fold((l) => null, (err) => Log.error(err));
           },
-          didReceiveFieldUpdate: (_DidReceiveFieldUpdate value) {
-            emit(state.copyWith(fieldContexts: value.fields));
+          didReceiveFieldUpdate: (fields) {
+            emit(state.copyWith(fieldContexts: fields));
           },
-          moveField: (_MoveField value) async {
+          moveField: (fieldId, fromIndex, toIndex) async {
+            if (fromIndex < toIndex) {
+              toIndex--;
+            }
+            final fieldContexts = List<FieldInfo>.from(state.fieldContexts);
+            fieldContexts.insert(
+              toIndex,
+              fieldContexts.removeAt(fromIndex),
+            );
+            emit(state.copyWith(fieldContexts: fieldContexts));
+
             final fieldBackendService = FieldBackendService(
               viewId: viewId,
-              fieldId: value.fieldId,
+              fieldId: fieldId,
             );
 
             final result = await fieldBackendService.moveField(
-              value.fromIndex,
-              value.toIndex,
+              fromIndex,
+              toIndex,
             );
 
             result.fold((l) => null, (r) => Log.error(r));
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/calendar_event_editor.dart b/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/calendar_event_editor.dart
index 1c10a7c00d8e..8ccef33fdf48 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/calendar_event_editor.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/calendar_event_editor.dart
@@ -187,7 +187,10 @@ class _PropertyCellState extends State<PropertyCell> {
     final gesture = GestureDetector(
       behavior: HitTestBehavior.opaque,
       onTap: () => cell.requestFocus.notify(),
-      child: AccessoryHover(child: cell),
+      child: AccessoryHover(
+        fieldType: widget.cellContext.fieldType,
+        child: cell,
+      ),
     );
 
     return Container(
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/toolbar/calendar_layout_setting.dart b/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/toolbar/calendar_layout_setting.dart
index 47e828072e72..97dc3cbef797 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/toolbar/calendar_layout_setting.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/calendar/presentation/toolbar/calendar_layout_setting.dart
@@ -228,6 +228,7 @@ class LayoutDateField extends StatelessWidget {
   Widget build(BuildContext context) {
     return AppFlowyPopover(
       direction: PopoverDirection.leftWithTopAligned,
+      triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
       constraints: BoxConstraints.loose(const Size(300, 400)),
       mutex: popoverMutex,
       offset: const Offset(-16, 0),
@@ -346,6 +347,7 @@ class FirstDayOfWeek extends StatelessWidget {
     return AppFlowyPopover(
       direction: PopoverDirection.leftWithTopAligned,
       constraints: BoxConstraints.loose(const Size(300, 400)),
+      triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
       mutex: popoverMutex,
       offset: const Offset(-16, 0),
       popupBuilder: (context) {
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/grid_page.dart b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/grid_page.dart
index 09da116783d3..defba2c6bff4 100755
--- a/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/grid_page.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/grid/presentation/grid_page.dart
@@ -389,6 +389,7 @@ class _WrapScrollView extends StatelessWidget {
       barSize: GridSize.scrollBarSize,
       autoHideScrollbar: false,
       child: StyledSingleChildScrollView(
+        autoHideScrollbar: false,
         controller: scrollController.horizontalController,
         axis: Axis.horizontal,
         child: SizedBox(
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/card/cells/checklist_card_cell.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/card/cells/checklist_card_cell.dart
index 33d607a24dd4..2d1deb00555a 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/card/cells/checklist_card_cell.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/card/cells/checklist_card_cell.dart
@@ -33,10 +33,9 @@ class _ChecklistCellState extends State<ChecklistCardCell> {
       value: _cellBloc,
       child: BlocBuilder<ChecklistCellBloc, ChecklistCellState>(
         builder: (context, state) {
-          if (state.allOptions.isEmpty) {
+          if (state.tasks.isEmpty) {
             return const SizedBox.shrink();
           }
-
           return Padding(
             padding: const EdgeInsets.symmetric(vertical: 4),
             child: ChecklistProgressBar(percent: state.percent),
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/accessory/cell_accessory.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/accessory/cell_accessory.dart
index ef46713b1281..ddf2494df140 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/accessory/cell_accessory.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/accessory/cell_accessory.dart
@@ -1,4 +1,5 @@
 import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pb.dart';
 import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra/theme_extension.dart';
 
@@ -92,7 +93,12 @@ class _PrimaryCellAccessoryState extends State<PrimaryCellAccessory>
 
 class AccessoryHover extends StatefulWidget {
   final CellAccessory child;
-  const AccessoryHover({required this.child, super.key});
+  final FieldType fieldType;
+  const AccessoryHover({
+    super.key,
+    required this.child,
+    required this.fieldType,
+  });
 
   @override
   State<AccessoryHover> createState() => _AccessoryHoverState();
@@ -106,7 +112,7 @@ class _AccessoryHoverState extends State<AccessoryHover> {
     final List<Widget> children = [
       DecoratedBox(
         decoration: BoxDecoration(
-          color: _isHover
+          color: _isHover && widget.fieldType != FieldType.Checklist
               ? AFThemeExtension.of(context).lightGreyHover
               : Colors.transparent,
           borderRadius: Corners.s6Border,
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell.dart
index 8ede7c50f95f..dce1ec7382a1 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell.dart
@@ -1,7 +1,12 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/database_view/application/cell/cell_controller_builder.dart';
 import 'package:appflowy/plugins/database_view/grid/presentation/layout/sizes.dart';
 import 'package:appflowy_popover/appflowy_popover.dart';
+import 'package:collection/collection.dart';
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flowy_infra_ui/widget/flowy_tooltip.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
@@ -11,24 +16,30 @@ import 'checklist_cell_editor.dart';
 import 'checklist_progress_bar.dart';
 
 class ChecklistCellStyle extends GridCellStyle {
-  String placeholder;
-  EdgeInsets? cellPadding;
+  final String placeholder;
+  final EdgeInsets? cellPadding;
+  final bool showTasksInline;
 
-  ChecklistCellStyle({
-    required this.placeholder,
+  const ChecklistCellStyle({
+    this.placeholder = "",
     this.cellPadding,
+    this.showTasksInline = false,
   });
 }
 
 class GridChecklistCell extends GridCellWidget {
   final CellControllerBuilder cellControllerBuilder;
-  late final ChecklistCellStyle? cellStyle;
+  late final ChecklistCellStyle cellStyle;
   GridChecklistCell({
     required this.cellControllerBuilder,
     GridCellStyle? style,
     super.key,
   }) {
-    cellStyle = style as ChecklistCellStyle?;
+    if (style != null) {
+      cellStyle = (style as ChecklistCellStyle);
+    } else {
+      cellStyle = const ChecklistCellStyle();
+    }
   }
 
   @override
@@ -38,14 +49,15 @@ class GridChecklistCell extends GridCellWidget {
 class GridChecklistCellState extends GridCellState<GridChecklistCell> {
   late ChecklistCellBloc _cellBloc;
   late final PopoverController _popover;
+  bool showIncompleteOnly = false;
 
   @override
   void initState() {
     _popover = PopoverController();
     final cellController =
         widget.cellControllerBuilder.build() as ChecklistCellController;
-    _cellBloc = ChecklistCellBloc(cellController: cellController);
-    _cellBloc.add(const ChecklistCellEvent.initial());
+    _cellBloc = ChecklistCellBloc(cellController: cellController)
+      ..add(const ChecklistCellEvent.initial());
     super.initState();
   }
 
@@ -53,44 +65,153 @@ class GridChecklistCellState extends GridCellState<GridChecklistCell> {
   Widget build(BuildContext context) {
     return BlocProvider.value(
       value: _cellBloc,
-      child: AppFlowyPopover(
-        margin: EdgeInsets.zero,
-        controller: _popover,
-        constraints: BoxConstraints.loose(const Size(360, 400)),
-        direction: PopoverDirection.bottomWithLeftAligned,
-        triggerActions: PopoverTriggerFlags.none,
-        popupBuilder: (BuildContext context) {
-          WidgetsBinding.instance.addPostFrameCallback((_) {
-            widget.onCellFocus.value = true;
-          });
-          return GridChecklistCellEditor(
-            cellController:
-                widget.cellControllerBuilder.build() as ChecklistCellController,
+      child: BlocBuilder<ChecklistCellBloc, ChecklistCellState>(
+        builder: (context, state) {
+          if (widget.cellStyle.showTasksInline) {
+            final tasks = List.from(state.tasks);
+            if (showIncompleteOnly) {
+              tasks.removeWhere((task) => task.isSelected);
+            }
+            final children = tasks
+                .mapIndexed(
+                  (index, task) => ChecklistItem(
+                    task: task,
+                    autofocus: state.newTask && index == tasks.length - 1,
+                  ),
+                )
+                .toList();
+            return Align(
+              alignment: Alignment.centerLeft,
+              child: Padding(
+                padding:
+                    widget.cellStyle.cellPadding ?? GridSize.cellContentInsets,
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Padding(
+                      padding: const EdgeInsets.only(left: 8.0),
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          Flexible(
+                            child: ChecklistProgressBar(percent: state.percent),
+                          ),
+                          const HSpace(6.0),
+                          FlowyIconButton(
+                            tooltipText: showIncompleteOnly
+                                ? LocaleKeys.grid_checklist_showComplete.tr()
+                                : LocaleKeys.grid_checklist_hideComplete.tr(),
+                            width: 32,
+                            iconColorOnHover:
+                                Theme.of(context).colorScheme.onSecondary,
+                            icon: FlowySvg(
+                              showIncompleteOnly
+                                  ? FlowySvgs.show_m
+                                  : FlowySvgs.hide_m,
+                              size: const Size.square(16),
+                            ),
+                            onPressed: () {
+                              setState(
+                                () => showIncompleteOnly = !showIncompleteOnly,
+                              );
+                            },
+                          ),
+                        ],
+                      ),
+                    ),
+                    const VSpace(4),
+                    ...children,
+                    const ChecklistItemControl(),
+                  ],
+                ),
+              ),
+            );
+          }
+
+          return AppFlowyPopover(
+            margin: EdgeInsets.zero,
+            controller: _popover,
+            constraints: BoxConstraints.loose(const Size(360, 400)),
+            direction: PopoverDirection.bottomWithLeftAligned,
+            triggerActions: PopoverTriggerFlags.none,
+            popupBuilder: (BuildContext context) {
+              WidgetsBinding.instance.addPostFrameCallback((_) {
+                widget.onCellFocus.value = true;
+              });
+              return GridChecklistCellEditor(
+                cellController: widget.cellControllerBuilder.build()
+                    as ChecklistCellController,
+              );
+            },
+            onClose: () => widget.onCellFocus.value = false,
+            child: Align(
+              alignment: Alignment.centerLeft,
+              child: Padding(
+                padding:
+                    widget.cellStyle.cellPadding ?? GridSize.cellContentInsets,
+                child: state.tasks.isEmpty
+                    ? FlowyText.medium(
+                        widget.cellStyle.placeholder,
+                        color: Theme.of(context).hintColor,
+                      )
+                    : ChecklistProgressBar(percent: state.percent),
+              ),
+            ),
           );
         },
-        onClose: () => widget.onCellFocus.value = false,
-        child: Align(
-          alignment: Alignment.centerLeft,
-          child: Padding(
-            padding:
-                widget.cellStyle?.cellPadding ?? GridSize.cellContentInsets,
-            child: BlocBuilder<ChecklistCellBloc, ChecklistCellState>(
-              builder: (context, state) {
-                if (state.allOptions.isEmpty) {
-                  return FlowyText.medium(
-                    widget.cellStyle?.placeholder ?? "",
-                    color: Theme.of(context).hintColor,
-                  );
-                }
-                return ChecklistProgressBar(percent: state.percent);
-              },
-            ),
-          ),
-        ),
       ),
     );
   }
 
   @override
-  void requestBeginFocus() => _popover.show();
+  void requestBeginFocus() {
+    if (!widget.cellStyle.showTasksInline) {
+      _popover.show();
+    }
+  }
+}
+
+class ChecklistItemControl extends StatelessWidget {
+  const ChecklistItemControl({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.fromLTRB(8.0, 4.0, 8.0, 0),
+      child: SizedBox(
+        height: 12,
+        child: GestureDetector(
+          behavior: HitTestBehavior.opaque,
+          onTap: () => context
+              .read<ChecklistCellBloc>()
+              .add(const ChecklistCellEvent.createNewTask("")),
+          child: Row(
+            children: [
+              const Flexible(child: Center(child: Divider())),
+              const HSpace(12.0),
+              FlowyTooltip(
+                message: LocaleKeys.grid_checklist_addNew.tr(),
+                child: FilledButton(
+                  style: FilledButton.styleFrom(
+                    minimumSize: const Size.square(12),
+                    maximumSize: const Size.square(12),
+                    padding: EdgeInsets.zero,
+                  ),
+                  onPressed: () => context
+                      .read<ChecklistCellBloc>()
+                      .add(const ChecklistCellEvent.createNewTask("")),
+                  child: FlowySvg(
+                    FlowySvgs.add_s,
+                    color: Theme.of(context).colorScheme.onPrimary,
+                  ),
+                ),
+              ),
+              const HSpace(12.0),
+              const Flexible(child: Center(child: Divider())),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
 }
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_bloc.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_bloc.dart
index 705557f52c56..b998b50a130c 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_bloc.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_bloc.dart
@@ -8,13 +8,20 @@ import 'package:freezed_annotation/freezed_annotation.dart';
 import 'dart:async';
 part 'checklist_cell_bloc.freezed.dart';
 
+class ChecklistSelectOption {
+  final bool isSelected;
+  final SelectOptionPB data;
+
+  ChecklistSelectOption(this.isSelected, this.data);
+}
+
 class ChecklistCellBloc extends Bloc<ChecklistCellEvent, ChecklistCellState> {
   final ChecklistCellController cellController;
-  final ChecklistCellBackendService _checklistCellSvc;
+  final ChecklistCellBackendService _checklistCellService;
   void Function()? _onCellChangedFn;
   ChecklistCellBloc({
     required this.cellController,
-  })  : _checklistCellSvc = ChecklistCellBackendService(
+  })  : _checklistCellService = ChecklistCellBackendService(
           viewId: cellController.viewId,
           fieldId: cellController.fieldId,
           rowId: cellController.rowId,
@@ -23,28 +30,43 @@ class ChecklistCellBloc extends Bloc<ChecklistCellEvent, ChecklistCellState> {
     on<ChecklistCellEvent>(
       (event, emit) async {
         await event.when(
-          initial: () async {
+          initial: () {
             _startListening();
-            _loadOptions();
           },
           didReceiveOptions: (data) {
             if (data == null) {
               emit(
                 const ChecklistCellState(
-                  allOptions: [],
-                  selectedOptions: [],
+                  tasks: [],
                   percent: 0,
+                  newTask: false,
                 ),
               );
-            } else {
-              emit(
-                state.copyWith(
-                  allOptions: data.options,
-                  selectedOptions: data.selectedOptions,
-                  percent: data.percentage,
-                ),
-              );
+              return;
             }
+
+            emit(
+              state.copyWith(
+                tasks: _makeChecklistSelectOptions(data),
+                percent: data.percentage,
+              ),
+            );
+          },
+          updateTaskName: (option, name) {
+            _updateOption(option, name);
+          },
+          selectTask: (option) async {
+            await _checklistCellService.select(optionId: option.id);
+          },
+          createNewTask: (name) async {
+            final result = await _checklistCellService.create(name: name);
+            result.fold(
+              (l) => emit(state.copyWith(newTask: true)),
+              (err) => Log.error(err),
+            );
+          },
+          deleteTask: (option) async {
+            await _deleteOption([option]);
           },
         );
       },
@@ -63,9 +85,6 @@ class ChecklistCellBloc extends Bloc<ChecklistCellEvent, ChecklistCellState> {
 
   void _startListening() {
     _onCellChangedFn = cellController.startListening(
-      onCellFieldChanged: () {
-        _loadOptions();
-      },
       onCellChanged: (data) {
         if (!isClosed) {
           add(ChecklistCellEvent.didReceiveOptions(data));
@@ -74,15 +93,18 @@ class ChecklistCellBloc extends Bloc<ChecklistCellEvent, ChecklistCellState> {
     );
   }
 
-  void _loadOptions() {
-    _checklistCellSvc.getCellData().then((result) {
-      if (isClosed) return;
+  void _updateOption(SelectOptionPB option, String name) async {
+    final result =
+        await _checklistCellService.updateName(option: option, name: name);
 
-      return result.fold(
-        (data) => add(ChecklistCellEvent.didReceiveOptions(data)),
-        (err) => Log.error(err),
-      );
-    });
+    result.fold((l) => null, (err) => Log.error(err));
+  }
+
+  Future<void> _deleteOption(List<SelectOptionPB> options) async {
+    final result = await _checklistCellService.delete(
+      optionIds: options.map((e) => e.id).toList(),
+    );
+    result.fold((l) => null, (err) => Log.error(err));
   }
 }
 
@@ -92,21 +114,53 @@ class ChecklistCellEvent with _$ChecklistCellEvent {
   const factory ChecklistCellEvent.didReceiveOptions(
     ChecklistCellDataPB? data,
   ) = _DidReceiveCellUpdate;
+  const factory ChecklistCellEvent.updateTaskName(
+    SelectOptionPB option,
+    String name,
+  ) = _UpdateTaskName;
+  const factory ChecklistCellEvent.selectTask(SelectOptionPB task) =
+      _SelectTask;
+  const factory ChecklistCellEvent.createNewTask(String description) =
+      _CreateNewTask;
+  const factory ChecklistCellEvent.deleteTask(SelectOptionPB option) =
+      _DeleteTask;
 }
 
 @freezed
 class ChecklistCellState with _$ChecklistCellState {
   const factory ChecklistCellState({
-    required List<SelectOptionPB> allOptions,
-    required List<SelectOptionPB> selectedOptions,
+    required List<ChecklistSelectOption> tasks,
     required double percent,
+    required bool newTask,
   }) = _ChecklistCellState;
 
   factory ChecklistCellState.initial(ChecklistCellController cellController) {
-    return const ChecklistCellState(
-      allOptions: [],
-      selectedOptions: [],
-      percent: 0,
+    final cellData = cellController.getCellData(loadIfNotExist: true);
+
+    return ChecklistCellState(
+      tasks: _makeChecklistSelectOptions(cellData),
+      percent: cellData?.percentage ?? 0,
+      newTask: false,
+    );
+  }
+}
+
+List<ChecklistSelectOption> _makeChecklistSelectOptions(
+  ChecklistCellDataPB? data,
+) {
+  if (data == null) {
+    return [];
+  }
+
+  final List<ChecklistSelectOption> options = [];
+  final List<SelectOptionPB> allOptions = List.from(data.options);
+  final selectedOptionIds = data.selectedOptions.map((e) => e.id).toList();
+
+  for (final option in allOptions) {
+    options.add(
+      ChecklistSelectOption(selectedOptionIds.contains(option.id), option),
     );
   }
+
+  return options;
 }
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor.dart
index f62f129d7295..fd388d93bf3d 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor.dart
@@ -14,7 +14,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
-import 'checklist_cell_editor_bloc.dart';
+import 'checklist_cell_bloc.dart';
 import 'checklist_progress_bar.dart';
 
 class GridChecklistCellEditor extends StatefulWidget {
@@ -22,12 +22,11 @@ class GridChecklistCellEditor extends StatefulWidget {
   const GridChecklistCellEditor({required this.cellController, super.key});
 
   @override
-  State<GridChecklistCellEditor> createState() =>
-      _GridChecklistCellEditorState();
+  State<GridChecklistCellEditor> createState() => _GridChecklistCellState();
 }
 
-class _GridChecklistCellEditorState extends State<GridChecklistCellEditor> {
-  late ChecklistCellEditorBloc _bloc;
+class _GridChecklistCellState extends State<GridChecklistCellEditor> {
+  late ChecklistCellBloc _bloc;
 
   /// Focus node for the new task text field
   late final FocusNode newTaskFocusNode;
@@ -45,17 +44,17 @@ class _GridChecklistCellEditorState extends State<GridChecklistCellEditor> {
         return KeyEventResult.ignored;
       },
     );
-    _bloc = ChecklistCellEditorBloc(cellController: widget.cellController)
-      ..add(const ChecklistCellEditorEvent.initial());
+    _bloc = ChecklistCellBloc(cellController: widget.cellController)
+      ..add(const ChecklistCellEvent.initial());
   }
 
   @override
   Widget build(BuildContext context) {
     return BlocProvider.value(
       value: _bloc,
-      child: BlocConsumer<ChecklistCellEditorBloc, ChecklistCellEditorState>(
+      child: BlocConsumer<ChecklistCellBloc, ChecklistCellState>(
         listener: (context, state) {
-          if (state.allOptions.isEmpty) {
+          if (state.tasks.isEmpty) {
             newTaskFocusNode.requestFocus();
           }
         },
@@ -65,7 +64,7 @@ class _GridChecklistCellEditorState extends State<GridChecklistCellEditor> {
             children: [
               AnimatedSwitcher(
                 duration: const Duration(milliseconds: 300),
-                child: state.allOptions.isEmpty
+                child: state.tasks.isEmpty
                     ? const SizedBox.shrink()
                     : Padding(
                         padding: const EdgeInsets.fromLTRB(16, 16, 16, 4),
@@ -75,10 +74,10 @@ class _GridChecklistCellEditorState extends State<GridChecklistCellEditor> {
                       ),
               ),
               ChecklistItemList(
-                options: state.allOptions,
+                options: state.tasks,
                 onUpdateTask: () => newTaskFocusNode.requestFocus(),
               ),
-              if (state.allOptions.isNotEmpty)
+              if (state.tasks.isNotEmpty)
                 const TypeOptionSeparator(spacing: 0.0),
               Padding(
                 padding: const EdgeInsets.symmetric(vertical: 8),
@@ -123,11 +122,15 @@ class _ChecklistItemListState extends State<ChecklistItemList> {
 
     final itemList = widget.options
         .mapIndexed(
-          (index, option) => ChecklistItem(
-            option: option,
-            onSubmitted:
-                index == widget.options.length - 1 ? widget.onUpdateTask : null,
-            key: ValueKey(option.data.id),
+          (index, option) => Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 8.0),
+            child: ChecklistItem(
+              task: option,
+              onSubmitted: index == widget.options.length - 1
+                  ? widget.onUpdateTask
+                  : null,
+              key: ValueKey(option.data.id),
+            ),
           ),
         )
         .toList();
@@ -147,12 +150,14 @@ class _ChecklistItemListState extends State<ChecklistItemList> {
 /// Represents an existing task
 @visibleForTesting
 class ChecklistItem extends StatefulWidget {
-  final ChecklistSelectOption option;
+  final ChecklistSelectOption task;
   final VoidCallback? onSubmitted;
+  final bool autofocus;
   const ChecklistItem({
-    required this.option,
+    required this.task,
     Key? key,
     this.onSubmitted,
+    this.autofocus = false,
   }) : super(key: key);
 
   @override
@@ -168,7 +173,7 @@ class _ChecklistItemState extends State<ChecklistItem> {
   @override
   void initState() {
     super.initState();
-    _textController = TextEditingController(text: widget.option.data.name);
+    _textController = TextEditingController(text: widget.task.data.name);
     _focusNode = FocusNode(
       onKey: (node, event) {
         if (event is RawKeyDownEvent &&
@@ -179,72 +184,83 @@ class _ChecklistItemState extends State<ChecklistItem> {
         return KeyEventResult.ignored;
       },
     );
+    if (widget.autofocus) {
+      _focusNode.requestFocus();
+    }
+  }
+
+  @override
+  void didUpdateWidget(ChecklistItem oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.task.data.name != oldWidget.task.data.name &&
+        !_focusNode.hasFocus) {
+      _textController.text = widget.task.data.name;
+    }
   }
 
   @override
   Widget build(BuildContext context) {
     final icon = FlowySvg(
-      widget.option.isSelected ? FlowySvgs.check_filled_s : FlowySvgs.uncheck_s,
+      widget.task.isSelected ? FlowySvgs.check_filled_s : FlowySvgs.uncheck_s,
       blendMode: BlendMode.dst,
     );
     return MouseRegion(
       onEnter: (event) => setState(() => _isHovered = true),
       onExit: (event) => setState(() => _isHovered = false),
       child: Container(
-        padding: const EdgeInsets.symmetric(horizontal: 8.0),
-        constraints: BoxConstraints(minHeight: GridSize.popoverItemHeight),
-        child: DecoratedBox(
-          decoration: BoxDecoration(
-            color: _isHovered
-                ? AFThemeExtension.of(context).lightGreyHover
-                : Colors.transparent,
-            borderRadius: Corners.s6Border,
-          ),
-          child: Row(
-            crossAxisAlignment: CrossAxisAlignment.center,
-            children: [
+        constraints: BoxConstraints(maxHeight: GridSize.popoverItemHeight),
+        decoration: BoxDecoration(
+          color: _isHovered
+              ? AFThemeExtension.of(context).lightGreyHover
+              : Colors.transparent,
+          borderRadius: Corners.s6Border,
+        ),
+        child: Row(
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: [
+            FlowyIconButton(
+              width: 32,
+              icon: icon,
+              hoverColor: Colors.transparent,
+              onPressed: () => context.read<ChecklistCellBloc>().add(
+                    ChecklistCellEvent.selectTask(widget.task.data),
+                  ),
+            ),
+            Expanded(
+              child: TextField(
+                controller: _textController,
+                focusNode: _focusNode,
+                style: Theme.of(context).textTheme.bodyMedium,
+                maxLines: 1,
+                decoration: InputDecoration(
+                  border: InputBorder.none,
+                  isCollapsed: true,
+                  contentPadding: EdgeInsets.only(
+                    top: 6.0,
+                    bottom: 6.0,
+                    left: 2.0,
+                    right: _isHovered ? 2.0 : 8.0,
+                  ),
+                  hintText: LocaleKeys.grid_checklist_taskHint.tr(),
+                ),
+                onChanged: _debounceOnChangedText,
+                onSubmitted: (description) {
+                  _submitUpdateTaskDescription(description);
+                  widget.onSubmitted?.call();
+                },
+              ),
+            ),
+            if (_isHovered)
               FlowyIconButton(
                 width: 32,
-                icon: icon,
+                icon: const FlowySvg(FlowySvgs.delete_s),
                 hoverColor: Colors.transparent,
-                onPressed: () => context.read<ChecklistCellEditorBloc>().add(
-                      ChecklistCellEditorEvent.selectTask(widget.option.data),
+                iconColorOnHover: Theme.of(context).colorScheme.error,
+                onPressed: () => context.read<ChecklistCellBloc>().add(
+                      ChecklistCellEvent.deleteTask(widget.task.data),
                     ),
               ),
-              Expanded(
-                child: TextField(
-                  controller: _textController,
-                  focusNode: _focusNode,
-                  style: Theme.of(context).textTheme.bodyMedium,
-                  maxLines: 1,
-                  decoration: InputDecoration(
-                    border: InputBorder.none,
-                    isCollapsed: true,
-                    contentPadding: const EdgeInsets.symmetric(
-                      vertical: 6.0,
-                      horizontal: 2.0,
-                    ),
-                    hintText: LocaleKeys.grid_checklist_taskHint.tr(),
-                  ),
-                  onChanged: _debounceOnChangedText,
-                  onSubmitted: (description) {
-                    _submitUpdateTaskDescription(description);
-                    widget.onSubmitted?.call();
-                  },
-                ),
-              ),
-              if (_isHovered)
-                FlowyIconButton(
-                  width: 32,
-                  icon: const FlowySvg(FlowySvgs.delete_s),
-                  hoverColor: Colors.transparent,
-                  iconColorOnHover: Theme.of(context).colorScheme.error,
-                  onPressed: () => context.read<ChecklistCellEditorBloc>().add(
-                        ChecklistCellEditorEvent.deleteTask(widget.option.data),
-                      ),
-                ),
-            ],
-          ),
+          ],
         ),
       ),
     );
@@ -258,10 +274,10 @@ class _ChecklistItemState extends State<ChecklistItem> {
   }
 
   void _submitUpdateTaskDescription(String description) {
-    context.read<ChecklistCellEditorBloc>().add(
-          ChecklistCellEditorEvent.updateTaskName(
-            widget.option.data,
-            description,
+    context.read<ChecklistCellBloc>().add(
+          ChecklistCellEvent.updateTaskName(
+            widget.task.data,
+            description.trim(),
           ),
         );
   }
@@ -316,8 +332,8 @@ class _NewTaskItemState extends State<NewTaskItem> {
               ),
               onSubmitted: (taskDescription) {
                 if (taskDescription.trim().isNotEmpty) {
-                  context.read<ChecklistCellEditorBloc>().add(
-                        ChecklistCellEditorEvent.newTask(
+                  context.read<ChecklistCellBloc>().add(
+                        ChecklistCellEvent.createNewTask(
                           taskDescription.trim(),
                         ),
                       );
@@ -340,11 +356,10 @@ class _NewTaskItemState extends State<NewTaskItem> {
             fontColor: Theme.of(context).colorScheme.onPrimary,
             padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
             onPressed: () {
-              if (_textEditingController.text.trim().isNotEmpty) {
-                context.read<ChecklistCellEditorBloc>().add(
-                      ChecklistCellEditorEvent.newTask(
-                        _textEditingController.text..trim(),
-                      ),
+              final text = _textEditingController.text.trim();
+              if (text.isNotEmpty) {
+                context.read<ChecklistCellBloc>().add(
+                      ChecklistCellEvent.createNewTask(text),
                     );
               }
               widget.focusNode.requestFocus();
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor_bloc.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor_bloc.dart
deleted file mode 100644
index 55185a521ceb..000000000000
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/cells/checklist_cell/checklist_cell_editor_bloc.dart
+++ /dev/null
@@ -1,176 +0,0 @@
-import 'dart:async';
-
-import 'package:appflowy/plugins/database_view/application/cell/cell_controller_builder.dart';
-import 'package:appflowy/plugins/database_view/application/cell/checklist_cell_service.dart';
-import 'package:appflowy_backend/log.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/checklist_entities.pb.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/select_option.pb.dart';
-import 'package:dartz/dartz.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:freezed_annotation/freezed_annotation.dart';
-
-part 'checklist_cell_editor_bloc.freezed.dart';
-
-class ChecklistSelectOption {
-  final bool isSelected;
-  final SelectOptionPB data;
-
-  ChecklistSelectOption(this.isSelected, this.data);
-}
-
-class ChecklistCellEditorBloc
-    extends Bloc<ChecklistCellEditorEvent, ChecklistCellEditorState> {
-  final ChecklistCellBackendService _checklistCellService;
-  final ChecklistCellController cellController;
-
-  ChecklistCellEditorBloc({
-    required this.cellController,
-  })  : _checklistCellService = ChecklistCellBackendService(
-          viewId: cellController.viewId,
-          fieldId: cellController.fieldId,
-          rowId: cellController.rowId,
-        ),
-        super(ChecklistCellEditorState.initial(cellController)) {
-    on<ChecklistCellEditorEvent>(
-      (event, emit) async {
-        await event.when(
-          initial: () async {
-            _startListening();
-            _loadOptions();
-          },
-          didReceiveTasks: (data) {
-            emit(
-              state.copyWith(
-                allOptions: _makeChecklistSelectOptions(data),
-                percent: data?.percentage ?? 0,
-              ),
-            );
-          },
-          newTask: (optionName) async {
-            await _createOption(optionName);
-            emit(
-              state.copyWith(
-                createOption: Some(optionName),
-              ),
-            );
-          },
-          deleteTask: (option) async {
-            await _deleteOption([option]);
-          },
-          updateTaskName: (option, name) {
-            _updateOption(option, name);
-          },
-          selectTask: (option) async {
-            await _checklistCellService.select(optionId: option.id);
-          },
-        );
-      },
-    );
-  }
-
-  @override
-  Future<void> close() async {
-    await cellController.dispose();
-    return super.close();
-  }
-
-  Future<void> _createOption(String name) async {
-    final result = await _checklistCellService.create(name: name);
-    result.fold((l) => {}, (err) => Log.error(err));
-  }
-
-  Future<void> _deleteOption(List<SelectOptionPB> options) async {
-    final result = await _checklistCellService.delete(
-      optionIds: options.map((e) => e.id).toList(),
-    );
-    result.fold((l) => null, (err) => Log.error(err));
-  }
-
-  void _updateOption(SelectOptionPB option, String name) async {
-    final result =
-        await _checklistCellService.updateName(option: option, name: name);
-
-    result.fold((l) => null, (err) => Log.error(err));
-  }
-
-  void _loadOptions() {
-    _checklistCellService.getCellData().then((result) {
-      if (isClosed) return;
-
-      return result.fold(
-        (data) => add(ChecklistCellEditorEvent.didReceiveTasks(data)),
-        (err) => Log.error(err),
-      );
-    });
-  }
-
-  void _startListening() {
-    cellController.startListening(
-      onCellChanged: ((data) {
-        if (!isClosed) {
-          add(ChecklistCellEditorEvent.didReceiveTasks(data));
-        }
-      }),
-      onCellFieldChanged: () {
-        _loadOptions();
-      },
-    );
-  }
-}
-
-@freezed
-class ChecklistCellEditorEvent with _$ChecklistCellEditorEvent {
-  const factory ChecklistCellEditorEvent.initial() = _Initial;
-  const factory ChecklistCellEditorEvent.didReceiveTasks(
-    ChecklistCellDataPB? data,
-  ) = _DidReceiveTasks;
-  const factory ChecklistCellEditorEvent.newTask(String taskName) = _NewOption;
-  const factory ChecklistCellEditorEvent.selectTask(
-    SelectOptionPB option,
-  ) = _SelectTask;
-  const factory ChecklistCellEditorEvent.updateTaskName(
-    SelectOptionPB option,
-    String name,
-  ) = _UpdateTaskName;
-  const factory ChecklistCellEditorEvent.deleteTask(SelectOptionPB option) =
-      _DeleteTask;
-}
-
-@freezed
-class ChecklistCellEditorState with _$ChecklistCellEditorState {
-  const factory ChecklistCellEditorState({
-    required List<ChecklistSelectOption> allOptions,
-    required Option<String> createOption,
-    required double percent,
-  }) = _ChecklistCellEditorState;
-
-  factory ChecklistCellEditorState.initial(ChecklistCellController context) {
-    final data = context.getCellData(loadIfNotExist: true);
-
-    return ChecklistCellEditorState(
-      allOptions: _makeChecklistSelectOptions(data),
-      createOption: none(),
-      percent: data?.percentage ?? 0,
-    );
-  }
-}
-
-List<ChecklistSelectOption> _makeChecklistSelectOptions(
-  ChecklistCellDataPB? data,
-) {
-  if (data == null) {
-    return [];
-  }
-
-  final List<ChecklistSelectOption> options = [];
-  final List<SelectOptionPB> allOptions = List.from(data.options);
-  final selectedOptionIds = data.selectedOptions.map((e) => e.id).toList();
-
-  for (final option in allOptions) {
-    options.add(
-      ChecklistSelectOption(selectedOptionIds.contains(option.id), option),
-    );
-  }
-
-  return options;
-}
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_property.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_property.dart
index 20a274328a0b..90099a9e71bd 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_property.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/row/row_property.dart
@@ -167,7 +167,10 @@ class _PropertyCellState extends State<_PropertyCell> {
     final gesture = GestureDetector(
       behavior: HitTestBehavior.opaque,
       onTap: () => cell.requestFocus.notify(),
-      child: AccessoryHover(child: cell),
+      child: AccessoryHover(
+        fieldType: widget.cellContext.fieldType,
+        child: cell,
+      ),
     );
 
     return Container(
@@ -271,7 +274,8 @@ GridCellStyle? _customCellStyle(FieldType fieldType) {
     case FieldType.Checklist:
       return ChecklistCellStyle(
         placeholder: LocaleKeys.grid_row_textPlaceholder.tr(),
-        cellPadding: const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
+        cellPadding: const EdgeInsets.symmetric(vertical: 6),
+        showTasksInline: true,
       );
     case FieldType.Number:
       return GridNumberCellStyle(
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/database_setting.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/database_setting.dart
deleted file mode 100644
index 8c77cbf0a678..000000000000
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/database_setting.dart
+++ /dev/null
@@ -1,75 +0,0 @@
-import 'package:appflowy/generated/flowy_svgs.g.dart';
-import 'package:appflowy/plugins/database_view/application/database_controller.dart';
-import 'package:flowy_infra/theme_extension.dart';
-import 'package:flowy_infra_ui/style_widget/button.dart';
-import 'package:flowy_infra_ui/style_widget/scrolling/styled_list.dart';
-import 'package:flowy_infra_ui/style_widget/text.dart';
-import 'package:flowy_infra_ui/widget/spacing.dart';
-import 'package:flutter/material.dart';
-
-import '../../grid/presentation/layout/sizes.dart';
-import 'setting_button.dart';
-
-class DatabaseSettingList extends StatelessWidget {
-  final DatabaseController databaseContoller;
-  final Function(DatabaseSettingAction, DatabaseController) onAction;
-  const DatabaseSettingList({
-    required this.databaseContoller,
-    required this.onAction,
-    Key? key,
-  }) : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    final cells = actionsForDatabaseLayout(databaseContoller.databaseLayout)
-        .map((action) {
-      return DatabaseSettingItem(
-        action: action,
-        onAction: (action) => onAction(action, databaseContoller),
-      );
-    }).toList();
-
-    return ListView.separated(
-      shrinkWrap: true,
-      controller: ScrollController(),
-      itemCount: cells.length,
-      separatorBuilder: (context, index) {
-        return VSpace(GridSize.typeOptionSeparatorHeight);
-      },
-      physics: StyledScrollPhysics(),
-      itemBuilder: (BuildContext context, int index) {
-        return cells[index];
-      },
-    );
-  }
-}
-
-class DatabaseSettingItem extends StatelessWidget {
-  final DatabaseSettingAction action;
-  final Function(DatabaseSettingAction) onAction;
-
-  const DatabaseSettingItem({
-    required this.action,
-    required this.onAction,
-    Key? key,
-  }) : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    return SizedBox(
-      height: GridSize.popoverItemHeight,
-      child: FlowyButton(
-        hoverColor: AFThemeExtension.of(context).lightGreyHover,
-        text: FlowyText.medium(
-          action.title(),
-          color: AFThemeExtension.of(context).textColor,
-        ),
-        onTap: () => onAction(action),
-        leftIcon: FlowySvg(
-          action.iconData(),
-          color: Theme.of(context).iconTheme.color,
-        ),
-      ),
-    );
-  }
-}
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_button.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_button.dart
index ccea4aa933b5..653aaf96f60b 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_button.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_button.dart
@@ -11,12 +11,10 @@ import 'package:flowy_infra/size.dart';
 import 'package:flowy_infra/theme_extension.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flutter/material.dart';
-import 'package:styled_widget/styled_widget.dart';
 
 import '../../grid/presentation/layout/sizes.dart';
 import '../../grid/presentation/widgets/toolbar/grid_layout.dart';
-import '../field/grid_property.dart';
-import 'database_setting.dart';
+import 'setting_property_list.dart';
 
 class SettingButton extends StatefulWidget {
   final DatabaseController databaseController;
@@ -39,7 +37,6 @@ class _SettingButtonState extends State<SettingButton> {
       constraints: BoxConstraints.loose(const Size(200, 400)),
       direction: PopoverDirection.bottomWithCenterAligned,
       offset: const Offset(0, 8),
-      margin: EdgeInsets.zero,
       triggerActions: PopoverTriggerFlags.none,
       child: FlowyTextButton(
         LocaleKeys.settings_title.tr(),
@@ -53,7 +50,7 @@ class _SettingButtonState extends State<SettingButton> {
         onPressed: () => _popoverController.show(),
       ),
       popupBuilder: (BuildContext context) {
-        return _DatabaseSettingListPopover(
+        return DatabaseSettingListPopover(
           databaseController: widget.databaseController,
         );
       },
@@ -61,10 +58,10 @@ class _SettingButtonState extends State<SettingButton> {
   }
 }
 
-class _DatabaseSettingListPopover extends StatefulWidget {
+class DatabaseSettingListPopover extends StatefulWidget {
   final DatabaseController databaseController;
 
-  const _DatabaseSettingListPopover({
+  const DatabaseSettingListPopover({
     required this.databaseController,
     Key? key,
   }) : super(key: key);
@@ -74,59 +71,40 @@ class _DatabaseSettingListPopover extends StatefulWidget {
 }
 
 class _DatabaseSettingListPopoverState
-    extends State<_DatabaseSettingListPopover> {
-  DatabaseSettingAction? _action;
+    extends State<DatabaseSettingListPopover> {
+  late final PopoverMutex popoverMutex;
+
+  @override
+  void initState() {
+    super.initState();
+    popoverMutex = PopoverMutex();
+  }
 
   @override
   Widget build(BuildContext context) {
-    if (_action == null) {
-      return DatabaseSettingList(
-        databaseContoller: widget.databaseController,
-        onAction: (action, settingContext) {
-          setState(() {
-            _action = action;
-          });
-        },
-      ).padding(all: 6.0);
-    } else {
-      switch (_action!) {
-        case DatabaseSettingAction.showLayout:
-          return DatabaseLayoutList(
-            viewId: widget.databaseController.viewId,
-            currentLayout: widget.databaseController.databaseLayout,
-          );
-        case DatabaseSettingAction.showGroup:
-          return DatabaseGroupList(
-            viewId: widget.databaseController.viewId,
-            fieldController: widget.databaseController.fieldController,
-            onDismissed: () {
-              // widget.popoverController.close();
-            },
-          );
-        case DatabaseSettingAction.showProperties:
-          return Column(
-            mainAxisSize: MainAxisSize.min,
-            children: [
-              DatabasePropertyList(
-                viewId: widget.databaseController.viewId,
-                fieldController: widget.databaseController.fieldController,
+    final cells =
+        actionsForDatabaseLayout(widget.databaseController.databaseLayout)
+            .map(
+              (action) => action.build(
+                context,
+                widget.databaseController,
+                popoverMutex,
               ),
-              FlowyText.regular(
-                LocaleKeys.grid_settings_reorderPropertiesTooltip.tr(),
-              ),
-              const VSpace(8),
-            ],
-          );
-        case DatabaseSettingAction.showCalendarLayout:
-          return CalendarLayoutSetting(
-            viewId: widget.databaseController.viewId,
-            fieldController: widget.databaseController.fieldController,
-            calendarSettingController: ICalendarSettingImpl(
-              widget.databaseController,
-            ),
-          );
-      }
-    }
+            )
+            .toList();
+
+    return ListView.separated(
+      shrinkWrap: true,
+      controller: ScrollController(),
+      itemCount: cells.length,
+      separatorBuilder: (context, index) {
+        return VSpace(GridSize.typeOptionSeparatorHeight);
+      },
+      physics: StyledScrollPhysics(),
+      itemBuilder: (BuildContext context, int index) {
+        return cells[index];
+      },
+    );
   }
 }
 
@@ -179,6 +157,58 @@ extension DatabaseSettingActionExtension on DatabaseSettingAction {
         return LocaleKeys.calendar_settings_name.tr();
     }
   }
+
+  Widget build(
+    BuildContext context,
+    DatabaseController databaseController,
+    PopoverMutex popoverMutex,
+  ) {
+    final popover = switch (this) {
+      DatabaseSettingAction.showLayout => DatabaseLayoutList(
+          viewId: databaseController.viewId,
+          currentLayout: databaseController.databaseLayout,
+        ),
+      DatabaseSettingAction.showGroup => DatabaseGroupList(
+          viewId: databaseController.viewId,
+          fieldController: databaseController.fieldController,
+          onDismissed: () {},
+        ),
+      DatabaseSettingAction.showProperties => DatabasePropertyList(
+          viewId: databaseController.viewId,
+          fieldController: databaseController.fieldController,
+        ),
+      DatabaseSettingAction.showCalendarLayout => CalendarLayoutSetting(
+          viewId: databaseController.viewId,
+          fieldController: databaseController.fieldController,
+          calendarSettingController: ICalendarSettingImpl(
+            databaseController,
+          ),
+        ),
+    };
+
+    return AppFlowyPopover(
+      triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
+      direction: PopoverDirection.leftWithTopAligned,
+      mutex: popoverMutex,
+      margin: EdgeInsets.zero,
+      offset: const Offset(-16, 0),
+      child: SizedBox(
+        height: GridSize.popoverItemHeight,
+        child: FlowyButton(
+          hoverColor: AFThemeExtension.of(context).lightGreyHover,
+          text: FlowyText.medium(
+            title(),
+            color: AFThemeExtension.of(context).textColor,
+          ),
+          leftIcon: FlowySvg(
+            iconData(),
+            color: Theme.of(context).iconTheme.color,
+          ),
+        ),
+      ),
+      popupBuilder: (context) => popover,
+    );
+  }
 }
 
 /// Returns the list of actions that should be shown for the given database layout.
diff --git a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/field/grid_property.dart b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_property_list.dart
similarity index 67%
rename from frontend/appflowy_flutter/lib/plugins/database_view/widgets/field/grid_property.dart
rename to frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_property_list.dart
index c06b9eaf1354..53e43ea4dc80 100644
--- a/frontend/appflowy_flutter/lib/plugins/database_view/widgets/field/grid_property.dart
+++ b/frontend/appflowy_flutter/lib/plugins/database_view/widgets/setting/setting_property_list.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:appflowy/generated/flowy_svgs.g.dart';
 import 'package:appflowy/plugins/database_view/application/field/field_controller.dart';
 import 'package:appflowy/plugins/database_view/application/field/field_info.dart';
@@ -7,12 +9,12 @@ import 'package:appflowy/plugins/database_view/grid/presentation/widgets/header/
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/protobuf.dart';
 import 'package:appflowy_popover/appflowy_popover.dart';
+import 'package:collection/collection.dart';
 
 import 'package:flowy_infra/theme_extension.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:reorderables/reorderables.dart';
 import 'package:styled_widget/styled_widget.dart';
 
 import '../../grid/presentation/layout/sizes.dart';
@@ -44,29 +46,43 @@ class _DatabasePropertyListState extends State<DatabasePropertyList> {
       )..add(const DatabasePropertyEvent.initial()),
       child: BlocBuilder<DatabasePropertyBloc, DatabasePropertyState>(
         builder: (context, state) {
-          final cells = state.fieldContexts.map((field) {
-            return GridPropertyCell(
+          final cells = state.fieldContexts.mapIndexed((index, field) {
+            return DatabasePropertyCell(
               key: ValueKey(field.id),
               viewId: widget.viewId,
               fieldInfo: field,
               popoverMutex: _popoverMutex,
+              index: index,
             );
           }).toList();
 
-          return ReorderableColumn(
-            needsLongPressDraggable: false,
-            buildDraggableFeedback: (context, constraints, child) =>
-                ConstrainedBox(
-              constraints: constraints,
-              child: Material(color: Colors.transparent, child: child),
-            ),
-            onReorder: (from, to) => context.read<DatabasePropertyBloc>().add(
-                  DatabasePropertyEvent.moveField(
-                    fieldId: cells[from].fieldInfo.id,
-                    fromIndex: from,
-                    toIndex: to,
+          return ReorderableListView(
+            proxyDecorator: (child, index, _) => Material(
+              color: Colors.transparent,
+              child: Stack(
+                children: [
+                  child,
+                  MouseRegion(
+                    cursor: Platform.isWindows
+                        ? SystemMouseCursors.click
+                        : SystemMouseCursors.grabbing,
+                    child: const SizedBox.expand(),
                   ),
-                ),
+                ],
+              ),
+            ),
+            buildDefaultDragHandles: false,
+            shrinkWrap: true,
+            onReorder: (from, to) {
+              context.read<DatabasePropertyBloc>().add(
+                    DatabasePropertyEvent.moveField(
+                      fieldId: cells[from].fieldInfo.id,
+                      fromIndex: from,
+                      toIndex: to,
+                    ),
+                  );
+            },
+            onReorderStart: (_) => _popoverMutex.close(),
             padding: const EdgeInsets.symmetric(vertical: 6.0),
             children: cells,
           );
@@ -77,23 +93,25 @@ class _DatabasePropertyListState extends State<DatabasePropertyList> {
 }
 
 @visibleForTesting
-class GridPropertyCell extends StatefulWidget {
+class DatabasePropertyCell extends StatefulWidget {
   final FieldInfo fieldInfo;
   final String viewId;
   final PopoverMutex popoverMutex;
+  final int index;
 
-  const GridPropertyCell({
+  const DatabasePropertyCell({
     super.key,
     required this.fieldInfo,
     required this.viewId,
     required this.popoverMutex,
+    required this.index,
   });
 
   @override
-  State<GridPropertyCell> createState() => _GridPropertyCellState();
+  State<DatabasePropertyCell> createState() => _DatabasePropertyCellState();
 }
 
-class _GridPropertyCellState extends State<GridPropertyCell> {
+class _DatabasePropertyCellState extends State<DatabasePropertyCell> {
   final PopoverController _popoverController = PopoverController();
 
   @override
@@ -109,7 +127,7 @@ class _GridPropertyCellState extends State<GridPropertyCell> {
     return AppFlowyPopover(
       mutex: widget.popoverMutex,
       controller: _popoverController,
-      offset: const Offset(8, 0),
+      offset: const Offset(-8, 0),
       direction: PopoverDirection.leftWithTopAligned,
       constraints: BoxConstraints.loose(const Size(240, 400)),
       triggerActions: PopoverTriggerFlags.none,
@@ -122,9 +140,31 @@ class _GridPropertyCellState extends State<GridPropertyCell> {
             widget.fieldInfo.name,
             color: AFThemeExtension.of(context).textColor,
           ),
-          leftIcon: FlowySvg(
-            widget.fieldInfo.fieldType.icon(),
-            color: Theme.of(context).iconTheme.color,
+          leftIconSize: const Size(36, 18),
+          leftIcon: Row(
+            children: [
+              ReorderableDragStartListener(
+                index: widget.index,
+                child: MouseRegion(
+                  cursor: Platform.isWindows
+                      ? SystemMouseCursors.click
+                      : SystemMouseCursors.grab,
+                  child: SizedBox(
+                    width: 14,
+                    height: 14,
+                    child: FlowySvg(
+                      FlowySvgs.drag_element_s,
+                      color: Theme.of(context).iconTheme.color,
+                    ),
+                  ),
+                ),
+              ),
+              const HSpace(6.0),
+              FlowySvg(
+                widget.fieldInfo.fieldType.icon(),
+                color: Theme.of(context).iconTheme.color,
+              ),
+            ],
           ),
           rightIcon: FlowyIconButton(
             hoverColor: Colors.transparent,
diff --git a/frontend/appflowy_flutter/lib/plugins/document/document_page.dart b/frontend/appflowy_flutter/lib/plugins/document/document_page.dart
index 11b7a5ff11a3..ca035dd98059 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/document_page.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/document_page.dart
@@ -106,7 +106,9 @@ class _DocumentPageState extends State<DocumentPage> {
       styleCustomizer: EditorStyleCustomizer(
         context: context,
         // the 44 is the width of the left action list
-        padding: const EdgeInsets.only(left: 40, right: 40 + 44),
+        padding: PlatformExtension.isMobile
+            ? const EdgeInsets.only(left: 20, right: 20)
+            : const EdgeInsets.only(left: 40, right: 40 + 44),
       ),
       header: _buildCoverAndIcon(context),
     );
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
index f4f82132b714..ed795ea65831 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_page.dart
@@ -1,5 +1,6 @@
 import 'package:appflowy/plugins/document/application/doc_bloc.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/background_color/theme_background_color.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/i18n/editor_i18n.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/image/custom_image_block_component.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/plugins.dart';
 import 'package:appflowy/plugins/document/presentation/editor_style.dart';
@@ -132,19 +133,23 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
         ),
       ];
 
-  late final showSlashMenu = customSlashCommand(
-    slashMenuItems,
-    shouldInsertSlash: false,
-    style: styleCustomizer.selectionMenuStyleBuilder(),
-  ).handler;
-
   EditorStyleCustomizer get styleCustomizer => widget.styleCustomizer;
   DocumentBloc get documentBloc => context.read<DocumentBloc>();
 
+  Future<bool> showSlashMenu(editorState) async {
+    final result = await customSlashCommand(
+      slashMenuItems,
+      shouldInsertSlash: false,
+      style: styleCustomizer.selectionMenuStyleBuilder(),
+    ).handler(editorState);
+    return result;
+  }
+
   @override
   void initState() {
     super.initState();
 
+    _initEditorL10n();
     _initializeShortcuts();
     indentableBlockTypes.add(ToggleListBlockKeys.type);
     convertibleBlockTypes.add(ToggleListBlockKeys.type);
@@ -196,38 +201,80 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
       scrollController: effectiveScrollController,
     );
 
-    final editor = AppFlowyEditor(
-      editorState: widget.editorState,
-      editable: true,
-      editorScrollController: editorScrollController,
-      // setup the auto focus parameters
-      autoFocus: widget.autoFocus ?? autoFocus,
-      focusedSelection: selection,
-      // setup the theme
-      editorStyle: styleCustomizer.style(),
-      // customize the block builders
-      blockComponentBuilders: blockComponentBuilders,
-      // customize the shortcuts
-      characterShortcutEvents: characterShortcutEvents,
-      commandShortcutEvents: commandShortcutEvents,
-      // customize the context menu items
-      contextMenuItems: customContextMenuItems,
-      // customize the header and footer.
-      header: widget.header,
-      footer: const VSpace(200),
+    final editor = Directionality(
+      textDirection: textDirection,
+      child: AppFlowyEditor(
+        editorState: widget.editorState,
+        editable: true,
+        editorScrollController: editorScrollController,
+        // setup the auto focus parameters
+        autoFocus: widget.autoFocus ?? autoFocus,
+        focusedSelection: selection,
+        // setup the theme
+        editorStyle: styleCustomizer.style(),
+        // customize the block builders
+        blockComponentBuilders: blockComponentBuilders,
+        // customize the shortcuts
+        characterShortcutEvents: characterShortcutEvents,
+        commandShortcutEvents: commandShortcutEvents,
+        // customize the context menu items
+        contextMenuItems: customContextMenuItems,
+        // customize the header and footer.
+        header: widget.header,
+        footer: const VSpace(200),
+      ),
     );
 
+    final editorState = widget.editorState;
+
+    if (PlatformExtension.isMobile) {
+      return Column(
+        children: [
+          Expanded(
+            child: MobileFloatingToolbar(
+              editorState: editorState,
+              editorScrollController: editorScrollController,
+              toolbarBuilder: (context, anchor) {
+                return AdaptiveTextSelectionToolbar.editable(
+                  clipboardStatus: ClipboardStatus.pasteable,
+                  onCopy: () => copyCommand.execute(editorState),
+                  onCut: () => cutCommand.execute(editorState),
+                  onPaste: () => pasteCommand.execute(editorState),
+                  onSelectAll: () => selectAllCommand.execute(editorState),
+                  anchors: TextSelectionToolbarAnchors(
+                    primaryAnchor: anchor,
+                  ),
+                );
+              },
+              child: editor,
+            ),
+          ),
+          MobileToolbar(
+            editorState: editorState,
+            toolbarItems: [
+              textDecorationMobileToolbarItem,
+              buildTextAndBackgroundColorMobileToolbarItem(),
+              headingMobileToolbarItem,
+              todoListMobileToolbarItem,
+              listMobileToolbarItem,
+              linkMobileToolbarItem,
+              quoteMobileToolbarItem,
+              dividerMobileToolbarItem,
+              codeMobileToolbarItem,
+            ],
+          ),
+        ],
+      );
+    }
+
     return Center(
       child: FloatingToolbar(
         style: styleCustomizer.floatingToolbarStyleBuilder(),
         items: toolbarItems,
-        editorState: widget.editorState,
+        editorState: editorState,
         editorScrollController: editorScrollController,
         textDirection: textDirection,
-        child: Directionality(
-          textDirection: textDirection,
-          child: editor,
-        ),
+        child: editor,
       ),
     );
   }
@@ -241,7 +288,8 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
       // OptionAction.moveDown,
     ];
 
-    final calloutBGColor = AFThemeExtension.of(context).calloutBGColor;
+    const calloutBGColor = Colors.black;
+    // AFThemeExtension.of(context).calloutBGColor;
 
     final configuration = BlockComponentConfiguration(
       padding: (_) => const EdgeInsets.symmetric(vertical: 5.0),
@@ -417,24 +465,27 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
         if (supportAlignBuilderType.contains(entry.key)) ...alignAction,
       ];
 
-      builder.showActions =
-          (node) => node.parent?.type != TableCellBlockKeys.type;
-      builder.actionBuilder = (context, state) {
-        final top = builder.configuration.padding(context.node).top;
-        final padding = context.node.type == HeadingBlockKeys.type
-            ? EdgeInsets.only(top: top + 8.0)
-            : EdgeInsets.only(top: top + 2.0);
-        return Padding(
-          padding: padding,
-          child: BlockActionList(
-            blockComponentContext: context,
-            blockComponentState: state,
-            editorState: widget.editorState,
-            actions: actions,
-            showSlashMenu: () => showSlashMenu(widget.editorState),
-          ),
-        );
-      };
+      // only show the ... and + button on the desktop platform.
+      if (PlatformExtension.isDesktop) {
+        builder.showActions =
+            (node) => node.parent?.type != TableCellBlockKeys.type;
+        builder.actionBuilder = (context, state) {
+          final top = builder.configuration.padding(context.node).top;
+          final padding = context.node.type == HeadingBlockKeys.type
+              ? EdgeInsets.only(top: top + 8.0)
+              : EdgeInsets.only(top: top + 2.0);
+          return Padding(
+            padding: padding,
+            child: BlockActionList(
+              blockComponentContext: context,
+              blockComponentState: state,
+              editorState: widget.editorState,
+              actions: actions,
+              showSlashMenu: () => showSlashMenu(widget.editorState),
+            ),
+          );
+        };
+      }
     }
 
     return builders;
@@ -443,7 +494,7 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
   List<SelectionMenuItem> _customSlashMenuItems() {
     final items = [...standardSelectionMenuItems];
     final imageItem = items.firstWhereOrNull(
-      (element) => element.name == AppFlowyEditorLocalizations.current.image,
+      (element) => element.name == AppFlowyEditorL10n.current.image,
     );
     if (imageItem != null) {
       final imageItemIndex = items.indexOf(imageItem);
@@ -574,4 +625,8 @@ class _AppFlowyEditorPageState extends State<AppFlowyEditorPage> {
       return null;
     };
   }
+
+  void _initEditorL10n() {
+    AppFlowyEditorL10n.current = EditorI18n();
+  }
 }
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/actions/option_action.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/actions/option_action.dart
index 215904790026..75fff9846c65 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/actions/option_action.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/actions/option_action.dart
@@ -259,7 +259,7 @@ class ColorOptionAction extends PopoverActionCell {
           ...FlowyTint.values.map(
             (e) => FlowyColorOption(
               color: e.color(context),
-              i18n: e.tintName(AppFlowyEditorLocalizations.current),
+              i18n: e.tintName(AppFlowyEditorL10n.current),
               id: e.id,
             ),
           ),
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_component.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_component.dart
index aed94fdf57d6..e1b12d05e2f0 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_component.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_component.dart
@@ -11,6 +11,8 @@ import 'package:highlight/highlight.dart' as highlight;
 import 'package:highlight/languages/all.dart';
 import 'package:provider/provider.dart';
 
+import 'code_block_themes.dart';
+
 class CodeBlockKeys {
   const CodeBlockKeys._();
 
@@ -234,6 +236,7 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
   }
 
   Widget _buildCodeBlock(BuildContext context, TextDirection textDirection) {
+    final isLightMode = Theme.of(context).brightness == Brightness.light;
     final delta = node.delta ?? Delta();
     final content = delta.toPlainText();
 
@@ -248,7 +251,7 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
     if (codeNodes == null) {
       throw Exception('Code block parse error.');
     }
-    final codeTextSpans = _convert(codeNodes);
+    final codeTextSpans = _convert(codeNodes, isLightMode: isLightMode);
     return Padding(
       padding: widget.padding,
       child: AppFlowyRichText(
@@ -319,11 +322,17 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
 
   // Copy from flutter.highlight package.
   // https://github.com/git-touch/highlight.dart/blob/master/flutter_highlight/lib/flutter_highlight.dart
-  List<TextSpan> _convert(List<highlight.Node> nodes) {
+  List<TextSpan> _convert(
+    List<highlight.Node> nodes, {
+    bool isLightMode = true,
+  }) {
     final List<TextSpan> spans = [];
     var currentSpans = spans;
     final List<List<TextSpan>> stack = [];
 
+    final codeblockTheme =
+        isLightMode ? lightThemeInCodeblock : darkThemeInCodeBlock;
+
     void traverse(highlight.Node node) {
       if (node.value != null) {
         currentSpans.add(
@@ -331,7 +340,7 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
               ? TextSpan(text: node.value)
               : TextSpan(
                   text: node.value,
-                  style: _builtInCodeBlockTheme[node.className!],
+                  style: codeblockTheme[node.className!],
                 ),
         );
       } else if (node.children != null) {
@@ -339,7 +348,7 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
         currentSpans.add(
           TextSpan(
             children: tmp,
-            style: _builtInCodeBlockTheme[node.className!],
+            style: codeblockTheme[node.className!],
           ),
         );
         stack.add(currentSpans);
@@ -361,46 +370,3 @@ class _CodeBlockComponentWidgetState extends State<CodeBlockComponentWidget>
     return spans;
   }
 }
-
-const _builtInCodeBlockTheme = {
-  'root':
-      TextStyle(backgroundColor: Color(0xffffffff), color: Color(0xff000000)),
-  'comment': TextStyle(color: Color(0xff007400)),
-  'quote': TextStyle(color: Color(0xff007400)),
-  'tag': TextStyle(color: Color(0xffaa0d91)),
-  'attribute': TextStyle(color: Color(0xffaa0d91)),
-  'keyword': TextStyle(color: Color(0xffaa0d91)),
-  'selector-tag': TextStyle(color: Color(0xffaa0d91)),
-  'literal': TextStyle(color: Color(0xffaa0d91)),
-  'name': TextStyle(color: Color(0xffaa0d91)),
-  'variable': TextStyle(color: Color(0xff3F6E74)),
-  'template-variable': TextStyle(color: Color(0xff3F6E74)),
-  'code': TextStyle(color: Color(0xffc41a16)),
-  'string': TextStyle(color: Color(0xffc41a16)),
-  'meta-string': TextStyle(color: Color(0xffc41a16)),
-  'regexp': TextStyle(color: Color(0xff0E0EFF)),
-  'link': TextStyle(color: Color(0xff0E0EFF)),
-  'title': TextStyle(color: Color(0xff1c00cf)),
-  'symbol': TextStyle(color: Color(0xff1c00cf)),
-  'bullet': TextStyle(color: Color(0xff1c00cf)),
-  'number': TextStyle(color: Color(0xff1c00cf)),
-  'section': TextStyle(color: Color(0xff643820)),
-  'meta': TextStyle(color: Color(0xff643820)),
-  'type': TextStyle(color: Color(0xff5c2699)),
-  'built_in': TextStyle(color: Color(0xff5c2699)),
-  'builtin-name': TextStyle(color: Color(0xff5c2699)),
-  'params': TextStyle(color: Color(0xff5c2699)),
-  'attr': TextStyle(color: Color(0xff836C28)),
-  'subst': TextStyle(color: Color(0xff000000)),
-  'formula': TextStyle(
-    backgroundColor: Color(0xffeeeeee),
-    fontStyle: FontStyle.italic,
-  ),
-  'addition': TextStyle(backgroundColor: Color(0xffbaeeba)),
-  'deletion': TextStyle(backgroundColor: Color(0xffffc8bd)),
-  'selector-id': TextStyle(color: Color(0xff9b703f)),
-  'selector-class': TextStyle(color: Color(0xff9b703f)),
-  'doctag': TextStyle(fontWeight: FontWeight.bold),
-  'strong': TextStyle(fontWeight: FontWeight.bold),
-  'emphasis': TextStyle(fontStyle: FontStyle.italic),
-};
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_themes.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_themes.dart
new file mode 100644
index 000000000000..86fa2f99feaa
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/code_block/code_block_themes.dart
@@ -0,0 +1,116 @@
+import 'package:flutter/painting.dart';
+
+const lightThemeInCodeblock = {
+  'root': TextStyle(
+    backgroundColor: Color(0xfffbf1c7),
+    color: Color(0xff3c3836),
+  ),
+  'subst': TextStyle(color: Color(0xff3c3836)),
+  'deletion': TextStyle(color: Color(0xff9d0006)),
+  'formula': TextStyle(color: Color(0xff9d0006)),
+  'keyword': TextStyle(color: Color(0xff9d0006)),
+  'link': TextStyle(color: Color(0xff9d0006)),
+  'selector-tag': TextStyle(color: Color(0xff9d0006)),
+  'built_in': TextStyle(color: Color(0xff076678)),
+  'emphasis': TextStyle(
+    color: Color(0xff076678),
+    fontStyle: FontStyle.italic,
+  ),
+  'name': TextStyle(color: Color(0xff076678)),
+  'quote': TextStyle(color: Color(0xff076678)),
+  'strong': TextStyle(
+    color: Color(0xff076678),
+    fontWeight: FontWeight.bold,
+  ),
+  'title': TextStyle(color: Color(0xff076678)),
+  'variable': TextStyle(color: Color(0xff076678)),
+  'attr': TextStyle(color: Color(0xffb57614)),
+  'params': TextStyle(color: Color(0xffb57614)),
+  'template-tag': TextStyle(color: Color(0xffb57614)),
+  'type': TextStyle(color: Color(0xffb57614)),
+  'builtin-name': TextStyle(color: Color(0xff8f3f71)),
+  'doctag': TextStyle(color: Color(0xff8f3f71)),
+  'literal': TextStyle(color: Color(0xff8f3f71)),
+  'number': TextStyle(color: Color(0xff8f3f71)),
+  'code': TextStyle(color: Color(0xffaf3a03)),
+  'meta': TextStyle(color: Color(0xffaf3a03)),
+  'regexp': TextStyle(color: Color(0xffaf3a03)),
+  'selector-id': TextStyle(color: Color(0xffaf3a03)),
+  'template-variable': TextStyle(color: Color(0xffaf3a03)),
+  'addition': TextStyle(color: Color(0xff79740e)),
+  'meta-string': TextStyle(color: Color(0xff79740e)),
+  'section': TextStyle(
+    color: Color(0xff79740e),
+    fontWeight: FontWeight.bold,
+  ),
+  'selector-attr': TextStyle(color: Color(0xff79740e)),
+  'selector-class': TextStyle(color: Color(0xff79740e)),
+  'string': TextStyle(color: Color(0xff79740e)),
+  'symbol': TextStyle(color: Color(0xff79740e)),
+  'attribute': TextStyle(color: Color(0xff427b58)),
+  'bullet': TextStyle(color: Color(0xff427b58)),
+  'class': TextStyle(color: Color(0xff427b58)),
+  'function': TextStyle(color: Color(0xff427b58)),
+  'meta-keyword': TextStyle(color: Color(0xff427b58)),
+  'selector-pseudo': TextStyle(color: Color(0xff427b58)),
+  'tag': TextStyle(
+    color: Color(0xff427b58),
+    fontWeight: FontWeight.bold,
+  ),
+  'comment': TextStyle(
+    color: Color(0xff928374),
+    fontStyle: FontStyle.italic,
+  ),
+  'link_label': TextStyle(color: Color(0xff8f3f71)),
+};
+
+const darkThemeInCodeBlock = {
+  'root': TextStyle(
+    backgroundColor: Color(0xff000000),
+    color: Color(0xfff8f8f8),
+  ),
+  'comment': TextStyle(
+    color: Color(0xffaeaeae),
+    fontStyle: FontStyle.italic,
+  ),
+  'quote': TextStyle(
+    color: Color(0xffaeaeae),
+    fontStyle: FontStyle.italic,
+  ),
+  'keyword': TextStyle(color: Color(0xffe28964)),
+  'selector-tag': TextStyle(color: Color(0xffe28964)),
+  'type': TextStyle(color: Color(0xffe28964)),
+  'string': TextStyle(color: Color(0xff65b042)),
+  'subst': TextStyle(color: Color(0xffdaefa3)),
+  'regexp': TextStyle(color: Color(0xffe9c062)),
+  'link': TextStyle(color: Color(0xffe9c062)),
+  'title': TextStyle(color: Color(0xff89bdff)),
+  'section': TextStyle(color: Color(0xff89bdff)),
+  'tag': TextStyle(color: Color(0xff89bdff)),
+  'name': TextStyle(color: Color(0xff89bdff)),
+  'symbol': TextStyle(color: Color(0xff3387cc)),
+  'bullet': TextStyle(color: Color(0xff3387cc)),
+  'number': TextStyle(color: Color(0xff3387cc)),
+  'params': TextStyle(color: Color(0xff3e87e3)),
+  'variable': TextStyle(color: Color(0xff3e87e3)),
+  'template-variable': TextStyle(color: Color(0xff3e87e3)),
+  'attribute': TextStyle(color: Color(0xffcda869)),
+  'meta': TextStyle(color: Color(0xff8996a8)),
+  'formula': TextStyle(
+    backgroundColor: Color(0xff0e2231),
+    color: Color(0xfff8f8f8),
+    fontStyle: FontStyle.italic,
+  ),
+  'addition': TextStyle(
+    backgroundColor: Color(0xff253b22),
+    color: Color(0xfff8f8f8),
+  ),
+  'deletion': TextStyle(
+    backgroundColor: Color(0xff420e09),
+    color: Color(0xfff8f8f8),
+  ),
+  'selector-class': TextStyle(color: Color(0xff9b703f)),
+  'selector-id': TextStyle(color: Color(0xff8b98ab)),
+  'emphasis': TextStyle(fontStyle: FontStyle.italic),
+  'strong': TextStyle(fontWeight: FontWeight.bold),
+};
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/header/cover_editor.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/header/cover_editor.dart
index bb7c916b90d2..db316a6d30f4 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/header/cover_editor.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/header/cover_editor.dart
@@ -284,7 +284,7 @@ class _ChangeCoverPopoverState extends State<ChangeCoverPopover> {
         .map(
           (t) => ColorOption(
             colorHex: t.color(context).toHex(),
-            name: t.tintName(AppFlowyEditorLocalizations.current),
+            name: t.tintName(AppFlowyEditorL10n.current),
           ),
         )
         .toList();
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/i18n/editor_i18n.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/i18n/editor_i18n.dart
new file mode 100644
index 000000000000..8029e2a8705b
--- /dev/null
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/i18n/editor_i18n.dart
@@ -0,0 +1,673 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy_editor/appflowy_editor.dart';
+import 'package:easy_localization/easy_localization.dart';
+
+class EditorI18n extends AppFlowyEditorL10n {
+  // static AppFlowyEditorLocalizations current = EditorI18n();
+  EditorI18n();
+
+  @override
+  String get bold {
+    return LocaleKeys.editor_bold.tr();
+  }
+
+  /// `Bulleted List`
+  @override
+  String get bulletedList {
+    return LocaleKeys.editor_bulletedList.tr();
+  }
+
+  /// `Checkbox`
+  @override
+  String get checkbox {
+    return LocaleKeys.editor_checkbox.tr();
+  }
+
+  /// `Embed Code`
+  @override
+  String get embedCode {
+    return LocaleKeys.editor_embedCode.tr();
+  }
+
+  /// `H1`
+  @override
+  String get heading1 {
+    return LocaleKeys.editor_heading1.tr();
+  }
+
+  /// `H2`
+  @override
+  String get heading2 {
+    return LocaleKeys.editor_heading2.tr();
+  }
+
+  /// `H3`
+  @override
+  String get heading3 {
+    return LocaleKeys.editor_heading3.tr();
+  }
+
+  /// `Highlight`
+  @override
+  String get highlight {
+    return LocaleKeys.editor_highlight.tr();
+  }
+
+  /// `Color`
+  @override
+  String get color {
+    return LocaleKeys.editor_color.tr();
+  }
+
+  /// `Image`
+  @override
+  String get image {
+    return LocaleKeys.editor_image.tr();
+  }
+
+  /// `Italic`
+  @override
+  String get italic {
+    return LocaleKeys.editor_italic.tr();
+  }
+
+  /// `Link`
+  @override
+  String get link {
+    return LocaleKeys.editor_link.tr();
+  }
+
+  /// `Numbered List`
+  @override
+  String get numberedList {
+    return LocaleKeys.editor_numberedList.tr();
+  }
+
+  /// `Quote`
+  @override
+  String get quote {
+    return LocaleKeys.editor_quote.tr();
+  }
+
+  /// `Strikethrough`
+  @override
+  String get strikethrough {
+    return LocaleKeys.editor_strikethrough.tr();
+  }
+
+  /// `Text`
+  @override
+  String get text {
+    return LocaleKeys.editor_text.tr();
+  }
+
+  /// `Underline`
+  @override
+  String get underline {
+    return LocaleKeys.editor_underline.tr();
+  }
+
+  /// `Default`
+  @override
+  String get fontColorDefault {
+    return LocaleKeys.editor_fontColorDefault.tr();
+  }
+
+  /// `Gray`
+  @override
+  String get fontColorGray {
+    return LocaleKeys.editor_fontColorGray.tr();
+  }
+
+  /// `Brown`
+  @override
+  String get fontColorBrown {
+    return LocaleKeys.editor_fontColorBrown.tr();
+  }
+
+  /// `Orange`
+  @override
+  String get fontColorOrange {
+    return LocaleKeys.editor_fontColorOrange.tr();
+  }
+
+  /// `Yellow`
+  @override
+  String get fontColorYellow {
+    return LocaleKeys.editor_fontColorYellow.tr();
+  }
+
+  /// `Green`
+  @override
+  String get fontColorGreen {
+    return LocaleKeys.editor_fontColorGreen.tr();
+  }
+
+  /// `Blue`
+  @override
+  String get fontColorBlue {
+    return LocaleKeys.editor_fontColorBlue.tr();
+  }
+
+  /// `Purple`
+  @override
+  String get fontColorPurple {
+    return LocaleKeys.editor_fontColorPurple.tr();
+  }
+
+  /// `Pink`
+  @override
+  String get fontColorPink {
+    return LocaleKeys.editor_fontColorPink.tr();
+  }
+
+  /// `Red`
+  @override
+  String get fontColorRed {
+    return LocaleKeys.editor_fontColorRed.tr();
+  }
+
+  /// `Default background`
+  @override
+  String get backgroundColorDefault {
+    return LocaleKeys.editor_backgroundColorDefault.tr();
+  }
+
+  /// `Gray background`
+  @override
+  String get backgroundColorGray {
+    return LocaleKeys.editor_backgroundColorGray.tr();
+  }
+
+  /// `Brown background`
+  @override
+  String get backgroundColorBrown {
+    return LocaleKeys.editor_backgroundColorBrown.tr();
+  }
+
+  /// `Orange background`
+  @override
+  String get backgroundColorOrange {
+    return LocaleKeys.editor_backgroundColorOrange.tr();
+  }
+
+  /// `Yellow background`
+  @override
+  String get backgroundColorYellow {
+    return LocaleKeys.editor_backgroundColorYellow.tr();
+  }
+
+  /// `Green background`
+  @override
+  String get backgroundColorGreen {
+    return LocaleKeys.editor_backgroundColorGreen.tr();
+  }
+
+  /// `Blue background`
+  @override
+  String get backgroundColorBlue {
+    return LocaleKeys.editor_backgroundColorBlue.tr();
+  }
+
+  /// `Purple background`
+  @override
+  String get backgroundColorPurple {
+    return LocaleKeys.editor_backgroundColorPurple.tr();
+  }
+
+  /// `Pink background`
+  @override
+  String get backgroundColorPink {
+    return LocaleKeys.editor_backgroundColorPink.tr();
+  }
+
+  /// `Red background`
+  @override
+  String get backgroundColorRed {
+    return LocaleKeys.editor_backgroundColorRed.tr();
+  }
+
+  /// `Done`
+  @override
+  String get done {
+    return LocaleKeys.editor_done.tr();
+  }
+
+  /// `Cancel`
+  @override
+  String get cancel {
+    return LocaleKeys.editor_cancel.tr();
+  }
+
+  /// `Tint 1`
+  @override
+  String get tint1 {
+    return LocaleKeys.editor_tint1.tr();
+  }
+
+  /// `Tint 2`
+  @override
+  String get tint2 {
+    return LocaleKeys.editor_tint2.tr();
+  }
+
+  /// `Tint 3`
+  @override
+  String get tint3 {
+    return LocaleKeys.editor_tint3.tr();
+  }
+
+  /// `Tint 4`
+  @override
+  String get tint4 {
+    return LocaleKeys.editor_tint4.tr();
+  }
+
+  /// `Tint 5`
+  @override
+  String get tint5 {
+    return LocaleKeys.editor_tint5.tr();
+  }
+
+  /// `Tint 6`
+  @override
+  String get tint6 {
+    return LocaleKeys.editor_tint6.tr();
+  }
+
+  /// `Tint 7`
+  @override
+  String get tint7 {
+    return LocaleKeys.editor_tint7.tr();
+  }
+
+  /// `Tint 8`
+  @override
+  String get tint8 {
+    return LocaleKeys.editor_tint8.tr();
+  }
+
+  /// `Tint 9`
+  @override
+  String get tint9 {
+    return LocaleKeys.editor_tint9.tr();
+  }
+
+  /// `Purple`
+  @override
+  String get lightLightTint1 {
+    return LocaleKeys.editor_lightLightTint1.tr();
+  }
+
+  /// `Pink`
+  @override
+  String get lightLightTint2 {
+    return LocaleKeys.editor_lightLightTint2.tr();
+  }
+
+  /// `Light Pink`
+  @override
+  String get lightLightTint3 {
+    return LocaleKeys.editor_lightLightTint3.tr();
+  }
+
+  /// `Orange`
+  @override
+  String get lightLightTint4 {
+    return LocaleKeys.editor_lightLightTint4.tr();
+  }
+
+  /// `Yellow`
+  @override
+  String get lightLightTint5 {
+    return LocaleKeys.editor_lightLightTint5.tr();
+  }
+
+  /// `Lime`
+  @override
+  String get lightLightTint6 {
+    return LocaleKeys.editor_lightLightTint6.tr();
+  }
+
+  /// `Green`
+  @override
+  String get lightLightTint7 {
+    return LocaleKeys.editor_lightLightTint7.tr();
+  }
+
+  /// `Aqua`
+  @override
+  String get lightLightTint8 {
+    return LocaleKeys.editor_lightLightTint8.tr();
+  }
+
+  /// `Blue`
+  @override
+  String get lightLightTint9 {
+    return LocaleKeys.editor_lightLightTint9.tr();
+  }
+
+  /// `URL`
+  @override
+  String get urlHint {
+    return LocaleKeys.editor_urlHint.tr();
+  }
+
+  /// `Heading 1`
+  @override
+  String get mobileHeading1 {
+    return LocaleKeys.editor_mobileHeading1.tr();
+  }
+
+  /// `Heading 2`
+  @override
+  String get mobileHeading2 {
+    return LocaleKeys.editor_mobileHeading2.tr();
+  }
+
+  /// `Heading 3`
+  @override
+  String get mobileHeading3 {
+    return LocaleKeys.editor_mobileHeading3.tr();
+  }
+
+  /// `Text Color`
+  @override
+  String get textColor {
+    return LocaleKeys.editor_textColor.tr();
+  }
+
+  /// `Background Color`
+  @override
+  String get backgroundColor {
+    return LocaleKeys.editor_backgroundColor.tr();
+  }
+
+  /// `Add your link`
+  @override
+  String get addYourLink {
+    return LocaleKeys.editor_addYourLink.tr();
+  }
+
+  /// `Open link`
+  @override
+  String get openLink {
+    return LocaleKeys.editor_openLink.tr();
+  }
+
+  /// `Copy link`
+  @override
+  String get copyLink {
+    return LocaleKeys.editor_copyLink.tr();
+  }
+
+  /// `Remove link`
+  @override
+  String get removeLink {
+    return LocaleKeys.editor_removeLink.tr();
+  }
+
+  /// `Edit link`
+  @override
+  String get editLink {
+    return LocaleKeys.editor_editLink.tr();
+  }
+
+  /// `Text`
+  @override
+  String get linkText {
+    return LocaleKeys.editor_linkText.tr();
+  }
+
+  /// `Please enter text`
+  @override
+  String get linkTextHint {
+    return LocaleKeys.editor_linkTextHint.tr();
+  }
+
+  /// `Please enter URL`
+  @override
+  String get linkAddressHint {
+    return LocaleKeys.editor_linkAddressHint.tr();
+  }
+
+  /// `Highlight color`
+  @override
+  String get highlightColor {
+    return LocaleKeys.editor_highlightColor.tr();
+  }
+
+  /// `Clear highlight color`
+  @override
+  String get clearHighlightColor {
+    return LocaleKeys.editor_clearHighlightColor.tr();
+  }
+
+  /// `Custom color`
+  @override
+  String get customColor {
+    return LocaleKeys.editor_customColor.tr();
+  }
+
+  /// `Hex value`
+  @override
+  String get hexValue {
+    return LocaleKeys.editor_hexValue.tr();
+  }
+
+  /// `Opacity`
+  @override
+  String get opacity {
+    return LocaleKeys.editor_opacity.tr();
+  }
+
+  /// `Reset to default color`
+  @override
+  String get resetToDefaultColor {
+    return LocaleKeys.editor_resetToDefaultColor.tr();
+  }
+
+  /// `LTR`
+  @override
+  String get ltr {
+    return LocaleKeys.editor_ltr.tr();
+  }
+
+  /// `RTL`
+  @override
+  String get rtl {
+    return LocaleKeys.editor_rtl.tr();
+  }
+
+  /// `Auto`
+  @override
+  String get auto {
+    return LocaleKeys.editor_auto.tr();
+  }
+
+  /// `Cut`
+  @override
+  String get cut {
+    return LocaleKeys.editor_cut.tr();
+  }
+
+  /// `Copy`
+  @override
+  String get copy {
+    return LocaleKeys.editor_copy.tr();
+  }
+
+  /// `Paste`
+  @override
+  String get paste {
+    return LocaleKeys.editor_paste.tr();
+  }
+
+  /// `Find`
+  @override
+  String get find {
+    return LocaleKeys.editor_find.tr();
+  }
+
+  /// `Previous match`
+  @override
+  String get previousMatch {
+    return LocaleKeys.editor_previousMatch.tr();
+  }
+
+  /// `Next match`
+  @override
+  String get nextMatch {
+    return LocaleKeys.editor_nextMatch.tr();
+  }
+
+  /// `Close`
+  @override
+  String get closeFind {
+    return LocaleKeys.editor_closeFind.tr();
+  }
+
+  /// `Replace`
+  @override
+  String get replace {
+    return LocaleKeys.editor_replace.tr();
+  }
+
+  /// `Replace all`
+  @override
+  String get replaceAll {
+    return LocaleKeys.editor_replaceAll.tr();
+  }
+
+  /// `Regex`
+  @override
+  String get regex {
+    return LocaleKeys.editor_regex.tr();
+  }
+
+  /// `Case sensitive`
+  @override
+  String get caseSensitive {
+    return LocaleKeys.editor_caseSensitive.tr();
+  }
+
+  /// `Upload Image`
+  @override
+  String get uploadImage {
+    return LocaleKeys.editor_uploadImage.tr();
+  }
+
+  /// `URL Image`
+  @override
+  String get urlImage {
+    return LocaleKeys.editor_urlImage.tr();
+  }
+
+  /// `Incorrect Link`
+  @override
+  String get incorrectLink {
+    return LocaleKeys.editor_incorrectLink.tr();
+  }
+
+  /// `Upload`
+  @override
+  String get upload {
+    return LocaleKeys.editor_upload.tr();
+  }
+
+  /// `Choose an image`
+  @override
+  String get chooseImage {
+    return LocaleKeys.editor_chooseImage.tr();
+  }
+
+  /// `Loading`
+  @override
+  String get loading {
+    return LocaleKeys.editor_loading.tr();
+  }
+
+  /// `Could not load the image`
+  @override
+  String get imageLoadFailed {
+    return LocaleKeys.editor_imageLoadFailed.tr();
+  }
+
+  /// `Divider`
+  @override
+  String get divider {
+    return LocaleKeys.editor_divider.tr();
+  }
+
+  /// `Table`
+  @override
+  String get table {
+    return LocaleKeys.editor_table.tr();
+  }
+
+  /// `Add before`
+  @override
+  String get colAddBefore {
+    return LocaleKeys.editor_colAddBefore.tr();
+  }
+
+  /// `Add before`
+  @override
+  String get rowAddBefore {
+    return LocaleKeys.editor_rowAddBefore.tr();
+  }
+
+  /// `Add after`
+  @override
+  String get colAddAfter {
+    return LocaleKeys.editor_colAddAfter.tr();
+  }
+
+  /// `Add after`
+  @override
+  String get rowAddAfter {
+    return LocaleKeys.editor_rowAddAfter.tr();
+  }
+
+  /// `Remove`
+  @override
+  String get colRemove {
+    return LocaleKeys.editor_colRemove.tr();
+  }
+
+  /// `Remove`
+  @override
+  String get rowRemove {
+    return LocaleKeys.editor_rowRemove.tr();
+  }
+
+  /// `Duplicate`
+  @override
+  String get colDuplicate {
+    return LocaleKeys.editor_colDuplicate.tr();
+  }
+
+  /// `Duplicate`
+  @override
+  String get rowDuplicate {
+    return LocaleKeys.editor_rowDuplicate.tr();
+  }
+
+  /// `Clear Content`
+  @override
+  String get colClear {
+    return LocaleKeys.editor_colClear.tr();
+  }
+
+  /// `Clear Content`
+  @override
+  String get rowClear {
+    return LocaleKeys.editor_rowClear.tr();
+  }
+
+  /// `Enter a / to insert a block, or start typing`
+  @override
+  String get slashPlaceHolder {
+    return LocaleKeys.editor_slashPlaceHolder.tr();
+  }
+}
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/image/image_selection_menu.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/image/image_selection_menu.dart
index ccaa14694ead..9a1d98a11eae 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/image/image_selection_menu.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/image/image_selection_menu.dart
@@ -4,7 +4,7 @@ import 'package:appflowy_editor/appflowy_editor.dart' hide Log;
 import 'package:flutter/material.dart';
 
 final customImageMenuItem = SelectionMenuItem(
-  name: AppFlowyEditorLocalizations.current.image,
+  name: AppFlowyEditorL10n.current.image,
   icon: (editorState, isSelected, style) => SelectionMenuIconWidget(
     name: 'image',
     isSelected: isSelected,
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/table/table_option_action.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/table/table_option_action.dart
index bc3529508571..c3d7cbf35be8 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/table/table_option_action.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/table/table_option_action.dart
@@ -127,7 +127,7 @@ class TableColorOptionAction extends PopoverActionCell {
           ...FlowyTint.values.map(
             (e) => FlowyColorOption(
               color: e.color(context),
-              i18n: e.tintName(AppFlowyEditorLocalizations.current),
+              i18n: e.tintName(AppFlowyEditorL10n.current),
               id: e.id,
             ),
           ),
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart
index 8e4eb9d1f124..305865a82307 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart
@@ -75,40 +75,9 @@ class EditorStyleCustomizer {
   }
 
   EditorStyle mobile() {
-    final theme = Theme.of(context);
-    final fontSize = context.read<DocumentAppearanceCubit>().state.fontSize;
-    final fontFamily = context.read<DocumentAppearanceCubit>().state.fontFamily;
-
-    return EditorStyle.desktop(
+    return EditorStyle.mobile(
       padding: padding,
-      cursorColor: theme.colorScheme.primary,
-      textStyleConfiguration: TextStyleConfiguration(
-        text: baseTextStyle(fontFamily).copyWith(
-          fontSize: fontSize,
-          color: theme.colorScheme.onBackground,
-          height: 1.5,
-        ),
-        bold: baseTextStyle(fontFamily).copyWith(
-          fontWeight: FontWeight.w600,
-        ),
-        italic: baseTextStyle(fontFamily).copyWith(fontStyle: FontStyle.italic),
-        underline: baseTextStyle(fontFamily)
-            .copyWith(decoration: TextDecoration.underline),
-        strikethrough: baseTextStyle(fontFamily)
-            .copyWith(decoration: TextDecoration.lineThrough),
-        href: baseTextStyle(fontFamily).copyWith(
-          color: theme.colorScheme.primary,
-          decoration: TextDecoration.underline,
-        ),
-        code: GoogleFonts.arefRuqaaInk(
-          textStyle: baseTextStyle(fontFamily).copyWith(
-            fontSize: fontSize,
-            fontWeight: FontWeight.normal,
-            color: Colors.red,
-            backgroundColor: theme.colorScheme.inverseSurface,
-          ),
-        ),
-      ),
+      textSpanDecorator: customizeAttributeDecorator,
     );
   }
 
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/more/font_size_switcher.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/more/font_size_switcher.dart
index 40328dc48986..fd76b579f3ad 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/more/font_size_switcher.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/more/font_size_switcher.dart
@@ -1,10 +1,13 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart';
+import 'package:collection/collection.dart';
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/theme_extension.dart';
 import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
-import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:easy_localization/easy_localization.dart';
+
+typedef _FontSizeSelection = (String, double, bool);
 
 class FontSizeSwitcher extends StatefulWidget {
   const FontSizeSwitcher({
@@ -16,12 +19,21 @@ class FontSizeSwitcher extends StatefulWidget {
 }
 
 class _FontSizeSwitcherState extends State<FontSizeSwitcher> {
-  final List<(String, double, bool)> _fontSizes = [
+  final List<_FontSizeSelection> _fontSizes = [
     (LocaleKeys.moreAction_small.tr(), 14.0, false),
     (LocaleKeys.moreAction_medium.tr(), 18.0, true),
     (LocaleKeys.moreAction_large.tr(), 22.0, false),
   ];
 
+  _FontSizeSelection? _selection;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _selection = _fontSizes.firstWhereOrNull((element) => element.$3);
+  }
+
   @override
   Widget build(BuildContext context) {
     final selectedBgColor = AFThemeExtension.of(context).toggleButtonBGColor;
@@ -39,34 +51,38 @@ class _FontSizeSwitcherState extends State<FontSizeSwitcher> {
             const SizedBox(
               height: 5,
             ),
-            ToggleButtons(
-              isSelected:
-                  _fontSizes.map((e) => e.$2 == state.fontSize).toList(),
-              onPressed: (int index) {
-                _updateSelectedFontSize(_fontSizes[index].$2);
-              },
-              color: foregroundColor,
-              borderRadius: const BorderRadius.all(Radius.circular(5)),
-              borderColor: foregroundColor,
-              borderWidth: 0.5,
-              // when selected
-              selectedColor: foregroundColor,
-              selectedBorderColor: foregroundColor,
-              fillColor: selectedBgColor,
-              // when hover
-              hoverColor: selectedBgColor.withOpacity(0.3),
-              constraints: const BoxConstraints(
-                minHeight: 40.0,
-                minWidth: 80.0,
+            SegmentedButton<_FontSizeSelection>(
+              showSelectedIcon: false,
+              style: TextButton.styleFrom(
+                foregroundColor: foregroundColor,
+                shadowColor: selectedBgColor.withOpacity(0.3),
+                padding: const EdgeInsets.all(16),
+                side: BorderSide(
+                  width: 0.5,
+                  color: foregroundColor,
+                ),
+                shape: RoundedRectangleBorder(
+                  borderRadius: BorderRadius.circular(5),
+                ),
               ),
-              children: _fontSizes
+              segments: _fontSizes
                   .map(
-                    (e) => Text(
-                      e.$1,
-                      style: TextStyle(fontSize: e.$2),
+                    (e) => ButtonSegment(
+                      value: e,
+                      label: FlowyText(
+                        e.$1,
+                        fontSize: e.$2,
+                      ),
                     ),
                   )
                   .toList(),
+              selected: {
+                _selection ?? _fontSizes.first,
+              },
+              onSelectionChanged: (Set<(String, double, bool)> newSelection) {
+                _selection = newSelection.firstOrNull;
+                _updateSelectedFontSize(newSelection.first.$2);
+              },
             ),
           ],
         );
diff --git a/frontend/appflowy_flutter/lib/plugins/document/presentation/more/more_button.dart b/frontend/appflowy_flutter/lib/plugins/document/presentation/more/more_button.dart
index 5266d3f357e3..202e820bb515 100644
--- a/frontend/appflowy_flutter/lib/plugins/document/presentation/more/more_button.dart
+++ b/frontend/appflowy_flutter/lib/plugins/document/presentation/more/more_button.dart
@@ -3,6 +3,7 @@ import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart';
 import 'package:appflowy/plugins/document/presentation/more/font_size_switcher.dart';
 import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flowy_infra_ui/widget/flowy_tooltip.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
@@ -14,21 +15,9 @@ class DocumentMoreButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return PopupMenuButton<int>(
-      color: Theme.of(context).colorScheme.surfaceVariant,
+    return AppFlowyPopover(
+      constraints: const BoxConstraints(maxWidth: 400, maxHeight: 320),
       offset: const Offset(0, 30),
-      itemBuilder: (context) {
-        return [
-          PopupMenuItem(
-            value: 1,
-            enabled: false,
-            child: BlocProvider.value(
-              value: context.read<DocumentAppearanceCubit>(),
-              child: const FontSizeSwitcher(),
-            ),
-          ),
-        ];
-      },
       child: FlowyTooltip(
         message: LocaleKeys.moreAction_moreOptions.tr(),
         child: FlowySvg(
@@ -37,6 +26,20 @@ class DocumentMoreButton extends StatelessWidget {
           color: Theme.of(context).iconTheme.color,
         ),
       ),
+      popupBuilder: (context) {
+        return Padding(
+          padding: const EdgeInsets.all(8.0),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              BlocProvider.value(
+                value: context.read<DocumentAppearanceCubit>(),
+                child: const FontSizeSwitcher(),
+              )
+            ],
+          ),
+        );
+      },
     );
   }
 }
diff --git a/frontend/appflowy_flutter/lib/startup/plugin/src/sandbox.dart b/frontend/appflowy_flutter/lib/startup/plugin/src/sandbox.dart
index a10ff9631adc..740fb3f4d2e2 100644
--- a/frontend/appflowy_flutter/lib/startup/plugin/src/sandbox.dart
+++ b/frontend/appflowy_flutter/lib/startup/plugin/src/sandbox.dart
@@ -42,10 +42,7 @@ class PluginSandbox {
     PluginConfig? config,
   }) {
     if (_pluginBuilders.containsKey(pluginType)) {
-      throw PlatformException(
-        code: '-1',
-        message: "$pluginType was registered before",
-      );
+      return;
     }
     _pluginBuilders[pluginType] = builder;
 
diff --git a/frontend/appflowy_flutter/lib/startup/tasks/app_widget.dart b/frontend/appflowy_flutter/lib/startup/tasks/app_widget.dart
index 9a0d8ef03918..6c4e555b7cd6 100644
--- a/frontend/appflowy_flutter/lib/startup/tasks/app_widget.dart
+++ b/frontend/appflowy_flutter/lib/startup/tasks/app_widget.dart
@@ -1,23 +1,20 @@
+import 'package:appflowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/user_settings_service.dart';
+import 'package:appflowy/workspace/application/notifications/notification_service.dart';
+import 'package:appflowy/workspace/application/settings/appearance/appearance_cubit.dart';
 import 'package:appflowy/workspace/application/settings/notifications/notification_settings_cubit.dart';
-
-import 'prelude.dart';
-
-import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
-
-import 'package:go_router/go_router.dart';
-import 'package:easy_localization/easy_localization.dart';
-import 'package:appflowy_editor/appflowy_editor.dart' hide Log;
 import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-user/protobuf.dart';
+import 'package:appflowy_editor/appflowy_editor.dart' hide Log;
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/theme.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:go_router/go_router.dart';
 
-import 'package:appflowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart';
-import 'package:appflowy/workspace/application/notifications/notification_service.dart';
-import 'package:appflowy/workspace/application/settings/appearance/appearance_cubit.dart';
-import 'package:appflowy/user/application/user_settings_service.dart';
-import 'package:appflowy/startup/startup.dart';
+import 'prelude.dart';
 
 class InitAppWidgetTask extends LaunchTask {
   const InitAppWidgetTask();
@@ -52,6 +49,7 @@ class InitAppWidgetTask extends LaunchTask {
       EasyLocalization(
         supportedLocales: const [
           // In alphabetical order
+          Locale('am', 'ET'),
           Locale('ar', 'SA'),
           Locale('ca', 'ES'),
           Locale('de', 'DE'),
@@ -144,8 +142,10 @@ class _ApplicationWidgetState extends State<ApplicationWidget> {
           theme: state.lightTheme,
           darkTheme: state.darkTheme,
           themeMode: state.themeMode,
-          localizationsDelegates: context.localizationDelegates +
-              [AppFlowyEditorLocalizations.delegate],
+          localizationsDelegates: [
+            ...context.localizationDelegates,
+            AppFlowyEditorLocalizations.delegate
+          ],
           supportedLocales: context.supportedLocales,
           locale: state.locale,
           routerConfig: routerConfig,
diff --git a/frontend/appflowy_flutter/lib/startup/tasks/appflowy_cloud_task.dart b/frontend/appflowy_flutter/lib/startup/tasks/appflowy_cloud_task.dart
index ca21b40c63a1..420c9d93fc20 100644
--- a/frontend/appflowy_flutter/lib/startup/tasks/appflowy_cloud_task.dart
+++ b/frontend/appflowy_flutter/lib/startup/tasks/appflowy_cloud_task.dart
@@ -2,6 +2,7 @@ import 'package:appflowy/env/env.dart';
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy/user/application/auth/auth_service.dart';
 import 'package:appflowy/user/application/user_auth_listener.dart';
+import 'package:appflowy_backend/log.dart';
 
 class InitAppFlowyCloudTask extends LaunchTask {
   final _authStateListener = UserAuthStateListener();
@@ -18,6 +19,7 @@ class InitAppFlowyCloudTask extends LaunchTask {
         isLoggingOut = false;
       },
       onInvalidAuth: (message) async {
+        Log.error(message);
         await getIt<AuthService>().signOut();
         // TODO(nathan): Show a dialog to notify the user that the session is expired.
         if (!isLoggingOut) {
diff --git a/frontend/appflowy_flutter/lib/startup/tasks/generate_router.dart b/frontend/appflowy_flutter/lib/startup/tasks/generate_router.dart
index 99d1a830b3ac..38ab60eedacc 100644
--- a/frontend/appflowy_flutter/lib/startup/tasks/generate_router.dart
+++ b/frontend/appflowy_flutter/lib/startup/tasks/generate_router.dart
@@ -1,3 +1,7 @@
+import 'package:appflowy/mobile/presentation/database/mobile_board_screen.dart';
+import 'package:appflowy/mobile/presentation/database/mobile_calendar_screen.dart';
+import 'package:appflowy/mobile/presentation/database/mobile_grid_screen.dart';
+import 'package:appflowy/mobile/presentation/favorite/mobile_favorite_page.dart';
 import 'package:appflowy/mobile/presentation/presentation.dart';
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy/startup/tasks/app_widget.dart';
@@ -25,10 +29,14 @@ GoRouter generateRouter(Widget child) {
       // Desktop only
       if (!PlatformExtension.isMobile) _desktopHomeScreenRoute(),
       // Mobile only
-      if (PlatformExtension.isMobile) _mobileHomeScreenWithNavigationBarRoute(),
+      if (PlatformExtension.isMobile) ...[
+        _mobileEditorScreenRoute(),
+        _mobileGridScreenRoute(),
+        _mobileBoardScreenRoute(),
+        _mobileCalendarScreenRoute(),
+        _mobileHomeScreenWithNavigationBarRoute(),
+      ],
 
-      // Unused routes for now, it may need to be used in the future.
-      // TODO(yijing): extract route method like other routes when it comes to be used.
       // Desktop and Mobile
       GoRoute(
         path: WorkspaceStartScreen.routeName,
@@ -77,8 +85,6 @@ StatefulShellRoute _mobileHomeScreenWithNavigationBarRoute() {
       StatefulShellBranch(
         routes: <RouteBase>[
           GoRoute(
-            // The screen to display as the root in the first tab of the
-            // bottom navigation bar.
             path: MobileHomeScreen.routeName,
             builder: (BuildContext context, GoRouterState state) {
               return const MobileHomeScreen();
@@ -86,33 +92,14 @@ StatefulShellRoute _mobileHomeScreenWithNavigationBarRoute() {
           ),
         ],
       ),
-      // TODO(yijing): implement other tabs later
-      // The following code comes from the example of StatefulShellRoute.indexedStack. I left there just for placeholder purpose. They will be updated in the future.
-      // The route branch for the second tab of the bottom navigation bar.
+
       StatefulShellBranch(
-        // It's not necessary to provide a navigatorKey if it isn't also
-        // needed elsewhere. If not provided, a default key will be used.
         routes: <RouteBase>[
           GoRoute(
-            // The screen to display as the root in the second tab of the
-            // bottom navigation bar.
-            path: '/b',
-            builder: (BuildContext context, GoRouterState state) =>
-                const RootPlaceholderScreen(
-              label: 'Favorite',
-              detailsPath: '/b/details/1',
-              secondDetailsPath: '/b/details/2',
-            ),
-            routes: <RouteBase>[
-              GoRoute(
-                path: 'details/:param',
-                builder: (BuildContext context, GoRouterState state) =>
-                    DetailsPlaceholderScreen(
-                  label: 'Favorite details',
-                  param: state.pathParameters['param'],
-                ),
-              ),
-            ],
+            path: MobileFavoriteScreen.routeName,
+            builder: (BuildContext context, GoRouterState state) {
+              return const MobileFavoriteScreen();
+            },
           ),
         ],
       ),
@@ -261,6 +248,70 @@ GoRoute _signInScreenRoute() {
   );
 }
 
+GoRoute _mobileEditorScreenRoute() {
+  return GoRoute(
+    path: MobileEditorScreen.routeName,
+    pageBuilder: (context, state) {
+      final id = state.uri.queryParameters[MobileEditorScreen.viewId]!;
+      final title = state.uri.queryParameters[MobileEditorScreen.viewTitle];
+      return MaterialPage(
+        child: MobileEditorScreen(
+          id: id,
+          title: title,
+        ),
+      );
+    },
+  );
+}
+
+GoRoute _mobileGridScreenRoute() {
+  return GoRoute(
+    path: MobileGridScreen.routeName,
+    pageBuilder: (context, state) {
+      final id = state.uri.queryParameters[MobileGridScreen.viewId]!;
+      final title = state.uri.queryParameters[MobileGridScreen.viewTitle];
+      return MaterialPage(
+        child: MobileGridScreen(
+          id: id,
+          title: title,
+        ),
+      );
+    },
+  );
+}
+
+GoRoute _mobileBoardScreenRoute() {
+  return GoRoute(
+    path: MobileBoardScreen.routeName,
+    pageBuilder: (context, state) {
+      final id = state.uri.queryParameters[MobileBoardScreen.viewId]!;
+      final title = state.uri.queryParameters[MobileBoardScreen.viewTitle];
+      return MaterialPage(
+        child: MobileBoardScreen(
+          id: id,
+          title: title,
+        ),
+      );
+    },
+  );
+}
+
+GoRoute _mobileCalendarScreenRoute() {
+  return GoRoute(
+    path: MobileCalendarScreen.routeName,
+    pageBuilder: (context, state) {
+      final id = state.uri.queryParameters[MobileCalendarScreen.viewId]!;
+      final title = state.uri.queryParameters[MobileCalendarScreen.viewTitle]!;
+      return MaterialPage(
+        child: MobileCalendarScreen(
+          id: id,
+          title: title,
+        ),
+      );
+    },
+  );
+}
+
 GoRoute _rootRoute(Widget child) {
   return GoRoute(
     path: '/',
diff --git a/frontend/appflowy_flutter/lib/user/application/user_auth_listener.dart b/frontend/appflowy_flutter/lib/user/application/user_auth_listener.dart
index c0d1231e4b2b..776d537f36af 100644
--- a/frontend/appflowy_flutter/lib/user/application/user_auth_listener.dart
+++ b/frontend/appflowy_flutter/lib/user/application/user_auth_listener.dart
@@ -53,7 +53,7 @@ class UserAuthStateListener {
                 _didSignIn?.call();
                 break;
               case AuthStatePB.InvalidAuth:
-                _onInvalidAuth?.call("");
+                _onInvalidAuth?.call(pb.message);
                 break;
               default:
                 break;
diff --git a/frontend/appflowy_flutter/lib/user/presentation/screens/splash_screen.dart b/frontend/appflowy_flutter/lib/user/presentation/screens/splash_screen.dart
index 1b53d80bdf7f..3ea6b371da81 100644
--- a/frontend/appflowy_flutter/lib/user/presentation/screens/splash_screen.dart
+++ b/frontend/appflowy_flutter/lib/user/presentation/screens/splash_screen.dart
@@ -14,16 +14,6 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:go_router/go_router.dart';
 
-// [[diagram: splash screen]]
-// ┌────────────────┐1.get user ┌──────────┐     ┌────────────┐ 2.send UserEventCheckUser
-// │  SplashScreen  │──────────▶│SplashBloc│────▶│ISplashUser │─────┐
-// └────────────────┘           └──────────┘     └────────────┘     │
-//                                                                  │
-//                                                                  ▼
-//    ┌───────────┐            ┌─────────────┐                 ┌────────┐
-//    │HomeScreen │◀───────────│BlocListener │◀────────────────│RustSDK │
-//    └───────────┘            └─────────────┘                 └────────┘
-//           4. Show HomeScreen or SignIn      3.return AuthState
 class SplashScreen extends StatelessWidget {
   /// Root Page of the app.
   const SplashScreen({
@@ -82,7 +72,7 @@ class SplashScreen extends StatelessWidget {
       (check) async {
         /// If encryption is needed, the user is navigated to the encryption screen.
         /// Otherwise, it fetches the current workspace for the user and navigates them
-        if (check.isNeedSecret) {
+        if (check.requireSecret) {
           getIt<AuthRouter>().pushEncryptionScreen(context, userProfile);
         } else {
           final result = await FolderEventGetCurrentWorkspace().send();
diff --git a/frontend/appflowy_flutter/lib/workspace/application/menu/menu_bloc.dart b/frontend/appflowy_flutter/lib/workspace/application/menu/menu_bloc.dart
index 3ad37b75007a..3ffb9a218b43 100644
--- a/frontend/appflowy_flutter/lib/workspace/application/menu/menu_bloc.dart
+++ b/frontend/appflowy_flutter/lib/workspace/application/menu/menu_bloc.dart
@@ -1,16 +1,15 @@
 import 'dart:async';
-import 'package:appflowy/startup/plugin/plugin.dart';
-import 'package:appflowy/workspace/application/view/view_ext.dart';
+
 import 'package:appflowy/workspace/application/workspace/workspace_listener.dart';
 import 'package:appflowy/workspace/application/workspace/workspace_service.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
-import 'package:dartz/dartz.dart';
 import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-error/errors.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-folder2/workspace.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-user/user_profile.pb.dart';
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:dartz/dartz.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:freezed_annotation/freezed_annotation.dart';
 
 part 'menu_bloc.freezed.dart';
 
@@ -42,7 +41,7 @@ class MenuBloc extends Bloc<MenuEvent, MenuState> {
             index: event.index,
           );
           result.fold(
-            (app) => emit(state.copyWith(plugin: app.plugin())),
+            (app) => emit(state.copyWith(lastCreatedView: app)),
             (error) {
               Log.error(error);
               emit(state.copyWith(successOrFailure: right(error)));
@@ -120,12 +119,12 @@ class MenuState with _$MenuState {
   const factory MenuState({
     required List<ViewPB> views,
     required Either<Unit, FlowyError> successOrFailure,
-    required Plugin plugin,
+    ViewPB? lastCreatedView,
   }) = _MenuState;
 
   factory MenuState.initial(WorkspacePB workspace) => MenuState(
         views: workspace.views,
         successOrFailure: left(unit),
-        plugin: makePlugin(pluginType: PluginType.blank),
+        lastCreatedView: null,
       );
 }
diff --git a/frontend/appflowy_flutter/lib/workspace/application/settings/appearance/appearance_cubit.dart b/frontend/appflowy_flutter/lib/workspace/application/settings/appearance/appearance_cubit.dart
index b97d9e062209..dd7a397f2099 100644
--- a/frontend/appflowy_flutter/lib/workspace/application/settings/appearance/appearance_cubit.dart
+++ b/frontend/appflowy_flutter/lib/workspace/application/settings/appearance/appearance_cubit.dart
@@ -3,7 +3,6 @@ import 'dart:async';
 import 'package:appflowy/user/application/user_settings_service.dart';
 import 'package:appflowy/util/platform_extension.dart';
 import 'package:appflowy/workspace/application/appearance_defaults.dart';
-import 'package:appflowy/mobile/application/mobile_theme_data.dart';
 import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-user/date_time.pbenum.dart';
 import 'package:appflowy_backend/protobuf/flowy-user/user_setting.pb.dart';
@@ -405,8 +404,190 @@ class AppearanceSettingsState with _$AppearanceSettingsState {
     if (PlatformExtension.isMobile) {
       // Mobile version has only one theme(light mode) for now.
       // The desktop theme and the mobile theme are independent.
-      final mobileThemeData = getMobileThemeData();
-      return mobileThemeData;
+      const mobileColorTheme = ColorScheme(
+        brightness: Brightness.light,
+        primary: Color(0xFF2DA2F6), //primary 100
+        onPrimary: Colors.white,
+        // TODO(yijing): add color later
+        secondary: Colors.white,
+        onSecondary: Colors.white,
+        error: Color(0xffFB006D),
+        onError: Color(0xffFB006D),
+        background: Colors.white,
+        onBackground: Color(0xff2F3030), // title text
+        outline: Color(0xffBDC0C5), //caption
+        //Snack bar
+        surface: Colors.white,
+        onSurface: Color(0xff2F3030), // title text
+      );
+      return ThemeData(
+        // color
+        primaryColor: mobileColorTheme.primary, //primary 100
+        primaryColorLight: const Color(0xFF57B5F8), //primary 80
+        dividerColor: mobileColorTheme.outline, //caption
+        scaffoldBackgroundColor: mobileColorTheme.background,
+        appBarTheme: AppBarTheme(
+          foregroundColor: mobileColorTheme.onBackground,
+          backgroundColor: mobileColorTheme.background,
+          elevation: 0,
+          centerTitle: false,
+          titleTextStyle: TextStyle(
+            fontFamily: 'Poppins',
+            color: mobileColorTheme.onBackground,
+            fontSize: 18,
+            fontWeight: FontWeight.w600,
+            letterSpacing: 0.05,
+          ),
+        ),
+        // button
+        elevatedButtonTheme: ElevatedButtonThemeData(
+          style: ButtonStyle(
+            elevation: MaterialStateProperty.all(0),
+            shadowColor: MaterialStateProperty.all(null),
+            backgroundColor: MaterialStateProperty.resolveWith<Color>(
+              (Set<MaterialState> states) {
+                if (states.contains(MaterialState.disabled)) {
+                  return const Color(0xFF57B5F8);
+                }
+                return mobileColorTheme.primary;
+              },
+            ),
+            foregroundColor: MaterialStateProperty.all(Colors.white),
+          ),
+        ),
+        outlinedButtonTheme: OutlinedButtonThemeData(
+          style: ButtonStyle(
+            foregroundColor: MaterialStateProperty.all(
+              mobileColorTheme.onBackground,
+            ),
+            backgroundColor: MaterialStateProperty.all(Colors.white),
+            shape: MaterialStateProperty.all(
+              RoundedRectangleBorder(
+                borderRadius: BorderRadius.circular(6),
+              ),
+            ),
+            side: MaterialStateProperty.all(
+              BorderSide(
+                color: mobileColorTheme.outline,
+                width: 0.5,
+              ),
+            ),
+            padding: MaterialStateProperty.all(
+              const EdgeInsets.symmetric(horizontal: 16),
+            ),
+            // splash color
+            overlayColor: MaterialStateProperty.all(
+              Colors.grey[100],
+            ),
+          ),
+        ),
+        // text
+        fontFamily: 'Poppins',
+        textTheme: const TextTheme(
+          displayLarge: TextStyle(
+            color: Color(0xFF57B5F8),
+            fontSize: 32,
+            fontWeight: FontWeight.w700,
+            height: 1.20,
+            letterSpacing: 0.16,
+          ),
+          displayMedium: TextStyle(
+            color: Color(0xff2F3030),
+            fontSize: 32,
+            fontWeight: FontWeight.w600,
+            height: 1.20,
+            letterSpacing: 0.16,
+          ),
+          // H1 Semi 26
+          displaySmall: TextStyle(
+            color: Color(0xFF2F3030),
+            fontSize: 26,
+            fontWeight: FontWeight.w600,
+            height: 1.10,
+            letterSpacing: 0.13,
+          ),
+          // body2 14 Regular
+          bodyMedium: TextStyle(
+            color: Colors.black,
+            fontSize: 14,
+            fontWeight: FontWeight.w400,
+            height: 1.20,
+            letterSpacing: 0.07,
+          ),
+          // blue text button
+          labelMedium: TextStyle(
+            color: Color(0xFF2DA2F6),
+            fontSize: 14,
+            fontWeight: FontWeight.w500,
+            height: 1.20,
+          ),
+        ),
+        inputDecorationTheme: InputDecorationTheme(
+          focusedBorder: const OutlineInputBorder(
+            borderSide: BorderSide(
+              width: 2,
+              color: Color(0xFF2DA2F6), //primary 100
+            ),
+            borderRadius: BorderRadius.all(Radius.circular(6)),
+          ),
+          focusedErrorBorder: OutlineInputBorder(
+            borderSide: BorderSide(color: mobileColorTheme.error),
+            borderRadius: const BorderRadius.all(Radius.circular(6)),
+          ),
+          errorBorder: OutlineInputBorder(
+            borderSide: BorderSide(color: mobileColorTheme.error),
+            borderRadius: const BorderRadius.all(Radius.circular(6)),
+          ),
+          enabledBorder: const OutlineInputBorder(
+            borderSide: BorderSide(
+              color: Color(0xffBDC0C5), //caption
+            ),
+            borderRadius: BorderRadius.all(Radius.circular(6)),
+          ),
+        ),
+        colorScheme: mobileColorTheme,
+        extensions: [
+          AFThemeExtension(
+            warning: theme.yellow,
+            success: theme.green,
+            tint1: theme.tint1,
+            tint2: theme.tint2,
+            tint3: theme.tint3,
+            tint4: theme.tint4,
+            tint5: theme.tint5,
+            tint6: theme.tint6,
+            tint7: theme.tint7,
+            tint8: theme.tint8,
+            tint9: theme.tint9,
+            textColor: theme.text,
+            greyHover: theme.hoverBG1,
+            greySelect: theme.bg3,
+            lightGreyHover: theme.hoverBG3,
+            toggleOffFill: theme.shader5,
+            progressBarBGColor: theme.progressBarBGColor,
+            toggleButtonBGColor: theme.toggleButtonBGColor,
+            calendarWeekendBGColor: theme.calendarWeekendBGColor,
+            gridRowCountColor: theme.gridRowCountColor,
+            code: _getFontStyle(
+              fontFamily: monospaceFontFamily,
+              fontColor: theme.shader3,
+            ),
+            callout: _getFontStyle(
+              fontFamily: fontFamily,
+              fontSize: FontSizes.s11,
+              fontColor: theme.shader3,
+            ),
+            calloutBGColor: theme.hoverBG3,
+            tableCellBGColor: theme.surface,
+            caption: _getFontStyle(
+              fontFamily: fontFamily,
+              fontSize: FontSizes.s11,
+              fontWeight: FontWeight.w400,
+              fontColor: theme.hint,
+            ),
+          ),
+        ],
+      );
     }
 
     // Due to Desktop version has multiple themes, it relies on the current theme to build the ThemeData
diff --git a/frontend/appflowy_flutter/lib/workspace/application/settings/notifications/notification_settings_cubit.dart b/frontend/appflowy_flutter/lib/workspace/application/settings/notifications/notification_settings_cubit.dart
index 75874cf432b5..b495845909b0 100644
--- a/frontend/appflowy_flutter/lib/workspace/application/settings/notifications/notification_settings_cubit.dart
+++ b/frontend/appflowy_flutter/lib/workspace/application/settings/notifications/notification_settings_cubit.dart
@@ -18,6 +18,11 @@ class NotificationSettingsCubit extends Cubit<NotificationSettingsState> {
         .getNotificationSettings()
         .then((notificationSettings) {
       _notificationSettings = notificationSettings;
+      emit(
+        state.copyWith(
+          isNotificationsEnabled: _notificationSettings.notificationsEnabled,
+        ),
+      );
       _initCompleter.complete();
     });
   }
@@ -26,13 +31,14 @@ class NotificationSettingsCubit extends Cubit<NotificationSettingsState> {
     await _initCompleter.future;
 
     _notificationSettings.notificationsEnabled = !state.isNotificationsEnabled;
-    _saveNotificationSettings();
 
     emit(
       state.copyWith(
         isNotificationsEnabled: _notificationSettings.notificationsEnabled,
       ),
     );
+
+    _saveNotificationSettings();
   }
 
   Future<void> _saveNotificationSettings() async {
diff --git a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/sidebar.dart b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/sidebar.dart
index e168394d2ece..4719ea2324f6 100644
--- a/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/sidebar.dart
+++ b/frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/sidebar.dart
@@ -1,8 +1,8 @@
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy/workspace/application/favorite/favorite_bloc.dart';
+import 'package:appflowy/workspace/application/menu/menu_bloc.dart';
 import 'package:appflowy/workspace/application/notifications/notification_action.dart';
 import 'package:appflowy/workspace/application/notifications/notification_action_bloc.dart';
-import 'package:appflowy/workspace/application/menu/menu_bloc.dart';
 import 'package:appflowy/workspace/application/panes/panes_cubit/panes_cubit.dart';
 import 'package:appflowy/workspace/application/view/view_ext.dart';
 import 'package:appflowy/workspace/presentation/home/menu/sidebar/sidebar_folder.dart';
@@ -54,50 +54,48 @@ class HomeSideBar extends StatelessWidget {
           create: (_) => FavoriteBloc()..add(const FavoriteEvent.initial()),
         )
       ],
-      child: BlocListener<MenuBloc, MenuState>(
-        listenWhen: (p, c) => p.plugin.id != c.plugin.id,
-        listener: (context, state) =>
-            context.read<PanesCubit>().openPlugin(plugin: state.plugin),
-        child: MultiBlocListener(
-          listeners: [
-            BlocListener<MenuBloc, MenuState>(
-              listenWhen: (p, c) => p.plugin.id != c.plugin.id,
-              listener: (context, state) =>
-                  context.read<PanesCubit>().openPlugin(plugin: state.plugin),
-            ),
-            BlocListener<NotificationActionBloc, NotificationActionState>(
-              listener: (context, state) {
-                final action = state.action;
-                if (action != null) {
-                  switch (action.type) {
-                    case ActionType.openView:
-                      final view =
-                          context.read<MenuBloc>().state.views.firstWhereOrNull(
-                                (view) => action.objectId == view.id,
-                              );
+      child: MultiBlocListener(
+        listeners: [
+          BlocListener<MenuBloc, MenuState>(
+            listenWhen: (p, c) =>
+                p.lastCreatedView?.id != c.lastCreatedView?.id,
+            listener: (context, state) => context.read<PanesCubit>().openPlugin(
+                  plugin: state.lastCreatedView!.plugin(),
+                ),
+          ),
+          BlocListener<NotificationActionBloc, NotificationActionState>(
+            listener: (context, state) {
+              final action = state.action;
+              if (action != null) {
+                switch (action.type) {
+                  case ActionType.openView:
+                    final view = context
+                        .read<MenuBloc>()
+                        .state
+                        .views
+                        .firstWhereOrNull((view) => action.objectId == view.id);
 
-                      if (view != null) {
-                        context
-                            .read<PanesCubit>()
-                            .openPlugin(plugin: view.plugin());
-                      }
-                  }
+                    if (view != null) {
+                      context
+                          .read<PanesCubit>()
+                          .openPlugin(plugin: view.plugin());
+                    }
                 }
-              },
-            ),
-          ],
-          child: Builder(
-            builder: (context) {
-              final menuState = context.watch<MenuBloc>().state;
-              final favoriteState = context.watch<FavoriteBloc>().state;
-
-              return _buildSidebar(
-                context,
-                menuState.views,
-                favoriteState.views,
-              );
+              }
             },
           ),
+        ],
+        child: Builder(
+          builder: (context) {
+            final menuState = context.watch<MenuBloc>().state;
+            final favoriteState = context.watch<FavoriteBloc>().state;
+
+            return _buildSidebar(
+              context,
+              menuState.views,
+              favoriteState.views,
+            );
+          },
         ),
       ),
     );
diff --git a/frontend/appflowy_flutter/packages/appflowy_backend/lib/ffi.dart b/frontend/appflowy_flutter/packages/appflowy_backend/lib/ffi.dart
index 9d4e17cca156..fef155d2cef5 100644
--- a/frontend/appflowy_flutter/packages/appflowy_backend/lib/ffi.dart
+++ b/frontend/appflowy_flutter/packages/appflowy_backend/lib/ffi.dart
@@ -20,7 +20,8 @@ DynamicLibrary _open() {
       return DynamicLibrary.open('${prefix}/libdart_ffi.so');
     if (Platform.isMacOS)
       return DynamicLibrary.open('${prefix}/libdart_ffi.dylib');
-    if (Platform.isIOS) return DynamicLibrary.open('${prefix}/libdart_ffi.a');
+    if (Platform.isIOS) 
+      return DynamicLibrary.open('${prefix}/libdart_ffi.a');
     if (Platform.isWindows)
       return DynamicLibrary.open('${prefix}/dart_ffi.dll');
   } else {
diff --git a/frontend/appflowy_flutter/packages/flowy_infra/lib/language.dart b/frontend/appflowy_flutter/packages/flowy_infra/lib/language.dart
index 97153d1d748c..08fd9ce0ead4 100644
--- a/frontend/appflowy_flutter/packages/flowy_infra/lib/language.dart
+++ b/frontend/appflowy_flutter/packages/flowy_infra/lib/language.dart
@@ -16,6 +16,8 @@ String languageFromLocale(Locale locale) {
       }
 
     // Then in alphabetical order
+    case "am":
+      return "አማርኛ";
     case "ar":
       return "العربية";
     case "ca":
@@ -64,7 +66,6 @@ String languageFromLocale(Locale locale) {
     case "hin":
       return "हिन्दी";
 
-
     // If not found then the language code will be displayed
     default:
       return locale.languageCode;
diff --git a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
index 136ff4a7435a..906058e6d1d9 100644
--- a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
+++ b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart
@@ -22,6 +22,8 @@ class FlowyButton extends StatelessWidget {
   final bool disable;
   final double disableOpacity;
   final Size? leftIconSize;
+  final bool expandText;
+  final MainAxisAlignment mainAxisAlignment;
 
   const FlowyButton({
     Key? key,
@@ -40,6 +42,8 @@ class FlowyButton extends StatelessWidget {
     this.disable = false,
     this.disableOpacity = 0.5,
     this.leftIconSize = const Size.square(16),
+    this.expandText = true,
+    this.mainAxisAlignment = MainAxisAlignment.center,
   }) : super(key: key);
 
   @override
@@ -79,7 +83,11 @@ class FlowyButton extends StatelessWidget {
       children.add(const HSpace(6));
     }
 
-    children.add(Expanded(child: text));
+    if (expandText) {
+      children.add(Expanded(child: text));
+    } else {
+      children.add(text);
+    }
 
     if (rightIcon != null) {
       children.add(const HSpace(6));
@@ -88,7 +96,7 @@ class FlowyButton extends StatelessWidget {
     }
 
     Widget child = Row(
-      mainAxisAlignment: MainAxisAlignment.center,
+      mainAxisAlignment: mainAxisAlignment,
       crossAxisAlignment: CrossAxisAlignment.center,
       children: children,
     );
diff --git a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scrollview.dart b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scrollview.dart
index 82f5c2edfd63..1b10d7335d3a 100644
--- a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scrollview.dart
+++ b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scrollview.dart
@@ -11,6 +11,7 @@ class StyledSingleChildScrollView extends StatefulWidget {
   final ScrollController? controller;
   final EdgeInsets? scrollbarPadding;
   final double barSize;
+  final bool autoHideScrollbar;
 
   final Widget? child;
 
@@ -24,6 +25,7 @@ class StyledSingleChildScrollView extends StatefulWidget {
     this.controller,
     this.scrollbarPadding,
     this.barSize = 8,
+    this.autoHideScrollbar = true,
   }) : super(key: key);
 
   @override
@@ -58,6 +60,7 @@ class StyledSingleChildScrollViewState
   @override
   Widget build(BuildContext context) {
     return ScrollbarListStack(
+      autoHideScrollbar: widget.autoHideScrollbar,
       contentSize: widget.contentSize,
       axis: widget.axis,
       controller: scrollController,
diff --git a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/text.dart b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/text.dart
index e90b45fdf8d8..849538a36bdd 100644
--- a/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/text.dart
+++ b/frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/text.dart
@@ -89,6 +89,10 @@ class FlowyText extends StatelessWidget {
         maxLines: maxLines,
         textAlign: textAlign,
         overflow: overflow ?? TextOverflow.clip,
+        textHeightBehavior: const TextHeightBehavior(
+          applyHeightToFirstAscent: false,
+          applyHeightToLastDescent: false,
+        ),
         style: Theme.of(context).textTheme.bodyMedium!.copyWith(
               fontSize: fontSize,
               fontWeight: fontWeight,
diff --git a/frontend/appflowy_flutter/pubspec.lock b/frontend/appflowy_flutter/pubspec.lock
index 819b14debb58..b1ff2a8df94a 100644
--- a/frontend/appflowy_flutter/pubspec.lock
+++ b/frontend/appflowy_flutter/pubspec.lock
@@ -54,8 +54,8 @@ packages:
     dependency: "direct main"
     description:
       path: "."
-      ref: "9ae85ea"
-      resolved-ref: "9ae85ea162606b79483c49550266c154c0cb500c"
+      ref: "6d163b8"
+      resolved-ref: "6d163b88976f6481c4eea5e91c0ed4d68378e56f"
       url: "https://github.com/AppFlowy-IO/appflowy-editor.git"
     source: git
     version: "1.4.4"
@@ -525,6 +525,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.0.15"
+  flutter_slidable:
+    dependency: "direct main"
+    description:
+      name: flutter_slidable
+      sha256: cc4231579e3eae41ae166660df717f4bad1359c87f4a4322ad8ba1befeb3d2be
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.0.0"
   flutter_svg:
     dependency: "direct main"
     description:
@@ -741,18 +749,18 @@ packages:
     dependency: transitive
     description:
       name: irondash_engine_context
-      sha256: "6431b11844472574a90803c02f1e55221e6a390a872786735f6757a67dacd678"
+      sha256: "559d4f156ba4d9a33c48185a1d7d5e887083bb601b0b130180d0aae3c1449338"
       url: "https://pub.dev"
     source: hosted
-    version: "0.3.0"
+    version: "0.4.0-dev.2"
   irondash_message_channel:
     dependency: transitive
     description:
       name: irondash_message_channel
-      sha256: "4114739083d1c63e6a1a8b93f09dd69b3cf9a9d6ee215ae7f23079307197ebba"
+      sha256: "500daa1fbe679f7d28a5258df3ff47dab6de352e680dc93c1ca9eae1555d8db5"
       url: "https://pub.dev"
     source: hosted
-    version: "0.3.0"
+    version: "0.3.1"
   isolates:
     dependency: transitive
     description:
@@ -1499,18 +1507,18 @@ packages:
     dependency: "direct main"
     description:
       name: super_clipboard
-      sha256: ba484eb42ce621b69241d18d2a8494109589e8796eb6a3399e6c8f9cdaab8303
+      sha256: "80f7f42e9778101d77e930dcd9206cf72a1d8b696b3cbc1e3f9cbeb71ac4cde7"
       url: "https://pub.dev"
     source: hosted
-    version: "0.6.3"
+    version: "0.7.0-dev.5"
   super_native_extensions:
     dependency: transitive
     description:
       name: super_native_extensions
-      sha256: dfe0a1c74430db946be973878da3f8611b8f124137f1dcbdf883e4605db40bd8
+      sha256: e3903ee807e82a930288811cf1b31a0dee30378bb544f30e3ea58d0ed2f884f2
       url: "https://pub.dev"
     source: hosted
-    version: "0.6.3"
+    version: "0.7.0-dev.5"
   sync_http:
     dependency: transitive
     description:
@@ -1745,7 +1753,7 @@ packages:
     source: hosted
     version: "1.1.7"
   vector_math:
-    dependency: transitive
+    dependency: "direct main"
     description:
       name: vector_math
       sha256: "80b3257d1492ce4d091729e3a67a60407d227c27241d6927be0130c98e741803"
diff --git a/frontend/appflowy_flutter/pubspec.yaml b/frontend/appflowy_flutter/pubspec.yaml
index 619b9b168807..4f118cfb5a65 100644
--- a/frontend/appflowy_flutter/pubspec.yaml
+++ b/frontend/appflowy_flutter/pubspec.yaml
@@ -47,7 +47,7 @@ dependencies:
   appflowy_editor:
     git:
       url: https://github.com/AppFlowy-IO/appflowy-editor.git
-      ref: "9ae85ea"
+      ref: "6d163b8"
   appflowy_popover:
     path: packages/appflowy_popover
 
@@ -106,7 +106,7 @@ dependencies:
   url_protocol:
   hive: ^2.2.3
   hive_flutter: ^1.1.0
-  super_clipboard: ^0.6.3
+  super_clipboard: ^0.7.0-dev.4
   vector_math: ^2.1.4
   go_router: ^10.1.2
   string_validator: ^1.0.0
@@ -117,6 +117,7 @@ dependencies:
   # to gather notification handling for all platforms
   local_notifier: ^0.1.5
   app_links: ^3.4.1
+  flutter_slidable: ^3.0.0
 
 dev_dependencies:
   flutter_lints: ^2.0.1
diff --git a/frontend/appflowy_tauri/src-tauri/Cargo.lock b/frontend/appflowy_tauri/src-tauri/Cargo.lock
index 6ae60b055b8a..417a4d21a4d7 100644
--- a/frontend/appflowy_tauri/src-tauri/Cargo.lock
+++ b/frontend/appflowy_tauri/src-tauri/Cargo.lock
@@ -762,7 +762,7 @@ dependencies = [
 [[package]]
 name = "client-api"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "bytes",
@@ -775,6 +775,7 @@ dependencies = [
  "gotrue-entity",
  "lib0",
  "mime",
+ "mime_guess",
  "parking_lot",
  "realtime-entity",
  "reqwest",
@@ -853,7 +854,7 @@ dependencies = [
 [[package]]
 name = "collab"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -872,7 +873,7 @@ dependencies = [
 [[package]]
 name = "collab-database"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -902,7 +903,7 @@ dependencies = [
 [[package]]
 name = "collab-derive"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -914,7 +915,7 @@ dependencies = [
 [[package]]
 name = "collab-document"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "collab",
@@ -934,7 +935,7 @@ dependencies = [
 [[package]]
 name = "collab-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "bytes",
@@ -948,7 +949,7 @@ dependencies = [
 [[package]]
 name = "collab-folder"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "chrono",
@@ -990,7 +991,7 @@ dependencies = [
 [[package]]
 name = "collab-persistence"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "async-trait",
  "bincode",
@@ -1011,7 +1012,7 @@ dependencies = [
 [[package]]
 name = "collab-plugins"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -1038,7 +1039,7 @@ dependencies = [
 [[package]]
 name = "collab-user"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "collab",
@@ -1437,15 +1438,17 @@ checksum = "c2e66c9d817f1720209181c316d28635c050fa304f9c79e47a520882661b7308"
 [[package]]
 name = "database-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "chrono",
  "collab-entity",
  "serde",
  "serde_json",
+ "serde_repr",
  "sqlx",
  "thiserror",
+ "tracing",
  "uuid",
  "validator",
 ]
@@ -2778,7 +2781,7 @@ dependencies = [
 [[package]]
 name = "gotrue"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "futures-util",
@@ -2794,9 +2797,11 @@ dependencies = [
 [[package]]
 name = "gotrue-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
+ "jsonwebtoken",
+ "lazy_static",
  "reqwest",
  "serde",
  "serde_json",
@@ -3227,7 +3232,7 @@ dependencies = [
 [[package]]
 name = "infra"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "reqwest",
@@ -3373,6 +3378,20 @@ dependencies = [
  "treediff",
 ]
 
+[[package]]
+name = "jsonwebtoken"
+version = "8.3.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6971da4d9c3aa03c3d8f3ff0f4155b534aad021292003895a469716b2a230378"
+dependencies = [
+ "base64 0.21.2",
+ "pem",
+ "ring",
+ "serde",
+ "serde_json",
+ "simple_asn1",
+]
+
 [[package]]
 name = "kuchiki"
 version = "0.8.1"
@@ -3894,6 +3913,17 @@ dependencies = [
  "winapi",
 ]
 
+[[package]]
+name = "num-bigint"
+version = "0.4.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f93ab6289c7b344a8a9f60f88d80aa20032336fe78da341afc91c8a2341fc75f"
+dependencies = [
+ "autocfg",
+ "num-integer",
+ "num-traits",
+]
+
 [[package]]
 name = "num-integer"
 version = "0.1.45"
@@ -4190,6 +4220,15 @@ version = "0.1.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "19b17cddbe7ec3f8bc800887bab5e717348c95ea2ca0b1bf0837fb964dc67099"
 
+[[package]]
+name = "pem"
+version = "1.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a8835c273a76a90455d7344889b0964598e3316e2a79ede8e36f16bdcf2228b8"
+dependencies = [
+ "base64 0.13.1",
+]
+
 [[package]]
 name = "percent-encoding"
 version = "2.3.0"
@@ -4876,7 +4915,7 @@ dependencies = [
 [[package]]
 name = "realtime-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "bytes",
  "collab",
@@ -5598,9 +5637,10 @@ dependencies = [
 [[package]]
 name = "shared_entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
+ "collab-entity",
  "database-entity",
  "gotrue-entity",
  "opener",
@@ -5653,6 +5693,18 @@ version = "2.2.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "420acb44afdae038210c99e69aae24109f32f15500aa708e81d46c9f29d55fcf"
 
+[[package]]
+name = "simple_asn1"
+version = "0.6.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "adc4e5204eb1910f40f9cfa375f6f05b68c3abac4b6fd879c8ff5e7ae8a0a085"
+dependencies = [
+ "num-bigint",
+ "num-traits",
+ "thiserror",
+ "time",
+]
+
 [[package]]
 name = "siphasher"
 version = "0.3.10"
diff --git a/frontend/appflowy_tauri/src-tauri/Cargo.toml b/frontend/appflowy_tauri/src-tauri/Cargo.toml
index fc71cc0ddd92..71833a1417fd 100644
--- a/frontend/appflowy_tauri/src-tauri/Cargo.toml
+++ b/frontend/appflowy_tauri/src-tauri/Cargo.toml
@@ -38,7 +38,7 @@ custom-protocol = ["tauri/custom-protocol"]
 # Run the script:
 # scripts/tool/update_client_api_rev.sh  new_rev_id
 # ⚠️⚠️⚠️️
-client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "52b82e68" }
+client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "141354bfa9d08c387cf9beb9697b89b052790e89" }
 # Please use the following script to update collab.
 # Working directory: frontend
 #
@@ -48,14 +48,14 @@ client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "52b
 # To switch to the local path, run:
 # scripts/tool/update_collab_source.sh
 # ⚠️⚠️⚠️️
-collab = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-folder = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-document = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-database = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-plugins = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-user = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-entity = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-persistence = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
+collab = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-folder = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-document = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-database = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-plugins = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-user = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-entity = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
+collab-persistence = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5" }
 
 
 
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/database/database_bd_svc.ts b/frontend/appflowy_tauri/src/appflowy_app/components/database/database_bd_svc.ts
index 48fed99cbefd..518a4f493dfc 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/database/database_bd_svc.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/database/database_bd_svc.ts
@@ -86,7 +86,6 @@ import {
   DatabaseEventUpdateCell,
   DatabaseEventGetSelectOptionCellData,
   DatabaseEventUpdateSelectOptionCell,
-  DatabaseEventGetChecklistCellData,
   DatabaseEventUpdateChecklistCell,
   DatabaseEventUpdateDateCell,
   DatabaseEventExportCSV,
@@ -623,18 +622,6 @@ export async function updateSelectOptionCell(
   return result.unwrap();
 }
 
-export async function getChecklistCell(viewId: string, rowId: string, fieldId: string): Promise<ChecklistCellDataPB> {
-  const payload = CellIdPB.fromObject({
-    view_id: viewId,
-    row_id: rowId,
-    field_id: fieldId,
-  });
-
-  const result = await DatabaseEventGetChecklistCellData(payload);
-
-  return result.unwrap();
-}
-
 export async function updateChecklistCell(
   viewId: string,
   rowId: string,
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/BlockSlashMenu.tsx b/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/BlockSlashMenu.tsx
index 60eef0a49006..234ff085f847 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/BlockSlashMenu.tsx
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/BlockSlashMenu.tsx
@@ -27,6 +27,7 @@ import { slashCommandActions } from '$app_reducers/document/slice';
 import { Keyboard } from '$app/constants/document/keyboard';
 import { selectOptionByUpDown } from '$app/utils/document/menu';
 import { turnToBlockThunk } from '$app_reducers/document/async-actions';
+import {useTranslation} from "react-i18next";
 
 function BlockSlashMenu({
   id,
@@ -42,6 +43,7 @@ function BlockSlashMenu({
   container: HTMLDivElement;
 }) {
   const dispatch = useAppDispatch();
+  const { t } = useTranslation()
   const ref = useRef<HTMLDivElement | null>(null);
   const { docId, controller } = useSubscribeDocument();
   const handleInsert = useCallback(
@@ -279,6 +281,12 @@ function BlockSlashMenu({
     [dispatch, docId]
   );
 
+  const renderEmptyContent = useCallback(() => {
+    return <div className={'m-5 text-text-caption flex justify-center items-center'}>
+      {t('findAndReplace.noResult')}
+    </div>
+  }, [t]);
+
   return (
     <div
       onMouseDown={(e) => {
@@ -288,7 +296,7 @@ function BlockSlashMenu({
       className={'flex h-[100%] max-h-[40vh] w-[324px] min-w-[180px] max-w-[calc(100vw-32px)] flex-col p-1'}
     >
       <div ref={ref} className={'min-h-0 flex-1 overflow-y-auto overflow-x-hidden'}>
-        {Object.entries(optionsByGroup).map(([group, options]) => (
+        {options.length === 0 ? renderEmptyContent(): Object.entries(optionsByGroup).map(([group, options]) => (
           <div key={group}>
             <div className={'px-2 py-2 text-sm text-text-caption'}>{group}</div>
             <div>
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/index.hooks.ts b/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/index.hooks.ts
index bc41b76ef02f..10fa7a0297f7 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/index.hooks.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/BlockSlash/index.hooks.ts
@@ -33,12 +33,6 @@ export function useBlockSlash() {
     setAnchorPosition(undefined);
   }, [blockId, visible]);
 
-  useEffect(() => {
-    if (!slashText) {
-      dispatch(slashCommandActions.closeSlashCommand(docId));
-    }
-  }, [dispatch, docId, slashText]);
-
   const searchText = useMemo(() => {
     if (!slashText) return '';
     if (slashText[0] !== '/') return slashText;
@@ -66,7 +60,7 @@ export function useSubscribeSlash() {
   const slashCommandState = useSubscribeSlashState();
   const visible = slashCommandState.isSlashCommand;
   const blockId = slashCommandState.blockId;
-  const { searchText } = useSubscribePanelSearchText({ blockId: '', open: visible });
+  const { searchText } = useSubscribePanelSearchText({ blockId: blockId || '', open: visible });
 
   return {
     visible,
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/TextBlock/useTurnIntoBlockEvents.ts b/frontend/appflowy_tauri/src/appflowy_app/components/document/TextBlock/useTurnIntoBlockEvents.ts
index 7b377205d61c..bb4859017e3c 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/TextBlock/useTurnIntoBlockEvents.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/TextBlock/useTurnIntoBlockEvents.ts
@@ -4,11 +4,9 @@ import { useAppDispatch } from '$app/stores/store';
 import { turnToBlockThunk } from '$app_reducers/document/async-actions';
 import { blockConfig } from '$app/constants/document/config';
 
-import Delta, { Op } from 'quill-delta';
+import Delta from 'quill-delta';
 import { useRangeRef } from '$app/components/document/_shared/SubscribeSelection.hooks';
-import { getBlock, getBlockDelta } from '$app/components/document/_shared/SubscribeNode.hooks';
-import isHotkey from 'is-hotkey';
-import { slashCommandActions } from '$app_reducers/document/slice';
+import {  getBlockDelta } from '$app/components/document/_shared/SubscribeNode.hooks';
 import { getDeltaText } from '$app/utils/document/delta';
 import { useSubscribeDocument } from '$app/components/document/_shared/SubscribeDoc.hooks';
 import { turnIntoConfig } from './shortchut';
@@ -212,26 +210,9 @@ export function useTurnIntoBlockEvents(id: string) {
 
           dispatch(turnToBlockThunk({ id, data, type: BlockType.EquationBlock, controller }));
         },
-      },
-      {
-        // Here custom slash key event for TextBlock
-        canHandle: (e: React.KeyboardEvent<HTMLDivElement>) => {
-          const flag = getFlag();
-
-          return isHotkey('/', e) && flag === '';
-        },
-        handler: (_: React.KeyboardEvent<HTMLDivElement>) => {
-          if (!controller) return;
-          dispatch(
-            slashCommandActions.openSlashCommand({
-              blockId: id,
-              docId,
-            })
-          );
-        },
-      },
+      }
     ];
-  }, [canHandle, controller, dispatch, docId, getAttrs, getDeltaContent, getFlag, id, spaceTriggerMap]);
+  }, [canHandle, controller, dispatch, getAttrs, getDeltaContent, id, spaceTriggerMap]);
 
   return turnIntoBlockEvents;
 }
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/InlineBlock/PageInline.tsx b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/InlineBlock/PageInline.tsx
index 1dcd4ac31e6a..a97726adedf4 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/InlineBlock/PageInline.tsx
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/InlineBlock/PageInline.tsx
@@ -13,9 +13,10 @@ function PageInline({ pageId }: { pageId: string }) {
   const { t } = useTranslation();
   const page = useAppSelector((state) => state.pages.pageMap[pageId]);
   const navigate = useNavigate();
-  const [currentPage, setCurrentPage] = useState<Page | null>(null);
+  const [currentPage, setCurrentPage] = useState<Page | null>(page);
   const loadPage = useCallback(async (id: string) => {
     const controller = new PageController(id);
+
     const page = await controller.getPage();
     setCurrentPage(page);
   }, []);
@@ -29,13 +30,15 @@ function PageInline({ pageId }: { pageId: string }) {
   );
 
   useEffect(() => {
-    if (page) {
+    if (!page) {
+      loadPage(pageId);
+    } else {
       setCurrentPage(page);
-      return;
     }
-    void loadPage(pageId);
+
   }, [page, loadPage, pageId]);
 
+
   return currentPage ? (
     <Tooltip arrow title={t('document.mention.page.tooltip')} placement={'top'}>
       <span
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/SubscribeNode.hooks.ts b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/SubscribeNode.hooks.ts
index f3edabedcd88..c687177c6dda 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/SubscribeNode.hooks.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/SubscribeNode.hooks.ts
@@ -18,6 +18,14 @@ export function useSubscribeNode(id: string) {
   }>((state) => {
     const documentState = state[DOCUMENT_NAME][docId];
     const node = documentState?.nodes[id];
+    // if node is root, return page name
+    if (!node?.parent) {
+      const delta = state.pages?.pageMap[docId]?.name;
+      return {
+        node,
+        delta: delta ? JSON.stringify(new Delta().insert(delta)) : '',
+      };
+    }
     const externalId = node?.externalId;
 
     return {
diff --git a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/usePanelSearchText.ts b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/usePanelSearchText.ts
index 1777423ea8bc..245041f702b9 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/usePanelSearchText.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/components/document/_shared/usePanelSearchText.ts
@@ -6,7 +6,7 @@ import { getDeltaText } from '$app/utils/document/delta';
 export function useSubscribePanelSearchText({ blockId, open }: { blockId: string; open: boolean }) {
   const [searchText, setSearchText] = useState<string>('');
   const beforeOpenDeltaRef = useRef<Op[]>([]);
-  const { delta } = useSubscribeNode(blockId);
+  const { delta: deltaStr } = useSubscribeNode(blockId);
   const handleSearch = useCallback((newDelta: Delta) => {
     const diff = new Delta(beforeOpenDeltaRef.current).diff(newDelta);
     const text = getDeltaText(diff);
@@ -15,20 +15,22 @@ export function useSubscribePanelSearchText({ blockId, open }: { blockId: string
   }, []);
 
   useEffect(() => {
-    if (!open || !delta) return;
-    handleSearch(new Delta(JSON.parse(delta)));
-  }, [handleSearch, delta, open]);
+    if (!open || !deltaStr) return;
+
+    handleSearch(new Delta(JSON.parse(deltaStr)));
+  }, [handleSearch, deltaStr, open]);
 
   useEffect(() => {
     if (!open) {
       beforeOpenDeltaRef.current = [];
       return;
     }
+    if (beforeOpenDeltaRef.current.length > 0) return;
 
-    beforeOpenDeltaRef.current = new Delta(JSON.parse(delta)).ops;
-    handleSearch(new Delta(JSON.parse(delta)));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [open]);
+    const delta = new Delta(JSON.parse(deltaStr || "{}"));
+    beforeOpenDeltaRef.current = delta.ops;
+    handleSearch(delta);
+  }, [deltaStr, handleSearch, open]);
 
   return {
     searchText,
diff --git a/frontend/appflowy_tauri/src/appflowy_app/stores/effects/workspace/page/page_controller.ts b/frontend/appflowy_tauri/src/appflowy_app/stores/effects/workspace/page/page_controller.ts
index de09500d0ccc..5bdea28e3915 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/stores/effects/workspace/page/page_controller.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/stores/effects/workspace/page/page_controller.ts
@@ -56,6 +56,7 @@ export class PageController {
   getPage = async (id?: string): Promise<Page> => {
     const result = await this.backendService.getPage(id || this.id);
 
+
     if (result.ok) {
       return parserViewPBToPage(result.val);
     }
diff --git a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/insert.ts b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/insert.ts
index fd269e4e09b1..76cdca31ba20 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/insert.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/insert.ts
@@ -34,26 +34,11 @@ export const insertAfterNodeThunk = createAsyncThunk(
     const actions = [];
     let newNodeId;
     const deltaOperator = new BlockDeltaOperator(documentState, controller);
-
-    if (defaultDelta) {
-      newNodeId = generateId();
-      actions.push(
-        ...deltaOperator.getNewTextLineActions({
-          blockId: newNodeId,
-          parentId,
-          prevId: node.id,
-          delta: defaultDelta,
-          type,
-        })
-      );
-    } else {
+    if (type === BlockType.DividerBlock) {
       const newNode = newBlock<any>(type, parentId, data);
 
       actions.push(controller.getInsertAction(newNode, node.id));
       newNodeId = newNode.id;
-    }
-
-    if (type === BlockType.DividerBlock) {
       const nodeId = generateId();
 
       actions.push(
@@ -66,6 +51,24 @@ export const insertAfterNodeThunk = createAsyncThunk(
         })
       );
       newNodeId = nodeId;
+    } else {
+      if (defaultDelta) {
+        newNodeId = generateId();
+        actions.push(
+          ...deltaOperator.getNewTextLineActions({
+            blockId: newNodeId,
+            parentId,
+            prevId: node.id,
+            delta: defaultDelta,
+            type,
+          })
+        );
+      } else {
+        const newNode = newBlock<any>(type, parentId, data);
+
+        actions.push(controller.getInsertAction(newNode, node.id));
+        newNodeId = newNode.id;
+      }
     }
 
     await controller.applyActions(actions);
diff --git a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/update.ts b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/update.ts
index 90a6cc0de0fd..72f68e1eddad 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/update.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/blocks/update.ts
@@ -8,6 +8,7 @@ import { updatePageName } from '$app_reducers/pages/async_actions';
 import { getDeltaText } from '$app/utils/document/delta';
 import { BlockDeltaOperator } from '$app/utils/document/block_delta';
 import { openMention, closeMention } from '$app_reducers/document/async-actions/mention';
+import {slashCommandActions} from "$app_reducers/document/slice";
 
 const updateNodeDeltaAfterThunk = createAsyncThunk(
   'document/updateNodeDeltaAfter',
@@ -16,7 +17,7 @@ const updateNodeDeltaAfterThunk = createAsyncThunk(
     thunkAPI
   ) => {
     const { dispatch } = thunkAPI;
-    const { docId, ops, oldDelta, newDelta } = payload;
+    const { docId, ops, oldDelta, newDelta, id } = payload;
     const insertOps = ops.filter((op) => op.insert !== undefined);
 
     const deleteOps = ops.filter((op) => op.delete !== undefined);
@@ -24,13 +25,32 @@ const updateNodeDeltaAfterThunk = createAsyncThunk(
     const newText = getDeltaText(newDelta);
     const deleteText = oldText.slice(newText.length);
 
-    if (insertOps.length === 1 && insertOps[0].insert === '@') {
-      dispatch(openMention({ docId }));
+    if (insertOps.length === 1) {
+      const char = insertOps[0].insert;
+      if (char === '@' && (oldText.endsWith(' ') || oldText === '')) {
+        dispatch(openMention({ docId }));
+      }
+      if (char === '/') {
+        dispatch(
+          slashCommandActions.openSlashCommand({
+            blockId: id,
+            docId,
+          })
+        );
+      }
     }
 
-    if (deleteOps.length === 1 && deleteText === '@') {
-      dispatch(closeMention({ docId }));
+    if (deleteOps.length === 1) {
+      if (deleteText === '@') {
+        dispatch(closeMention({ docId }));
+      }
+      if (deleteText === '/') {
+        dispatch(
+          slashCommandActions.closeSlashCommand(docId)
+        );
+      }
     }
+
   }
 );
 
@@ -44,13 +64,6 @@ export const updateNodeDeltaThunk = createAsyncThunk(
     const docState = state[DOCUMENT_NAME][docId];
     const node = docState.nodes[id];
 
-    const deltaOperator = new BlockDeltaOperator(docState, controller);
-    const oldDelta = deltaOperator.getDeltaWithBlockId(id);
-
-    if (!oldDelta) return;
-    const diff = oldDelta?.diff(newDelta);
-
-    if (ops.length === 0 || diff?.ops.length === 0) return;
     // If the node is the root node, update the page name
     if (!node.parent) {
       await dispatch(
@@ -62,7 +75,13 @@ export const updateNodeDeltaThunk = createAsyncThunk(
       return;
     }
 
-    if (!node.externalId) return;
+    const deltaOperator = new BlockDeltaOperator(docState, controller);
+    const oldDelta = deltaOperator.getDeltaWithBlockId(id);
+
+    if (!oldDelta) return;
+    const diff = oldDelta?.diff(newDelta);
+
+    if (ops.length === 0 || diff?.ops.length === 0 || !node.externalId) return;
 
     await controller.applyTextDelta(node.externalId, JSON.stringify(ops));
     await dispatch(updateNodeDeltaAfterThunk({ docId, id, ops, newDelta, oldDelta, controller }));
diff --git a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/mention.ts b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/mention.ts
index 9549da3d5cc6..4ec94ea731df 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/mention.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/mention.ts
@@ -62,24 +62,16 @@ export const formatMention = createAsyncThunk(
     const caret = rangeState.caret;
 
     if (!caret) return;
-    const index = caret.index - searchTextLength;
+    const charLength = searchTextLength + 1;
+    const index = caret.index - charLength;
 
-    const deltaOperator = new BlockDeltaOperator(documentState);
+    const deltaOperator = new BlockDeltaOperator(documentState, controller);
 
     const nodeDelta = deltaOperator.getDeltaWithBlockId(blockId);
 
     if (!nodeDelta) return;
-    const diffDelta = new Delta()
-      .retain(index)
-      .delete(searchTextLength)
-      .insert(`@`, {
-        mention: {
-          type,
-          [type]: value,
-        },
-      });
+    const diffDelta = new Delta().retain(index).delete(charLength).insert('@',{ mention: { type, [type]: value } });
     const applyTextDeltaAction = deltaOperator.getApplyDeltaAction(blockId, diffDelta);
-
     if (!applyTextDeltaAction) return;
     await controller.applyActions([applyTextDeltaAction]);
     dispatch(
diff --git a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/turn_to.ts b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/turn_to.ts
index d9eac7d3e038..bdfd1d4fde34 100644
--- a/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/turn_to.ts
+++ b/frontend/appflowy_tauri/src/appflowy_app/stores/reducers/document/async-actions/turn_to.ts
@@ -61,7 +61,7 @@ export const turnToBlockThunk = createAsyncThunk(
         parentId: parent.id,
         prevId: block.id || null,
         delta: delta ? delta : new Delta([{ insert: '' }]),
-        type,
+        type: BlockType.TextBlock,
         data,
       });
 
diff --git a/frontend/resources/flowy_icons/16x/three-dots-vertical.svg b/frontend/resources/flowy_icons/16x/three-dots-vertical.svg
new file mode 100644
index 000000000000..91b93eda223b
--- /dev/null
+++ b/frontend/resources/flowy_icons/16x/three-dots-vertical.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.26576 3.43317C9.26576 2.73334 8.69868 2.1665 7.99909 2.1665C7.29951 2.1665 6.73242 2.73334 6.73242 3.43317C6.73242 4.133 7.29951 4.69984 7.99909 4.69984C8.69868 4.69984 9.26576 4.133 9.26576 3.43317ZM9.26576 8.49984C9.26576 7.8 8.69868 7.23317 7.99909 7.23317C7.29951 7.23317 6.73242 7.8 6.73242 8.49984C6.73242 9.19967 7.29951 9.7665 7.99909 9.7665C8.69868 9.7665 9.26576 9.19967 9.26576 8.49984ZM9.26576 13.5665C9.26576 12.8667 8.69868 12.2998 7.99909 12.2998C7.29951 12.2998 6.73242 12.8667 6.73242 13.5665C6.73242 14.2663 7.29951 14.8332 7.99909 14.8332C8.69868 14.8332 9.26576 14.2663 9.26576 13.5665Z" fill="#2F3030"/>
+</svg>
diff --git a/frontend/resources/flowy_icons/24x/m_delete.svg b/frontend/resources/flowy_icons/24x/m_delete.svg
new file mode 100644
index 000000000000..9fa5510e01bc
--- /dev/null
+++ b/frontend/resources/flowy_icons/24x/m_delete.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.998 1.95312C10.893 1.95312 9.99804 2.84812 9.99804 3.95312H4.99805C4.44605 3.95312 3.99805 4.40112 3.99805 4.95312C3.99805 5.50511 4.44605 5.95311 4.99805 5.95311V17.9531C4.99805 20.1431 6.80304 21.9531 8.99804 21.9531H14.998C17.193 21.9531 18.998 20.1481 18.998 17.9531V5.95311C19.55 5.95311 19.998 5.50511 19.998 4.95312C19.998 4.40112 19.55 3.95312 18.998 3.95312H13.998C13.998 2.84812 13.103 1.95312 11.998 1.95312ZM6.99804 5.95311H16.998V17.9531C16.998 19.0501 16.108 19.9531 15.029 19.9531L8.99804 19.9221C7.89604 19.9221 6.99804 19.0321 6.99804 17.9531V5.95311ZM9.99804 7.95311C9.44604 7.95311 8.99804 8.40111 8.99804 8.9531V16.9531C8.99804 17.5051 9.44604 17.9531 9.99804 17.9531C10.55 17.9531 10.998 17.5051 10.998 16.9531V8.9531C10.998 8.40111 10.55 7.95311 9.99804 7.95311ZM13.998 7.95311C13.446 7.95311 12.998 8.40111 12.998 8.9531V16.9531C12.998 17.5051 13.446 17.9531 13.998 17.9531C14.55 17.9531 14.998 17.5051 14.998 16.9531V8.9531C14.998 8.40111 14.55 7.95311 13.998 7.95311Z" fill="#FB006D"/>
+</svg>
diff --git a/frontend/resources/flowy_icons/24x/m_duplicate.svg b/frontend/resources/flowy_icons/24x/m_duplicate.svg
new file mode 100644
index 000000000000..dc843ae000d0
--- /dev/null
+++ b/frontend/resources/flowy_icons/24x/m_duplicate.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.99805 2.01416C6.43705 2.01416 2.99805 5.41996 2.99805 8.98296C2.99805 8.99326 2.99805 9.00376 2.99805 9.01416C2.99805 11.4742 2.99805 14.4105 2.99805 14.6704C2.99805 16.5342 4.60906 18.0142 6.56006 18.0142H6.99805V18.6704C6.99805 20.5342 8.60906 22.0142 10.5601 22.0142H17.436C19.387 22.0142 20.998 20.5342 20.998 18.6704V9.35796C20.998 7.49416 19.387 6.01416 17.436 6.01416H16.998V5.35796C16.998 3.49416 15.387 2.01416 13.436 2.01416C13.222 2.01416 13.212 2.01416 9.99805 2.01416ZM10.998 4.01416C12.16 4.01416 13.284 4.01416 13.436 4.01416C14.324 4.01416 14.998 4.64436 14.998 5.35796V14.6704C14.998 15.384 14.324 16.0142 13.436 16.0142H6.56006C5.67206 16.0142 4.99805 15.384 4.99805 14.6704C4.99805 14.4564 4.99805 12.0945 4.99805 10.0142H7.43604C9.38603 10.0142 10.998 8.53426 10.998 6.67036V4.01416ZM8.99805 4.26416V6.67036C8.99805 7.38396 8.32404 8.01416 7.43604 8.01416H5.21704C5.67604 6.24696 7.22605 4.73456 8.99805 4.26416ZM16.998 8.01416H17.436C18.324 8.01416 18.998 8.64436 18.998 9.35796V18.6704C18.998 19.384 18.324 20.0142 17.436 20.0142H10.5601C9.67206 20.0142 8.99805 19.384 8.99805 18.6704V18.0142H13.436C15.387 18.0142 16.998 16.5342 16.998 14.6704V8.01416Z" fill="#2F3030"/>
+</svg>
diff --git a/frontend/resources/flowy_icons/24x/m_rename.svg b/frontend/resources/flowy_icons/24x/m_rename.svg
new file mode 100644
index 000000000000..de114a1142ba
--- /dev/null
+++ b/frontend/resources/flowy_icons/24x/m_rename.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.9946 1.95312C16.7296 1.95312 16.4636 2.04713 16.2756 2.23413C15.7196 2.79013 13.7186 4.79115 13.2746 5.23615L4.26961 14.2412L3.2686 15.2412C3.1296 15.3812 3.0576 15.5792 3.0186 15.7732L2.0186 20.7762C1.8786 21.4762 2.47461 22.0721 3.17461 21.9331C3.80061 21.8071 7.5526 21.0572 8.1776 20.9322C8.3716 20.8932 8.56961 20.8212 8.70961 20.6822L9.70961 19.6812L18.7146 10.6762C19.1596 10.2322 21.1606 8.23012 21.7166 7.67512C21.9036 7.48712 21.9976 7.22113 21.9976 6.95613C21.9976 5.31912 21.5806 4.14912 20.7156 3.26612C19.8426 2.37511 18.6766 1.95312 16.9946 1.95312ZM17.3886 3.97211C18.2916 4.02511 18.8766 4.23216 19.2776 4.64216C19.6876 5.06016 19.9466 5.64015 20.0026 6.52516C19.4546 7.07216 18.6526 7.86212 17.9956 8.51912C17.2026 7.72612 16.2246 6.74815 15.4316 5.95515C16.0896 5.29815 16.8416 4.51911 17.3886 3.97211ZM13.9936 7.39314L16.5576 9.95717L8.9906 17.5241L6.4266 14.9602L13.9936 7.39314ZM4.9886 16.3982L7.5526 18.9621L7.4586 19.0562C6.7986 19.1882 5.46561 19.4672 4.23761 19.7132L4.89461 16.4922L4.9886 16.3982Z" fill="#2F3030"/>
+</svg>
diff --git a/frontend/resources/flowy_icons/24x/m_share.svg b/frontend/resources/flowy_icons/24x/m_share.svg
new file mode 100644
index 000000000000..fbbb4d089dff
--- /dev/null
+++ b/frontend/resources/flowy_icons/24x/m_share.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.998 1.95312C15.341 1.95312 13.998 3.29613 13.998 4.95312C13.998 5.21012 14.039 5.53013 14.1 5.76813L8.74704 9.50412C8.26804 9.18012 7.61905 8.95312 6.99805 8.95312C5.34105 8.95312 3.99805 10.2961 3.99805 11.9531C3.99805 13.6101 5.34105 14.9531 6.99805 14.9531C7.63005 14.9531 8.25404 14.7181 8.73804 14.3851L14.1021 18.1511C14.0361 18.3981 13.998 18.6851 13.998 18.9531C13.998 20.6101 15.341 21.9531 16.998 21.9531C18.655 21.9531 19.998 20.6101 19.998 18.9531C19.998 17.2961 18.655 15.9531 16.998 15.9531C16.366 15.9531 15.7501 16.1811 15.2671 16.5151L9.88904 12.7521C9.95404 12.5051 9.99805 12.2211 9.99805 11.9531C9.99805 11.6851 9.96004 11.3961 9.89404 11.1491L15.259 7.39713C15.738 7.72013 16.377 7.95312 16.998 7.95312C18.655 7.95312 19.998 6.61013 19.998 4.95312C19.998 3.29613 18.655 1.95312 16.998 1.95312ZM16.998 3.95312C17.55 3.95312 17.998 4.40112 17.998 4.95312C17.998 5.50513 17.55 5.95312 16.998 5.95312C16.446 5.95312 15.998 5.50513 15.998 4.95312C15.998 4.40112 16.446 3.95312 16.998 3.95312ZM6.99805 10.9531C7.55005 10.9531 7.99805 11.4011 7.99805 11.9531C7.99805 12.5051 7.55005 12.9531 6.99805 12.9531C6.44605 12.9531 5.99805 12.5051 5.99805 11.9531C5.99805 11.4011 6.44605 10.9531 6.99805 10.9531ZM16.998 17.9531C17.55 17.9531 17.998 18.4011 17.998 18.9531C17.998 19.5051 17.55 19.9531 16.998 19.9531C16.446 19.9531 15.998 19.5051 15.998 18.9531C15.998 18.4011 16.446 17.9531 16.998 17.9531Z" fill="#2F3030"/>
+</svg>
diff --git a/frontend/resources/flowy_icons/24x/m_unfavorite.svg b/frontend/resources/flowy_icons/24x/m_unfavorite.svg
new file mode 100644
index 000000000000..e495c3b202ae
--- /dev/null
+++ b/frontend/resources/flowy_icons/24x/m_unfavorite.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.0232 2.44141C11.4522 2.44121 10.8692 2.79641 10.5242 3.50341L8.40012 7.87611L3.55892 8.56321C2.00202 8.77981 1.49763 10.3072 2.62193 11.4052L6.12003 14.8102L5.30802 19.5892C5.04062 21.1362 6.32372 22.0712 7.71302 21.3382C8.24982 21.0542 11.0102 19.6242 12.0232 19.0892L16.3332 21.3382C17.7242 22.0712 19.0112 21.1372 18.7382 19.5892L17.8952 14.8102L21.3932 11.4052C22.5232 10.3112 22.0442 8.78421 20.4872 8.56321L15.6152 7.87611L13.5222 3.50341C13.1772 2.79611 12.5942 2.44171 12.0232 2.44141ZM12.0232 5.03381L14.0842 9.25041C14.2302 9.54871 14.5052 9.73481 14.8342 9.78141L19.5192 10.4682L16.1152 13.7482C15.8762 13.9792 15.7762 14.2962 15.8342 14.6222L16.6462 19.2452L12.4922 17.0592C12.3382 16.9782 12.1672 16.9392 11.9972 16.9442C11.9972 16.0352 12.0232 5.03381 12.0232 5.03381Z" fill="#FFCE00"/>
+</svg>
diff --git a/frontend/resources/translations/am-ET.json b/frontend/resources/translations/am-ET.json
new file mode 100644
index 000000000000..1d95813944df
--- /dev/null
+++ b/frontend/resources/translations/am-ET.json
@@ -0,0 +1,864 @@
+{
+  "appName": "AppFlowy",
+  "defaultUsername": "Me",
+  "welcomeText": "እንኳን በደህና መጡ @:appName መተግበሪያ ስም",
+  "githubStarText": "በ Github ላይ ኮከብ",
+  "subscribeNewsletterText": "ለዜና ጽሑፍ ይመዝገቡ",
+  "letsGoButtonText": "ፈጣን ጅምር",
+  "title": "ርዕስ",
+  "youCanAlso": "እርስዎም ይችላሉ",
+  "and": "እና",
+  "blockActions": {
+    "addBelowTooltip": "ከዚህ በታች ለመጨመር ጠቅ ያድርጉ",
+    "addAboveCmd": "Alt+click",
+    "addAboveMacCmd": "Option+click",
+    "addAboveTooltip": "ከላይ ለመጨመር",
+    "dragTooltip": "ለመንቀሳቀስ ጎትት",
+    "openMenuTooltip": "ምናሌን ለመክፈት ጠቅ ያድርጉ"
+  },
+  "signUp": {
+    "buttonText": "ተመዝገቢ",
+    "title": "ይመዝገቡ @:appName",
+    "getStartedText": "እንጀምር",
+    "emptyPasswordError": "የይለፍ ቃል ባዶ ሊሆን አይችልም",
+    "repeatPasswordEmptyError": "ይድገሙ የይለፍ ቃል ባዶ ሊሆን አይችልም",
+    "unmatchedPasswordError": "ይድገሙ የይለፍ ቃል እንደ የይለፍ ቃል አንድ አይነት አይደለም",
+    "alreadyHaveAnAccount": "ቀድሞውኑ መለያ አለዎት?",
+    "emailHint": "ኢሜል",
+    "passwordHint": "የይለፍ ቃል",
+    "repeatPasswordHint": "የማለፊያ ቃልዎን ይድገሙ",
+    "signUpWith": "ይመዝገቡ"
+  },
+  "signIn": {
+    "loginTitle": "ወደ @:appName ይግቡ",
+    "loginButtonText": "ግባ",
+    "loginStartWithAnonymous": "ስም-አልባ ክፍለ ጊዜ ይጀምሩ",
+    "continueAnonymousUser": "ስም-አልባ ክፍለ ጊዜን ይቀጥሉ",
+    "buttonText": "ግባ",
+    "forgotPassword": "የይለፍ ቃሉን ረሳኽው?",
+    "emailHint": "ኢሜል",
+    "passwordHint": "የይለፍ ቃል",
+    "dontHaveAnAccount": "መለያ የለዎትም?",
+    "repeatPasswordEmptyError": "ይድገሙ የይለፍ ቃል ባዶ ሊሆን አይችልም",
+    "unmatchedPasswordError": "ይድገሙ የይለፍ ቃል እንደ የይለፍ ቃል አንድ አይነት አይደለም",
+    "syncPromptMessage": "ውሂቡን ማመሳሰል የተወሰነ ጊዜ ሊወስድ ይችላል.እባክዎን ይህንን ገጽ አይዝጉ",
+    "or": "ወይም",
+    "LogInWithGoogle": "በ Google ይግቡ",
+    "LogInWithGithub": "በ Github ይግቡ",
+    "LogInWithDiscord": "በ Discord ይግቡ",
+    "signInWith": "በመለያ ይግቡ:"
+  },
+  "workspace": {
+    "chooseWorkspace": "የስራ ቦታዎን ይምረጡ",
+    "create": "የስራ ቦታ ፍጠር",
+    "reset": "የስራ ቦታን ዳግም ያስጀምሩ",
+    "resetWorkspacePrompt": "የስራ ቦታን ዳግም ማስጀመር በውስጡ ያሉትን ገጾች እና መረጃዎችን ያጠፋል። እርግጠኛ ነዎት የስራ ቦታውን እንደገና ማስጀመር ይፈልጋሉ? ወይም የስራ ቦታውን ለማደስ የድጋፍ ቡድኑን ማነጋገር ይችላሉ",
+    "hint": "የስራ ቦታ",
+    "notFoundError": "የስራ ቦታ አልተገኘም",
+    "failedToLoad": "የሆነ ስህተት ተከስቷል! የስራ ቦታውን መጫን አልተሳካም። ማንኛውንም የተከፈተ የአፕሊኬሽንን ምሳሌ ለመዝጋት ይሞክሩ ከዛ እንደገና ይሞክሩ።",
+    "errorActions": {
+      "reportIssue": "ችግር ሪፖርት ያድርጉ",
+      "reachOut": "Discord ላይ ያግኙን"
+    }
+  },
+  "shareAction": {
+    "buttonText": "አጋራ",
+    "workInProgress": "በቅርብ ቀን",
+    "markdown": "Markdown",
+    "csv": "CSV",
+    "copyLink": "አገናኝ ቅዳ"
+  },
+  "moreAction": {
+    "small": "ትንሽ",
+    "medium": "መካከለኛ",
+    "large": "ትልቅ",
+    "fontSize": "የቅርጸ-ቁምፊ መጠን",
+    "import": "ማስመጣት",
+    "moreOptions": "ተጨማሪ አማራጮች"
+  },
+  "importPanel": {
+    "textAndMarkdown": "ጽሑፍ እና Markdown",
+    "documentFromV010": "ሰነድ ከ v0.1.0",
+    "databaseFromV010": "የመረጃ ቋት ከ v0.1.0",
+    "csv": "CSV",
+    "database": "የመረጃ ቋት"
+  },
+  "disclosureAction": {
+    "rename": "እንደገና ይሰይሙ",
+    "delete": "ሰርዝ",
+    "duplicate": "አባዛ",
+    "unfavorite": "ከተወዳጅዎች ያስወግዱ",
+    "favorite": "ወደ ተወዳጆች ያክሉ",
+    "openNewTab": "በአዲስ ትር ውስጥ ይክፈቱ",
+    "moveTo": "ወደ ይሂዱ",
+    "addToFavorites": "ወደ ተወዳጆች ያክሉ",
+    "copyLink": "አገናኝ ቅዳ"
+  },
+  "blankPageTitle": "ባዶ ገጽ",
+  "newPageText": "አዲስ ገጽ",
+  "newDocumentText": "አዲስ ሰነድ",
+  "newGridText": "አዲስ ፍርግርግ",
+  "newCalendarText": "አዲስ የቀን መቁጠሪያ",
+  "newBoardText": "አዲስ ቦርድ",
+  "trash": {
+    "text": "መጣያ",
+    "restoreAll": "ሁሉንም ወደነበረበት መመለስ",
+    "deleteAll": "ሁሉንም ሰርዝ",
+    "pageHeader": {
+      "fileName": "የመዝገብ ስም",
+      "lastModified": "ለመጨረሻ ጊዜ የተሻሻለው",
+      "created": "ተፈጠረ"
+    },
+    "confirmDeleteAll": {
+      "title": "ሁሉም ገጾችን በቆሻሻ መጣያ ውስጥ ለመሰረዝ እርግጠኛ ነዎት?",
+      "caption": "ይህ እርምጃ ሊቀለበስ አይችልም።"
+    },
+    "confirmRestoreAll": {
+      "title": "ሁሉንም ገጾች በቆሻሻ መጣያ ውስጥ እንደገና መመልስዎን እርግጠኛ ነዎት?",
+      "caption": "ይህ እርምጃ ሊቀለበስ አይችልም።"
+    }
+  },
+  "deletePagePrompt": {
+    "text": "ይህ ገጽ በቆሻሻ መጣያ ውስጥ ነው",
+    "restore": "መልሶ መመለስ",
+    "deletePermanent": "በቋሚነት ሰርዝ"
+  },
+  "dialogCreatePageNameHint": "ገጽ ስም",
+  "questionBubble": {
+    "shortcuts": "አቋራጮች",
+    "whatsNew": "ምን አዲስ ነገር አለ?",
+    "help": "እገዛ እና ድጋፍ",
+    "markdown": "ምልክት ተደርጎበታል",
+    "debug": {
+      "name": "ማረም መረጃ",
+      "success": "የተገለበጠ የአድራሻ መረጃ ወደ ቅንጥብ ሰሌዳ!",
+      "fail": "የማረም መረጃ ወደ ቅንጥብ ሰሌዳ መቅዳት አልተቻለም"
+    },
+    "feedback": "ግብረመልስ"
+  },
+  "menuAppHeader": {
+    "moreButtonToolTip": "ያስወግዱ፣ እንደገና ይሰይሙ እና ተጨማሪ ...",
+    "addPageTooltip": "በፍጥነት አንድ ገጽ ውስጥ ያክሉ",
+    "defaultNewPageName": "ላልተሰራ",
+    "renameDialog": "እንደገና ይሰይሙ"
+  },
+  "toolbar": {
+    "undo": "መቀልበስ",
+    "redo": "ድጋሚ",
+    "bold": "ደፋር",
+    "italic": "ጣዕሙ",
+    "underline": "ከመስመር ውጭ",
+    "strike": "ቀሚስ",
+    "numList": "ቁጥሩ ዝርዝር",
+    "bulletList": "ጉልበተኛ ዝርዝር",
+    "checkList": "ዝርዝርን ይመልከቱ",
+    "inlineCode": "የውስጥ ኮድ",
+    "quote": "ጥቅስ",
+    "header": "አርዕስት",
+    "highlight": "ያድጉ",
+    "color": "ቀለም",
+    "addLink": "አገናኝን ያክሉ",
+    "link": "አገናኝ"
+  },
+  "tooltip": {
+    "lightMode": "ወደ ቀላል ሁኔታ ቀይር",
+    "darkMode": "ወደ ጨለማ ሁኔታ ቀይር",
+    "openAsPage": "እንደ ገጽ ይክፈቱ",
+    "addNewRow": "አዲስ ረድፍ ያክሉ",
+    "openMenu": "ምናሌን ለመክፈት ጠቅ ያድርጉ",
+    "dragRow": "ረድፉን እንደገና ለማዳበር ረዥም ፕሬስ",
+    "viewDataBase": "የመረጃ ቋት ይመልከቱ",
+    "referencePage": "ይህ {name} የተጠቀሰ ነው",
+    "addBlockBelow": "ከዚህ በታች የሆነ አግድ ያክሉ"
+  },
+  "sideBar": {
+    "closeSidebar": "የጎን አሞሌ ይዝጉ",
+    "openSidebar": "የተከፈተ የጎን አሞሌ",
+    "personal": "የግል",
+    "favorites": "ተወዳጆች",
+    "clickToHidePersonal": "የግል ክፍልን ለመደበቅ ጠቅ ያድርጉ",
+    "clickToHideFavorites": "የሚወዱትን ክፍል ለመደበቅ ጠቅ ያድርጉ",
+    "addAPage": "አንድ ገጽ ያክሉ"
+  },
+  "notifications": {
+    "export": {
+      "markdown": "ለመላክ የተላከው ማስታወሻ",
+      "path": "Documents/flowy"
+    }
+  },
+  "contactsPage": {
+    "title": "እውቂያዎች",
+    "whatsHappening": "በዚህ ሳምንት ምን እየሆነ ነው?",
+    "addContact": "እውቂያ ይጨምሩ",
+    "editContact": "እውቂያ ያርትዑ"
+  },
+  "button": {
+    "OK": "እሺ",
+    "Done": "ተከናውኗል",
+    "Cancel": "ይቅር",
+    "signIn": "ይግቡ",
+    "signOut": "ዘግተው ውጣ",
+    "complete": "ተጠናቀቀ",
+    "save": "አስቀምጥ",
+    "generate": "ማመንጨት",
+    "esc": "Esc",
+    "keep": "ጠብቅ",
+    "tryAgain": "እንደገና ሞክር",
+    "discard": "መጣል",
+    "replace": "ይተኩ",
+    "insertBelow": "ከዚህ በታች ያስገቡ",
+    "upload": "ይስቀሉ",
+    "edit": "አርትዕ",
+    "delete": "ሰርዝ",
+    "duplicate": "የተባዛ",
+    "done": "ተከናውኗል",
+    "putback": "ይቅር"
+  },
+  "label": {
+    "welcome": "እንኳን ደና መጡ!",
+    "firstName": "የመጀመሪያ ስም",
+    "middleName": "የአባት ስም",
+    "lastName": "የአያት ስም",
+    "stepX": "ደረጃ {x}"
+  },
+  "oAuth": {
+    "err": {
+      "failedTitle": "ከመለያዎ ጋር መገናኘት አልተቻለም።",
+      "failedMsg": "እባክዎን በአሳሽዎ ውስጥ የመግቢያ ሂደቱን ማጠናቀቁዎን ያረጋግጡ።"
+    },
+    "google": {
+      "title": "ጉግል መግቢያ",
+      "instruction1": "የ Google እውቂያዎችዎን ለማስመጣት ይህንን መተግበሪያ የድር አሳሽንዎን በመጠቀም ይህንን መተግበሪያ መፍቀድ ያስፈልግዎታል።",
+      "instruction2": "ጽሑፉን አዶን ጠቅ በማድረግ ወይም መምረጥ ወይም መምረጥ ይህንን ኮድ ወደ ቅንጥብ ሰሌዳዎ ይቅዱ።",
+      "instruction3": "በድር አሳሽዎ ውስጥ ወደሚከተለው አገናኝ ይሂዱ እና ከላይ ያለውን ኮድ ያስገቡ",
+      "instruction4": "ምዝገባ ሲያጠናቅቁ ከዚህ በታች ያለውን ቁልፍ ተጫን"
+    }
+  },
+  "settings": {
+    "title": "ቅንብሮች",
+    "menu": {
+      "appearance": "መልክ",
+      "language": "ቋንቋ",
+      "user": "ተጠቃሚ",
+      "files": "ፋይሎች",
+      "notifications": "ማሳወቂያዎች",
+      "open": "ክፍት ቅንብሮች",
+      "logout": "ውጣ",
+      "logoutPrompt": "እርግጠኛ ነዎት ረጃጁን ማውጣት ይፈልጋሉ?",
+      "selfEncryptionLogoutPrompt": "እርግጠኛ ነዎት ዘግተው መውጣት ይፈልጋሉ? እባክዎን የምስጢር ምስጢሩን እንደገለበጡ ያረጋግጡ",
+      "syncSetting": "ቅንብሮችን አመሳስል",
+      "enableSync": "ማመሳሰልን አንቃ",
+      "enableEncrypt": "ውሂብን ኢንክሪፕት ማድረግ",
+      "enableEncryptPrompt": "በዚህ ምስጢር ውሂብዎን ለማስጠበቅ ምስጠራን ያግብሩ። በደህና ያከማቹ; አንዴ ከነቃ, ሊጠፋ አይችልም። ከጠፋ, የእርስዎ ውሂብ እየተስተካከለ ይሆናል። ለመቅዳት ጠቅ ያድርጉ",
+      "inputEncryptPrompt": "እባክዎ የምስጠራ ምስጢርዎን ያስገቡ ለ",
+      "clickToCopySecret": "ምስጢር ለመቅዳት ጠቅ ያድርጉ",
+      "inputTextFieldHint": "ምስጢርዎ",
+      "historicalUserList": "የተጠቃሚ የመግቢያ ታሪክ",
+      "historicalUserListTooltip": "ይህ ዝርዝር ስም-አልባ መለያዎችዎን ያሳያል። ዝርዝሩን ለማየት መለያ ላይ ጠቅ ማድረግ ይችላሉ። ያልታወቁ መለያዎች 'የተጀመሩ' ቁልፍን ጠቅ በማድረግ የተፈጠሩ ናቸው",
+      "openHistoricalUser": "ማንነቱ ያልታሰበ መለያ ለመክፈት ጠቅ ያድርጉ"
+    },
+    "notifications": {
+      "enableNotifications": {
+        "label": "ማሳወቂያዎችን አንቃ",
+        "hint": "የአካባቢያዊ ማሳወቂያዎችን ከማየት ለማቆም ያጥፉ."
+      }
+    },
+    "appearance": {
+      "resetSetting": "ይህንን ቅንብር እንደገና ያስጀምሩ",
+      "fontFamily": {
+        "label": "የቅርጸ-ቁምፊ ቤተሰብ",
+        "search": "ፍለጋ"
+      },
+      "themeMode": {
+        "label": "ጭብጥ ሁኔታ",
+        "light": "ቀላል ሁኔታ",
+        "dark": "ጨለማ ሁነታን",
+        "system": "ከስርዓት ጋር መላመድ"
+      },
+      "layoutDirection": {
+        "label": "አቀማመጥ አቅጣጫ",
+        "hint": "ከግራ ወደ ቀኝ ወይም ወደ ግራ ወይም ወደ ቀኝ በማያ ገጽዎ ላይ ያለውን የይዘት ፍሰት ይቆጣጠሩ።",
+        "ltr": "LTR",
+        "rtl": "RTL"
+      },
+      "textDirection": {
+        "label": "ነባሪ የጽሑፍ አቅጣጫ",
+        "hint": "ጽሑፉ ከግራ ወይም ከቀኝ እንደ ነባሪው መጀመር እንዳለበት ይግለጹ።",
+        "ltr": "LTR",
+        "rtl": "RTL",
+        "auto": "ራስ-ሰር",
+        "fallback": "እንደ አቀማመጥ አቅጣጫ ተመሳሳይ ነው"
+      },
+      "themeUpload": {
+        "button": "ይስቀሉ",
+        "uploadTheme": "ጭብጥ ይስቀሉ",
+        "description": "ከዚህ በታች ያለውን አዝራር በመጠቀም የራስዎን የአፕልሎሎሪያ ገጽ ጭብጥ ይስቀሉ።",
+        "failure": "የተሰቀሉት ጭብጥ ልክ ያልሆነ ቅርጸት ነበረው።",
+        "loading": "እባክዎ ጭብጥዎን በማረጋገጥ እና ሲሰቅል እባክዎ ይጠብቁ ...",
+        "uploadSuccess": "ጭብጥዎ በተሳካ ሁኔታ ተሰቅሏል",
+        "deletionFailure": "ጭብጡን መሰረዝ አልተቻለም.እሱን እራስዎ ለመሰረዝ ይሞክሩ።",
+        "filePickerDialogTitle": "የ .flowy_plugin ፋይል ይምረጡ",
+        "urlUploadFailure": "URL ን መክፈት አልተሳካም: {}"
+      },
+      "theme": "ጭብጥ",
+      "builtInsLabel": "የተገነቡ ገጽታዎች",
+      "pluginsLabel": "ተሰኪዎች",
+      "dateFormat": {
+        "label": "የቀን ቅርጸት",
+        "local": "አካባቢያዊ",
+        "us": "US",
+        "iso": "ISO",
+        "friendly": "ተስማሚ",
+        "dmy": "D/M/Y"
+      },
+      "timeFormat": {
+        "label": "የጊዜ ቅርጸት",
+        "twelveHour": "አሥራ ሁለት ሰዓት",
+        "twentyFourHour": "ሀያ አራት ሰዓት"
+      },
+      "showNamingDialogWhenCreatingPage": "አንድን ገጽ በሚፈጥርበት ጊዜ የ ስምምነቱን ንግግር ያሳዩ"
+    },
+    "files": {
+      "copy": "ቅጂ",
+      "defaultLocation": "ፋይሎችን እና የውሂብ ማከማቻ ቦታን ያንብቡ",
+      "exportData": "ውሂብዎን ወደ ውጭ ይላኩ",
+      "doubleTapToCopy": "መንገዱን ለመቅዳት ሁለቴ መታ ያድርጉ",
+      "restoreLocation": "ወደ APPFOFLAY ነባሪ ጎዳና ወደነበረበት መመለስ",
+      "customizeLocation": "ሌላ አቃፊ ይክፈቱ",
+      "restartApp": "ተግባራዊ ለሆኑ ለውጦች መተግበሪያን እንደገና ያስጀምሩ።",
+      "exportDatabase": "የመረጃ ቋት የመረጃ ቋት",
+      "selectFiles": "ወደ ውጭ ለመላክ የሚያስፈልጉትን ፋይሎች ይምረጡ",
+      "selectAll": "ሁሉንም ምረጥ",
+      "deselectAll": "ሁሉንም አይምረጡ",
+      "createNewFolder": "አዲስ አቃፊ ይፍጠሩ",
+      "createNewFolderDesc": "ውሂብዎን ማከማቸት እንደሚፈልጉ ይንገሩን",
+      "defineWhereYourDataIsStored": "ውሂብዎ የት እንደተከማቸ ይግለጹ",
+      "open": "ክፈት",
+      "openFolder": "አሁን ያለውን አቃፊ ይክፈቱ",
+      "openFolderDesc": "አሁን ባለው የ Appflowy አቃፊዎ ውስጥ ያንብቡ እና ይፃፉ",
+      "folderHintText": "አቃፊ ስም",
+      "location": "አዲስ አቃፊ መፍጠር",
+      "locationDesc": "ለ Appflowy ውሂብ አቃፊዎ ስም ይምረጡ",
+      "browser": "ያስሱ",
+      "create": "ፍጠር",
+      "set": "አዘጋጅ",
+      "folderPath": "አቃፊዎን ለማከማቸት መንገድ",
+      "locationCannotBeEmpty": "መንገድ ባዶ ሊሆን አይችልም",
+      "pathCopiedSnackbar": "የፋይል ማከማቻ መንገድ ወደ ቅንጥብ ሰሌዳው ተቀብሏል!",
+      "changeLocationTooltips": "የውሂብ ማውጫውን ይለውጡ",
+      "change": "ለውጥ",
+      "openLocationTooltips": "ሌላ የውሂብ ማውጫ ይክፈቱ",
+      "openCurrentDataFolder": "የአሁኑን የውሂብ ማውጫ ይክፈቱ",
+      "recoverLocationTooltips": "ወደ Appflowy ነባሪ የውሂብ ማውጫ ዳግም ያስጀምሩ",
+      "exportFileSuccess": "ወደ ውጭ የመላክ ፋይል በተሳካ ሁኔታ!",
+      "exportFileFail": "ወደ ውጭ የመላክ ፋይል አልተሳካም!",
+      "export": "ወደ ውጭ ይላኩ"
+    },
+    "user": {
+      "name": "ስም",
+      "email": "ኢሜል",
+      "tooltipSelectIcon": "አዶን ይምረጡ",
+      "selectAnIcon": "አዶን ይምረጡ",
+      "pleaseInputYourOpenAIKey": "እባክዎን OpenAI ቁልፍዎን ያስገቡ",
+      "pleaseInputYourStabilityAIKey": "እባክዎ Stability AI ቁልፍን ያስገቡ",
+      "clickToLogout": "የአሁኑን ተጠቃሚ ለመግባት ጠቅ ያድርጉ"
+    },
+    "shortcuts": {
+      "shortcutsLabel": "አቋራጮች",
+      "command": "ትእዛዝ",
+      "keyBinding": "የቁልፍ ሰሌዳ",
+      "addNewCommand": "አዲስ ትዕዛዝ ያክሉ",
+      "updateShortcutStep": "የሚፈለገውን ቁልፍ ጥምረት እና አስገባን ይጫኑ",
+      "shortcutIsAlreadyUsed": "ይህ አቋራጭ አስቀድሞ ጥቅም ላይ ውሏል- {conflict}",
+      "resetToDefault": "ወደ ነባሪ የቁልፍ ማያያዣዎች ዳግም ያስጀምሩ",
+      "couldNotLoadErrorMsg": "አቋራጮችን መጫን አልተቻለም, እንደገና ይሞክሩ",
+      "couldNotSaveErrorMsg": "አቋራጮችን ማስቀመጥ አልተቻለም, እንደገና ይሞክሩ"
+    }
+  },
+  "grid": {
+    "deleteView": "እርግጠኛ ነዎት ይህንን አመለካከት መሰረዝ ይፈልጋሉ?",
+    "createView": "አዲስ",
+    "title": {
+      "placeholder": "ላልተሰራ"
+    },
+    "settings": {
+      "filter": "ማጣሪያ",
+      "sort": "ደርድር",
+      "sortBy": "ቅደምተከተሉ የተስተካከለው",
+      "properties": "ንብረቶች",
+      "reorderPropertiesTooltip": "ለመደናቀፊያዎች ንድፍ ለመጎተት ይጎትቱ",
+      "group": "ቡድን",
+      "addFilter": "ማጣሪያ ያክሉ",
+      "deleteFilter": "ማጣሪያ ሰርዝ",
+      "filterBy": "ማጣሪያ በ ...",
+      "typeAValue": "እሴት ይተይቡ ...",
+      "layout": "አቀማመጥ",
+      "databaseLayout": "አቀማመጥ"
+    },
+    "textFilter": {
+      "contains": "ይይዛል",
+      "doesNotContain": "አይይዝም",
+      "endsWith": "ከ ጋር ያበቃል",
+      "startWith": "ይጀምራል",
+      "is": "ነው",
+      "isNot": "አይደለም",
+      "isEmpty": "ባዶ ነው",
+      "isNotEmpty": "ባዶ አይደለም",
+      "choicechipPrefix": {
+        "isNot": "አይደለም",
+        "startWith": "ይጀምራል",
+        "endWith": "ከ ጋር ያበቃል",
+        "isEmpty": "ይጀምራል",
+        "isNotEmpty": "ነው"
+      }
+    },
+    "checkboxFilter": {
+      "isChecked": "አይደለም",
+      "isUnchecked": "ባዶ ነው",
+      "choicechipPrefix": {
+        "is": "ባዶ አይደለም"
+      }
+    },
+    "checklistFilter": {
+      "isComplete": "አይደለም",
+      "isIncomplted": "ባዶ ነው"
+    },
+    "singleSelectOptionFilter": {
+      "is": "ነው",
+      "isNot": "አይደለም",
+      "isEmpty": "ባዶ ነው",
+      "isNotEmpty": "ባዶ አይደለም"
+    },
+    "multiSelectOptionFilter": {
+      "contains": "ይይዛል",
+      "doesNotContain": "አይይዝም",
+      "isEmpty": "ባዶ ነው",
+      "isNotEmpty": "ባዶ አይደለም"
+    },
+    "field": {
+      "hide": "አይደለም",
+      "show": "ባዶ ነው",
+      "insertLeft": "ባዶ አይደለም",
+      "insertRight": "ምልክት ተደርጎበታል",
+      "duplicate": "ቁጥጥር ካልተደረገበት",
+      "delete": "ነው",
+      "textFieldName": "ተጠናቅቋል",
+      "checkboxFieldName": "ያልተሟላ ነው",
+      "dateFieldName": "ደብቅ",
+      "updatedAtFieldName": "አሳይ",
+      "createdAtFieldName": "ግራ ያስገቡ",
+      "numberFieldName": "ቀኝ ያስገቡ",
+      "singleSelectFieldName": "የተባዛ",
+      "multiSelectFieldName": "ሰርዝ",
+      "urlFieldName": "ጽሑፍ",
+      "checklistFieldName": "አመልካች ሳጥን",
+      "numberFormat": "ቀን",
+      "dateFormat": "ለመጨረሻ ጊዜ የተስተካከለ ጊዜ",
+      "includeTime": "የተፈጠረ ጊዜ",
+      "isRange": "ቁጥሮች",
+      "dateFormatFriendly": "ይምረጡ",
+      "dateFormatISO": "Year-Month-Day",
+      "dateFormatLocal": "Month/Day/Year",
+      "dateFormatUS": "Year/Month/Day",
+      "dateFormatDayMonthYear": "Day/Month/Year",
+      "timeFormat": "ልዩ መልሶች",
+      "invalidTimeFormat": "ዩ አር ኤል",
+      "timeFormatTwelveHour": "የማረጋገጫ ዝርዝር",
+      "timeFormatTwentyFourHour": "የቁጥር ቅርጸት",
+      "clearDate": "የቀን ቅርጸት",
+      "addSelectOption": "ጊዜን ያካትቱ",
+      "optionTitle": "ቀኑ ቀኑ",
+      "addOption": "ወር ቀን, ዓመት",
+      "editProperty": "የጊዜ ቅርጸት",
+      "newProperty": "የተሳሳተ ቅርጸት",
+      "deleteFieldPromptMessage": "12 ሰዓት",
+      "newColumn": "24 ሰዓት"
+    },
+    "rowPage": {
+      "newField": "ግልጽ ቀን",
+      "fieldDragEelementTooltip": "አንድ አማራጭ ያክሉ",
+      "showHiddenFields": {
+        "one": "የተደበቁ {} ፊልዶችን ያሳዩ",
+        "many": "የተደበቁ {} ፊልዶችን ያሳዩ",
+        "other": "የተደበቁ {} ፊልዶችን ያሳዩ"
+      },
+      "hideHiddenFields": {
+        "one": "የተደበቁ {} ፊልዶችን ይደብቁ",
+        "many": "የተደበቁ {} ፊልዶችን ይደብቁ",
+        "other": "የተደበቁ {} ፊልዶችን ይደብቁ"
+      }
+    },
+    "sort": {
+      "ascending": "ኧረይህ ንብረት ይሰረዛል",
+      "descending": "አዲስ አምድ",
+      "deleteAllSorts": "አዲስ መስክ ያክሉ",
+      "addSort": "ምናሌን ለመክፈት ጠቅ ያድርጉ"
+    },
+    "row": {
+      "duplicate": "ቁጥጥር ካልተደረገበት",
+      "delete": "ነው",
+      "titlePlaceholder": "ላልተሰራ",
+      "textPlaceholder": "ተጠናቅቋል",
+      "copyProperty": "ያልተሟላ ነው",
+      "count": "ደብቅ",
+      "newRow": "አሳይ",
+      "action": "ግራ ያስገቡ",
+      "add": "ቀኝ ያስገቡ",
+      "drag": "የተባዛ"
+    },
+    "selectOption": {
+      "create": "ሰርዝ",
+      "purpleColor": "ጽሑፍ",
+      "pinkColor": "አመልካች ሳጥን",
+      "lightPinkColor": "ቀን",
+      "orangeColor": "ለመጨረሻ ጊዜ የተስተካከለ ጊዜ",
+      "yellowColor": "የተፈጠረ ጊዜ",
+      "limeColor": "ቁጥሮች",
+      "greenColor": "ይምረጡ",
+      "aquaColor": "ልዩ መልሶች",
+      "blueColor": "ዩ አር ኤል",
+      "deleteTag": "የማረጋገጫ ዝርዝር",
+      "colorPanelTitle": "የቁጥር ቅርጸት",
+      "panelTitle": "የቀን ቅርጸት",
+      "searchOption": "ጊዜን ያካትቱ",
+      "searchOrCreateOption": "ቀኑ ቀኑ",
+      "createNew": "ወር ቀን, ዓመት",
+      "orSelectOne": "የጊዜ ቅርጸት"
+    },
+    "checklist": {
+      "taskHint": "የተሳሳተ ቅርጸት",
+      "addNew": "12 ሰዓት",
+      "submitNewTask": "ሰርዝ"
+    },
+    "menuName": "ጽሑፍ",
+    "referencedGridPrefix": "አመልካች ሳጥን"
+  },
+  "document": {
+    "menuName": "ሰነድ",
+    "date": {
+      "timeHintTextInTwelveHour": "01:00 PM",
+      "timeHintTextInTwentyFourHour": "13:00"
+    },
+    "slashMenu": {
+      "board": {
+        "selectABoardToLinkTo": "ለማገናኘት ቦርድ ይምረጡ",
+        "createANewBoard": "አዲስ ቦርድ ይፍጠሩ"
+      },
+      "grid": {
+        "selectAGridToLinkTo": "ለማገናኘት ፍርግርግ ይምረጡ",
+        "createANewGrid": "አዲስ ፍርግርግ ይፍጠሩ"
+      },
+      "calendar": {
+        "selectACalendarToLinkTo": "ለማገናኘት የቀን መቁጠሪያ ይምረጡ",
+        "createANewCalendar": "አዲስ የቀን መቁጠሪያ ይፍጠሩ"
+      }
+    },
+    "selectionMenu": {
+      "outline": "ዝርዝር",
+      "codeBlock": "ኮድ ብሎክ"
+    },
+    "plugins": {
+      "referencedBoard": "ማጣቀሻ ቦርድ",
+      "referencedGrid": "ማጣቀሻ ፍርግርግ",
+      "referencedCalendar": "የቀን ቀን መቁጠሪያ",
+      "autoGeneratorMenuItemName": "OpenAI ጸሐፊ",
+      "autoGeneratorTitleName": "OpenAI ማንኛውንም ነገር እንዲጽፉ ይጠይቁ ...",
+      "autoGeneratorLearnMore": "ተጨማሪ እወቅ",
+      "autoGeneratorGenerate": "ማመንጨት",
+      "autoGeneratorHintText": "OpenAI ይጠይቁ ...",
+      "autoGeneratorCantGetOpenAIKey": "የ OpenAI ቁልፍ ማግኘት አልተቻለም",
+      "autoGeneratorRewrite": "እንደገና ይፃፉ",
+      "smartEdit": "ረዳቶች",
+      "openAI": "ኦፔና",
+      "smartEditFixSpelling": "የፊደል አጻጻፍ",
+      "warning": "⚠️ የAI ምላሾች ትክክል ያልሆኑ ወይም አሳሳች ሊሆኑ ይችላሉ.",
+      "smartEditSummarize": "ማጠቃለል",
+      "smartEditImproveWriting": "ጽሑፍን ማሻሻል",
+      "smartEditMakeLonger": "ረዘም ላለ ጊዜ ያድርጉ",
+      "smartEditCouldNotFetchResult": "ከOpenAI ውጤት ማምለጥ አልተቻለም",
+      "smartEditCouldNotFetchKey": "ኦፕናይ ቁልፍን ማጣት አልተቻለም",
+      "smartEditDisabled": "በቅንብሮች ውስጥ OpenAI ያገናኙ",
+      "discardResponse": "የ AI ምላሾችን መጣል ይፈልጋሉ?",
+      "createInlineMathEquation": "እኩልነት ይፍጠሩ",
+      "toggleList": "የተስተካከለ ዝርዝር",
+      "cover": {
+        "changeCover": "ሽፋን",
+        "colors": "ቀለሞች",
+        "images": "ምስሎች",
+        "clearAll": "ሁሉንም ያፅዱ",
+        "abstract": "ረቂቅ",
+        "addCover": "ሽፋን ጨምር",
+        "addLocalImage": "የአከባቢ ምስል ያክሉ",
+        "invalidImageUrl": "ልክ ያልሆነ ምስል ዩአርኤል",
+        "failedToAddImageToGallery": "ወደ ማዕከለ-ስዕላት ምስልን ማከል አልተሳካም",
+        "enterImageUrl": "የምስል ዩአርኤል ያስገቡ",
+        "add": "ጨምር",
+        "back": "ተመለስ",
+        "saveToGallery": "ወደ ማዕከለ-ስዕላት ይቆጥቡ",
+        "removeIcon": "አዶ ያስወግዱ",
+        "pasteImageUrl": "የመለጠጥ ምስል ዩ አር ኤል",
+        "or": "ወይም",
+        "pickFromFiles": "ከፋይሎች ይምረጡ",
+        "couldNotFetchImage": "ምስልን ማምጣት አልተቻለም",
+        "imageSavingFailed": "ምስል ቁጠባ አልተሳካም",
+        "addIcon": "አዶን ያክሉ",
+        "coverRemoveAlert": "ከተሰረዘ በኋላ ከሽፋን ይወገዳል።",
+        "alertDialogConfirmation": "እርግጠኛ ነዎት ለመቀጠል ይፈልጋሉ?"
+      },
+      "mathEquation": {
+        "addMathEquation": "የሂሳብ እኩልታን ያክሉ",
+        "editMathEquation": "የሂሳብ እኩልትን ያርትዑ"
+      },
+      "optionAction": {
+        "click": "ጠቅ ያድርጉ",
+        "toOpenMenu": " ምናሌን ለመክፈት",
+        "delete": "ሰርዝ",
+        "duplicate": "የተባዛ",
+        "turnInto": "መለወጥ",
+        "moveUp": "ተንቀሳቀሱ",
+        "moveDown": "ውረድ",
+        "color": "ቀለም",
+        "align": "ስልጣን",
+        "left": "ግራ",
+        "center": "ማዕከል",
+        "right": "ቀኝ",
+        "defaultColor": "ነባሪ"
+      },
+      "image": {
+        "copiedToPasteBoard": "የምስል አገናኝ ወደ ቅንጥብ ሰሌዳው ተቀድቷል",
+        "addAnImage": "ምስል ያክሉ"
+      },
+      "outline": {
+        "addHeadingToCreateOutline": "የርዕስ ማውጫ ለመፍጠር የርዕስ ማውጫዎችን ለማክበር ያክሉ."
+      },
+      "table": {
+        "addAfter": "በኋላ ያክሉ",
+        "addBefore": "ከዚህ በፊት ያክሉ",
+        "delete": "ሰርዝ",
+        "clear": "የተባዛ",
+        "duplicate": "የተባዛ",
+        "bgColor": "መለወጥ"
+      },
+      "contextMenu": {
+        "copy": "ተንቀሳቀሱ",
+        "cut": "ውረድ",
+        "paste": "ቀለም"
+      }
+    },
+    "textBlock": {
+      "placeholder": "ለትዛዞች '/' ይጻፉ"
+    },
+    "title": {
+      "placeholder": "ያልተሰየመ"
+    },
+    "imageBlock": {
+      "placeholder": "ምስልን ለማከል ጠቅ ያድርጉ",
+      "upload": {
+        "label": "ይስቀሉ",
+        "placeholder": "ምስልን ለመስቀል ጠቅ ያድርጉ"
+      },
+      "url": {
+        "label": "የምስል ዩአርኤል",
+        "placeholder": "የምስል ዩአርኤል ያስገቡ"
+      },
+      "ai": {
+        "label": "ምስል OpenAI ውስጥ ምስልን ማመንጨት",
+        "placeholder": "ምስልን ለማመንጨት እባክዎን ለ OpenAI ይጠይቁ"
+      },
+      "stability_ai": {
+        "label": "ምስልን Stability AI ያመነጫል",
+        "placeholder": "እባክዎን ምስሉን ለማመንጨት እባክዎ Stability AI አጥነት ያስገቡ"
+      },
+      "support": "የምስል መጠን ወሰን 5 ሜባ ነው.የሚደገፉ ቅርፀቶች: JPEG, PNG, GIF, SVG",
+      "error": {
+        "invalidImage": "ልክ ያልሆነ ምስል",
+        "invalidImageSize": "የምስል መጠን ከ 5 ሜባ በታች መሆን አለበት",
+        "invalidImageFormat": "የምስል ቅርጸት አይደገፍም.የሚደገፉ ቅርፀቶች: JPEG, PNG, GIF, SVG",
+        "invalidImageUrl": "ልክ ያልሆነ ምስል ዩአርኤል"
+      },
+      "embedLink": {
+        "label": "አገናኝ",
+        "placeholder": "የመለጠጥ ወይም የምስል አገናኝን ይለዩ"
+      },
+      "searchForAnImage": "ምስልን ይፈልጉ",
+      "pleaseInputYourOpenAIKey": "እባክዎ በቅንብሮች ገጽ ውስጥ የኦፕሬና ቁልፍዎን ያስገቡ",
+      "pleaseInputYourStabilityAIKey": "በቅንብሮች ገጽ ውስጥ የመረጋጋት Stability AI ቁልፍን ያስገቡ"
+    },
+    "codeBlock": {
+      "language": {
+        "label": "ቋንቋ",
+        "placeholder": "ቋንቋ ይምረጡ"
+      }
+    },
+    "inlineLink": {
+      "placeholder": "መለጠፍ ወይም አገናኝ ይተይቡ",
+      "openInNewTab": "በአዲስ ትር ክፈት",
+      "copyLink": "አገናኝ ቅዳ",
+      "removeLink": "አገናኝን ያስወግዱ",
+      "url": {
+        "label": "አገናኝ ዩአርኤል",
+        "placeholder": "አገናኝ ዩአርኤል ያስገቡ"
+      },
+      "title": {
+        "label": "አገናኝ ርዕስ",
+        "placeholder": "የአገናኝ ርዕስ ያስገቡ"
+      }
+    },
+    "mention": {
+      "placeholder": "አንድን ሰው ወይም አንድ ገጽ ወይም ቀን ጥቀስ ...",
+      "page": {
+        "label": "ወደ ገጽ አገናኝ",
+        "tooltip": "ገጽ ለመክፈት ጠቅ ያድርጉ"
+      }
+    },
+    "toolbar": {
+      "resetToDefaultFont": "ወደ ነባሪ ዳግም ያስጀምሩ"
+    },
+    "errorBlock": {
+      "theBlockIsNotSupported": "የአሁኑ ስሪት ይህንን ብሎክ አይደግፍም።",
+      "blockContentHasBeenCopied": "ብሎክ ይዘቱ ተቀብሏል።"
+    }
+  },
+  "board": {
+    "column": {
+      "create_new_card": "አዲስ"
+    },
+    "menuName": "ቦርድ",
+    "referencedBoardPrefix": "እይታ"
+  },
+  "calendar": {
+    "menuName": "የቀን መቁጠሪያ",
+    "defaultNewCalendarTitle": "ላልተሰራ",
+    "newEventButtonTooltip": "አዲስ ክስተት ያክሉ",
+    "navigation": {
+      "today": "ዛሬ",
+      "jumpToday": "እስከ ዛሬ ድረስ ዝለል",
+      "previousMonth": "ያለፈው ወር",
+      "nextMonth": "በሚቀጥለው ወር"
+    },
+    "settings": {
+      "showWeekNumbers": "የሳምንቱ ቁጥሮች ያሳዩ",
+      "showWeekends": "ቅዳሜና እሁድን ያሳዩ",
+      "firstDayOfWeek": "ሳምንት ይጀምሩ",
+      "layoutDateField": "የቀን ቀን መቁጠሪያ በ",
+      "noDateTitle": "ቀን የለም",
+      "noDateHint": "ያልተስተካከሉ ክስተቶች እዚህ ይታያሉ",
+      "clickToAdd": "ወደ የቀን መቁጠሪያው ለማከል ጠቅ ያድርጉ",
+      "name": "የቀን መቁጠሪያ አቀማመጥ"
+    },
+    "referencedCalendarPrefix": "View of"
+  },
+  "errorDialog": {
+    "title": "Appflowy ስህተት",
+    "howToFixFallback": "ለተፈጠረው ችግር ይቅርታ እንጠይቃለን!ስህተትዎን በሚገልፅ የእኛ የ Gitubub ገጽ ላይ አንድ ጉዳይ ያስገቡ.",
+    "github": "በ Github ላይ ይመልከቱ"
+  },
+  "search": {
+    "label": "ፍለጋ",
+    "placeholder": {
+      "actions": "የፍለጋ እርምጃዎች ..."
+    }
+  },
+  "message": {
+    "copy": {
+      "success": "Copied!",
+      "fail": "መቅዳት አልተቻለም"
+    }
+  },
+  "unSupportBlock": "የአሁኑ ስሪት ይህንን ብሎክ አይደግፍም።",
+  "views": {
+    "deleteContentTitle": "እርግጠኛ ነዎት {pageType} መሰረዝ ይፈልጋሉ?",
+    "deleteContentCaption": "ይህን {pageType} ከሆነ, ከቆሻሻ መጣያ መመለስ ይችላሉ።"
+  },
+  "colors": {
+    "custom": "ብጁ",
+    "default": "ነባሪ",
+    "red": "ቀይ",
+    "orange": "ብርቱካናማ",
+    "yellow": "ቢጫ",
+    "green": "አረንጓዴ",
+    "blue": "ሰማያዊ",
+    "purple": "ሐምራዊ",
+    "pink": "ሐምራዊ",
+    "brown": "ብናማ",
+    "gray": "ግራጫ"
+  },
+  "emoji": {
+    "search": "ፈልግ ኢሞጂዲ",
+    "noRecent": "ምንም የቅርብ ጊዜ ኢሞጂ የለም",
+    "noEmojiFound": "ምንም ኢሞጂ አልተገኘም",
+    "filter": "ማጣሪያ",
+    "random": "የዘፈቀደ",
+    "selectSkinTone": "የቆዳ ድምጽ ይምረጡ",
+    "remove": "ኢሞጂን ያስወግዱ",
+    "categories": {
+      "smileys": "ፈገግታ እና ስሜቶች",
+      "people": "ሰዎች እና አካል",
+      "animals": "እንስሳት እና ተፈጥሮ",
+      "food": "ምግብ እና መጠጥ",
+      "activities": "እንቅስቃሴዎች",
+      "places": "ጉዞ እና ቦታዎች",
+      "objects": "ነገሮች",
+      "symbols": "ምልክቶች",
+      "flags": "ባንዲራዎች",
+      "nature": "ተፈጥሮ",
+      "frequentlyUsed": "ብዙ ጊዜ ጥቅም ላይ ውሏል"
+    }
+  },
+  "inlineActions": {
+    "noResults": "ምንም ውጤቶች የሉም",
+    "pageReference": "ገጽ ማጣቀሻ",
+    "date": "ቀን",
+    "reminder": {
+      "groupTitle": "አስታዋሽ",
+      "shortKeyword": "አስታውስ"
+    }
+  },
+  "datePicker": {
+    "dateTimeFormatTooltip": "በቅንብሮች ውስጥ ያለውን ቀን እና የጊዜ ቅርጸት ይለውጡ"
+  },
+  "relativeDates": {
+    "yesterday": "ትናንት",
+    "today": "ዛሬ",
+    "tomorrow": "ነገ",
+    "oneWeek": "1 ሳምንት"
+  },
+  "notificationHub": {
+    "title": "ማሳወቂያዎች",
+    "emptyTitle": "ሁሉም ተነሱ!",
+    "emptyBody": "ምንም የማሳወቂያዎች ወይም እርምጃዎች የለም.በተረጋጋና ይደሰቱ.",
+    "tabs": {
+      "inbox": "የገቢ መልእክት ሳጥን",
+      "upcoming": "መጪ"
+    },
+    "actions": {
+      "markAllRead": "ሁሉንም እንደ ንባብ ምልክት ያድርጉበት",
+      "showAll": "ሁሉም",
+      "showUnreads": "ያልተነበበ"
+    },
+    "filters": {
+      "ascending": "መውጣት",
+      "descending": "መውረድ",
+      "groupByDate": "ቀን",
+      "showUnreadsOnly": "ያልተነበቡ ቃላቶችን ብቻ ያሳዩ",
+      "resetToDefault": "ወደ ነባሪ ዳግም ያስጀምሩ"
+    }
+  },
+  "reminderNotification": {
+    "title": "አስታዋሽ",
+    "message": "አስታውስ",
+    "tooltipDelete": "በቅንብሮች ውስጥ ያለውን ቀን እና የጊዜ ቅርጸት ይለውጡ",
+    "tooltipMarkRead": "ትናንት",
+    "tooltipMarkUnread": "ዛሬ"
+  },
+  "findAndReplace": {
+    "find": "ነገ",
+    "previousMatch": "1 ሳምንት",
+    "nextMatch": "ማሳወቂያዎች",
+    "close": "ሁሉም ተነሱ!",
+    "replace": "ምንም የማሳወቂያዎች ወይም እርምጃዎች የለም.በተረጋጋና ይደሰቱ.",
+    "replaceAll": "የገቢ መልእክት ሳጥን",
+    "noResult": "ምንም ውጤቶች የሉም",
+    "caseSensitive": "መጪ"
+  }
+}
diff --git a/frontend/resources/translations/en.json b/frontend/resources/translations/en.json
index 329ae3010d0d..f9226db020fb 100644
--- a/frontend/resources/translations/en.json
+++ b/frontend/resources/translations/en.json
@@ -147,6 +147,7 @@
     "defaultNewPageName": "Untitled",
     "renameDialog": "Rename"
   },
+  "noPagesInside": "No pages inside",
   "toolbar": {
     "undo": "Undo",
     "redo": "Redo",
@@ -217,7 +218,11 @@
     "delete": "Delete",
     "duplicate": "Duplicate",
     "done": "Done",
-    "putback": "Put Back"
+    "putback": "Put Back",
+    "share": "Share",
+    "removeFromFavorites": "Remove from favorites",
+    "addToFavorites": "Add to favorites",
+    "rename": "Rename"
   },
   "label": {
     "welcome": "Welcome!",
@@ -533,7 +538,9 @@
     "checklist": {
       "taskHint": "Task description",
       "addNew": "Add a new task",
-      "submitNewTask": "Create"
+      "submitNewTask": "Create",
+      "hideComplete": "Hide completed tasks",
+      "showComplete": "Show all tasks"
     },
     "menuName": "Grid",
     "referencedGridPrefix": "View of"
@@ -865,5 +872,122 @@
     "replaceAll": "Replace all",
     "noResult": "No results",
     "caseSensitive": "Case sensitive"
+  },
+  "error": {
+    "weAreSorry": "We're sorry",
+    "loadingViewError": "We're having trouble loading this view. Please check your internet connection, refresh the app, and do not hesitate to reach out to the team if the issue continues."
+  },
+  "editor": {
+    "bold": "Bold",
+    "bulletedList": "Bulleted List",
+    "checkbox": "Checkbox",
+    "embedCode": "Embed Code",
+    "heading1": "H1",
+    "heading2": "H2",
+    "heading3": "H3",
+    "highlight": "Highlight",
+    "color": "Color",
+    "image": "Image",
+    "italic": "Italic",
+    "link": "Link",
+    "numberedList": "Numbered List",
+    "quote": "Quote",
+    "strikethrough": "Strikethrough",
+    "text": "Text",
+    "underline": "Underline",
+    "fontColorDefault": "Default",
+    "fontColorGray": "Gray",
+    "fontColorBrown": "Brown",
+    "fontColorOrange": "Orange",
+    "fontColorYellow": "Yellow",
+    "fontColorGreen": "Green",
+    "fontColorBlue": "Blue",
+    "fontColorPurple": "Purple",
+    "fontColorPink": "Pink",
+    "fontColorRed": "Red",
+    "backgroundColorDefault": "Default background",
+    "backgroundColorGray": "Gray background",
+    "backgroundColorBrown": "Brown background",
+    "backgroundColorOrange": "Orange background",
+    "backgroundColorYellow": "Yellow background",
+    "backgroundColorGreen": "Green background",
+    "backgroundColorBlue": "Blue background",
+    "backgroundColorPurple": "Purple background",
+    "backgroundColorPink": "Pink background",
+    "backgroundColorRed": "Red background",
+    "done": "Done",
+    "cancel": "Cancel",
+    "tint1": "Tint 1",
+    "tint2": "Tint 2",
+    "tint3": "Tint 3",
+    "tint4": "Tint 4",
+    "tint5": "Tint 5",
+    "tint6": "Tint 6",
+    "tint7": "Tint 7",
+    "tint8": "Tint 8",
+    "tint9": "Tint 9",
+    "lightLightTint1": "Purple",
+    "lightLightTint2": "Pink",
+    "lightLightTint3": "Light Pink",
+    "lightLightTint4": "Orange",
+    "lightLightTint5": "Yellow",
+    "lightLightTint6": "Lime",
+    "lightLightTint7": "Green",
+    "lightLightTint8": "Aqua",
+    "lightLightTint9": "Blue",
+    "urlHint": "URL",
+    "mobileHeading1": "Heading 1",
+    "mobileHeading2": "Heading 2",
+    "mobileHeading3": "Heading 3",
+    "textColor": "Text Color",
+    "backgroundColor": "Background Color",
+    "addYourLink": "Add your link",
+    "openLink": "Open link",
+    "copyLink": "Copy link",
+    "removeLink": "Remove link",
+    "editLink": "Edit link",
+    "linkText": "Text",
+    "linkTextHint": "Please enter text",
+    "linkAddressHint": "Please enter URL",
+    "highlightColor": "Highlight color",
+    "clearHighlightColor": "Clear highlight color",
+    "customColor": "Custom color",
+    "hexValue": "Hex value",
+    "opacity": "Opacity",
+    "resetToDefaultColor": "Reset to default color",
+    "ltr": "LTR",
+    "rtl": "RTL",
+    "auto": "Auto",
+    "cut": "Cut",
+    "copy": "Copy",
+    "paste": "Paste",
+    "find": "Find",
+    "previousMatch": "Previous match",
+    "nextMatch": "Next match",
+    "closeFind": "Close",
+    "replace": "Replace",
+    "replaceAll": "Replace all",
+    "regex": "Regex",
+    "caseSensitive": "Case sensitive",
+    "uploadImage": "Upload Image",
+    "urlImage": "URL Image",
+    "incorrectLink": "Incorrect Link",
+    "upload": "Upload",
+    "chooseImage": "Choose an image",
+    "loading": "Loading",
+    "imageLoadFailed": "Could not load the image",
+    "divider": "Divider",
+    "table": "Table",
+    "colAddBefore": "Add before",
+    "rowAddBefore": "Add before",
+    "colAddAfter": "Add after",
+    "rowAddAfter": "Add after",
+    "colRemove": "Remove",
+    "rowRemove": "Remove",
+    "colDuplicate": "Duplicate",
+    "rowDuplicate": "Duplicate",
+    "colClear": "Clear Content",
+    "rowClear": "Clear Content",
+    "slashPlaceHolder": "Enter a / to insert a block, or start typing"
   }
-}
+}
\ No newline at end of file
diff --git a/frontend/resources/translations/pt-PT.json b/frontend/resources/translations/pt-PT.json
index 6e36a32977e3..7fba344dfba5 100644
--- a/frontend/resources/translations/pt-PT.json
+++ b/frontend/resources/translations/pt-PT.json
@@ -261,7 +261,8 @@
     },
     "notifications": {
       "enableNotifications": {
-        "label": "Ativar notificações"
+        "label": "Ativar notificações",
+        "hint": "Desligue para impedir que notificações locais apareçam."
       }
     },
     "appearance": {
@@ -276,8 +277,23 @@
         "dark": "Modo Escuro",
         "system": "Adaptar ao sistema"
       },
+      "layoutDirection": {
+        "label": "Direção da disposição",
+        "hint": "Controle o fluxo do conteúdo no ecrã, da esquerda para a direita ou da direita para a esquerda.",
+        "ltr": "EPD",
+        "rtl": "DPE"
+      },
+      "textDirection": {
+        "label": "Direção de texto padrão",
+        "hint": "Especifique se o texto deve começar da esquerda ou da direita como padrão.",
+        "ltr": "EPD",
+        "rtl": "DPE",
+        "auto": "AUTO",
+        "fallback": "Igual à direção da disposição"
+      },
       "themeUpload": {
         "button": "Carregar",
+        "uploadTheme": "Carregar tema",
         "description": "Carregue seu próprio tema AppFlowy usando o botão abaixo.",
         "failure": "O tema que foi carregado tinha um formato inválido.",
         "loading": "Aguarde enquanto validamos e carregamos seu tema...",
@@ -289,6 +305,20 @@
       "theme": "Tema",
       "builtInsLabel": "Temas integrados",
       "pluginsLabel": "Plugins",
+      "dateFormat": {
+        "label": "Formato de data",
+        "local": "Local",
+        "us": "EUA",
+        "iso": "ISO",
+        "friendly": "Amigável",
+        "dmy": "D/M/A"
+      },
+      "timeFormat": {
+        "label": "Formato de hora",
+        "twelveHour": "Doze horas",
+        "twentyFourHour": "Vinte e quatro horas"
+      },
+      "showNamingDialogWhenCreatingPage": "Mostrar caixa de diálogo de nomenclatura ao criar uma página",
       "lightLabel": "Modo Claro",
       "darkLabel": "Modo Escuro"
     },
@@ -331,8 +361,10 @@
     "user": {
       "name": "Nome",
       "email": "E-mail",
+      "tooltipSelectIcon": "Selecione o ícone",
       "selectAnIcon": "Selecione um ícone",
       "pleaseInputYourOpenAIKey": "por favor insira sua chave OpenAI",
+      "pleaseInputYourStabilityAIKey": "por favor, insira a sua chave Stability AI",
       "clickToLogout": "Clique para fazer logout"
     },
     "shortcuts": {
@@ -350,6 +382,9 @@
   "grid": {
     "deleteView": "Tem certeza de que deseja excluir esta visualização?",
     "createView": "Novo",
+    "title": {
+      "placeholder": "Sem título"
+    },
     "settings": {
       "filter": "Filtro",
       "sort": "Organizar",
@@ -406,6 +441,7 @@
     },
     "field": {
       "hide": "Esconder",
+      "show": "Mostrar",
       "insertLeft": "Inserir Esquerda",
       "insertRight": "Inserir à Direita",
       "duplicate": "Duplicado",
@@ -423,6 +459,7 @@
       "numberFormat": "Formato numérico",
       "dateFormat": "Formato de data",
       "includeTime": "Incluir tempo",
+      "isRange": "Data de fim",
       "dateFormatFriendly": "Mês dia ano",
       "dateFormatISO": "Ano mês dia",
       "dateFormatLocal": "Mês dia ano",
@@ -441,6 +478,20 @@
       "deleteFieldPromptMessage": "Tem certeza? Esta propriedade será excluída",
       "newColumn": "Nova Coluna"
     },
+    "rowPage": {
+      "newField": "Adicionar um novo campo",
+      "fieldDragEelementTooltip": "Clique para abrir o menu",
+      "showHiddenFields": {
+        "one": "Mostrar campo oculto {}",
+        "many": "Mostrar campos ocultos {}",
+        "other": "Mostrar campos ocultos {}"
+      },
+      "hideHiddenFields": {
+        "one": "Ocultar campo oculto {}",
+        "many": "Ocultar campos ocultos {}",
+        "other": "Ocultar campos ocultos {}"
+      }
+    },
     "sort": {
       "ascending": "Ascendente",
       "descending": "descendente",
@@ -456,7 +507,9 @@
       "copyProperty": "Propriedade copiada para a área de transferência",
       "count": "Contar",
       "newRow": "Nova linha",
-      "action": "Ação"
+      "action": "Ação",
+      "add": "Clique em adicionar abaixo",
+      "drag": "Arraste para mover"
     },
     "selectOption": {
       "create": "Criar",
@@ -472,10 +525,15 @@
       "deleteTag": "Excluir etiqueta",
       "colorPanelTitle": "cores",
       "panelTitle": "Selecione uma opção ou crie uma",
-      "searchOption": "Pesquise uma opção"
+      "searchOption": "Pesquise uma opção",
+      "searchOrCreateOption": "Pesquise ou crie uma opção...",
+      "createNew": "Crie um novo",
+      "orSelectOne": "Ou selecione uma opção"
     },
     "checklist": {
-      "addNew": "Adicionar um item"
+      "taskHint": "Descrição da tarefa",
+      "addNew": "Adicionar um item",
+      "submitNewTask": "Criar"
     },
     "menuName": "Grade",
     "referencedGridPrefix": "Vista de"
@@ -572,7 +630,8 @@
         "defaultColor": "Padrão"
       },
       "image": {
-        "copiedToPasteBoard": "O link da imagem foi copiado para a área de transferência"
+        "copiedToPasteBoard": "O link da imagem foi copiado para a área de transferência",
+        "addAnImage": "Adicione uma imagem"
       },
       "outline": {
         "addHeadingToCreateOutline": "Adicione títulos para criar um sumário."
@@ -607,13 +666,28 @@
         "label": "imagem URL",
         "placeholder": "Insira o URL da imagem"
       },
+      "ai": {
+        "label": "Gerar imagem da OpenAI",
+        "placeholder": "Por favor, insira o comando para a OpenAI gerar a imagem"
+      },
+      "stability_ai": {
+        "label": "Gerar imagem da Stability AI",
+        "placeholder": "Por favor, insira o comando para a Stability AI gerar a imagem"
+      },
       "support": "O limite de tamanho da imagem é de 5 MB. Formatos suportados: JPEG, PNG, GIF, SVG",
       "error": {
         "invalidImage": "imagem inválida",
         "invalidImageSize": "O tamanho da imagem deve ser inferior a 5 MB",
         "invalidImageFormat": "O formato da imagem não é suportado. Formatos suportados: JPEG, PNG, GIF, SVG",
         "invalidImageUrl": "URL de imagem inválido"
-      }
+      },
+      "embedLink": {
+        "label": "Incorporar hiperligação",
+        "placeholder": "Cole ou digite uma hiperligação de imagem"
+      },
+      "searchForAnImage": "Procure uma imagem",
+      "pleaseInputYourOpenAIKey": "por favor, insira a sua chave OpenAI na página Configurações",
+      "pleaseInputYourStabilityAIKey": "por favor, insira a sua chave Stability AI na página Configurações"
     },
     "codeBlock": {
       "language": {
@@ -641,6 +715,13 @@
         "label": "Link para a página",
         "tooltip": "Clique para abrir a página"
       }
+    },
+    "toolbar": {
+      "resetToDefaultFont": "Restaurar para o padrão"
+    },
+    "errorBlock": {
+      "theBlockIsNotSupported": "A versão atual não suporta este bloco.",
+      "blockContentHasBeenCopied": "O conteúdo do bloco foi copiado."
     }
   },
   "board": {
@@ -653,6 +734,7 @@
   "calendar": {
     "menuName": "Calendário",
     "defaultNewCalendarTitle": "Sem título",
+    "newEventButtonTooltip": "Adicionar um novo evento",
     "navigation": {
       "today": "Hoje",
       "jumpToday": "Ir para hoje",
@@ -707,6 +789,9 @@
     "gray": "Cinzento"
   },
   "emoji": {
+    "search": "Pesquisar emoji",
+    "noRecent": "Nenhum emoji recente",
+    "noEmojiFound": "Nenhum emoji encontrado",
     "filter": "Filtro",
     "random": "Aleatório",
     "selectSkinTone": "Selecione o tom do tema",
@@ -724,5 +809,52 @@
       "nature": "Natureza",
       "frequentlyUsed": "Usado frequentemente"
     }
+  },
+  "inlineActions": {
+    "noResults": "Nenhum resultado",
+    "pageReference": "Referência de página",
+    "date": "Data",
+    "reminder": {
+      "groupTitle": "Lembrete",
+      "shortKeyword": "lembrete"
+    }
+  },
+  "relativeDates": {
+    "yesterday": "Ontem",
+    "today": "Hoje",
+    "tomorrow": "Amanhã",
+    "oneWeek": "1 semana"
+  },
+  "notificationHub": {
+    "title": "Notificações",
+    "empty": "Nada para ver aqui!",
+    "tabs": {
+      "inbox": "Caixa de entrada",
+      "upcoming": "A chegar"
+    },
+    "filters": {
+      "ascending": "Ascendente",
+      "descending": "Descendente",
+      "groupByDate": "Agrupar por data",
+      "showUnreadsOnly": "Mostrar apenas os não lidos",
+      "resetToDefault": "Restaurar para o padrão"
+    }
+  },
+  "reminderNotification": {
+    "title": "Lembrete",
+    "message": "Lembre-se de verificar isto antes que esqueça!",
+    "tooltipDelete": "Apagar",
+    "tooltipMarkRead": "Marcar como lido",
+    "tooltipMarkUnread": "Marcar como não lido"
+  },
+  "findAndReplace": {
+    "find": "Encontrar",
+    "previousMatch": "Correspondência anterior",
+    "nextMatch": "Correspondência seguinte",
+    "close": "Fechar",
+    "replace": "Substituir",
+    "replaceAll": "Substituir tudo",
+    "noResult": "Nenhum resultado",
+    "caseSensitive": "Maiúsculas e minúsculas"
   }
 }
diff --git a/frontend/rust-lib/Cargo.lock b/frontend/rust-lib/Cargo.lock
index 69280ae014f8..591e3240e62e 100644
--- a/frontend/rust-lib/Cargo.lock
+++ b/frontend/rust-lib/Cargo.lock
@@ -660,7 +660,7 @@ dependencies = [
 [[package]]
 name = "client-api"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "bytes",
@@ -673,6 +673,7 @@ dependencies = [
  "gotrue-entity",
  "lib0",
  "mime",
+ "mime_guess",
  "parking_lot",
  "realtime-entity",
  "reqwest",
@@ -720,7 +721,7 @@ dependencies = [
 [[package]]
 name = "collab"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -739,7 +740,7 @@ dependencies = [
 [[package]]
 name = "collab-database"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -769,7 +770,7 @@ dependencies = [
 [[package]]
 name = "collab-derive"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -781,7 +782,7 @@ dependencies = [
 [[package]]
 name = "collab-document"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "collab",
@@ -801,7 +802,7 @@ dependencies = [
 [[package]]
 name = "collab-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "bytes",
@@ -815,7 +816,7 @@ dependencies = [
 [[package]]
 name = "collab-folder"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "chrono",
@@ -857,7 +858,7 @@ dependencies = [
 [[package]]
 name = "collab-persistence"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "async-trait",
  "bincode",
@@ -878,7 +879,7 @@ dependencies = [
 [[package]]
 name = "collab-plugins"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -905,7 +906,7 @@ dependencies = [
 [[package]]
 name = "collab-user"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=2f5734ae#2f5734ae9e58efd611383b78cd9068d514643e75"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Collab?rev=ff10abd5e#ff10abd5e41b9a7d118cbb79f8c2bf9ac27c0ded"
 dependencies = [
  "anyhow",
  "collab",
@@ -1137,7 +1138,7 @@ dependencies = [
  "cssparser-macros",
  "dtoa-short",
  "itoa",
- "phf 0.8.0",
+ "phf 0.11.2",
  "smallvec",
 ]
 
@@ -1264,15 +1265,17 @@ checksum = "c2e66c9d817f1720209181c316d28635c050fa304f9c79e47a520882661b7308"
 [[package]]
 name = "database-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "chrono",
  "collab-entity",
  "serde",
  "serde_json",
+ "serde_repr",
  "sqlx",
  "thiserror",
+ "tracing",
  "uuid",
  "validator",
 ]
@@ -2437,7 +2440,7 @@ dependencies = [
 [[package]]
 name = "gotrue"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "futures-util",
@@ -2453,9 +2456,11 @@ dependencies = [
 [[package]]
 name = "gotrue-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
+ "jsonwebtoken",
+ "lazy_static",
  "reqwest",
  "serde",
  "serde_json",
@@ -2811,7 +2816,7 @@ dependencies = [
 [[package]]
 name = "infra"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
  "reqwest",
@@ -2885,6 +2890,20 @@ dependencies = [
  "wasm-bindgen",
 ]
 
+[[package]]
+name = "jsonwebtoken"
+version = "8.3.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6971da4d9c3aa03c3d8f3ff0f4155b534aad021292003895a469716b2a230378"
+dependencies = [
+ "base64 0.21.3",
+ "pem",
+ "ring",
+ "serde",
+ "serde_json",
+ "simple_asn1",
+]
+
 [[package]]
 name = "lazy_static"
 version = "1.4.0"
@@ -3309,6 +3328,27 @@ dependencies = [
  "winapi",
 ]
 
+[[package]]
+name = "num-bigint"
+version = "0.4.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "608e7659b5c3d7cba262d894801b9ec9d00de989e8a82bd4bef91d08da45cdc0"
+dependencies = [
+ "autocfg",
+ "num-integer",
+ "num-traits",
+]
+
+[[package]]
+name = "num-integer"
+version = "0.1.45"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "225d3389fb3509a24c93f5c29eb6bde2586b98d9f016636dff58d7c6f7569cd9"
+dependencies = [
+ "autocfg",
+ "num-traits",
+]
+
 [[package]]
 name = "num-traits"
 version = "0.2.16"
@@ -3394,9 +3434,9 @@ checksum = "ff011a302c396a5197692431fc1948019154afc178baf7d8e37367442a4601cf"
 
 [[package]]
 name = "openssl-src"
-version = "300.1.3+3.1.2"
+version = "300.1.5+3.1.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cd2c101a165fff9935e34def4669595ab1c7847943c42be86e21503e482be107"
+checksum = "559068e4c12950d7dcaa1857a61725c0d38d4fc03ff8e070ab31a75d6e316491"
 dependencies = [
  "cc",
 ]
@@ -3517,6 +3557,15 @@ version = "0.1.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "19b17cddbe7ec3f8bc800887bab5e717348c95ea2ca0b1bf0837fb964dc67099"
 
+[[package]]
+name = "pem"
+version = "1.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a8835c273a76a90455d7344889b0964598e3316e2a79ede8e36f16bdcf2228b8"
+dependencies = [
+ "base64 0.13.1",
+]
+
 [[package]]
 name = "percent-encoding"
 version = "2.3.0"
@@ -3574,7 +3623,7 @@ version = "0.8.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "3dfb61232e34fcb633f43d12c58f83c1df82962dcdfa565a4e866ffc17dafe12"
 dependencies = [
- "phf_macros",
+ "phf_macros 0.8.0",
  "phf_shared 0.8.0",
  "proc-macro-hack",
 ]
@@ -3594,6 +3643,7 @@ version = "0.11.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ade2d8b8f33c7333b51bcf0428d37e217e9f32192ae4772156f65063b8ce03dc"
 dependencies = [
+ "phf_macros 0.11.2",
  "phf_shared 0.11.2",
 ]
 
@@ -3661,6 +3711,19 @@ dependencies = [
  "syn 1.0.109",
 ]
 
+[[package]]
+name = "phf_macros"
+version = "0.11.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3444646e286606587e49f3bcf1679b8cef1dc2c5ecc29ddacaffc305180d464b"
+dependencies = [
+ "phf_generator 0.11.2",
+ "phf_shared 0.11.2",
+ "proc-macro2",
+ "quote",
+ "syn 2.0.31",
+]
+
 [[package]]
 name = "phf_shared"
 version = "0.8.0"
@@ -4202,7 +4265,7 @@ dependencies = [
 [[package]]
 name = "realtime-entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "bytes",
  "collab",
@@ -4823,9 +4886,10 @@ dependencies = [
 [[package]]
 name = "shared_entity"
 version = "0.1.0"
-source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=52b82e68#52b82e68f6e61e9e38606b9110d782870ee911e4"
+source = "git+https://github.com/AppFlowy-IO/AppFlowy-Cloud?rev=141354bfa9d08c387cf9beb9697b89b052790e89#141354bfa9d08c387cf9beb9697b89b052790e89"
 dependencies = [
  "anyhow",
+ "collab-entity",
  "database-entity",
  "gotrue-entity",
  "opener",
@@ -4872,6 +4936,18 @@ version = "2.2.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "420acb44afdae038210c99e69aae24109f32f15500aa708e81d46c9f29d55fcf"
 
+[[package]]
+name = "simple_asn1"
+version = "0.6.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "adc4e5204eb1910f40f9cfa375f6f05b68c3abac4b6fd879c8ff5e7ae8a0a085"
+dependencies = [
+ "num-bigint",
+ "num-traits",
+ "thiserror",
+ "time",
+]
+
 [[package]]
 name = "siphasher"
 version = "0.3.11"
diff --git a/frontend/rust-lib/Cargo.toml b/frontend/rust-lib/Cargo.toml
index 8a127b7a3af5..9f3142145e9d 100644
--- a/frontend/rust-lib/Cargo.toml
+++ b/frontend/rust-lib/Cargo.toml
@@ -82,7 +82,7 @@ incremental = false
 # Run the script:
 # scripts/tool/update_client_api_rev.sh  new_rev_id
 # ⚠️⚠️⚠️️
-client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "52b82e68" }
+client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "141354bfa9d08c387cf9beb9697b89b052790e89" }
 # Please use the following script to update collab.
 # Working directory: frontend
 #
@@ -92,11 +92,11 @@ client-api = { git = "https://github.com/AppFlowy-IO/AppFlowy-Cloud", rev = "52b
 # To switch to the local path, run:
 # scripts/tool/update_collab_source.sh
 # ⚠️⚠️⚠️️
-collab = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-folder = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-document = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-database = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-plugins = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-user = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-entity = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
-collab-persistence = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "2f5734ae" }
+collab = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-folder = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-document = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-database = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-plugins = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-user = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-entity = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
+collab-persistence = { git = "https://github.com/AppFlowy-IO/AppFlowy-Collab", rev = "ff10abd5e" }
diff --git a/frontend/rust-lib/event-integration/src/document/document_event.rs b/frontend/rust-lib/event-integration/src/document/document_event.rs
index 8439d3ffb36d..ab20d240bd39 100644
--- a/frontend/rust-lib/event-integration/src/document/document_event.rs
+++ b/frontend/rust-lib/event-integration/src/document/document_event.rs
@@ -1,18 +1,20 @@
+use std::collections::HashMap;
+
+use serde_json::Value;
+
 use flowy_document2::entities::*;
 use flowy_document2::event_map::DocumentEvent;
 use flowy_folder2::entities::{CreateViewPayloadPB, ViewLayoutPB, ViewPB};
 use flowy_folder2::event_map::FolderEvent;
-use serde_json::Value;
-use std::collections::HashMap;
 
 use crate::document::utils::{gen_delta_str, gen_id, gen_text_block_data};
 use crate::event_builder::EventBuilder;
-use crate::FlowyCoreTest;
+use crate::EventIntegrationTest;
 
 const TEXT_BLOCK_TY: &str = "paragraph";
 
 pub struct DocumentEventTest {
-  inner: FlowyCoreTest,
+  inner: EventIntegrationTest,
 }
 
 pub struct OpenDocumentData {
@@ -22,11 +24,11 @@ pub struct OpenDocumentData {
 
 impl DocumentEventTest {
   pub async fn new() -> Self {
-    let sdk = FlowyCoreTest::new_with_guest_user().await;
+    let sdk = EventIntegrationTest::new_with_guest_user().await;
     Self { inner: sdk }
   }
 
-  pub fn new_with_core(core: FlowyCoreTest) -> Self {
+  pub fn new_with_core(core: EventIntegrationTest) -> Self {
     Self { inner: core }
   }
 
diff --git a/frontend/rust-lib/event-integration/src/event_builder.rs b/frontend/rust-lib/event-integration/src/event_builder.rs
index 943507add39d..a6c0209622f2 100644
--- a/frontend/rust-lib/event-integration/src/event_builder.rs
+++ b/frontend/rust-lib/event-integration/src/event_builder.rs
@@ -10,7 +10,7 @@ use lib_dispatch::prelude::{
   AFPluginDispatcher, AFPluginEventResponse, AFPluginFromBytes, AFPluginRequest, ToBytes, *,
 };
 
-use crate::FlowyCoreTest;
+use crate::EventIntegrationTest;
 
 #[derive(Clone)]
 pub struct EventBuilder {
@@ -18,7 +18,7 @@ pub struct EventBuilder {
 }
 
 impl EventBuilder {
-  pub fn new(sdk: FlowyCoreTest) -> Self {
+  pub fn new(sdk: EventIntegrationTest) -> Self {
     Self {
       context: TestContext::new(sdk),
     }
@@ -121,13 +121,13 @@ impl EventBuilder {
 
 #[derive(Clone)]
 pub struct TestContext {
-  pub sdk: FlowyCoreTest,
+  pub sdk: EventIntegrationTest,
   request: Option<AFPluginRequest>,
   response: Option<AFPluginEventResponse>,
 }
 
 impl TestContext {
-  pub fn new(sdk: FlowyCoreTest) -> Self {
+  pub fn new(sdk: EventIntegrationTest) -> Self {
     Self {
       sdk,
       request: None,
diff --git a/frontend/rust-lib/event-integration/src/folder_event.rs b/frontend/rust-lib/event-integration/src/folder_event.rs
deleted file mode 100644
index a6cbebf09de2..000000000000
--- a/frontend/rust-lib/event-integration/src/folder_event.rs
+++ /dev/null
@@ -1,115 +0,0 @@
-use crate::event_builder::EventBuilder;
-use crate::FlowyCoreTest;
-use flowy_folder2::entities::*;
-use flowy_folder2::event_map::FolderEvent::*;
-
-pub struct ViewTest {
-  pub sdk: FlowyCoreTest,
-  pub workspace: WorkspacePB,
-  pub parent_view: ViewPB,
-  pub child_view: ViewPB,
-}
-
-impl ViewTest {
-  #[allow(dead_code)]
-  pub async fn new(sdk: &FlowyCoreTest, layout: ViewLayoutPB, data: Vec<u8>) -> Self {
-    let workspace = create_workspace(sdk, "Workspace", "").await;
-    open_workspace(sdk, &workspace.id).await;
-    let app = create_app(sdk, "App", "AppFlowy GitHub Project", &workspace.id).await;
-    let view = create_view(sdk, &app.id, layout, data).await;
-    Self {
-      sdk: sdk.clone(),
-      workspace,
-      parent_view: app,
-      child_view: view,
-    }
-  }
-
-  pub async fn new_grid_view(sdk: &FlowyCoreTest, data: Vec<u8>) -> Self {
-    Self::new(sdk, ViewLayoutPB::Grid, data).await
-  }
-
-  pub async fn new_board_view(sdk: &FlowyCoreTest, data: Vec<u8>) -> Self {
-    Self::new(sdk, ViewLayoutPB::Board, data).await
-  }
-
-  pub async fn new_calendar_view(sdk: &FlowyCoreTest, data: Vec<u8>) -> Self {
-    Self::new(sdk, ViewLayoutPB::Calendar, data).await
-  }
-
-  pub async fn new_document_view(sdk: &FlowyCoreTest) -> Self {
-    Self::new(sdk, ViewLayoutPB::Document, vec![]).await
-  }
-}
-
-async fn create_workspace(sdk: &FlowyCoreTest, name: &str, desc: &str) -> WorkspacePB {
-  let request = CreateWorkspacePayloadPB {
-    name: name.to_owned(),
-    desc: desc.to_owned(),
-  };
-
-  EventBuilder::new(sdk.clone())
-    .event(CreateWorkspace)
-    .payload(request)
-    .async_send()
-    .await
-    .parse::<WorkspacePB>()
-}
-
-async fn open_workspace(sdk: &FlowyCoreTest, workspace_id: &str) {
-  let payload = WorkspaceIdPB {
-    value: Some(workspace_id.to_owned()),
-  };
-  let _ = EventBuilder::new(sdk.clone())
-    .event(OpenWorkspace)
-    .payload(payload)
-    .async_send()
-    .await;
-}
-
-async fn create_app(sdk: &FlowyCoreTest, name: &str, desc: &str, workspace_id: &str) -> ViewPB {
-  let create_app_request = CreateViewPayloadPB {
-    parent_view_id: workspace_id.to_owned(),
-    name: name.to_string(),
-    desc: desc.to_string(),
-    thumbnail: None,
-    layout: ViewLayoutPB::Document,
-    initial_data: vec![],
-    meta: Default::default(),
-    set_as_current: true,
-    index: None,
-  };
-
-  EventBuilder::new(sdk.clone())
-    .event(CreateView)
-    .payload(create_app_request)
-    .async_send()
-    .await
-    .parse::<ViewPB>()
-}
-
-async fn create_view(
-  sdk: &FlowyCoreTest,
-  app_id: &str,
-  layout: ViewLayoutPB,
-  data: Vec<u8>,
-) -> ViewPB {
-  let payload = CreateViewPayloadPB {
-    parent_view_id: app_id.to_string(),
-    name: "View A".to_string(),
-    desc: "".to_string(),
-    thumbnail: Some("http://1.png".to_string()),
-    layout,
-    initial_data: data,
-    meta: Default::default(),
-    set_as_current: true,
-    index: None,
-  };
-
-  EventBuilder::new(sdk.clone())
-    .event(CreateView)
-    .payload(payload)
-    .async_send()
-    .await
-    .parse::<ViewPB>()
-}
diff --git a/frontend/rust-lib/event-integration/src/lib.rs b/frontend/rust-lib/event-integration/src/lib.rs
index 373f65e00155..c7fe6c00d9fc 100644
--- a/frontend/rust-lib/event-integration/src/lib.rs
+++ b/frontend/rust-lib/event-integration/src/lib.rs
@@ -1,59 +1,33 @@
-use std::collections::HashMap;
-use std::convert::TryFrom;
 use std::env::temp_dir;
 use std::path::PathBuf;
 use std::sync::Arc;
 
-use bytes::Bytes;
-use collab::core::collab::MutexCollab;
-use collab::core::origin::CollabOrigin;
-use collab::preclude::updates::decoder::Decode;
-use collab::preclude::{merge_updates_v1, Update};
-use collab_document::blocks::DocumentData;
-use collab_document::document::Document;
 use nanoid::nanoid;
 use parking_lot::RwLock;
-use protobuf::ProtobufError;
-use tokio::sync::broadcast::{channel, Sender};
-use uuid::Uuid;
 
 use flowy_core::{AppFlowyCore, AppFlowyCoreConfig};
-use flowy_database2::entities::*;
-use flowy_database2::event_map::DatabaseEvent;
-use flowy_document2::entities::{DocumentDataPB, OpenDocumentPayloadPB};
-use flowy_document2::event_map::DocumentEvent;
-use flowy_folder2::entities::icon::UpdateViewIconPayloadPB;
-use flowy_folder2::entities::*;
-use flowy_folder2::event_map::FolderEvent;
-use flowy_notification::entities::SubscribeObject;
-use flowy_notification::{register_notification_sender, NotificationSender};
-use flowy_server::supabase::define::{USER_DEVICE_ID, USER_EMAIL, USER_SIGN_IN_URL, USER_UUID};
-use flowy_user::entities::{
-  AuthTypePB, OauthSignInPB, SignInUrlPB, SignInUrlPayloadPB, UpdateCloudConfigPB,
-  UserCloudConfigPB, UserProfilePB,
-};
-use flowy_user::errors::{FlowyError, FlowyResult};
-use flowy_user::event_map::UserEvent::*;
+use flowy_notification::register_notification_sender;
+use flowy_user::entities::AuthTypePB;
 
-use crate::document::document_event::{DocumentEventTest, OpenDocumentData};
-use crate::event_builder::EventBuilder;
-use crate::user_event::{async_sign_up, SignUpContext};
+use crate::test_user::TestNotificationSender;
 
 pub mod document;
 pub mod event_builder;
-pub mod folder_event;
-pub mod user_event;
+pub mod test_database;
+pub mod test_document;
+pub mod test_folder;
+pub mod test_user;
 
 #[derive(Clone)]
-pub struct FlowyCoreTest {
-  auth_type: Arc<RwLock<AuthTypePB>>,
-  inner: AppFlowyCore,
+pub struct EventIntegrationTest {
+  pub auth_type: Arc<RwLock<AuthTypePB>>,
+  pub inner: AppFlowyCore,
   #[allow(dead_code)]
   cleaner: Arc<Cleaner>,
   pub notification_sender: TestNotificationSender,
 }
 
-impl Default for FlowyCoreTest {
+impl Default for EventIntegrationTest {
   fn default() -> Self {
     let temp_dir = temp_dir().join(nanoid!(6));
     std::fs::create_dir_all(&temp_dir).unwrap();
@@ -61,50 +35,10 @@ impl Default for FlowyCoreTest {
   }
 }
 
-impl FlowyCoreTest {
+impl EventIntegrationTest {
   pub fn new() -> Self {
     Self::default()
   }
-
-  pub async fn insert_document_text(&self, document_id: &str, text: &str, index: usize) {
-    let document_event = DocumentEventTest::new_with_core(self.clone());
-    document_event
-      .insert_index(document_id, text, index, None)
-      .await;
-  }
-
-  pub async fn get_document_data(&self, view_id: &str) -> DocumentData {
-    let pb = EventBuilder::new(self.clone())
-      .event(DocumentEvent::GetDocumentData)
-      .payload(OpenDocumentPayloadPB {
-        document_id: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<DocumentDataPB>();
-
-    DocumentData::from(pb)
-  }
-
-  pub async fn get_document_update(&self, document_id: &str) -> Vec<u8> {
-    let cloud_service = self.document_manager.get_cloud_service().clone();
-    let remote_updates = cloud_service
-      .get_document_updates(document_id)
-      .await
-      .unwrap();
-
-    if remote_updates.is_empty() {
-      return vec![];
-    }
-
-    let updates = remote_updates
-      .iter()
-      .map(|update| update.as_ref())
-      .collect::<Vec<&[u8]>>();
-
-    merge_updates_v1(&updates).unwrap()
-  }
-
   pub fn new_with_user_data_path(path: PathBuf, name: String) -> Self {
     let config = AppFlowyCoreConfig::new(path.to_str().unwrap(), name).log_filter(
       "trace",
@@ -128,719 +62,9 @@ impl FlowyCoreTest {
       cleaner: Arc::new(Cleaner(path)),
     }
   }
-
-  pub async fn enable_encryption(&self) -> String {
-    let config = EventBuilder::new(self.clone())
-      .event(GetCloudConfig)
-      .async_send()
-      .await
-      .parse::<UserCloudConfigPB>();
-    let update = UpdateCloudConfigPB {
-      enable_sync: None,
-      enable_encrypt: Some(true),
-    };
-    let error = EventBuilder::new(self.clone())
-      .event(SetCloudConfig)
-      .payload(update)
-      .async_send()
-      .await
-      .error();
-    assert!(error.is_none());
-    config.encrypt_secret
-  }
-
-  pub async fn get_user_profile(&self) -> Result<UserProfilePB, FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(GetUserProfile)
-      .async_send()
-      .await
-      .try_parse::<UserProfilePB>()
-  }
-
-  pub async fn new_with_guest_user() -> Self {
-    let test = Self::default();
-    test.sign_up_as_guest().await;
-    test
-  }
-
-  pub async fn sign_up_as_guest(&self) -> SignUpContext {
-    async_sign_up(self.inner.dispatcher(), AuthTypePB::Local).await
-  }
-
-  pub async fn supabase_party_sign_up(&self) -> UserProfilePB {
-    let map = third_party_sign_up_param(Uuid::new_v4().to_string());
-    let payload = OauthSignInPB {
-      map,
-      auth_type: AuthTypePB::Supabase,
-    };
-
-    EventBuilder::new(self.clone())
-      .event(OauthSignIn)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<UserProfilePB>()
-  }
-
-  pub async fn sign_out(&self) {
-    EventBuilder::new(self.clone())
-      .event(SignOut)
-      .async_send()
-      .await;
-  }
-
-  pub fn set_auth_type(&self, auth_type: AuthTypePB) {
-    *self.auth_type.write() = auth_type;
-  }
-
-  pub async fn init_user(&self) -> UserProfilePB {
-    self.sign_up_as_guest().await.user_profile
-  }
-
-  pub async fn af_cloud_sign_in_with_email(&self, email: &str) -> FlowyResult<UserProfilePB> {
-    let payload = SignInUrlPayloadPB {
-      email: email.to_string(),
-      auth_type: AuthTypePB::AFCloud,
-    };
-    let sign_in_url = EventBuilder::new(self.clone())
-      .event(GetSignInURL)
-      .payload(payload)
-      .async_send()
-      .await
-      .try_parse::<SignInUrlPB>()?
-      .sign_in_url;
-
-    let mut map = HashMap::new();
-    map.insert(USER_SIGN_IN_URL.to_string(), sign_in_url);
-    map.insert(USER_DEVICE_ID.to_string(), uuid::Uuid::new_v4().to_string());
-    let payload = OauthSignInPB {
-      map,
-      auth_type: AuthTypePB::AFCloud,
-    };
-
-    let user_profile = EventBuilder::new(self.clone())
-      .event(OauthSignIn)
-      .payload(payload)
-      .async_send()
-      .await
-      .try_parse::<UserProfilePB>()?;
-
-    Ok(user_profile)
-  }
-
-  pub async fn supabase_sign_up_with_uuid(
-    &self,
-    uuid: &str,
-    email: Option<String>,
-  ) -> FlowyResult<UserProfilePB> {
-    let mut map = HashMap::new();
-    map.insert(USER_UUID.to_string(), uuid.to_string());
-    map.insert(USER_DEVICE_ID.to_string(), uuid.to_string());
-    map.insert(
-      USER_EMAIL.to_string(),
-      email.unwrap_or_else(|| format!("{}@appflowy.io", nanoid!(10))),
-    );
-    let payload = OauthSignInPB {
-      map,
-      auth_type: AuthTypePB::Supabase,
-    };
-
-    let user_profile = EventBuilder::new(self.clone())
-      .event(OauthSignIn)
-      .payload(payload)
-      .async_send()
-      .await
-      .try_parse::<UserProfilePB>()?;
-
-    Ok(user_profile)
-  }
-
-  // Must sign up/ sign in first
-  pub async fn get_current_workspace(&self) -> WorkspaceSettingPB {
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::GetCurrentWorkspace)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::WorkspaceSettingPB>()
-  }
-
-  pub async fn get_all_workspace_views(&self) -> Vec<ViewPB> {
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::ReadWorkspaceViews)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::RepeatedViewPB>()
-      .items
-  }
-
-  pub async fn get_views(&self, parent_view_id: &str) -> ViewPB {
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::ReadView)
-      .payload(ViewIdPB {
-        value: parent_view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
-
-  pub async fn delete_view(&self, view_id: &str) {
-    let payload = RepeatedViewIdPB {
-      items: vec![view_id.to_string()],
-    };
-
-    // delete the view. the view will be moved to trash
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::DeleteView)
-      .payload(payload)
-      .async_send()
-      .await;
-  }
-
-  pub async fn update_view(&self, changeset: UpdateViewPayloadPB) -> Option<FlowyError> {
-    // delete the view. the view will be moved to trash
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::UpdateView)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_view_icon(&self, payload: UpdateViewIconPayloadPB) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::UpdateViewIcon)
-      .payload(payload)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn create_view(&self, parent_id: &str, name: String) -> ViewPB {
-    let payload = CreateViewPayloadPB {
-      parent_view_id: parent_id.to_string(),
-      name,
-      desc: "".to_string(),
-      thumbnail: None,
-      layout: Default::default(),
-      initial_data: vec![],
-      meta: Default::default(),
-      set_as_current: false,
-      index: None,
-    };
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::CreateView)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
-
-  pub async fn create_document(
-    &self,
-    parent_id: &str,
-    name: String,
-    initial_data: Vec<u8>,
-  ) -> ViewPB {
-    let payload = CreateViewPayloadPB {
-      parent_view_id: parent_id.to_string(),
-      name,
-      desc: "".to_string(),
-      thumbnail: None,
-      layout: ViewLayoutPB::Document,
-      initial_data,
-      meta: Default::default(),
-      set_as_current: true,
-      index: None,
-    };
-    let view = EventBuilder::new(self.clone())
-      .event(FolderEvent::CreateView)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<ViewPB>();
-
-    let payload = OpenDocumentPayloadPB {
-      document_id: view.id.clone(),
-    };
-
-    let _ = EventBuilder::new(self.clone())
-      .event(DocumentEvent::OpenDocument)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<DocumentDataPB>();
-
-    view
-  }
-
-  pub async fn create_grid(&self, parent_id: &str, name: String, initial_data: Vec<u8>) -> ViewPB {
-    let payload = CreateViewPayloadPB {
-      parent_view_id: parent_id.to_string(),
-      name,
-      desc: "".to_string(),
-      thumbnail: None,
-      layout: ViewLayoutPB::Grid,
-      initial_data,
-      meta: Default::default(),
-      set_as_current: true,
-      index: None,
-    };
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::CreateView)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
-
-  pub async fn open_database(&self, view_id: &str) {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetDatabase)
-      .payload(DatabaseViewIdPB {
-        value: view_id.to_string(),
-      })
-      .async_send()
-      .await;
-  }
-
-  pub async fn open_document(&self, doc_id: String) -> OpenDocumentData {
-    let payload = OpenDocumentPayloadPB {
-      document_id: doc_id.clone(),
-    };
-    let data = EventBuilder::new(self.clone())
-      .event(DocumentEvent::OpenDocument)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<DocumentDataPB>();
-    OpenDocumentData { id: doc_id, data }
-  }
-
-  pub async fn create_board(&self, parent_id: &str, name: String, initial_data: Vec<u8>) -> ViewPB {
-    let payload = CreateViewPayloadPB {
-      parent_view_id: parent_id.to_string(),
-      name,
-      desc: "".to_string(),
-      thumbnail: None,
-      layout: ViewLayoutPB::Board,
-      initial_data,
-      meta: Default::default(),
-      set_as_current: true,
-      index: None,
-    };
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::CreateView)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
-
-  pub async fn create_calendar(
-    &self,
-    parent_id: &str,
-    name: String,
-    initial_data: Vec<u8>,
-  ) -> ViewPB {
-    let payload = CreateViewPayloadPB {
-      parent_view_id: parent_id.to_string(),
-      name,
-      desc: "".to_string(),
-      thumbnail: None,
-      layout: ViewLayoutPB::Calendar,
-      initial_data,
-      meta: Default::default(),
-      set_as_current: true,
-      index: None,
-    };
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::CreateView)
-      .payload(payload)
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
-
-  pub async fn get_database(&self, view_id: &str) -> DatabasePB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetDatabase)
-      .payload(DatabaseViewIdPB {
-        value: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<flowy_database2::entities::DatabasePB>()
-  }
-
-  pub async fn get_all_database_fields(&self, view_id: &str) -> RepeatedFieldPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetFields)
-      .payload(GetFieldPayloadPB {
-        view_id: view_id.to_string(),
-        field_ids: None,
-      })
-      .async_send()
-      .await
-      .parse::<RepeatedFieldPB>()
-  }
-
-  pub async fn create_field(&self, view_id: &str, field_type: FieldType) -> FieldPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::CreateTypeOption)
-      .payload(CreateFieldPayloadPB {
-        view_id: view_id.to_string(),
-        field_type,
-        type_option_data: None,
-      })
-      .async_send()
-      .await
-      .parse::<TypeOptionPB>()
-      .field
-  }
-
-  pub async fn update_field(&self, changeset: FieldChangesetPB) {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateField)
-      .payload(changeset)
-      .async_send()
-      .await;
-  }
-
-  pub async fn delete_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::DeleteField)
-      .payload(DeleteFieldPayloadPB {
-        view_id: view_id.to_string(),
-        field_id: field_id.to_string(),
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_field_type(
-    &self,
-    view_id: &str,
-    field_id: &str,
-    field_type: FieldType,
-  ) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateFieldType)
-      .payload(UpdateFieldTypePayloadPB {
-        view_id: view_id.to_string(),
-        field_id: field_id.to_string(),
-        field_type,
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn duplicate_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::DuplicateField)
-      .payload(DuplicateFieldPayloadPB {
-        view_id: view_id.to_string(),
-        field_id: field_id.to_string(),
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn get_primary_field(&self, database_view_id: &str) -> FieldPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetPrimaryField)
-      .payload(DatabaseViewIdPB {
-        value: database_view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<FieldPB>()
-  }
-
-  pub async fn create_row(
-    &self,
-    view_id: &str,
-    start_row_id: Option<String>,
-    data: Option<RowDataPB>,
-  ) -> RowMetaPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::CreateRow)
-      .payload(CreateRowPayloadPB {
-        view_id: view_id.to_string(),
-        start_row_id,
-        group_id: None,
-        data,
-      })
-      .async_send()
-      .await
-      .parse::<RowMetaPB>()
-  }
-
-  pub async fn delete_row(&self, view_id: &str, row_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::DeleteRow)
-      .payload(RowIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        group_id: None,
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn get_row(&self, view_id: &str, row_id: &str) -> OptionalRowPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetRow)
-      .payload(RowIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        group_id: None,
-      })
-      .async_send()
-      .await
-      .parse::<OptionalRowPB>()
-  }
-
-  pub async fn get_row_meta(&self, view_id: &str, row_id: &str) -> RowMetaPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetRowMeta)
-      .payload(RowIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        group_id: None,
-      })
-      .async_send()
-      .await
-      .parse::<RowMetaPB>()
-  }
-
-  pub async fn update_row_meta(&self, changeset: UpdateRowMetaChangesetPB) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateRowMeta)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn duplicate_row(&self, view_id: &str, row_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::DuplicateRow)
-      .payload(RowIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        group_id: None,
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn move_row(&self, view_id: &str, row_id: &str, to_row_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::MoveRow)
-      .payload(MoveRowPayloadPB {
-        view_id: view_id.to_string(),
-        from_row_id: row_id.to_string(),
-        to_row_id: to_row_id.to_string(),
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_cell(&self, changeset: CellChangesetPB) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateCell)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_date_cell(&self, changeset: DateChangesetPB) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateDateCell)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn get_cell(&self, view_id: &str, row_id: &str, field_id: &str) -> CellPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetCell)
-      .payload(CellIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        field_id: field_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<CellPB>()
-  }
-
-  pub async fn get_date_cell(&self, view_id: &str, row_id: &str, field_id: &str) -> DateCellDataPB {
-    let cell = self.get_cell(view_id, row_id, field_id).await;
-    DateCellDataPB::try_from(Bytes::from(cell.data)).unwrap()
-  }
-
-  pub async fn get_checklist_cell(
-    &self,
-    view_id: &str,
-    field_id: &str,
-    row_id: &str,
-  ) -> ChecklistCellDataPB {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetChecklistCellData)
-      .payload(CellIdPB {
-        view_id: view_id.to_string(),
-        row_id: row_id.to_string(),
-        field_id: field_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<ChecklistCellDataPB>()
-  }
-
-  pub async fn update_checklist_cell(
-    &self,
-    changeset: ChecklistCellDataChangesetPB,
-  ) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateChecklistCell)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn insert_option(
-    &self,
-    view_id: &str,
-    field_id: &str,
-    row_id: &str,
-    name: &str,
-  ) -> Option<FlowyError> {
-    let option = EventBuilder::new(self.clone())
-      .event(DatabaseEvent::CreateSelectOption)
-      .payload(CreateSelectOptionPayloadPB {
-        field_id: field_id.to_string(),
-        view_id: view_id.to_string(),
-        option_name: name.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<SelectOptionPB>();
-
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::InsertOrUpdateSelectOption)
-      .payload(RepeatedSelectOptionPayload {
-        view_id: view_id.to_string(),
-        field_id: field_id.to_string(),
-        row_id: row_id.to_string(),
-        items: vec![option],
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn get_groups(&self, view_id: &str) -> Vec<GroupPB> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetGroups)
-      .payload(DatabaseViewIdPB {
-        value: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<RepeatedGroupPB>()
-      .items
-  }
-
-  pub async fn move_group(&self, view_id: &str, from_id: &str, to_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::MoveGroup)
-      .payload(MoveGroupPayloadPB {
-        view_id: view_id.to_string(),
-        from_group_id: from_id.to_string(),
-        to_group_id: to_id.to_string(),
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn set_group_by_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::SetGroupByField)
-      .payload(GroupByFieldPayloadPB {
-        field_id: field_id.to_string(),
-        view_id: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_group(
-    &self,
-    view_id: &str,
-    group_id: &str,
-    name: Option<String>,
-    visible: Option<bool>,
-  ) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateGroup)
-      .payload(UpdateGroupPB {
-        view_id: view_id.to_string(),
-        group_id: group_id.to_string(),
-        name,
-        visible,
-      })
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn update_setting(&self, changeset: DatabaseSettingChangesetPB) -> Option<FlowyError> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::UpdateDatabaseSetting)
-      .payload(changeset)
-      .async_send()
-      .await
-      .error()
-  }
-
-  pub async fn get_all_calendar_events(&self, view_id: &str) -> Vec<CalendarEventPB> {
-    EventBuilder::new(self.clone())
-      .event(DatabaseEvent::GetAllCalendarEvents)
-      .payload(CalendarEventRequestPB {
-        view_id: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<RepeatedCalendarEventPB>()
-      .items
-  }
-
-  pub async fn get_view(&self, view_id: &str) -> ViewPB {
-    EventBuilder::new(self.clone())
-      .event(FolderEvent::ReadView)
-      .payload(ViewIdPB {
-        value: view_id.to_string(),
-      })
-      .async_send()
-      .await
-      .parse::<flowy_folder2::entities::ViewPB>()
-  }
 }
 
-impl std::ops::Deref for FlowyCoreTest {
+impl std::ops::Deref for EventIntegrationTest {
   type Target = AppFlowyCore;
 
   fn deref(&self) -> &Self::Target {
@@ -848,89 +72,6 @@ impl std::ops::Deref for FlowyCoreTest {
   }
 }
 
-#[derive(Clone)]
-pub struct TestNotificationSender {
-  sender: Arc<Sender<SubscribeObject>>,
-}
-
-impl Default for TestNotificationSender {
-  fn default() -> Self {
-    let (sender, _) = channel(1000);
-    Self {
-      sender: Arc::new(sender),
-    }
-  }
-}
-
-impl TestNotificationSender {
-  pub fn new() -> Self {
-    Self::default()
-  }
-
-  pub fn subscribe<T>(&self, id: &str, ty: impl Into<i32> + Send) -> tokio::sync::mpsc::Receiver<T>
-  where
-    T: TryFrom<Bytes, Error = ProtobufError> + Send + 'static,
-  {
-    let id = id.to_string();
-    let (tx, rx) = tokio::sync::mpsc::channel::<T>(10);
-    let mut receiver = self.sender.subscribe();
-    let ty = ty.into();
-    tokio::spawn(async move {
-      // DatabaseNotification::DidUpdateDatabaseSnapshotState
-      while let Ok(value) = receiver.recv().await {
-        if value.id == id && value.ty == ty {
-          if let Some(payload) = value.payload {
-            match T::try_from(Bytes::from(payload)) {
-              Ok(object) => {
-                let _ = tx.send(object).await;
-              },
-              Err(e) => {
-                panic!(
-                  "Failed to parse notification payload to type: {:?} with error: {}",
-                  std::any::type_name::<T>(),
-                  e
-                );
-              },
-            }
-          }
-        }
-      }
-    });
-    rx
-  }
-
-  pub fn subscribe_with_condition<T, F>(&self, id: &str, when: F) -> tokio::sync::mpsc::Receiver<T>
-  where
-    T: TryFrom<Bytes, Error = ProtobufError> + Send + 'static,
-    F: Fn(&T) -> bool + Send + 'static,
-  {
-    let id = id.to_string();
-    let (tx, rx) = tokio::sync::mpsc::channel::<T>(10);
-    let mut receiver = self.sender.subscribe();
-    tokio::spawn(async move {
-      while let Ok(value) = receiver.recv().await {
-        if value.id == id {
-          if let Some(payload) = value.payload {
-            if let Ok(object) = T::try_from(Bytes::from(payload)) {
-              if when(&object) {
-                let _ = tx.send(object).await;
-              }
-            }
-          }
-        }
-      }
-    });
-    rx
-  }
-}
-
-impl NotificationSender for TestNotificationSender {
-  fn send_subject(&self, subject: SubscribeObject) -> Result<(), String> {
-    let _ = self.sender.send(subject);
-    Ok(())
-  }
-}
-
 pub struct Cleaner(PathBuf);
 
 impl Cleaner {
@@ -948,25 +89,3 @@ impl Drop for Cleaner {
     Self::cleanup(&self.0)
   }
 }
-
-pub fn third_party_sign_up_param(uuid: String) -> HashMap<String, String> {
-  let mut params = HashMap::new();
-  params.insert(USER_UUID.to_string(), uuid);
-  params.insert(
-    USER_EMAIL.to_string(),
-    format!("{}@test.com", Uuid::new_v4()),
-  );
-  params.insert(USER_DEVICE_ID.to_string(), Uuid::new_v4().to_string());
-  params
-}
-
-pub fn assert_document_data_equal(collab_update: &[u8], doc_id: &str, expected: DocumentData) {
-  let collab = MutexCollab::new(CollabOrigin::Server, doc_id, vec![]);
-  collab.lock().with_origin_transact_mut(|txn| {
-    let update = Update::decode_v1(collab_update).unwrap();
-    txn.apply_update(update);
-  });
-  let document = Document::open(Arc::new(collab)).unwrap();
-  let actual = document.get_document_data().unwrap();
-  assert_eq!(actual, expected);
-}
diff --git a/frontend/rust-lib/event-integration/src/test_database.rs b/frontend/rust-lib/event-integration/src/test_database.rs
new file mode 100644
index 000000000000..ebd258e4b131
--- /dev/null
+++ b/frontend/rust-lib/event-integration/src/test_database.rs
@@ -0,0 +1,447 @@
+use std::convert::TryFrom;
+
+use bytes::Bytes;
+
+use flowy_database2::entities::*;
+use flowy_database2::event_map::DatabaseEvent;
+use flowy_folder2::entities::*;
+use flowy_folder2::event_map::FolderEvent;
+use flowy_user::errors::FlowyError;
+
+use crate::event_builder::EventBuilder;
+use crate::EventIntegrationTest;
+
+impl EventIntegrationTest {
+  pub async fn create_grid(&self, parent_id: &str, name: String, initial_data: Vec<u8>) -> ViewPB {
+    let payload = CreateViewPayloadPB {
+      parent_view_id: parent_id.to_string(),
+      name,
+      desc: "".to_string(),
+      thumbnail: None,
+      layout: ViewLayoutPB::Grid,
+      initial_data,
+      meta: Default::default(),
+      set_as_current: true,
+      index: None,
+    };
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+
+  pub async fn open_database(&self, view_id: &str) {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetDatabase)
+      .payload(DatabaseViewIdPB {
+        value: view_id.to_string(),
+      })
+      .async_send()
+      .await;
+  }
+
+  pub async fn create_board(&self, parent_id: &str, name: String, initial_data: Vec<u8>) -> ViewPB {
+    let payload = CreateViewPayloadPB {
+      parent_view_id: parent_id.to_string(),
+      name,
+      desc: "".to_string(),
+      thumbnail: None,
+      layout: ViewLayoutPB::Board,
+      initial_data,
+      meta: Default::default(),
+      set_as_current: true,
+      index: None,
+    };
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+
+  pub async fn create_calendar(
+    &self,
+    parent_id: &str,
+    name: String,
+    initial_data: Vec<u8>,
+  ) -> ViewPB {
+    let payload = CreateViewPayloadPB {
+      parent_view_id: parent_id.to_string(),
+      name,
+      desc: "".to_string(),
+      thumbnail: None,
+      layout: ViewLayoutPB::Calendar,
+      initial_data,
+      meta: Default::default(),
+      set_as_current: true,
+      index: None,
+    };
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+
+  pub async fn get_database(&self, view_id: &str) -> DatabasePB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetDatabase)
+      .payload(DatabaseViewIdPB {
+        value: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<DatabasePB>()
+  }
+
+  pub async fn get_all_database_fields(&self, view_id: &str) -> RepeatedFieldPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetFields)
+      .payload(GetFieldPayloadPB {
+        view_id: view_id.to_string(),
+        field_ids: None,
+      })
+      .async_send()
+      .await
+      .parse::<RepeatedFieldPB>()
+  }
+
+  pub async fn create_field(&self, view_id: &str, field_type: FieldType) -> FieldPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::CreateTypeOption)
+      .payload(CreateFieldPayloadPB {
+        view_id: view_id.to_string(),
+        field_type,
+        type_option_data: None,
+      })
+      .async_send()
+      .await
+      .parse::<TypeOptionPB>()
+      .field
+  }
+
+  pub async fn update_field(&self, changeset: FieldChangesetPB) {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateField)
+      .payload(changeset)
+      .async_send()
+      .await;
+  }
+
+  pub async fn delete_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::DeleteField)
+      .payload(DeleteFieldPayloadPB {
+        view_id: view_id.to_string(),
+        field_id: field_id.to_string(),
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_field_type(
+    &self,
+    view_id: &str,
+    field_id: &str,
+    field_type: FieldType,
+  ) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateFieldType)
+      .payload(UpdateFieldTypePayloadPB {
+        view_id: view_id.to_string(),
+        field_id: field_id.to_string(),
+        field_type,
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn duplicate_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::DuplicateField)
+      .payload(DuplicateFieldPayloadPB {
+        view_id: view_id.to_string(),
+        field_id: field_id.to_string(),
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn get_primary_field(&self, database_view_id: &str) -> FieldPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetPrimaryField)
+      .payload(DatabaseViewIdPB {
+        value: database_view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<FieldPB>()
+  }
+
+  pub async fn create_row(
+    &self,
+    view_id: &str,
+    start_row_id: Option<String>,
+    data: Option<RowDataPB>,
+  ) -> RowMetaPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::CreateRow)
+      .payload(CreateRowPayloadPB {
+        view_id: view_id.to_string(),
+        start_row_id,
+        group_id: None,
+        data,
+      })
+      .async_send()
+      .await
+      .parse::<RowMetaPB>()
+  }
+
+  pub async fn delete_row(&self, view_id: &str, row_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::DeleteRow)
+      .payload(RowIdPB {
+        view_id: view_id.to_string(),
+        row_id: row_id.to_string(),
+        group_id: None,
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn get_row(&self, view_id: &str, row_id: &str) -> OptionalRowPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetRow)
+      .payload(RowIdPB {
+        view_id: view_id.to_string(),
+        row_id: row_id.to_string(),
+        group_id: None,
+      })
+      .async_send()
+      .await
+      .parse::<OptionalRowPB>()
+  }
+
+  pub async fn get_row_meta(&self, view_id: &str, row_id: &str) -> RowMetaPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetRowMeta)
+      .payload(RowIdPB {
+        view_id: view_id.to_string(),
+        row_id: row_id.to_string(),
+        group_id: None,
+      })
+      .async_send()
+      .await
+      .parse::<RowMetaPB>()
+  }
+
+  pub async fn update_row_meta(&self, changeset: UpdateRowMetaChangesetPB) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateRowMeta)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn duplicate_row(&self, view_id: &str, row_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::DuplicateRow)
+      .payload(RowIdPB {
+        view_id: view_id.to_string(),
+        row_id: row_id.to_string(),
+        group_id: None,
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn move_row(&self, view_id: &str, row_id: &str, to_row_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::MoveRow)
+      .payload(MoveRowPayloadPB {
+        view_id: view_id.to_string(),
+        from_row_id: row_id.to_string(),
+        to_row_id: to_row_id.to_string(),
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_cell(&self, changeset: CellChangesetPB) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateCell)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_date_cell(&self, changeset: DateChangesetPB) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateDateCell)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn get_cell(&self, view_id: &str, row_id: &str, field_id: &str) -> CellPB {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetCell)
+      .payload(CellIdPB {
+        view_id: view_id.to_string(),
+        row_id: row_id.to_string(),
+        field_id: field_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<CellPB>()
+  }
+
+  pub async fn get_date_cell(&self, view_id: &str, row_id: &str, field_id: &str) -> DateCellDataPB {
+    let cell = self.get_cell(view_id, row_id, field_id).await;
+    DateCellDataPB::try_from(Bytes::from(cell.data)).unwrap()
+  }
+
+  pub async fn get_checklist_cell(
+    &self,
+    view_id: &str,
+    field_id: &str,
+    row_id: &str,
+  ) -> ChecklistCellDataPB {
+    let cell = self.get_cell(view_id, row_id, field_id).await;
+    ChecklistCellDataPB::try_from(Bytes::from(cell.data)).unwrap()
+  }
+
+  pub async fn update_checklist_cell(
+    &self,
+    changeset: ChecklistCellDataChangesetPB,
+  ) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateChecklistCell)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn insert_option(
+    &self,
+    view_id: &str,
+    field_id: &str,
+    row_id: &str,
+    name: &str,
+  ) -> Option<FlowyError> {
+    let option = EventBuilder::new(self.clone())
+      .event(DatabaseEvent::CreateSelectOption)
+      .payload(CreateSelectOptionPayloadPB {
+        field_id: field_id.to_string(),
+        view_id: view_id.to_string(),
+        option_name: name.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<SelectOptionPB>();
+
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::InsertOrUpdateSelectOption)
+      .payload(RepeatedSelectOptionPayload {
+        view_id: view_id.to_string(),
+        field_id: field_id.to_string(),
+        row_id: row_id.to_string(),
+        items: vec![option],
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn get_groups(&self, view_id: &str) -> Vec<GroupPB> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetGroups)
+      .payload(DatabaseViewIdPB {
+        value: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<RepeatedGroupPB>()
+      .items
+  }
+
+  pub async fn move_group(&self, view_id: &str, from_id: &str, to_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::MoveGroup)
+      .payload(MoveGroupPayloadPB {
+        view_id: view_id.to_string(),
+        from_group_id: from_id.to_string(),
+        to_group_id: to_id.to_string(),
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn set_group_by_field(&self, view_id: &str, field_id: &str) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::SetGroupByField)
+      .payload(GroupByFieldPayloadPB {
+        field_id: field_id.to_string(),
+        view_id: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_group(
+    &self,
+    view_id: &str,
+    group_id: &str,
+    name: Option<String>,
+    visible: Option<bool>,
+  ) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateGroup)
+      .payload(UpdateGroupPB {
+        view_id: view_id.to_string(),
+        group_id: group_id.to_string(),
+        name,
+        visible,
+      })
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_setting(&self, changeset: DatabaseSettingChangesetPB) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::UpdateDatabaseSetting)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn get_all_calendar_events(&self, view_id: &str) -> Vec<CalendarEventPB> {
+    EventBuilder::new(self.clone())
+      .event(DatabaseEvent::GetAllCalendarEvents)
+      .payload(CalendarEventRequestPB {
+        view_id: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<RepeatedCalendarEventPB>()
+      .items
+  }
+}
diff --git a/frontend/rust-lib/event-integration/src/test_document.rs b/frontend/rust-lib/event-integration/src/test_document.rs
new file mode 100644
index 000000000000..45029f2d3660
--- /dev/null
+++ b/frontend/rust-lib/event-integration/src/test_document.rs
@@ -0,0 +1,119 @@
+use std::sync::Arc;
+
+use collab::core::collab::MutexCollab;
+use collab::core::origin::CollabOrigin;
+use collab::preclude::updates::decoder::Decode;
+use collab::preclude::{merge_updates_v1, Update};
+use collab_document::blocks::DocumentData;
+use collab_document::document::Document;
+
+use flowy_document2::entities::{DocumentDataPB, OpenDocumentPayloadPB};
+use flowy_document2::event_map::DocumentEvent;
+use flowy_folder2::entities::{CreateViewPayloadPB, ViewLayoutPB, ViewPB};
+use flowy_folder2::event_map::FolderEvent;
+
+use crate::document::document_event::{DocumentEventTest, OpenDocumentData};
+use crate::event_builder::EventBuilder;
+use crate::EventIntegrationTest;
+
+impl EventIntegrationTest {
+  pub async fn create_document(
+    &self,
+    parent_id: &str,
+    name: String,
+    initial_data: Vec<u8>,
+  ) -> ViewPB {
+    let payload = CreateViewPayloadPB {
+      parent_view_id: parent_id.to_string(),
+      name,
+      desc: "".to_string(),
+      thumbnail: None,
+      layout: ViewLayoutPB::Document,
+      initial_data,
+      meta: Default::default(),
+      set_as_current: true,
+      index: None,
+    };
+    let view = EventBuilder::new(self.clone())
+      .event(FolderEvent::CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>();
+
+    let payload = OpenDocumentPayloadPB {
+      document_id: view.id.clone(),
+    };
+
+    let _ = EventBuilder::new(self.clone())
+      .event(DocumentEvent::OpenDocument)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<DocumentDataPB>();
+
+    view
+  }
+  pub async fn open_document(&self, doc_id: String) -> OpenDocumentData {
+    let payload = OpenDocumentPayloadPB {
+      document_id: doc_id.clone(),
+    };
+    let data = EventBuilder::new(self.clone())
+      .event(DocumentEvent::OpenDocument)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<DocumentDataPB>();
+    OpenDocumentData { id: doc_id, data }
+  }
+  pub async fn insert_document_text(&self, document_id: &str, text: &str, index: usize) {
+    let document_event = DocumentEventTest::new_with_core(self.clone());
+    document_event
+      .insert_index(document_id, text, index, None)
+      .await;
+  }
+
+  pub async fn get_document_data(&self, view_id: &str) -> DocumentData {
+    let pb = EventBuilder::new(self.clone())
+      .event(DocumentEvent::GetDocumentData)
+      .payload(OpenDocumentPayloadPB {
+        document_id: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<DocumentDataPB>();
+
+    DocumentData::from(pb)
+  }
+
+  pub async fn get_document_update(&self, document_id: &str) -> Vec<u8> {
+    let workspace_id = self.user_manager.workspace_id().unwrap();
+    let cloud_service = self.document_manager.get_cloud_service().clone();
+    let remote_updates = cloud_service
+      .get_document_updates(document_id, &workspace_id)
+      .await
+      .unwrap();
+
+    if remote_updates.is_empty() {
+      return vec![];
+    }
+
+    let updates = remote_updates
+      .iter()
+      .map(|update| update.as_ref())
+      .collect::<Vec<&[u8]>>();
+
+    merge_updates_v1(&updates).unwrap()
+  }
+}
+
+pub fn assert_document_data_equal(collab_update: &[u8], doc_id: &str, expected: DocumentData) {
+  let collab = MutexCollab::new(CollabOrigin::Server, doc_id, vec![]);
+  collab.lock().with_origin_transact_mut(|txn| {
+    let update = Update::decode_v1(collab_update).unwrap();
+    txn.apply_update(update);
+  });
+  let document = Document::open(Arc::new(collab)).unwrap();
+  let actual = document.get_document_data().unwrap();
+  assert_eq!(actual, expected);
+}
diff --git a/frontend/rust-lib/event-integration/src/test_folder.rs b/frontend/rust-lib/event-integration/src/test_folder.rs
new file mode 100644
index 000000000000..d5f0e7a141c2
--- /dev/null
+++ b/frontend/rust-lib/event-integration/src/test_folder.rs
@@ -0,0 +1,173 @@
+use flowy_folder2::entities::icon::UpdateViewIconPayloadPB;
+use flowy_folder2::entities::*;
+use flowy_folder2::event_map::FolderEvent;
+use flowy_folder2::event_map::FolderEvent::*;
+use flowy_user::errors::FlowyError;
+
+use crate::event_builder::EventBuilder;
+use crate::EventIntegrationTest;
+
+impl EventIntegrationTest {
+  // Must sign up/ sign in first
+  pub async fn get_current_workspace(&self) -> WorkspaceSettingPB {
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::GetCurrentWorkspace)
+      .async_send()
+      .await
+      .parse::<WorkspaceSettingPB>()
+  }
+
+  pub async fn get_all_workspace_views(&self) -> Vec<ViewPB> {
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::ReadWorkspaceViews)
+      .async_send()
+      .await
+      .parse::<RepeatedViewPB>()
+      .items
+  }
+
+  pub async fn get_views(&self, parent_view_id: &str) -> ViewPB {
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::ReadView)
+      .payload(ViewIdPB {
+        value: parent_view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+
+  pub async fn delete_view(&self, view_id: &str) {
+    let payload = RepeatedViewIdPB {
+      items: vec![view_id.to_string()],
+    };
+
+    // delete the view. the view will be moved to trash
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::DeleteView)
+      .payload(payload)
+      .async_send()
+      .await;
+  }
+
+  pub async fn update_view(&self, changeset: UpdateViewPayloadPB) -> Option<FlowyError> {
+    // delete the view. the view will be moved to trash
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::UpdateView)
+      .payload(changeset)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn update_view_icon(&self, payload: UpdateViewIconPayloadPB) -> Option<FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::UpdateViewIcon)
+      .payload(payload)
+      .async_send()
+      .await
+      .error()
+  }
+
+  pub async fn create_view(&self, parent_id: &str, name: String) -> ViewPB {
+    let payload = CreateViewPayloadPB {
+      parent_view_id: parent_id.to_string(),
+      name,
+      desc: "".to_string(),
+      thumbnail: None,
+      layout: Default::default(),
+      initial_data: vec![],
+      meta: Default::default(),
+      set_as_current: false,
+      index: None,
+    };
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+
+  pub async fn get_view(&self, view_id: &str) -> ViewPB {
+    EventBuilder::new(self.clone())
+      .event(FolderEvent::ReadView)
+      .payload(ViewIdPB {
+        value: view_id.to_string(),
+      })
+      .async_send()
+      .await
+      .parse::<ViewPB>()
+  }
+}
+
+pub struct ViewTest {
+  pub sdk: EventIntegrationTest,
+  pub workspace: WorkspacePB,
+  pub child_view: ViewPB,
+}
+
+impl ViewTest {
+  #[allow(dead_code)]
+  pub async fn new(sdk: &EventIntegrationTest, layout: ViewLayoutPB, data: Vec<u8>) -> Self {
+    let workspace = create_workspace(sdk, "Workspace", "").await;
+    let payload = WorkspaceIdPB {
+      value: Some(workspace.id.clone()),
+    };
+    let _ = EventBuilder::new(sdk.clone())
+      .event(OpenWorkspace)
+      .payload(payload)
+      .async_send()
+      .await;
+
+    let payload = CreateViewPayloadPB {
+      parent_view_id: workspace.id.clone(),
+      name: "View A".to_string(),
+      desc: "".to_string(),
+      thumbnail: Some("http://1.png".to_string()),
+      layout,
+      initial_data: data,
+      meta: Default::default(),
+      set_as_current: true,
+      index: None,
+    };
+
+    let view = EventBuilder::new(sdk.clone())
+      .event(CreateView)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<ViewPB>();
+    Self {
+      sdk: sdk.clone(),
+      workspace,
+      child_view: view,
+    }
+  }
+
+  pub async fn new_grid_view(sdk: &EventIntegrationTest, data: Vec<u8>) -> Self {
+    Self::new(sdk, ViewLayoutPB::Grid, data).await
+  }
+
+  pub async fn new_board_view(sdk: &EventIntegrationTest, data: Vec<u8>) -> Self {
+    Self::new(sdk, ViewLayoutPB::Board, data).await
+  }
+
+  pub async fn new_calendar_view(sdk: &EventIntegrationTest, data: Vec<u8>) -> Self {
+    Self::new(sdk, ViewLayoutPB::Calendar, data).await
+  }
+}
+
+async fn create_workspace(sdk: &EventIntegrationTest, name: &str, desc: &str) -> WorkspacePB {
+  let request = CreateWorkspacePayloadPB {
+    name: name.to_owned(),
+    desc: desc.to_owned(),
+  };
+
+  EventBuilder::new(sdk.clone())
+    .event(CreateWorkspace)
+    .payload(request)
+    .async_send()
+    .await
+    .parse::<WorkspacePB>()
+}
diff --git a/frontend/rust-lib/event-integration/src/test_user.rs b/frontend/rust-lib/event-integration/src/test_user.rs
new file mode 100644
index 000000000000..b09c4b9acc3b
--- /dev/null
+++ b/frontend/rust-lib/event-integration/src/test_user.rs
@@ -0,0 +1,296 @@
+use std::collections::HashMap;
+use std::convert::TryFrom;
+use std::sync::Arc;
+
+use bytes::Bytes;
+use nanoid::nanoid;
+use protobuf::ProtobufError;
+use tokio::sync::broadcast::{channel, Sender};
+use uuid::Uuid;
+
+use flowy_notification::entities::SubscribeObject;
+use flowy_notification::NotificationSender;
+use flowy_server::supabase::define::{USER_DEVICE_ID, USER_EMAIL, USER_SIGN_IN_URL, USER_UUID};
+use flowy_user::entities::{
+  AuthTypePB, OauthSignInPB, SignInUrlPB, SignInUrlPayloadPB, SignUpPayloadPB, UpdateCloudConfigPB,
+  UpdateUserProfilePayloadPB, UserCloudConfigPB, UserProfilePB,
+};
+use flowy_user::errors::{FlowyError, FlowyResult};
+use flowy_user::event_map::UserEvent::*;
+use lib_dispatch::prelude::{AFPluginDispatcher, AFPluginRequest, ToBytes};
+
+use crate::event_builder::EventBuilder;
+use crate::EventIntegrationTest;
+
+impl EventIntegrationTest {
+  pub async fn enable_encryption(&self) -> String {
+    let config = EventBuilder::new(self.clone())
+      .event(GetCloudConfig)
+      .async_send()
+      .await
+      .parse::<UserCloudConfigPB>();
+    let update = UpdateCloudConfigPB {
+      enable_sync: None,
+      enable_encrypt: Some(true),
+    };
+    let error = EventBuilder::new(self.clone())
+      .event(SetCloudConfig)
+      .payload(update)
+      .async_send()
+      .await
+      .error();
+    assert!(error.is_none());
+    config.encrypt_secret
+  }
+
+  pub async fn new_with_guest_user() -> Self {
+    let test = Self::default();
+    test.sign_up_as_guest().await;
+    test
+  }
+
+  pub async fn sign_up_as_guest(&self) -> SignUpContext {
+    let password = login_password();
+    let email = unique_email();
+    let payload = SignUpPayloadPB {
+      email,
+      name: "appflowy".to_string(),
+      password: password.clone(),
+      auth_type: AuthTypePB::Local,
+      device_id: uuid::Uuid::new_v4().to_string(),
+    }
+    .into_bytes()
+    .unwrap();
+
+    let request = AFPluginRequest::new(SignUp).payload(payload);
+    let user_profile = AFPluginDispatcher::async_send(self.inner.dispatcher(), request)
+      .await
+      .parse::<UserProfilePB, FlowyError>()
+      .unwrap()
+      .unwrap();
+
+    // let _ = create_default_workspace_if_need(dispatch.clone(), &user_profile.id);
+    SignUpContext {
+      user_profile,
+      password,
+    }
+  }
+
+  pub async fn af_cloud_sign_up(&self) -> UserProfilePB {
+    let email = unique_email();
+    self.af_cloud_sign_in_with_email(&email).await.unwrap()
+  }
+
+  pub async fn supabase_party_sign_up(&self) -> UserProfilePB {
+    let map = third_party_sign_up_param(Uuid::new_v4().to_string());
+    let payload = OauthSignInPB {
+      map,
+      auth_type: AuthTypePB::Supabase,
+    };
+
+    EventBuilder::new(self.clone())
+      .event(OauthSignIn)
+      .payload(payload)
+      .async_send()
+      .await
+      .parse::<UserProfilePB>()
+  }
+
+  pub async fn sign_out(&self) {
+    EventBuilder::new(self.clone())
+      .event(SignOut)
+      .async_send()
+      .await;
+  }
+
+  pub fn set_auth_type(&self, auth_type: AuthTypePB) {
+    *self.auth_type.write() = auth_type;
+  }
+
+  pub async fn init_user(&self) -> UserProfilePB {
+    self.sign_up_as_guest().await.user_profile
+  }
+
+  pub async fn get_user_profile(&self) -> Result<UserProfilePB, FlowyError> {
+    EventBuilder::new(self.clone())
+      .event(GetUserProfile)
+      .async_send()
+      .await
+      .try_parse::<UserProfilePB>()
+  }
+
+  pub async fn update_user_profile(&self, params: UpdateUserProfilePayloadPB) {
+    EventBuilder::new(self.clone())
+      .event(UpdateUserProfile)
+      .payload(params)
+      .async_send()
+      .await;
+  }
+
+  pub async fn af_cloud_sign_in_with_email(&self, email: &str) -> FlowyResult<UserProfilePB> {
+    let payload = SignInUrlPayloadPB {
+      email: email.to_string(),
+      auth_type: AuthTypePB::AFCloud,
+    };
+    let sign_in_url = EventBuilder::new(self.clone())
+      .event(GetSignInURL)
+      .payload(payload)
+      .async_send()
+      .await
+      .try_parse::<SignInUrlPB>()?
+      .sign_in_url;
+
+    let mut map = HashMap::new();
+    map.insert(USER_SIGN_IN_URL.to_string(), sign_in_url);
+    map.insert(USER_DEVICE_ID.to_string(), Uuid::new_v4().to_string());
+    let payload = OauthSignInPB {
+      map,
+      auth_type: AuthTypePB::AFCloud,
+    };
+
+    let user_profile = EventBuilder::new(self.clone())
+      .event(OauthSignIn)
+      .payload(payload)
+      .async_send()
+      .await
+      .try_parse::<UserProfilePB>()?;
+
+    Ok(user_profile)
+  }
+
+  pub async fn supabase_sign_up_with_uuid(
+    &self,
+    uuid: &str,
+    email: Option<String>,
+  ) -> FlowyResult<UserProfilePB> {
+    let mut map = HashMap::new();
+    map.insert(USER_UUID.to_string(), uuid.to_string());
+    map.insert(USER_DEVICE_ID.to_string(), uuid.to_string());
+    map.insert(
+      USER_EMAIL.to_string(),
+      email.unwrap_or_else(|| format!("{}@appflowy.io", nanoid!(10))),
+    );
+    let payload = OauthSignInPB {
+      map,
+      auth_type: AuthTypePB::Supabase,
+    };
+
+    let user_profile = EventBuilder::new(self.clone())
+      .event(OauthSignIn)
+      .payload(payload)
+      .async_send()
+      .await
+      .try_parse::<UserProfilePB>()?;
+
+    Ok(user_profile)
+  }
+}
+
+#[derive(Clone)]
+pub struct TestNotificationSender {
+  sender: Arc<Sender<SubscribeObject>>,
+}
+
+impl Default for TestNotificationSender {
+  fn default() -> Self {
+    let (sender, _) = channel(1000);
+    Self {
+      sender: Arc::new(sender),
+    }
+  }
+}
+
+impl TestNotificationSender {
+  pub fn new() -> Self {
+    Self::default()
+  }
+
+  pub fn subscribe<T>(&self, id: &str, ty: impl Into<i32> + Send) -> tokio::sync::mpsc::Receiver<T>
+  where
+    T: TryFrom<Bytes, Error = ProtobufError> + Send + 'static,
+  {
+    let id = id.to_string();
+    let (tx, rx) = tokio::sync::mpsc::channel::<T>(10);
+    let mut receiver = self.sender.subscribe();
+    let ty = ty.into();
+    tokio::spawn(async move {
+      // DatabaseNotification::DidUpdateDatabaseSnapshotState
+      while let Ok(value) = receiver.recv().await {
+        if value.id == id && value.ty == ty {
+          if let Some(payload) = value.payload {
+            match T::try_from(Bytes::from(payload)) {
+              Ok(object) => {
+                let _ = tx.send(object).await;
+              },
+              Err(e) => {
+                panic!(
+                  "Failed to parse notification payload to type: {:?} with error: {}",
+                  std::any::type_name::<T>(),
+                  e
+                );
+              },
+            }
+          }
+        }
+      }
+    });
+    rx
+  }
+
+  pub fn subscribe_with_condition<T, F>(&self, id: &str, when: F) -> tokio::sync::mpsc::Receiver<T>
+  where
+    T: TryFrom<Bytes, Error = ProtobufError> + Send + 'static,
+    F: Fn(&T) -> bool + Send + 'static,
+  {
+    let id = id.to_string();
+    let (tx, rx) = tokio::sync::mpsc::channel::<T>(10);
+    let mut receiver = self.sender.subscribe();
+    tokio::spawn(async move {
+      while let Ok(value) = receiver.recv().await {
+        if value.id == id {
+          if let Some(payload) = value.payload {
+            if let Ok(object) = T::try_from(Bytes::from(payload)) {
+              if when(&object) {
+                let _ = tx.send(object).await;
+              }
+            }
+          }
+        }
+      }
+    });
+    rx
+  }
+}
+impl NotificationSender for TestNotificationSender {
+  fn send_subject(&self, subject: SubscribeObject) -> Result<(), String> {
+    let _ = self.sender.send(subject);
+    Ok(())
+  }
+}
+
+pub fn third_party_sign_up_param(uuid: String) -> HashMap<String, String> {
+  let mut params = HashMap::new();
+  params.insert(USER_UUID.to_string(), uuid);
+  params.insert(
+    USER_EMAIL.to_string(),
+    format!("{}@test.com", Uuid::new_v4()),
+  );
+  params.insert(USER_DEVICE_ID.to_string(), Uuid::new_v4().to_string());
+  params
+}
+
+pub fn unique_email() -> String {
+  format!("{}@appflowy.io", Uuid::new_v4())
+}
+
+pub fn login_email() -> String {
+  "annie2@appflowy.io".to_string()
+}
+
+pub fn login_password() -> String {
+  "HelloWorld!123".to_string()
+}
+pub struct SignUpContext {
+  pub user_profile: UserProfilePB,
+  pub password: String,
+}
diff --git a/frontend/rust-lib/event-integration/src/user_event.rs b/frontend/rust-lib/event-integration/src/user_event.rs
deleted file mode 100644
index 67e44e732e6f..000000000000
--- a/frontend/rust-lib/event-integration/src/user_event.rs
+++ /dev/null
@@ -1,84 +0,0 @@
-use std::sync::Arc;
-
-use nanoid::nanoid;
-
-use flowy_user::entities::{AuthTypePB, SignUpPayloadPB, UserProfilePB};
-use flowy_user::errors::FlowyError;
-use flowy_user::event_map::UserEvent::*;
-use lib_dispatch::prelude::{AFPluginDispatcher, AFPluginRequest, ToBytes};
-
-pub fn random_email() -> String {
-  format!("{}@appflowy.io", nanoid!(20))
-}
-
-pub fn login_email() -> String {
-  "annie2@appflowy.io".to_string()
-}
-
-pub fn login_password() -> String {
-  "HelloWorld!123".to_string()
-}
-
-pub struct SignUpContext {
-  pub user_profile: UserProfilePB,
-  pub password: String,
-}
-
-pub fn sign_up(dispatch: Arc<AFPluginDispatcher>) -> SignUpContext {
-  let password = login_password();
-  let payload = SignUpPayloadPB {
-    email: random_email(),
-    name: "app flowy".to_string(),
-    password: password.clone(),
-    auth_type: AuthTypePB::Local,
-    device_id: uuid::Uuid::new_v4().to_string(),
-  }
-  .into_bytes()
-  .unwrap();
-
-  let request = AFPluginRequest::new(SignUp).payload(payload);
-  let user_profile = AFPluginDispatcher::sync_send(dispatch, request)
-    .parse::<UserProfilePB, FlowyError>()
-    .unwrap()
-    .unwrap();
-
-  SignUpContext {
-    user_profile,
-    password,
-  }
-}
-
-pub async fn async_sign_up(
-  dispatch: Arc<AFPluginDispatcher>,
-  auth_type: AuthTypePB,
-) -> SignUpContext {
-  let password = login_password();
-  let email = random_email();
-  let payload = SignUpPayloadPB {
-    email,
-    name: "appflowy".to_string(),
-    password: password.clone(),
-    auth_type,
-    device_id: uuid::Uuid::new_v4().to_string(),
-  }
-  .into_bytes()
-  .unwrap();
-
-  let request = AFPluginRequest::new(SignUp).payload(payload);
-  let user_profile = AFPluginDispatcher::async_send(dispatch.clone(), request)
-    .await
-    .parse::<UserProfilePB, FlowyError>()
-    .unwrap()
-    .unwrap();
-
-  // let _ = create_default_workspace_if_need(dispatch.clone(), &user_profile.id);
-  SignUpContext {
-    user_profile,
-    password,
-  }
-}
-
-pub async fn init_user_setting(dispatch: Arc<AFPluginDispatcher>) {
-  let request = AFPluginRequest::new(InitUser);
-  let _ = AFPluginDispatcher::async_send(dispatch.clone(), request).await;
-}
diff --git a/frontend/rust-lib/event-integration/tests/database/local_test/test.rs b/frontend/rust-lib/event-integration/tests/database/local_test/test.rs
index d21a1596ceb5..03c7d5cbd36e 100644
--- a/frontend/rust-lib/event-integration/tests/database/local_test/test.rs
+++ b/frontend/rust-lib/event-integration/tests/database/local_test/test.rs
@@ -3,7 +3,7 @@ use std::convert::TryFrom;
 use bytes::Bytes;
 
 use event_integration::event_builder::EventBuilder;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_database2::entities::{
   CellChangesetPB, CellIdPB, ChecklistCellDataChangesetPB, DatabaseLayoutPB,
   DatabaseSettingChangesetPB, DatabaseViewIdPB, DateChangesetPB, FieldType, SelectOptionCellDataPB,
@@ -13,7 +13,7 @@ use lib_infra::util::timestamp;
 
 #[tokio::test]
 async fn get_database_id_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -35,7 +35,7 @@ async fn get_database_id_event_test() {
 
 #[tokio::test]
 async fn get_database_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -49,7 +49,7 @@ async fn get_database_event_test() {
 
 #[tokio::test]
 async fn get_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -64,7 +64,7 @@ async fn get_field_event_test() {
 
 #[tokio::test]
 async fn create_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -78,7 +78,7 @@ async fn create_field_event_test() {
 
 #[tokio::test]
 async fn delete_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -99,7 +99,7 @@ async fn delete_field_event_test() {
 // The primary field is not allowed to be deleted.
 #[tokio::test]
 async fn delete_primary_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -114,7 +114,7 @@ async fn delete_primary_field_event_test() {
 
 #[tokio::test]
 async fn update_field_type_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -132,7 +132,7 @@ async fn update_field_type_event_test() {
 
 #[tokio::test]
 async fn update_primary_field_type_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -151,7 +151,7 @@ async fn update_primary_field_type_event_test() {
 
 #[tokio::test]
 async fn duplicate_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -169,7 +169,7 @@ async fn duplicate_field_event_test() {
 // The primary field is not allowed to be duplicated. So this test should return an error.
 #[tokio::test]
 async fn duplicate_primary_field_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -183,7 +183,7 @@ async fn duplicate_primary_field_test() {
 
 #[tokio::test]
 async fn get_primary_field_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -196,7 +196,7 @@ async fn get_primary_field_event_test() {
 
 #[tokio::test]
 async fn create_row_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -209,7 +209,7 @@ async fn create_row_event_test() {
 
 #[tokio::test]
 async fn delete_row_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -232,7 +232,7 @@ async fn delete_row_event_test() {
 
 #[tokio::test]
 async fn get_row_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -248,7 +248,7 @@ async fn get_row_event_test() {
 
 #[tokio::test]
 async fn update_row_meta_event_with_url_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -276,7 +276,7 @@ async fn update_row_meta_event_with_url_test() {
 
 #[tokio::test]
 async fn update_row_meta_event_with_cover_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -304,7 +304,7 @@ async fn update_row_meta_event_with_cover_test() {
 
 #[tokio::test]
 async fn delete_row_event_with_invalid_row_id_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -317,7 +317,7 @@ async fn delete_row_event_with_invalid_row_id_test() {
 
 #[tokio::test]
 async fn duplicate_row_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -334,7 +334,7 @@ async fn duplicate_row_event_test() {
 
 #[tokio::test]
 async fn duplicate_row_event_with_invalid_row_id_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -351,7 +351,7 @@ async fn duplicate_row_event_with_invalid_row_id_test() {
 
 #[tokio::test]
 async fn move_row_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -371,7 +371,7 @@ async fn move_row_event_test() {
 
 #[tokio::test]
 async fn move_row_event_test2() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -391,7 +391,7 @@ async fn move_row_event_test2() {
 
 #[tokio::test]
 async fn move_row_event_with_invalid_row_id_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -418,7 +418,7 @@ async fn move_row_event_with_invalid_row_id_test() {
 
 #[tokio::test]
 async fn update_text_cell_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -448,7 +448,7 @@ async fn update_text_cell_event_test() {
 
 #[tokio::test]
 async fn update_checkbox_cell_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -479,7 +479,7 @@ async fn update_checkbox_cell_event_test() {
 
 #[tokio::test]
 async fn update_single_select_cell_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -506,7 +506,7 @@ async fn update_single_select_cell_event_test() {
 
 #[tokio::test]
 async fn update_date_cell_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -543,7 +543,7 @@ async fn update_date_cell_event_test() {
 
 #[tokio::test]
 async fn update_date_cell_event_with_empty_time_str_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -579,7 +579,7 @@ async fn update_date_cell_event_with_empty_time_str_test() {
 
 #[tokio::test]
 async fn create_checklist_field_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -600,7 +600,7 @@ async fn create_checklist_field_test() {
 
 #[tokio::test]
 async fn update_checklist_cell_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -657,7 +657,7 @@ async fn update_checklist_cell_test() {
 // The number of groups should be 0 if there is no group by field in grid
 #[tokio::test]
 async fn get_groups_event_with_grid_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -669,7 +669,7 @@ async fn get_groups_event_with_grid_test() {
 
 #[tokio::test]
 async fn get_groups_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -681,7 +681,7 @@ async fn get_groups_event_test() {
 
 #[tokio::test]
 async fn move_group_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -715,7 +715,7 @@ async fn move_group_event_test() {
 
 #[tokio::test]
 async fn move_group_event_with_invalid_id_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -737,7 +737,7 @@ async fn move_group_event_with_invalid_id_test() {
 
 #[tokio::test]
 async fn rename_group_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -761,7 +761,7 @@ async fn rename_group_event_test() {
 
 #[tokio::test]
 async fn hide_group_event_test2() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -783,7 +783,7 @@ async fn hide_group_event_test2() {
 // Update the database layout type from grid to board
 #[tokio::test]
 async fn update_database_layout_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -805,7 +805,7 @@ async fn update_database_layout_event_test() {
 // Update the database layout type from grid to board. Set the checkbox field as the grouping field
 #[tokio::test]
 async fn update_database_layout_event_test2() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let grid_view = test
     .create_grid(&current_workspace.id, "my grid view".to_owned(), vec![])
@@ -837,7 +837,7 @@ async fn update_database_layout_event_test2() {
 // Create a checkbox field in the default board and then set it as the grouping field.
 #[tokio::test]
 async fn set_group_by_checkbox_field_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let board_view = test
     .create_board(&current_workspace.id, "my board view".to_owned(), vec![])
@@ -854,7 +854,7 @@ async fn set_group_by_checkbox_field_test() {
 
 #[tokio::test]
 async fn get_all_calendar_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let calendar_view = test
     .create_calendar(&current_workspace.id, "my calendar view".to_owned(), vec![])
@@ -867,7 +867,7 @@ async fn get_all_calendar_event_test() {
 
 #[tokio::test]
 async fn create_calendar_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let calendar_view = test
     .create_calendar(&current_workspace.id, "my calendar view".to_owned(), vec![])
diff --git a/frontend/rust-lib/event-integration/tests/database/supabase_test/helper.rs b/frontend/rust-lib/event-integration/tests/database/supabase_test/helper.rs
index 250ef4546f3d..c146644da2c8 100644
--- a/frontend/rust-lib/event-integration/tests/database/supabase_test/helper.rs
+++ b/frontend/rust-lib/event-integration/tests/database/supabase_test/helper.rs
@@ -71,9 +71,10 @@ impl FlowySupabaseDatabaseTest {
   }
 
   pub async fn get_database_collab_update(&self, database_id: &str) -> Vec<u8> {
+    let workspace_id = self.user_manager.workspace_id().unwrap();
     let cloud_service = self.database_manager.get_cloud_service().clone();
     let remote_updates = cloud_service
-      .get_collab_update(database_id, CollabType::Database)
+      .get_collab_update(database_id, CollabType::Database, &workspace_id)
       .await
       .unwrap();
 
diff --git a/frontend/rust-lib/event-integration/tests/document/af_cloud_test/edit_test.rs b/frontend/rust-lib/event-integration/tests/document/af_cloud_test/edit_test.rs
index 255864a0eead..772b345efa47 100644
--- a/frontend/rust-lib/event-integration/tests/document/af_cloud_test/edit_test.rs
+++ b/frontend/rust-lib/event-integration/tests/document/af_cloud_test/edit_test.rs
@@ -1,6 +1,6 @@
 use std::time::Duration;
 
-use event_integration::assert_document_data_equal;
+use event_integration::test_document::assert_document_data_equal;
 use flowy_document2::entities::DocumentSyncStatePB;
 
 use crate::document::af_cloud_test::util::AFCloudDocumentTest;
diff --git a/frontend/rust-lib/event-integration/tests/document/supabase_test/edit_test.rs b/frontend/rust-lib/event-integration/tests/document/supabase_test/edit_test.rs
index e0596e62997a..7300c3773bd8 100644
--- a/frontend/rust-lib/event-integration/tests/document/supabase_test/edit_test.rs
+++ b/frontend/rust-lib/event-integration/tests/document/supabase_test/edit_test.rs
@@ -1,6 +1,6 @@
 use std::time::Duration;
 
-use event_integration::assert_document_data_equal;
+use event_integration::test_document::assert_document_data_equal;
 use flowy_document2::entities::DocumentSyncStatePB;
 
 use crate::document::supabase_test::helper::FlowySupabaseDocumentTest;
diff --git a/frontend/rust-lib/event-integration/tests/folder/local_test/script.rs b/frontend/rust-lib/event-integration/tests/folder/local_test/script.rs
index 5e375e6c6ed7..24c56d8f4231 100644
--- a/frontend/rust-lib/event-integration/tests/folder/local_test/script.rs
+++ b/frontend/rust-lib/event-integration/tests/folder/local_test/script.rs
@@ -1,7 +1,7 @@
 use collab_folder::core::ViewLayout;
 
 use event_integration::event_builder::EventBuilder;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_folder2::entities::icon::{UpdateViewIconPayloadPB, ViewIconPB};
 use flowy_folder2::entities::*;
 use flowy_folder2::event_map::FolderEvent::*;
@@ -64,7 +64,7 @@ pub enum FolderScript {
 }
 
 pub struct FolderTest {
-  pub sdk: FlowyCoreTest,
+  pub sdk: EventIntegrationTest,
   pub all_workspace: Vec<WorkspacePB>,
   pub workspace: WorkspacePB,
   pub parent_view: ViewPB,
@@ -75,7 +75,7 @@ pub struct FolderTest {
 
 impl FolderTest {
   pub async fn new() -> Self {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let _ = sdk.init_user().await;
     let workspace = create_workspace(&sdk, "FolderWorkspace", "Folder test workspace").await;
     let parent_view = create_app(&sdk, &workspace.id, "Folder App", "Folder test app").await;
@@ -201,7 +201,7 @@ impl FolderTest {
     }
   }
 }
-pub async fn create_workspace(sdk: &FlowyCoreTest, name: &str, desc: &str) -> WorkspacePB {
+pub async fn create_workspace(sdk: &EventIntegrationTest, name: &str, desc: &str) -> WorkspacePB {
   let request = CreateWorkspacePayloadPB {
     name: name.to_owned(),
     desc: desc.to_owned(),
@@ -215,7 +215,10 @@ pub async fn create_workspace(sdk: &FlowyCoreTest, name: &str, desc: &str) -> Wo
     .parse::<WorkspacePB>()
 }
 
-pub async fn read_workspace(sdk: &FlowyCoreTest, workspace_id: Option<String>) -> Vec<WorkspacePB> {
+pub async fn read_workspace(
+  sdk: &EventIntegrationTest,
+  workspace_id: Option<String>,
+) -> Vec<WorkspacePB> {
   let request = WorkspaceIdPB {
     value: workspace_id,
   };
@@ -241,7 +244,12 @@ pub async fn read_workspace(sdk: &FlowyCoreTest, workspace_id: Option<String>) -
   workspaces
 }
 
-pub async fn create_app(sdk: &FlowyCoreTest, workspace_id: &str, name: &str, desc: &str) -> ViewPB {
+pub async fn create_app(
+  sdk: &EventIntegrationTest,
+  workspace_id: &str,
+  name: &str,
+  desc: &str,
+) -> ViewPB {
   let create_view_request = CreateViewPayloadPB {
     parent_view_id: workspace_id.to_owned(),
     name: name.to_string(),
@@ -263,7 +271,7 @@ pub async fn create_app(sdk: &FlowyCoreTest, workspace_id: &str, name: &str, des
 }
 
 pub async fn create_view(
-  sdk: &FlowyCoreTest,
+  sdk: &EventIntegrationTest,
   app_id: &str,
   name: &str,
   desc: &str,
@@ -288,7 +296,7 @@ pub async fn create_view(
     .parse::<ViewPB>()
 }
 
-pub async fn read_view(sdk: &FlowyCoreTest, view_id: &str) -> ViewPB {
+pub async fn read_view(sdk: &EventIntegrationTest, view_id: &str) -> ViewPB {
   let view_id = ViewIdPB::from(view_id);
   EventBuilder::new(sdk.clone())
     .event(ReadView)
@@ -299,7 +307,7 @@ pub async fn read_view(sdk: &FlowyCoreTest, view_id: &str) -> ViewPB {
 }
 
 pub async fn move_view(
-  sdk: &FlowyCoreTest,
+  sdk: &EventIntegrationTest,
   view_id: String,
   parent_id: String,
   prev_view_id: Option<String>,
@@ -319,7 +327,7 @@ pub async fn move_view(
   assert!(error.is_none());
 }
 pub async fn update_view(
-  sdk: &FlowyCoreTest,
+  sdk: &EventIntegrationTest,
   view_id: &str,
   name: Option<String>,
   desc: Option<String>,
@@ -340,7 +348,7 @@ pub async fn update_view(
     .await;
 }
 
-pub async fn update_view_icon(sdk: &FlowyCoreTest, view_id: &str, icon: Option<ViewIconPB>) {
+pub async fn update_view_icon(sdk: &EventIntegrationTest, view_id: &str, icon: Option<ViewIconPB>) {
   let request = UpdateViewIconPayloadPB {
     view_id: view_id.to_string(),
     icon,
@@ -352,7 +360,7 @@ pub async fn update_view_icon(sdk: &FlowyCoreTest, view_id: &str, icon: Option<V
     .await;
 }
 
-pub async fn delete_view(sdk: &FlowyCoreTest, view_ids: Vec<String>) {
+pub async fn delete_view(sdk: &EventIntegrationTest, view_ids: Vec<String>) {
   let request = RepeatedViewIdPB { items: view_ids };
   EventBuilder::new(sdk.clone())
     .event(DeleteView)
@@ -361,7 +369,7 @@ pub async fn delete_view(sdk: &FlowyCoreTest, view_ids: Vec<String>) {
     .await;
 }
 
-pub async fn read_trash(sdk: &FlowyCoreTest) -> RepeatedTrashPB {
+pub async fn read_trash(sdk: &EventIntegrationTest) -> RepeatedTrashPB {
   EventBuilder::new(sdk.clone())
     .event(ReadTrash)
     .async_send()
@@ -369,7 +377,7 @@ pub async fn read_trash(sdk: &FlowyCoreTest) -> RepeatedTrashPB {
     .parse::<RepeatedTrashPB>()
 }
 
-pub async fn restore_app_from_trash(sdk: &FlowyCoreTest, app_id: &str) {
+pub async fn restore_app_from_trash(sdk: &EventIntegrationTest, app_id: &str) {
   let id = TrashIdPB {
     id: app_id.to_owned(),
   };
@@ -380,7 +388,7 @@ pub async fn restore_app_from_trash(sdk: &FlowyCoreTest, app_id: &str) {
     .await;
 }
 
-pub async fn restore_view_from_trash(sdk: &FlowyCoreTest, view_id: &str) {
+pub async fn restore_view_from_trash(sdk: &EventIntegrationTest, view_id: &str) {
   let id = TrashIdPB {
     id: view_id.to_owned(),
   };
@@ -391,14 +399,14 @@ pub async fn restore_view_from_trash(sdk: &FlowyCoreTest, view_id: &str) {
     .await;
 }
 
-pub async fn delete_all_trash(sdk: &FlowyCoreTest) {
+pub async fn delete_all_trash(sdk: &EventIntegrationTest) {
   EventBuilder::new(sdk.clone())
     .event(DeleteAllTrash)
     .async_send()
     .await;
 }
 
-pub async fn toggle_favorites(sdk: &FlowyCoreTest, view_id: Vec<String>) {
+pub async fn toggle_favorites(sdk: &EventIntegrationTest, view_id: Vec<String>) {
   let request = RepeatedViewIdPB { items: view_id };
   EventBuilder::new(sdk.clone())
     .event(ToggleFavorite)
@@ -407,7 +415,7 @@ pub async fn toggle_favorites(sdk: &FlowyCoreTest, view_id: Vec<String>) {
     .await;
 }
 
-pub async fn read_favorites(sdk: &FlowyCoreTest) -> RepeatedViewPB {
+pub async fn read_favorites(sdk: &EventIntegrationTest) -> RepeatedViewPB {
   EventBuilder::new(sdk.clone())
     .event(ReadFavorites)
     .async_send()
diff --git a/frontend/rust-lib/event-integration/tests/folder/local_test/subscription_test.rs b/frontend/rust-lib/event-integration/tests/folder/local_test/subscription_test.rs
index f3fb6208a36f..2df246b212ac 100644
--- a/frontend/rust-lib/event-integration/tests/folder/local_test/subscription_test.rs
+++ b/frontend/rust-lib/event-integration/tests/folder/local_test/subscription_test.rs
@@ -1,6 +1,6 @@
 use std::time::Duration;
 
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_folder2::entities::{ChildViewUpdatePB, RepeatedViewPB, UpdateViewPayloadPB};
 use flowy_folder2::notification::FolderNotification;
 
@@ -16,7 +16,7 @@ use crate::util::receive_with_timeout;
 /// 5. Await the notification for workspace view updates with a timeout of 30 seconds.
 /// 6. Ensure that the received views contain the newly created "test_view".
 async fn create_child_view_in_workspace_subscription_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let workspace = test.get_current_workspace().await.workspace;
   let mut rx = test
     .notification_sender
@@ -40,7 +40,7 @@ async fn create_child_view_in_workspace_subscription_test() {
 
 #[tokio::test]
 async fn create_child_view_in_view_subscription_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let mut workspace = test.get_current_workspace().await.workspace;
   let workspace_child_view = workspace.views.pop().unwrap();
   let mut rx = test.notification_sender.subscribe::<ChildViewUpdatePB>(
@@ -72,7 +72,7 @@ async fn create_child_view_in_view_subscription_test() {
 
 #[tokio::test]
 async fn delete_view_subscription_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let workspace = test.get_current_workspace().await.workspace;
   let mut rx = test
     .notification_sender
@@ -94,7 +94,7 @@ async fn delete_view_subscription_test() {
 
 #[tokio::test]
 async fn update_view_subscription_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let mut workspace = test.get_current_workspace().await.workspace;
   let mut rx = test
     .notification_sender
diff --git a/frontend/rust-lib/event-integration/tests/folder/local_test/test.rs b/frontend/rust-lib/event-integration/tests/folder/local_test/test.rs
index 25994e2a6096..87cc6b82d9e6 100644
--- a/frontend/rust-lib/event-integration/tests/folder/local_test/test.rs
+++ b/frontend/rust-lib/event-integration/tests/folder/local_test/test.rs
@@ -1,12 +1,12 @@
 use event_integration::event_builder::EventBuilder;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_folder2::entities::icon::{UpdateViewIconPayloadPB, ViewIconPB, ViewIconTypePB};
 use flowy_folder2::entities::*;
 use flowy_user::errors::ErrorCode;
 
 #[tokio::test]
 async fn create_workspace_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let request = CreateWorkspacePayloadPB {
     name: "my second workspace".to_owned(),
     desc: "".to_owned(),
@@ -22,7 +22,7 @@ async fn create_workspace_event_test() {
 
 #[tokio::test]
 async fn open_workspace_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let payload = CreateWorkspacePayloadPB {
     name: "my second workspace".to_owned(),
     desc: "".to_owned(),
@@ -52,7 +52,7 @@ async fn open_workspace_event_test() {
 
 #[tokio::test]
 async fn create_view_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -64,7 +64,7 @@ async fn create_view_event_test() {
 
 #[tokio::test]
 async fn update_view_event_with_name_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -85,7 +85,7 @@ async fn update_view_event_with_name_test() {
 
 #[tokio::test]
 async fn update_view_icon_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -109,7 +109,7 @@ async fn update_view_icon_event_test() {
 
 #[tokio::test]
 async fn delete_view_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -132,7 +132,7 @@ async fn delete_view_event_test() {
 
 #[tokio::test]
 async fn put_back_trash_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -175,7 +175,7 @@ async fn put_back_trash_event_test() {
 
 #[tokio::test]
 async fn delete_view_permanently_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let view = test
     .create_view(&current_workspace.id, "My first view".to_string())
@@ -224,7 +224,7 @@ async fn delete_view_permanently_event_test() {
 
 #[tokio::test]
 async fn delete_all_trash_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
 
   for i in 0..3 {
@@ -268,7 +268,7 @@ async fn delete_all_trash_test() {
 
 #[tokio::test]
 async fn multiple_hierarchy_view_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   for i in 1..4 {
     let parent = test
@@ -344,7 +344,7 @@ async fn multiple_hierarchy_view_test() {
 
 #[tokio::test]
 async fn move_view_event_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   for i in 1..4 {
     let parent = test
@@ -382,7 +382,7 @@ async fn move_view_event_test() {
 
 #[tokio::test]
 async fn move_view_event_after_delete_view_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   for i in 1..6 {
     let _ = test
@@ -424,7 +424,7 @@ async fn move_view_event_after_delete_view_test() {
 
 #[tokio::test]
 async fn move_view_event_after_delete_view_test2() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let parent = test
     .create_view(&current_workspace.id, "My view".to_string())
@@ -466,7 +466,7 @@ async fn move_view_event_after_delete_view_test2() {
 #[tokio::test]
 async fn create_parent_view_with_invalid_name() {
   for (name, code) in invalid_workspace_name_test_case() {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let request = CreateWorkspacePayloadPB {
       name,
       desc: "".to_owned(),
@@ -494,7 +494,7 @@ fn invalid_workspace_name_test_case() -> Vec<(String, ErrorCode)> {
 
 #[tokio::test]
 async fn move_view_across_parent_test() {
-  let test = FlowyCoreTest::new_with_guest_user().await;
+  let test = EventIntegrationTest::new_with_guest_user().await;
   let current_workspace = test.get_current_workspace().await.workspace;
   let parent_1 = test
     .create_view(&current_workspace.id, "My view 1".to_string())
@@ -539,7 +539,7 @@ async fn move_view_across_parent_test() {
 }
 
 async fn move_folder_nested_view(
-  sdk: FlowyCoreTest,
+  sdk: EventIntegrationTest,
   view_id: String,
   new_parent_id: String,
   prev_view_id: Option<String>,
diff --git a/frontend/rust-lib/event-integration/tests/user/af_cloud_test/test.rs b/frontend/rust-lib/event-integration/tests/user/af_cloud_test/test.rs
index 79540f573df8..e0a138e0fac4 100644
--- a/frontend/rust-lib/event-integration/tests/user/af_cloud_test/test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/af_cloud_test/test.rs
@@ -1,13 +1,36 @@
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
+use flowy_user::entities::UpdateUserProfilePayloadPB;
 
 use crate::util::{generate_test_email, get_af_cloud_config};
 
 #[tokio::test]
 async fn af_cloud_sign_up_test() {
   if get_af_cloud_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let email = generate_test_email();
     let user = test.af_cloud_sign_in_with_email(&email).await.unwrap();
     assert_eq!(user.email, email);
   }
 }
+
+#[tokio::test]
+async fn af_cloud_update_user_metadata_of_open_ai_key() {
+  if get_af_cloud_config().is_some() {
+    let test = EventIntegrationTest::new();
+    let user = test.af_cloud_sign_up().await;
+
+    let old_profile = test.get_user_profile().await.unwrap();
+    assert_eq!(old_profile.openai_key, "".to_string());
+
+    test
+      .update_user_profile(UpdateUserProfilePayloadPB {
+        id: user.id,
+        openai_key: Some("new openai_key".to_string()),
+        ..Default::default()
+      })
+      .await;
+
+    let new_profile = test.get_user_profile().await.unwrap();
+    assert_eq!(new_profile.openai_key, "new openai_key".to_string());
+  }
+}
diff --git a/frontend/rust-lib/event-integration/tests/user/local_test/auth_test.rs b/frontend/rust-lib/event-integration/tests/user/local_test/auth_test.rs
index 2edb5d7d4ed4..4866d3672049 100644
--- a/frontend/rust-lib/event-integration/tests/user/local_test/auth_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/local_test/auth_test.rs
@@ -1,5 +1,5 @@
-use event_integration::user_event::*;
-use event_integration::{event_builder::EventBuilder, FlowyCoreTest};
+use event_integration::test_user::{login_password, unique_email};
+use event_integration::{event_builder::EventBuilder, EventIntegrationTest};
 use flowy_user::entities::{AuthTypePB, SignInPayloadPB, SignUpPayloadPB};
 use flowy_user::errors::ErrorCode;
 use flowy_user::event_map::UserEvent::*;
@@ -9,7 +9,7 @@ use crate::user::local_test::helper::*;
 #[tokio::test]
 async fn sign_up_with_invalid_email() {
   for email in invalid_email_test_case() {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let request = SignUpPayloadPB {
       email: email.to_string(),
       name: valid_name(),
@@ -33,9 +33,9 @@ async fn sign_up_with_invalid_email() {
 }
 #[tokio::test]
 async fn sign_up_with_long_password() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let request = SignUpPayloadPB {
-    email: random_email(),
+    email: unique_email(),
     name: valid_name(),
     password: "1234".repeat(100).as_str().to_string(),
     auth_type: AuthTypePB::Local,
@@ -58,7 +58,7 @@ async fn sign_up_with_long_password() {
 #[tokio::test]
 async fn sign_in_with_invalid_email() {
   for email in invalid_email_test_case() {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let request = SignInPayloadPB {
       email: email.to_string(),
       password: login_password(),
@@ -84,10 +84,10 @@ async fn sign_in_with_invalid_email() {
 #[tokio::test]
 async fn sign_in_with_invalid_password() {
   for password in invalid_password_test_case() {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
 
     let request = SignInPayloadPB {
-      email: random_email(),
+      email: unique_email(),
       password,
       name: "".to_string(),
       auth_type: AuthTypePB::Local,
diff --git a/frontend/rust-lib/event-integration/tests/user/local_test/user_awareness_test.rs b/frontend/rust-lib/event-integration/tests/user/local_test/user_awareness_test.rs
index 75348b7687a5..68bae5c7a4b7 100644
--- a/frontend/rust-lib/event-integration/tests/user/local_test/user_awareness_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/local_test/user_awareness_test.rs
@@ -1,13 +1,13 @@
 use std::collections::HashMap;
 
 use event_integration::event_builder::EventBuilder;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_user::entities::{ReminderPB, RepeatedReminderPB};
 use flowy_user::event_map::UserEvent::*;
 
 #[tokio::test]
 async fn user_update_with_name() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let _ = sdk.sign_up_as_guest().await;
   let mut meta = HashMap::new();
   meta.insert("object_id".to_string(), "".to_string());
diff --git a/frontend/rust-lib/event-integration/tests/user/local_test/user_profile_test.rs b/frontend/rust-lib/event-integration/tests/user/local_test/user_profile_test.rs
index 6969be29acde..a488de02a11f 100644
--- a/frontend/rust-lib/event-integration/tests/user/local_test/user_profile_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/local_test/user_profile_test.rs
@@ -1,14 +1,16 @@
-use crate::user::local_test::helper::*;
-use event_integration::{event_builder::EventBuilder, FlowyCoreTest};
+use nanoid::nanoid;
+
+use event_integration::{event_builder::EventBuilder, EventIntegrationTest};
 use flowy_user::entities::{UpdateUserProfilePayloadPB, UserProfilePB};
 use flowy_user::{errors::ErrorCode, event_map::UserEvent::*};
-use nanoid::nanoid;
+
+use crate::user::local_test::helper::*;
 
 // use serial_test::*;
 
 #[tokio::test]
 async fn user_profile_get_failed() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let result = EventBuilder::new(sdk)
     .event(GetUserProfile)
     .async_send()
@@ -19,7 +21,7 @@ async fn user_profile_get_failed() {
 
 #[tokio::test]
 async fn user_profile_get() {
-  let test = FlowyCoreTest::new();
+  let test = EventIntegrationTest::new();
   let user_profile = test.init_user().await;
   let user = EventBuilder::new(test.clone())
     .event(GetUserProfile)
@@ -30,7 +32,7 @@ async fn user_profile_get() {
 
 #[tokio::test]
 async fn user_update_with_name() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let user = sdk.init_user().await;
   let new_name = "hello_world".to_owned();
   let request = UpdateUserProfilePayloadPB::new(user.id).name(&new_name);
@@ -49,7 +51,7 @@ async fn user_update_with_name() {
 
 #[tokio::test]
 async fn user_update_with_ai_key() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let user = sdk.init_user().await;
   let openai_key = "openai_key".to_owned();
   let stability_ai_key = "stability_ai_key".to_owned();
@@ -72,7 +74,7 @@ async fn user_update_with_ai_key() {
 
 #[tokio::test]
 async fn user_update_with_email() {
-  let sdk = FlowyCoreTest::new();
+  let sdk = EventIntegrationTest::new();
   let user = sdk.init_user().await;
   let new_email = format!("{}@gmail.com", nanoid!(6));
   let request = UpdateUserProfilePayloadPB::new(user.id).email(&new_email);
@@ -90,7 +92,7 @@ async fn user_update_with_email() {
 
 #[tokio::test]
 async fn user_update_with_invalid_email() {
-  let test = FlowyCoreTest::new();
+  let test = EventIntegrationTest::new();
   let user = test.init_user().await;
   for email in invalid_email_test_case() {
     let request = UpdateUserProfilePayloadPB::new(user.id).email(&email);
@@ -109,7 +111,7 @@ async fn user_update_with_invalid_email() {
 
 #[tokio::test]
 async fn user_update_with_invalid_password() {
-  let test = FlowyCoreTest::new();
+  let test = EventIntegrationTest::new();
   let user = test.init_user().await;
   for password in invalid_password_test_case() {
     let request = UpdateUserProfilePayloadPB::new(user.id).password(&password);
@@ -126,7 +128,7 @@ async fn user_update_with_invalid_password() {
 
 #[tokio::test]
 async fn user_update_with_invalid_name() {
-  let test = FlowyCoreTest::new();
+  let test = EventIntegrationTest::new();
   let user = test.init_user().await;
   let request = UpdateUserProfilePayloadPB::new(user.id).name("");
   assert!(EventBuilder::new(test.clone())
diff --git a/frontend/rust-lib/event-integration/tests/user/migration_test/document_test.rs b/frontend/rust-lib/event-integration/tests/user/migration_test/document_test.rs
index 167bbecc9cd9..9f3100b7ca4b 100644
--- a/frontend/rust-lib/event-integration/tests/user/migration_test/document_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/migration_test/document_test.rs
@@ -1,4 +1,4 @@
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_core::DEFAULT_NAME;
 use flowy_folder2::entities::ViewLayoutPB;
 
@@ -11,7 +11,7 @@ async fn migrate_historical_empty_document_test() {
     "historical_empty_document",
   )
   .unwrap();
-  let test = FlowyCoreTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
+  let test = EventIntegrationTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
 
   let views = test.get_all_workspace_views().await;
   assert_eq!(views.len(), 3);
diff --git a/frontend/rust-lib/event-integration/tests/user/migration_test/version_test.rs b/frontend/rust-lib/event-integration/tests/user/migration_test/version_test.rs
index 05caa93510c3..ccd1b25e8c4a 100644
--- a/frontend/rust-lib/event-integration/tests/user/migration_test/version_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/migration_test/version_test.rs
@@ -1,4 +1,4 @@
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_core::DEFAULT_NAME;
 use flowy_folder2::entities::ViewLayoutPB;
 
@@ -11,7 +11,7 @@ async fn migrate_020_historical_empty_document_test() {
     "020_historical_user_data",
   )
   .unwrap();
-  let test = FlowyCoreTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
+  let test = EventIntegrationTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
 
   let mut views = test.get_all_workspace_views().await;
   assert_eq!(views.len(), 1);
diff --git a/frontend/rust-lib/event-integration/tests/user/supabase_test/auth_test.rs b/frontend/rust-lib/event-integration/tests/user/supabase_test/auth_test.rs
index c64ecf2b7788..999df506ef86 100644
--- a/frontend/rust-lib/event-integration/tests/user/supabase_test/auth_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/supabase_test/auth_test.rs
@@ -10,7 +10,7 @@ use serde_json::json;
 
 use event_integration::document::document_event::DocumentEventTest;
 use event_integration::event_builder::EventBuilder;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_core::DEFAULT_NAME;
 use flowy_encrypt::decrypt_text;
 use flowy_server::supabase::define::{USER_EMAIL, USER_UUID};
@@ -23,7 +23,7 @@ use crate::util::*;
 #[tokio::test]
 async fn third_party_sign_up_test() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let mut map = HashMap::new();
     map.insert(USER_UUID.to_string(), uuid::Uuid::new_v4().to_string());
     map.insert(
@@ -48,7 +48,7 @@ async fn third_party_sign_up_test() {
 #[tokio::test]
 async fn third_party_sign_up_with_encrypt_test() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     test.supabase_party_sign_up().await;
     let user_profile = test.get_user_profile().await.unwrap();
     assert!(user_profile.encryption_sign.is_empty());
@@ -65,7 +65,7 @@ async fn third_party_sign_up_with_encrypt_test() {
 #[tokio::test]
 async fn third_party_sign_up_with_duplicated_uuid() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let email = format!("{}@appflowy.io", nanoid!(6));
     let mut map = HashMap::new();
     map.insert(USER_UUID.to_string(), uuid::Uuid::new_v4().to_string());
@@ -98,7 +98,7 @@ async fn third_party_sign_up_with_duplicated_uuid() {
 #[tokio::test]
 async fn third_party_sign_up_with_duplicated_email() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let email = format!("{}@appflowy.io", nanoid!(6));
     test
       .supabase_sign_up_with_uuid(&uuid::Uuid::new_v4().to_string(), Some(email.clone()))
@@ -116,7 +116,7 @@ async fn third_party_sign_up_with_duplicated_email() {
 #[tokio::test]
 async fn sign_up_as_guest_and_then_update_to_new_cloud_user_test() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new_with_guest_user().await;
+    let test = EventIntegrationTest::new_with_guest_user().await;
     let old_views = test
       .folder_manager
       .get_current_workspace_views()
@@ -148,7 +148,7 @@ async fn sign_up_as_guest_and_then_update_to_new_cloud_user_test() {
 #[tokio::test]
 async fn sign_up_as_guest_and_then_update_to_existing_cloud_user_test() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new_with_guest_user().await;
+    let test = EventIntegrationTest::new_with_guest_user().await;
     let uuid = uuid::Uuid::new_v4().to_string();
 
     let email = format!("{}@appflowy.io", nanoid!(6));
@@ -260,7 +260,7 @@ async fn update_user_profile_with_existing_email_test() {
 #[tokio::test]
 async fn migrate_anon_document_on_cloud_signup() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let user_profile = test.sign_up_as_guest().await.user_profile;
 
     let view = test
@@ -273,12 +273,13 @@ async fn migrate_anon_document_on_cloud_signup() {
 
     let _ = test.supabase_party_sign_up().await;
 
+    let workspace_id = test.user_manager.workspace_id().unwrap();
     // After sign up, the documents should be migrated to the cloud
     // So, we can get the document data from the cloud
     let data: DocumentData = test
       .document_manager
       .get_cloud_service()
-      .get_document_data(&view.id)
+      .get_document_data(&view.id, &workspace_id)
       .await
       .unwrap()
       .unwrap();
@@ -304,7 +305,8 @@ async fn migrate_anon_data_on_cloud_signup() {
       "workspace_sync",
     )
     .unwrap();
-    let test = FlowyCoreTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
+    let test =
+      EventIntegrationTest::new_with_user_data_path(user_db_path, DEFAULT_NAME.to_string());
     let user_profile = test.supabase_party_sign_up().await;
 
     // Get the folder data from remote
@@ -372,6 +374,7 @@ async fn migrate_anon_data_on_cloud_signup() {
       let rows = editor.get_rows(&database_view.id).await.unwrap();
       assert_eq!(rows.len(), 3);
 
+      let workspace_id = test.user_manager.workspace_id().unwrap();
       if i == 0 {
         let first_row = rows.first().unwrap().as_ref();
         let icon_url = first_row.meta.icon_url.clone().unwrap();
@@ -381,7 +384,7 @@ async fn migrate_anon_data_on_cloud_signup() {
         let document_data: DocumentData = test
           .document_manager
           .get_cloud_service()
-          .get_document_data(&document_id)
+          .get_document_data(&document_id, &workspace_id)
           .await
           .unwrap()
           .unwrap();
@@ -407,7 +410,7 @@ async fn migrate_anon_data_on_cloud_signup() {
       }
 
       assert!(cloud_service
-        .get_collab_update(&database_id, CollabType::Database)
+        .get_collab_update(&database_id, CollabType::Database, &workspace_id)
         .await
         .is_ok());
     }
diff --git a/frontend/rust-lib/event-integration/tests/user/supabase_test/workspace_test.rs b/frontend/rust-lib/event-integration/tests/user/supabase_test/workspace_test.rs
index 74236b458e7e..49e4e289c7c2 100644
--- a/frontend/rust-lib/event-integration/tests/user/supabase_test/workspace_test.rs
+++ b/frontend/rust-lib/event-integration/tests/user/supabase_test/workspace_test.rs
@@ -1,6 +1,6 @@
 use std::collections::HashMap;
 
-use event_integration::{event_builder::EventBuilder, FlowyCoreTest};
+use event_integration::{event_builder::EventBuilder, EventIntegrationTest};
 use flowy_folder2::entities::WorkspaceSettingPB;
 use flowy_folder2::event_map::FolderEvent::GetCurrentWorkspace;
 use flowy_server::supabase::define::{USER_EMAIL, USER_UUID};
@@ -12,7 +12,7 @@ use crate::util::*;
 #[tokio::test]
 async fn initial_workspace_test() {
   if get_supabase_config().is_some() {
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     let mut map = HashMap::new();
     map.insert(USER_UUID.to_string(), uuid::Uuid::new_v4().to_string());
     map.insert(
diff --git a/frontend/rust-lib/event-integration/tests/util.rs b/frontend/rust-lib/event-integration/tests/util.rs
index d0c104ffb8c4..9847095458bc 100644
--- a/frontend/rust-lib/event-integration/tests/util.rs
+++ b/frontend/rust-lib/event-integration/tests/util.rs
@@ -16,7 +16,7 @@ use zip::ZipArchive;
 
 use event_integration::event_builder::EventBuilder;
 use event_integration::Cleaner;
-use event_integration::FlowyCoreTest;
+use event_integration::EventIntegrationTest;
 use flowy_database_deps::cloud::DatabaseCloudService;
 use flowy_folder_deps::cloud::{FolderCloudService, FolderSnapshot};
 use flowy_server::supabase::api::*;
@@ -36,13 +36,13 @@ pub fn get_supabase_config() -> Option<SupabaseConfiguration> {
 }
 
 pub struct FlowySupabaseTest {
-  inner: FlowyCoreTest,
+  inner: EventIntegrationTest,
 }
 
 impl FlowySupabaseTest {
   pub fn new() -> Option<Self> {
     let _ = get_supabase_config()?;
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     test.set_auth_type(AuthTypePB::Supabase);
     test.server_provider.set_auth_type(AuthType::Supabase);
 
@@ -76,7 +76,7 @@ impl FlowySupabaseTest {
 }
 
 impl Deref for FlowySupabaseTest {
-  type Target = FlowyCoreTest;
+  type Target = EventIntegrationTest;
 
   fn deref(&self) -> &Self::Target {
     &self.inner
@@ -215,13 +215,13 @@ pub fn unzip_history_user_db(root: &str, folder_name: &str) -> std::io::Result<(
 }
 
 pub struct AFCloudTest {
-  inner: FlowyCoreTest,
+  inner: EventIntegrationTest,
 }
 
 impl AFCloudTest {
   pub fn new() -> Option<Self> {
     let _ = get_af_cloud_config()?;
-    let test = FlowyCoreTest::new();
+    let test = EventIntegrationTest::new();
     test.set_auth_type(AuthTypePB::AFCloud);
     test.server_provider.set_auth_type(AuthType::AFCloud);
 
@@ -230,7 +230,7 @@ impl AFCloudTest {
 }
 
 impl Deref for AFCloudTest {
-  type Target = FlowyCoreTest;
+  type Target = EventIntegrationTest;
 
   fn deref(&self) -> &Self::Target {
     &self.inner
diff --git a/frontend/rust-lib/flowy-core/src/deps_resolve/document_deps.rs b/frontend/rust-lib/flowy-core/src/deps_resolve/document_deps.rs
index 7673e011d37a..ce9b2ae9da33 100644
--- a/frontend/rust-lib/flowy-core/src/deps_resolve/document_deps.rs
+++ b/frontend/rust-lib/flowy-core/src/deps_resolve/document_deps.rs
@@ -38,6 +38,14 @@ impl DocumentUser for DocumentUserImpl {
       .user_id()
   }
 
+  fn workspace_id(&self) -> Result<String, FlowyError> {
+    self
+      .0
+      .upgrade()
+      .ok_or(FlowyError::internal().with_context("Unexpected error: UserSession is None"))?
+      .workspace_id()
+  }
+
   fn token(&self) -> Result<Option<String>, FlowyError> {
     self
       .0
diff --git a/frontend/rust-lib/flowy-core/src/integrate/trait_impls.rs b/frontend/rust-lib/flowy-core/src/integrate/trait_impls.rs
index 0b02424f43d2..bd4df22ff4b5 100644
--- a/frontend/rust-lib/flowy-core/src/integrate/trait_impls.rs
+++ b/frontend/rust-lib/flowy-core/src/integrate/trait_impls.rs
@@ -190,13 +190,15 @@ impl DatabaseCloudService for ServerProvider {
     &self,
     object_id: &str,
     collab_type: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdate, Error> {
+    let workspace_id = workspace_id.to_string();
     let server = self.get_server(&self.get_server_type());
     let database_id = object_id.to_string();
     FutureResult::new(async move {
       server?
         .database_service()
-        .get_collab_update(&database_id, collab_type)
+        .get_collab_update(&database_id, collab_type, &workspace_id)
         .await
     })
   }
@@ -205,12 +207,14 @@ impl DatabaseCloudService for ServerProvider {
     &self,
     object_ids: Vec<String>,
     object_ty: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdateByOid, Error> {
+    let workspace_id = workspace_id.to_string();
     let server = self.get_server(&self.get_server_type());
     FutureResult::new(async move {
       server?
         .database_service()
-        .batch_get_collab_updates(object_ids, object_ty)
+        .batch_get_collab_updates(object_ids, object_ty, &workspace_id)
         .await
     })
   }
@@ -232,13 +236,18 @@ impl DatabaseCloudService for ServerProvider {
 }
 
 impl DocumentCloudService for ServerProvider {
-  fn get_document_updates(&self, document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error> {
-    let server = self.get_server(&self.get_server_type());
+  fn get_document_updates(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error> {
+    let workspace_id = workspace_id.to_string();
     let document_id = document_id.to_string();
+    let server = self.get_server(&self.get_server_type());
     FutureResult::new(async move {
       server?
         .document_service()
-        .get_document_updates(&document_id)
+        .get_document_updates(&document_id, &workspace_id)
         .await
     })
   }
@@ -247,24 +256,31 @@ impl DocumentCloudService for ServerProvider {
     &self,
     document_id: &str,
     limit: usize,
+    workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error> {
+    let workspace_id = workspace_id.to_string();
     let server = self.get_server(&self.get_server_type());
     let document_id = document_id.to_string();
     FutureResult::new(async move {
       server?
         .document_service()
-        .get_document_snapshots(&document_id, limit)
+        .get_document_snapshots(&document_id, limit, &workspace_id)
         .await
     })
   }
 
-  fn get_document_data(&self, document_id: &str) -> FutureResult<Option<DocumentData>, Error> {
+  fn get_document_data(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error> {
+    let workspace_id = workspace_id.to_string();
     let server = self.get_server(&self.get_server_type());
     let document_id = document_id.to_string();
     FutureResult::new(async move {
       server?
         .document_service()
-        .get_document_data(&document_id)
+        .get_document_data(&document_id, &workspace_id)
         .await
     })
   }
diff --git a/frontend/rust-lib/flowy-core/src/lib.rs b/frontend/rust-lib/flowy-core/src/lib.rs
index 1bb72f1c267d..de97c12a51b8 100644
--- a/frontend/rust-lib/flowy-core/src/lib.rs
+++ b/frontend/rust-lib/flowy-core/src/lib.rs
@@ -125,6 +125,7 @@ impl AppFlowyCore {
         server_provider.clone(),
         Arc::downgrade(&collab_builder),
       );
+
       collab_builder
         .set_snapshot_persistence(Arc::new(SnapshotDBImpl(Arc::downgrade(&user_manager))));
 
@@ -179,8 +180,8 @@ impl AppFlowyCore {
 
     let cloned_user_session = Arc::downgrade(&user_manager);
     runtime.block_on(async move {
-      if let Some(user_session) = cloned_user_session.upgrade() {
-        if let Err(err) = user_session
+      if let Some(user_manager) = cloned_user_session.upgrade() {
+        if let Err(err) = user_manager
           .init(user_status_callback, collab_interact_impl)
           .await
         {
diff --git a/frontend/rust-lib/flowy-database-deps/src/cloud.rs b/frontend/rust-lib/flowy-database-deps/src/cloud.rs
index bae09c5b300e..0a679a4ba5ee 100644
--- a/frontend/rust-lib/flowy-database-deps/src/cloud.rs
+++ b/frontend/rust-lib/flowy-database-deps/src/cloud.rs
@@ -16,12 +16,14 @@ pub trait DatabaseCloudService: Send + Sync {
     &self,
     object_id: &str,
     collab_type: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdate, Error>;
 
   fn batch_get_collab_updates(
     &self,
     object_ids: Vec<String>,
     object_ty: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdateByOid, Error>;
 
   fn get_collab_snapshots(
diff --git a/frontend/rust-lib/flowy-database2/src/entities/type_option_entities/checklist_entities.rs b/frontend/rust-lib/flowy-database2/src/entities/type_option_entities/checklist_entities.rs
index 7f616c935a1a..ac27d959abd8 100644
--- a/frontend/rust-lib/flowy-database2/src/entities/type_option_entities/checklist_entities.rs
+++ b/frontend/rust-lib/flowy-database2/src/entities/type_option_entities/checklist_entities.rs
@@ -5,7 +5,6 @@ use flowy_error::{ErrorCode, FlowyError};
 
 use crate::entities::parser::NotEmptyStr;
 use crate::entities::SelectOptionPB;
-use crate::services::field::checklist_type_option::ChecklistCellData;
 use crate::services::field::SelectOption;
 
 #[derive(Debug, Clone, Default, ProtoBuf)]
@@ -20,25 +19,6 @@ pub struct ChecklistCellDataPB {
   pub percentage: f64,
 }
 
-impl From<ChecklistCellData> for ChecklistCellDataPB {
-  fn from(cell_data: ChecklistCellData) -> Self {
-    let selected_options = cell_data.selected_options();
-    let percentage = cell_data.percentage_complete();
-    Self {
-      options: cell_data
-        .options
-        .into_iter()
-        .map(|option| option.into())
-        .collect(),
-      selected_options: selected_options
-        .into_iter()
-        .map(|option| option.into())
-        .collect(),
-      percentage,
-    }
-  }
-}
-
 #[derive(Debug, Clone, Default, ProtoBuf)]
 pub struct ChecklistCellDataChangesetPB {
   #[pb(index = 1)]
diff --git a/frontend/rust-lib/flowy-database2/src/event_handler.rs b/frontend/rust-lib/flowy-database2/src/event_handler.rs
index 7129193c7c39..02efd04ac3bb 100644
--- a/frontend/rust-lib/flowy-database2/src/event_handler.rs
+++ b/frontend/rust-lib/flowy-database2/src/event_handler.rs
@@ -596,20 +596,6 @@ pub(crate) async fn update_select_option_cell_handler(
   Ok(())
 }
 
-#[tracing::instrument(level = "trace", skip_all, err)]
-pub(crate) async fn get_checklist_cell_data_handler(
-  data: AFPluginData<CellIdPB>,
-  manager: AFPluginState<Weak<DatabaseManager>>,
-) -> DataResult<ChecklistCellDataPB, FlowyError> {
-  let manager = upgrade_manager(manager)?;
-  let params: CellIdParams = data.into_inner().try_into()?;
-  let database_editor = manager.get_database_with_view_id(&params.view_id).await?;
-  let data = database_editor
-    .get_checklist_option(params.row_id, &params.field_id)
-    .await;
-  data_result_ok(data)
-}
-
 #[tracing::instrument(level = "trace", skip_all, err)]
 pub(crate) async fn update_checklist_cell_handler(
   data: AFPluginData<ChecklistCellDataChangesetPB>,
@@ -625,7 +611,7 @@ pub(crate) async fn update_checklist_cell_handler(
     update_options: params.update_options,
   };
   database_editor
-    .set_checklist_options(&params.view_id, params.row_id, &params.field_id, changeset)
+    .update_cell_with_changeset(&params.view_id, params.row_id, &params.field_id, changeset)
     .await?;
   Ok(())
 }
diff --git a/frontend/rust-lib/flowy-database2/src/event_map.rs b/frontend/rust-lib/flowy-database2/src/event_map.rs
index 026d16a8db7b..0d7d8e5d7802 100644
--- a/frontend/rust-lib/flowy-database2/src/event_map.rs
+++ b/frontend/rust-lib/flowy-database2/src/event_map.rs
@@ -50,7 +50,6 @@ pub fn init(database_manager: Weak<DatabaseManager>) -> AFPlugin {
         .event(DatabaseEvent::GetSelectOptionCellData, get_select_option_handler)
         .event(DatabaseEvent::UpdateSelectOptionCell, update_select_option_cell_handler)
         // Checklist
-        .event(DatabaseEvent::GetChecklistCellData, get_checklist_cell_data_handler)
         .event(DatabaseEvent::UpdateChecklistCell, update_checklist_cell_handler)
         // Date
         .event(DatabaseEvent::UpdateDateCell, update_date_cell_handler)
@@ -256,11 +255,8 @@ pub enum DatabaseEvent {
   #[event(input = "SelectOptionCellChangesetPB")]
   UpdateSelectOptionCell = 72,
 
-  #[event(input = "CellIdPB", output = "ChecklistCellDataPB")]
-  GetChecklistCellData = 73,
-
   #[event(input = "ChecklistCellDataChangesetPB")]
-  UpdateChecklistCell = 74,
+  UpdateChecklistCell = 73,
 
   /// [UpdateDateCell] event is used to update a date cell's data. [DateChangesetPB]
   /// contains the date and the time string. It can be cast to [CellChangesetPB] that
diff --git a/frontend/rust-lib/flowy-database2/src/manager.rs b/frontend/rust-lib/flowy-database2/src/manager.rs
index d35c81048c7c..10734ba8a50a 100644
--- a/frontend/rust-lib/flowy-database2/src/manager.rs
+++ b/frontend/rust-lib/flowy-database2/src/manager.rs
@@ -76,11 +76,12 @@ impl DatabaseManager {
   pub async fn initialize(
     &self,
     uid: i64,
-    _workspace_id: String,
+    workspace_id: String,
     database_views_aggregate_id: String,
   ) -> FlowyResult<()> {
     let collab_db = self.user.collab_db(uid)?;
     let collab_builder = UserDatabaseCollabServiceImpl {
+      workspace_id: workspace_id.clone(),
       collab_builder: self.collab_builder.clone(),
       cloud_service: self.cloud_service.clone(),
     };
@@ -92,7 +93,11 @@ impl DatabaseManager {
       trace!("workspace database not exist, try to fetch from remote");
       match self
         .cloud_service
-        .get_collab_update(&database_views_aggregate_id, CollabType::WorkspaceDatabase)
+        .get_collab_update(
+          &database_views_aggregate_id,
+          CollabType::WorkspaceDatabase,
+          &workspace_id,
+        )
         .await
       {
         Ok(updates) => {
@@ -127,7 +132,12 @@ impl DatabaseManager {
     Ok(())
   }
 
-  #[instrument(level = "debug", skip_all, err)]
+  #[instrument(
+    name = "database_initialize_with_new_user",
+    level = "debug",
+    skip_all,
+    err
+  )]
   pub async fn initialize_with_new_user(
     &self,
     user_id: i64,
@@ -370,6 +380,7 @@ fn subscribe_block_event(workspace_database: &WorkspaceDatabase) {
 }
 
 struct UserDatabaseCollabServiceImpl {
+  workspace_id: String,
   collab_builder: Arc<AppFlowyCollabBuilder>,
   cloud_service: Arc<dyn DatabaseCloudService>,
 }
@@ -380,6 +391,7 @@ impl DatabaseCollabService for UserDatabaseCollabServiceImpl {
     object_id: &str,
     object_ty: CollabType,
   ) -> CollabFuture<Result<CollabObjectUpdate, DatabaseError>> {
+    let workspace_id = self.workspace_id.clone();
     let object_id = object_id.to_string();
     let weak_cloud_service = Arc::downgrade(&self.cloud_service);
     Box::pin(async move {
@@ -390,7 +402,7 @@ impl DatabaseCollabService for UserDatabaseCollabServiceImpl {
         },
         Some(cloud_service) => {
           let updates = cloud_service
-            .get_collab_update(&object_id, object_ty)
+            .get_collab_update(&object_id, object_ty, &workspace_id)
             .await?;
           Ok(updates)
         },
@@ -403,6 +415,7 @@ impl DatabaseCollabService for UserDatabaseCollabServiceImpl {
     object_ids: Vec<String>,
     object_ty: CollabType,
   ) -> CollabFuture<Result<CollabObjectUpdateByOid, DatabaseError>> {
+    let workspace_id = self.workspace_id.clone();
     let weak_cloud_service = Arc::downgrade(&self.cloud_service);
     Box::pin(async move {
       match weak_cloud_service.upgrade() {
@@ -412,7 +425,7 @@ impl DatabaseCollabService for UserDatabaseCollabServiceImpl {
         },
         Some(cloud_service) => {
           let updates = cloud_service
-            .batch_get_collab_updates(object_ids, object_ty)
+            .batch_get_collab_updates(object_ids, object_ty, &workspace_id)
             .await?;
           Ok(updates)
         },
diff --git a/frontend/rust-lib/flowy-database2/src/services/database/database_editor.rs b/frontend/rust-lib/flowy-database2/src/services/database/database_editor.rs
index 88ce9c9f12a9..ed539a137854 100644
--- a/frontend/rust-lib/flowy-database2/src/services/database/database_editor.rs
+++ b/frontend/rust-lib/flowy-database2/src/services/database/database_editor.rs
@@ -21,7 +21,7 @@ use crate::services::cell::{
 use crate::services::database::util::database_view_setting_pb_from_view;
 use crate::services::database::UpdatedRow;
 use crate::services::database_view::{DatabaseViewChanged, DatabaseViewData, DatabaseViews};
-use crate::services::field::checklist_type_option::{ChecklistCellChangeset, ChecklistCellData};
+use crate::services::field::checklist_type_option::ChecklistCellChangeset;
 use crate::services::field::{
   default_type_option_data_from_type, select_type_option_from_field, transform_type_option,
   type_option_data_from_pb_or_default, type_option_to_pb, SelectOptionCellChangeset,
@@ -858,15 +858,6 @@ impl DatabaseEditor {
     }
   }
 
-  pub async fn get_checklist_option(&self, row_id: RowId, field_id: &str) -> ChecklistCellDataPB {
-    let row_cell = self.database.lock().get_cell(field_id, &row_id);
-    let cell_data = match row_cell.cell {
-      None => ChecklistCellData::default(),
-      Some(cell) => ChecklistCellData::from(&cell),
-    };
-    ChecklistCellDataPB::from(cell_data)
-  }
-
   pub async fn set_checklist_options(
     &self,
     view_id: &str,
diff --git a/frontend/rust-lib/flowy-database2/tests/database/database_editor.rs b/frontend/rust-lib/flowy-database2/tests/database/database_editor.rs
index 125b770cdb48..9fe298be3d5a 100644
--- a/frontend/rust-lib/flowy-database2/tests/database/database_editor.rs
+++ b/frontend/rust-lib/flowy-database2/tests/database/database_editor.rs
@@ -6,9 +6,9 @@ use collab_database::fields::Field;
 use collab_database::rows::{CreateRowParams, RowDetail, RowId};
 use strum::EnumCount;
 
-use event_integration::folder_event::ViewTest;
-use event_integration::FlowyCoreTest;
-use flowy_database2::entities::{FieldType, FilterPB, RowMetaPB, SelectOptionPB};
+use event_integration::test_folder::ViewTest;
+use event_integration::EventIntegrationTest;
+use flowy_database2::entities::{FieldType, FilterPB, RowMetaPB};
 use flowy_database2::services::cell::{CellBuilder, ToCellChangeset};
 use flowy_database2::services::database::DatabaseEditor;
 use flowy_database2::services::field::checklist_type_option::{
@@ -26,8 +26,7 @@ use crate::database::mock_data::{
 };
 
 pub struct DatabaseEditorTest {
-  pub sdk: FlowyCoreTest,
-  pub app_id: String,
+  pub sdk: EventIntegrationTest,
   pub view_id: String,
   pub editor: Arc<DatabaseEditor>,
   pub fields: Vec<Arc<Field>>,
@@ -38,7 +37,7 @@ pub struct DatabaseEditorTest {
 
 impl DatabaseEditorTest {
   pub async fn new_grid() -> Self {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let _ = sdk.init_user().await;
 
     let params = make_test_grid();
@@ -47,7 +46,7 @@ impl DatabaseEditorTest {
   }
 
   pub async fn new_no_date_grid() -> Self {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let _ = sdk.init_user().await;
 
     let params = make_no_date_test_grid();
@@ -56,7 +55,7 @@ impl DatabaseEditorTest {
   }
 
   pub async fn new_board() -> Self {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let _ = sdk.init_user().await;
 
     let params = make_test_board();
@@ -65,7 +64,7 @@ impl DatabaseEditorTest {
   }
 
   pub async fn new_calendar() -> Self {
-    let sdk = FlowyCoreTest::new();
+    let sdk = EventIntegrationTest::new();
     let _ = sdk.init_user().await;
 
     let params = make_test_calendar();
@@ -73,7 +72,7 @@ impl DatabaseEditorTest {
     Self::new(sdk, view_test).await
   }
 
-  pub async fn new(sdk: FlowyCoreTest, test: ViewTest) -> Self {
+  pub async fn new(sdk: EventIntegrationTest, test: ViewTest) -> Self {
     let editor = sdk
       .database_manager
       .get_database_with_view_id(&test.child_view.id)
@@ -92,10 +91,8 @@ impl DatabaseEditorTest {
       .collect();
 
     let view_id = test.child_view.id;
-    let app_id = test.parent_view.id;
     Self {
       sdk,
-      app_id,
       view_id,
       editor,
       fields,
@@ -221,7 +218,7 @@ impl DatabaseEditorTest {
   pub(crate) async fn set_checklist_cell(
     &mut self,
     row_id: RowId,
-    f: Box<dyn FnOnce(Vec<SelectOptionPB>) -> Vec<String>>,
+    selected_options: Vec<String>,
   ) -> FlowyResult<()> {
     let field = self
       .editor
@@ -233,13 +230,8 @@ impl DatabaseEditorTest {
       })
       .unwrap()
       .clone();
-    let options = self
-      .editor
-      .get_checklist_option(row_id.clone(), &field.id)
-      .await
-      .options;
     let cell_changeset = ChecklistCellChangeset {
-      selected_option_ids: f(options),
+      selected_option_ids: selected_options,
       ..Default::default()
     };
     self
diff --git a/frontend/rust-lib/flowy-database2/tests/database/filter_test/checklist_filter_test.rs b/frontend/rust-lib/flowy-database2/tests/database/filter_test/checklist_filter_test.rs
index 115ecd919ef7..b8abeeca9cb8 100644
--- a/frontend/rust-lib/flowy-database2/tests/database/filter_test/checklist_filter_test.rs
+++ b/frontend/rust-lib/flowy-database2/tests/database/filter_test/checklist_filter_test.rs
@@ -1,4 +1,5 @@
-use flowy_database2::entities::ChecklistFilterConditionPB;
+use flowy_database2::entities::{ChecklistFilterConditionPB, FieldType};
+use flowy_database2::services::field::checklist_type_option::ChecklistCellData;
 
 use crate::database::filter_test::script::FilterScript::*;
 use crate::database::filter_test::script::{DatabaseFilterTest, FilterRowChanged};
@@ -8,10 +9,12 @@ async fn grid_filter_checklist_is_incomplete_test() {
   let mut test = DatabaseFilterTest::new().await;
   let expected = 6;
   let row_count = test.row_details.len();
+  let option_ids = get_checklist_cell_options(&test).await;
+
   let scripts = vec![
     UpdateChecklistCell {
       row_id: test.row_details[0].row.id.clone(),
-      f: Box::new(|options| options.into_iter().map(|option| option.id).collect()),
+      selected_option_ids: option_ids,
     },
     CreateChecklistFilter {
       condition: ChecklistFilterConditionPB::IsIncomplete,
@@ -30,10 +33,11 @@ async fn grid_filter_checklist_is_complete_test() {
   let mut test = DatabaseFilterTest::new().await;
   let expected = 1;
   let row_count = test.row_details.len();
+  let option_ids = get_checklist_cell_options(&test).await;
   let scripts = vec![
     UpdateChecklistCell {
       row_id: test.row_details[0].row.id.clone(),
-      f: Box::new(|options| options.into_iter().map(|option| option.id).collect()),
+      selected_option_ids: option_ids,
     },
     CreateChecklistFilter {
       condition: ChecklistFilterConditionPB::IsComplete,
@@ -46,3 +50,20 @@ async fn grid_filter_checklist_is_complete_test() {
   ];
   test.run_scripts(scripts).await;
 }
+
+async fn get_checklist_cell_options(test: &DatabaseFilterTest) -> Vec<String> {
+  let field = test.get_first_field(FieldType::Checklist);
+  let row_cell = test
+    .editor
+    .get_cell(&field.id, &test.row_details[0].row.id)
+    .await;
+  row_cell
+    .map_or_else(
+      || ChecklistCellData::default(),
+      |cell| ChecklistCellData::from(&cell),
+    )
+    .options
+    .into_iter()
+    .map(|option| option.id)
+    .collect()
+}
diff --git a/frontend/rust-lib/flowy-database2/tests/database/filter_test/script.rs b/frontend/rust-lib/flowy-database2/tests/database/filter_test/script.rs
index 80ca12f72ea8..de07820b6c43 100644
--- a/frontend/rust-lib/flowy-database2/tests/database/filter_test/script.rs
+++ b/frontend/rust-lib/flowy-database2/tests/database/filter_test/script.rs
@@ -30,7 +30,7 @@ pub enum FilterScript {
     },
     UpdateChecklistCell{
         row_id: RowId,
-        f: Box<dyn FnOnce(Vec<SelectOptionPB>) -> Vec<String>> ,
+        selected_option_ids: Vec<String>,
     },
     UpdateSingleSelectCell {
         row_id: RowId,
@@ -138,8 +138,8 @@ impl DatabaseFilterTest {
                 self.assert_future_changed(changed).await;
                 self.update_text_cell(row_id, &text).await.unwrap();
             }
-            FilterScript::UpdateChecklistCell { row_id, f } => {
-                self.set_checklist_cell( row_id, f).await.unwrap();
+            FilterScript::UpdateChecklistCell { row_id, selected_option_ids } => {
+                self.set_checklist_cell( row_id, selected_option_ids).await.unwrap();
             }
             FilterScript::UpdateSingleSelectCell { row_id, option_id, changed} => {
                 self.recv = Some(self.editor.subscribe_view_changed(&self.view_id()).await.unwrap());
diff --git a/frontend/rust-lib/flowy-document-deps/src/cloud.rs b/frontend/rust-lib/flowy-document-deps/src/cloud.rs
index cd37ab706d67..0a17113b7a66 100644
--- a/frontend/rust-lib/flowy-document-deps/src/cloud.rs
+++ b/frontend/rust-lib/flowy-document-deps/src/cloud.rs
@@ -7,15 +7,24 @@ use lib_infra::future::FutureResult;
 /// Each kind of server should implement this trait. Check out the [AppFlowyServerProvider] of
 /// [flowy-server] crate for more information.
 pub trait DocumentCloudService: Send + Sync + 'static {
-  fn get_document_updates(&self, document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error>;
+  fn get_document_updates(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error>;
 
   fn get_document_snapshots(
     &self,
     document_id: &str,
     limit: usize,
+    workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error>;
 
-  fn get_document_data(&self, document_id: &str) -> FutureResult<Option<DocumentData>, Error>;
+  fn get_document_data(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error>;
 }
 
 pub struct DocumentSnapshot {
diff --git a/frontend/rust-lib/flowy-document2/src/manager.rs b/frontend/rust-lib/flowy-document2/src/manager.rs
index 0d001d45d6f8..ee8a9c9a9c49 100644
--- a/frontend/rust-lib/flowy-document2/src/manager.rs
+++ b/frontend/rust-lib/flowy-document2/src/manager.rs
@@ -22,6 +22,9 @@ use crate::reminder::DocumentReminderAction;
 
 pub trait DocumentUser: Send + Sync {
   fn user_id(&self) -> Result<i64, FlowyError>;
+
+  fn workspace_id(&self) -> Result<String, FlowyError>;
+
   fn token(&self) -> Result<Option<String>, FlowyError>; // unused now.
   fn collab_db(&self, uid: i64) -> Result<Weak<RocksCollabDB>, FlowyError>;
 }
@@ -56,7 +59,12 @@ impl DocumentManager {
     Ok(())
   }
 
-  #[instrument(level = "debug", skip_all, err)]
+  #[instrument(
+    name = "document_initialize_with_new_user",
+    level = "debug",
+    skip_all,
+    err
+  )]
   pub async fn initialize_with_new_user(&self, uid: i64, workspace_id: String) -> FlowyResult<()> {
     self.initialize(uid, workspace_id).await?;
     Ok(())
@@ -101,7 +109,10 @@ impl DocumentManager {
     let mut updates = vec![];
     if !self.is_doc_exist(doc_id)? {
       // Try to get the document from the cloud service
-      updates = self.cloud_service.get_document_updates(doc_id).await?;
+      updates = self
+        .cloud_service
+        .get_document_updates(&self.user.workspace_id()?, doc_id)
+        .await?;
     }
 
     let uid = self.user.user_id()?;
@@ -120,7 +131,10 @@ impl DocumentManager {
   pub async fn get_document_data(&self, doc_id: &str) -> FlowyResult<DocumentData> {
     let mut updates = vec![];
     if !self.is_doc_exist(doc_id)? {
-      updates = self.cloud_service.get_document_updates(doc_id).await?;
+      updates = self
+        .cloud_service
+        .get_document_updates(doc_id, &self.user.workspace_id()?)
+        .await?;
     }
     let uid = self.user.user_id()?;
     let collab = self.collab_for_document(uid, doc_id, updates).await?;
@@ -152,9 +166,10 @@ impl DocumentManager {
     document_id: &str,
     limit: usize,
   ) -> FlowyResult<Vec<DocumentSnapshotPB>> {
+    let workspace_id = self.user.workspace_id()?;
     let snapshots = self
       .cloud_service
-      .get_document_snapshots(document_id, limit)
+      .get_document_snapshots(document_id, limit, &workspace_id)
       .await?
       .into_iter()
       .map(|snapshot| DocumentSnapshotPB {
diff --git a/frontend/rust-lib/flowy-document2/src/notification.rs b/frontend/rust-lib/flowy-document2/src/notification.rs
index 94c5bed28f9f..b468ec20c7f3 100644
--- a/frontend/rust-lib/flowy-document2/src/notification.rs
+++ b/frontend/rust-lib/flowy-document2/src/notification.rs
@@ -29,6 +29,7 @@ impl std::convert::From<i32> for DocumentNotification {
   }
 }
 
+#[tracing::instrument(level = "trace")]
 pub(crate) fn send_notification(id: &str, ty: DocumentNotification) -> NotificationBuilder {
   NotificationBuilder::new(id, ty, DOCUMENT_OBSERVABLE_SOURCE)
 }
diff --git a/frontend/rust-lib/flowy-document2/tests/document/util.rs b/frontend/rust-lib/flowy-document2/tests/document/util.rs
index 70378775bca0..4ee4fcb109a3 100644
--- a/frontend/rust-lib/flowy-document2/tests/document/util.rs
+++ b/frontend/rust-lib/flowy-document2/tests/document/util.rs
@@ -9,6 +9,7 @@ use nanoid::nanoid;
 use parking_lot::Once;
 use tempfile::TempDir;
 use tracing_subscriber::{fmt::Subscriber, util::SubscriberInitExt, EnvFilter};
+use uuid::Uuid;
 
 use collab_integrate::collab_builder::{AppFlowyCollabBuilder, DefaultCollabStorageProvider};
 use collab_integrate::RocksCollabDB;
@@ -61,6 +62,10 @@ impl DocumentUser for FakeUser {
     Ok(1)
   }
 
+  fn workspace_id(&self) -> Result<String, FlowyError> {
+    Ok(Uuid::new_v4().to_string())
+  }
+
   fn token(&self) -> Result<Option<String>, FlowyError> {
     Ok(None)
   }
@@ -120,7 +125,11 @@ pub fn gen_id() -> String {
 
 pub struct LocalTestDocumentCloudServiceImpl();
 impl DocumentCloudService for LocalTestDocumentCloudServiceImpl {
-  fn get_document_updates(&self, _document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error> {
+  fn get_document_updates(
+    &self,
+    _document_id: &str,
+    _workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
 
@@ -128,11 +137,16 @@ impl DocumentCloudService for LocalTestDocumentCloudServiceImpl {
     &self,
     _document_id: &str,
     _limit: usize,
+    _workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
 
-  fn get_document_data(&self, _document_id: &str) -> FutureResult<Option<DocumentData>, Error> {
+  fn get_document_data(
+    &self,
+    _document_id: &str,
+    _workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error> {
     FutureResult::new(async move { Ok(None) })
   }
 }
diff --git a/frontend/rust-lib/flowy-folder2/src/manager.rs b/frontend/rust-lib/flowy-folder2/src/manager.rs
index fda3198502b1..b15ce1b2c56c 100644
--- a/frontend/rust-lib/flowy-folder2/src/manager.rs
+++ b/frontend/rust-lib/flowy-folder2/src/manager.rs
@@ -265,7 +265,12 @@ impl FolderManager {
 
   /// Initialize the folder for the new user.
   /// Using the [DefaultFolderBuilder] to create the default workspace for the new user.
-  #[instrument(level = "debug", skip_all, err)]
+  #[instrument(
+    name = "folder_initialize_with_new_user",
+    level = "debug",
+    skip_all,
+    err
+  )]
   pub async fn initialize_with_new_user(
     &self,
     user_id: i64,
diff --git a/frontend/rust-lib/flowy-server/Cargo.toml b/frontend/rust-lib/flowy-server/Cargo.toml
index 82a79bd89eb8..ccdc0a7b5681 100644
--- a/frontend/rust-lib/flowy-server/Cargo.toml
+++ b/frontend/rust-lib/flowy-server/Cargo.toml
@@ -9,7 +9,7 @@ edition = "2021"
 tracing = { version = "0.1" }
 futures = "0.3.26"
 futures-util = "0.3.26"
-reqwest = { version = "0.11.20", features = ["native-tls-vendored", "multipart","blocking"] }
+reqwest = { version = "0.11.20", features = ["native-tls-vendored", "multipart", "blocking"] }
 hyper = "0.14"
 config = { version = "0.10.1", default-features = false, features = ["yaml"] }
 serde = { version = "1.0", features = ["derive"] }
@@ -23,7 +23,7 @@ bytes = { version = "1.5", features = ["serde"] }
 tokio-retry = "0.3"
 anyhow = "1.0"
 uuid = { version = "1.3.3", features = ["v4"] }
-chrono = { version = "0.4.31", default-features = false, features = ["clock"] }
+chrono = { version = "0.4.31", default-features = false, features = ["clock", "serde"] }
 collab = { version = "0.1.0" }
 collab-plugins = { version = "0.1.0"}
 collab-document = { version = "0.1.0" }
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/database.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/database.rs
index 21d2b4af0255..e5ec9038b45e 100644
--- a/frontend/rust-lib/flowy-server/src/af_cloud/impls/database.rs
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/database.rs
@@ -1,6 +1,6 @@
 use anyhow::Error;
 use client_api::entity::QueryCollabResult::{Failed, Success};
-use client_api::entity::{BatchQueryCollabParams, QueryCollabParams};
+use client_api::entity::{BatchQueryCollab, BatchQueryCollabParams, QueryCollabParams};
 use client_api::error::ErrorCode::RecordNotFound;
 use collab_entity::CollabType;
 use tracing::error;
@@ -22,11 +22,14 @@ where
     &self,
     object_id: &str,
     collab_type: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdate, Error> {
+    let workspace_id = workspace_id.to_string();
     let object_id = object_id.to_string();
     let try_get_client = self.0.try_get_client();
     FutureResult::new(async move {
       let params = QueryCollabParams {
+        workspace_id,
         object_id,
         collab_type,
       };
@@ -47,20 +50,22 @@ where
     &self,
     object_ids: Vec<String>,
     object_ty: CollabType,
+    workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdateByOid, Error> {
+    let workspace_id = workspace_id.to_string();
     let try_get_client = self.0.try_get_client();
     FutureResult::new(async move {
       let client = try_get_client?;
       let params = BatchQueryCollabParams(
         object_ids
           .into_iter()
-          .map(|object_id| QueryCollabParams {
+          .map(|object_id| BatchQueryCollab {
             object_id,
             collab_type: object_ty.clone(),
           })
           .collect(),
       );
-      let results = client.batch_get_collab(params).await?;
+      let results = client.batch_get_collab(&workspace_id, params).await?;
       Ok(
         results
           .0
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/document.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/document.rs
index 91b2e193e8b7..2c46cebbaef2 100644
--- a/frontend/rust-lib/flowy-server/src/af_cloud/impls/document.rs
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/document.rs
@@ -16,11 +16,17 @@ impl<T> DocumentCloudService for AFCloudDocumentCloudServiceImpl<T>
 where
   T: AFServer,
 {
-  fn get_document_updates(&self, document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error> {
+  fn get_document_updates(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error> {
+    let workspace_id = workspace_id.to_string();
     let try_get_client = self.0.try_get_client();
     let document_id = document_id.to_string();
     FutureResult::new(async move {
       let params = QueryCollabParams {
+        workspace_id,
         object_id: document_id.to_string(),
         collab_type: CollabType::Document,
       };
@@ -36,15 +42,22 @@ where
     &self,
     _document_id: &str,
     _limit: usize,
+    _workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
 
-  fn get_document_data(&self, document_id: &str) -> FutureResult<Option<DocumentData>, Error> {
+  fn get_document_data(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error> {
     let try_get_client = self.0.try_get_client();
     let document_id = document_id.to_string();
+    let workspace_id = workspace_id.to_string();
     FutureResult::new(async move {
       let params = QueryCollabParams {
+        workspace_id,
         object_id: document_id.clone(),
         collab_type: CollabType::Document,
       };
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/file_storage.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/file_storage.rs
index 507a26eabbc9..569ad3877bdf 100644
--- a/frontend/rust-lib/flowy-server/src/af_cloud/impls/file_storage.rs
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/file_storage.rs
@@ -33,10 +33,10 @@ where
             .to_string();
           let mut buffer = Vec::new();
           file.read_to_end(&mut buffer).await?;
-          Ok(client.put_file(&object.workspace_id, buffer, mime).await?)
+          Ok(client.put_blob(&object.workspace_id, buffer, mime).await?)
         },
         ObjectValue::Bytes { bytes, mime } => {
-          Ok(client.put_file(&object.workspace_id, bytes, mime).await?)
+          Ok(client.put_blob(&object.workspace_id, bytes, mime).await?)
         },
       }
     })
@@ -46,7 +46,7 @@ where
     let try_get_client = self.0.try_get_client();
     FutureResult::new(async move {
       let client = try_get_client?;
-      client.delete_file(&object_url).await?;
+      client.delete_blob(&object_url).await?;
       Ok(())
     })
   }
@@ -55,7 +55,7 @@ where
     let try_get_client = self.0.try_get_client();
     FutureResult::new(async move {
       let client = try_get_client?;
-      let bytes = client.get_file(&object_url).await?;
+      let bytes = client.get_blob(&object_url).await?;
       Ok(bytes)
     })
   }
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/folder.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/folder.rs
index 210b40b6110d..0f4d6283a641 100644
--- a/frontend/rust-lib/flowy-server/src/af_cloud/impls/folder.rs
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/folder.rs
@@ -25,6 +25,7 @@ where
     FutureResult::new(async move {
       let params = QueryCollabParams {
         object_id: workspace_id.clone(),
+        workspace_id: workspace_id.clone(),
         collab_type: CollabType::Folder,
       };
       let updates = vec![try_get_client?
@@ -50,7 +51,8 @@ where
     let try_get_client = self.0.try_get_client();
     FutureResult::new(async move {
       let params = QueryCollabParams {
-        object_id: workspace_id,
+        object_id: workspace_id.clone(),
+        workspace_id,
         collab_type: CollabType::Folder,
       };
       let update = try_get_client?
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/user.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/cloud_service_impl.rs
similarity index 69%
rename from frontend/rust-lib/flowy-server/src/af_cloud/impls/user.rs
rename to frontend/rust-lib/flowy-server/src/af_cloud/impls/user/cloud_service_impl.rs
index f31d269ba21a..b5d090df87b0 100644
--- a/frontend/rust-lib/flowy-server/src/af_cloud/impls/user.rs
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/cloud_service_impl.rs
@@ -2,10 +2,8 @@ use std::collections::HashMap;
 use std::sync::Arc;
 
 use anyhow::{anyhow, Error};
-use client_api::entity::dto::UserUpdateParams;
-use client_api::entity::{
-  AFUserProfileView, AFWorkspace, AFWorkspaces, InsertCollabParams, OAuthProvider,
-};
+use client_api::entity::workspace_dto::CreateWorkspaceMember;
+use client_api::entity::{AFRole, AFWorkspace, InsertCollabParams, OAuthProvider};
 use collab_entity::CollabObject;
 
 use flowy_error::{ErrorCode, FlowyError};
@@ -14,6 +12,10 @@ use flowy_user_deps::entities::*;
 use lib_infra::box_any::BoxAny;
 use lib_infra::future::FutureResult;
 
+use crate::af_cloud::impls::user::dto::{
+  af_update_from_update_params, user_profile_from_af_profile,
+};
+use crate::af_cloud::impls::user::util::encryption_type_from_profile;
 use crate::af_cloud::{AFCloudClient, AFServer};
 use crate::supabase::define::{USER_DEVICE_ID, USER_SIGN_IN_URL};
 
@@ -91,11 +93,7 @@ where
     FutureResult::new(async move {
       let client = try_get_client?;
       client
-        .update(UserUpdateParams {
-          name: params.name,
-          email: params.email,
-          password: params.password,
-        })
+        .update_user(af_update_from_update_params(params))
         .await?;
       Ok(())
     })
@@ -108,31 +106,19 @@ where
     let try_get_client = self.server.try_get_client();
     FutureResult::new(async move {
       let client = try_get_client?;
-      let profile = client.profile().await?;
-      let encryption_type = encryption_type_from_profile(&profile);
-      Ok(Some(UserProfile {
-        email: profile.email.unwrap_or("".to_string()),
-        name: profile.name.unwrap_or("".to_string()),
-        token: client.get_token()?,
-        icon_url: "".to_owned(),
-        openai_key: "".to_owned(),
-        stability_ai_key: "".to_owned(),
-        workspace_id: match profile.latest_workspace_id {
-          Some(w) => w.to_string(),
-          None => "".to_string(),
-        },
-        auth_type: AuthType::AFCloud,
-        encryption_type,
-        uid: profile.uid.ok_or(anyhow!("no uid found"))?,
-      }))
+      let profile = client.get_profile().await?;
+      let token = client.get_token()?;
+      let profile = user_profile_from_af_profile(token, profile)?;
+
+      Ok(Some(profile))
     })
   }
 
-  fn get_user_workspaces(&self, _uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
+  fn get_all_user_workspaces(&self, _uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
     let try_get_client = self.server.try_get_client();
     FutureResult::new(async move {
-      let workspaces = try_get_client?.workspaces().await?;
-      Ok(to_user_workspaces(workspaces)?)
+      let workspaces = try_get_client?.get_workspaces().await?;
+      Ok(to_user_workspaces(workspaces.0)?)
     })
   }
 
@@ -145,11 +131,11 @@ where
 
       // from cloud
       let client = try_get_client?;
-      let profile = client.profile().await?;
+      let profile = client.get_profile().await?;
       let client_token = client.access_token()?;
 
       // compare and check
-      if uid != profile.uid.ok_or(anyhow!("expecting uid"))? {
+      if uid != profile.uid {
         return Err(anyhow!("uid mismatch"));
       }
       if token != client_token {
@@ -167,7 +153,13 @@ where
     let try_get_client = self.server.try_get_client();
     FutureResult::new(async move {
       try_get_client?
-        .add_workspace_members(workspace_id.parse()?, vec![user_email])
+        .add_workspace_members(
+          workspace_id,
+          vec![CreateWorkspaceMember {
+            email: user_email,
+            role: AFRole::Member,
+          }],
+        )
         .await?;
       Ok(())
     })
@@ -181,7 +173,7 @@ where
     let try_get_client = self.server.try_get_client();
     FutureResult::new(async move {
       try_get_client?
-        .remove_workspace_members(workspace_id.parse()?, vec![user_email])
+        .remove_workspace_members(workspace_id, vec![user_email])
         .await?;
       Ok(())
     })
@@ -230,59 +222,42 @@ pub async fn user_sign_in_with_url(
   params: AFCloudOAuthParams,
 ) -> Result<AuthResponse, FlowyError> {
   let is_new_user = client.sign_in_with_url(&params.sign_in_url).await?;
-  let (profile, af_workspaces) = tokio::try_join!(client.profile(), client.workspaces())?;
 
-  let latest_workspace = to_user_workspace(
-    af_workspaces
-      .get_latest(&profile)
-      .or(af_workspaces.first().cloned())
-      .ok_or(anyhow!("no workspace found"))?,
-  )?;
+  let workspace_profile = client.get_user_workspace_info().await?;
+  let user_profile = workspace_profile.user_profile;
 
-  let user_workspaces = to_user_workspaces(af_workspaces)?;
-  let encryption_type = encryption_type_from_profile(&profile);
+  let latest_workspace = to_user_workspace(workspace_profile.visiting_workspace);
+  let user_workspaces = to_user_workspaces(workspace_profile.workspaces)?;
+  let encryption_type = encryption_type_from_profile(&user_profile);
 
   Ok(AuthResponse {
-    user_id: profile.uid.ok_or(anyhow!("no uid found"))?,
-    name: profile.name.ok_or(anyhow!("no name found"))?,
+    user_id: user_profile.uid,
+    name: user_profile.name.unwrap_or_default(),
     latest_workspace,
     user_workspaces,
-    email: profile.email,
+    email: user_profile.email,
     token: Some(client.get_token()?),
     device_id: params.device_id,
     encryption_type,
     is_new_user,
+    updated_at: user_profile.updated_at,
+    metadata: user_profile.metadata,
   })
 }
 
-fn encryption_type_from_profile(profile: &AFUserProfileView) -> EncryptionType {
-  match &profile.encryption_sign {
-    Some(e) => EncryptionType::SelfEncryption(e.to_string()),
-    None => EncryptionType::NoEncryption,
-  }
-}
-
-fn to_user_workspace(af_workspace: AFWorkspace) -> Result<UserWorkspace, FlowyError> {
-  Ok(UserWorkspace {
+fn to_user_workspace(af_workspace: AFWorkspace) -> UserWorkspace {
+  UserWorkspace {
     id: af_workspace.workspace_id.to_string(),
-    name: af_workspace
-      .workspace_name
-      .ok_or(anyhow!("no workspace_name found"))?,
-    created_at: af_workspace
-      .created_at
-      .ok_or(anyhow!("no created_at found"))?,
-    database_views_aggregate_id: af_workspace
-      .database_storage_id
-      .ok_or(anyhow!("no database_views_aggregate_id found"))?
-      .to_string(),
-  })
+    name: af_workspace.workspace_name,
+    created_at: af_workspace.created_at,
+    database_views_aggregate_id: af_workspace.database_storage_id.to_string(),
+  }
 }
 
-fn to_user_workspaces(af_workspaces: AFWorkspaces) -> Result<Vec<UserWorkspace>, FlowyError> {
-  let mut result = Vec::with_capacity(af_workspaces.len());
-  for item in af_workspaces.0.into_iter() {
-    let user_workspace = to_user_workspace(item)?;
-    result.push(user_workspace);
+fn to_user_workspaces(workspaces: Vec<AFWorkspace>) -> Result<Vec<UserWorkspace>, FlowyError> {
+  let mut result = Vec::with_capacity(workspaces.len());
+  for item in workspaces.into_iter() {
+    result.push(to_user_workspace(item));
   }
   Ok(result)
 }
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/dto.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/dto.rs
new file mode 100644
index 000000000000..e2c2922d0c89
--- /dev/null
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/dto.rs
@@ -0,0 +1,65 @@
+use anyhow::Error;
+use client_api::entity::auth_dto::{UpdateUserParams, UserMetaData};
+use client_api::entity::AFUserProfile;
+
+use flowy_user_deps::entities::{
+  AuthType, UpdateUserProfileParams, UserProfile, USER_METADATA_ICON_URL,
+  USER_METADATA_OPEN_AI_KEY, USER_METADATA_STABILITY_AI_KEY,
+};
+
+use crate::af_cloud::impls::user::util::encryption_type_from_profile;
+
+pub fn af_update_from_update_params(update: UpdateUserProfileParams) -> UpdateUserParams {
+  let mut user_metadata = UserMetaData::new();
+  if let Some(openai_key) = update.openai_key {
+    user_metadata.insert(USER_METADATA_OPEN_AI_KEY, openai_key);
+  }
+
+  if let Some(stability_ai_key) = update.stability_ai_key {
+    user_metadata.insert(USER_METADATA_STABILITY_AI_KEY, stability_ai_key);
+  }
+
+  if let Some(icon_url) = update.icon_url {
+    user_metadata.insert(USER_METADATA_ICON_URL, icon_url);
+  }
+
+  UpdateUserParams {
+    name: update.name,
+    email: update.email,
+    password: update.password,
+    metadata: Some(user_metadata),
+  }
+}
+
+pub fn user_profile_from_af_profile(
+  token: String,
+  profile: AFUserProfile,
+) -> Result<UserProfile, Error> {
+  let encryption_type = encryption_type_from_profile(&profile);
+  let (icon_url, openai_key, stability_ai_key) = {
+    profile
+      .metadata
+      .map(|m| {
+        (
+          m.get(USER_METADATA_ICON_URL).map(|v| v.to_string()),
+          m.get(USER_METADATA_OPEN_AI_KEY).map(|v| v.to_string()),
+          m.get(USER_METADATA_STABILITY_AI_KEY).map(|v| v.to_string()),
+        )
+      })
+      .unwrap_or_default()
+  };
+
+  Ok(UserProfile {
+    email: profile.email.unwrap_or("".to_string()),
+    name: profile.name.unwrap_or("".to_string()),
+    token,
+    icon_url: icon_url.unwrap_or_default(),
+    openai_key: openai_key.unwrap_or_default(),
+    stability_ai_key: stability_ai_key.unwrap_or_default(),
+    workspace_id: profile.latest_workspace_id.to_string(),
+    auth_type: AuthType::AFCloud,
+    encryption_type,
+    uid: profile.uid,
+    updated_at: profile.updated_at,
+  })
+}
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/mod.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/mod.rs
new file mode 100644
index 000000000000..96e13cbc2d0f
--- /dev/null
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/mod.rs
@@ -0,0 +1,5 @@
+pub use cloud_service_impl::*;
+
+mod cloud_service_impl;
+mod dto;
+mod util;
diff --git a/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/util.rs b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/util.rs
new file mode 100644
index 000000000000..b357861aa3cc
--- /dev/null
+++ b/frontend/rust-lib/flowy-server/src/af_cloud/impls/user/util.rs
@@ -0,0 +1,10 @@
+use client_api::entity::AFUserProfile;
+
+use flowy_user_deps::entities::EncryptionType;
+
+pub fn encryption_type_from_profile(profile: &AFUserProfile) -> EncryptionType {
+  match &profile.encryption_sign {
+    Some(e) => EncryptionType::SelfEncryption(e.to_string()),
+    None => EncryptionType::NoEncryption,
+  }
+}
diff --git a/frontend/rust-lib/flowy-server/src/local_server/impls/database.rs b/frontend/rust-lib/flowy-server/src/local_server/impls/database.rs
index f004912384ce..cec38613bf4d 100644
--- a/frontend/rust-lib/flowy-server/src/local_server/impls/database.rs
+++ b/frontend/rust-lib/flowy-server/src/local_server/impls/database.rs
@@ -13,6 +13,7 @@ impl DatabaseCloudService for LocalServerDatabaseCloudServiceImpl {
     &self,
     _object_id: &str,
     _collab_type: CollabType,
+    _workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdate, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
@@ -21,6 +22,7 @@ impl DatabaseCloudService for LocalServerDatabaseCloudServiceImpl {
     &self,
     _object_ids: Vec<String>,
     _object_ty: CollabType,
+    _workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdateByOid, Error> {
     FutureResult::new(async move { Ok(CollabObjectUpdateByOid::default()) })
   }
diff --git a/frontend/rust-lib/flowy-server/src/local_server/impls/document.rs b/frontend/rust-lib/flowy-server/src/local_server/impls/document.rs
index 71e1481a2825..6797270a0056 100644
--- a/frontend/rust-lib/flowy-server/src/local_server/impls/document.rs
+++ b/frontend/rust-lib/flowy-server/src/local_server/impls/document.rs
@@ -6,7 +6,11 @@ use lib_infra::future::FutureResult;
 pub(crate) struct LocalServerDocumentCloudServiceImpl();
 
 impl DocumentCloudService for LocalServerDocumentCloudServiceImpl {
-  fn get_document_updates(&self, _document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error> {
+  fn get_document_updates(
+    &self,
+    _document_id: &str,
+    _workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
 
@@ -14,11 +18,16 @@ impl DocumentCloudService for LocalServerDocumentCloudServiceImpl {
     &self,
     _document_id: &str,
     _limit: usize,
+    _workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error> {
     FutureResult::new(async move { Ok(vec![]) })
   }
 
-  fn get_document_data(&self, _document_id: &str) -> FutureResult<Option<DocumentData>, Error> {
+  fn get_document_data(
+    &self,
+    _document_id: &str,
+    _workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error> {
     FutureResult::new(async move { Ok(None) })
   }
 }
diff --git a/frontend/rust-lib/flowy-server/src/local_server/impls/user.rs b/frontend/rust-lib/flowy-server/src/local_server/impls/user.rs
index 7828d9f2e80d..5cc0455ac150 100644
--- a/frontend/rust-lib/flowy-server/src/local_server/impls/user.rs
+++ b/frontend/rust-lib/flowy-server/src/local_server/impls/user.rs
@@ -11,6 +11,7 @@ use flowy_user_deps::entities::*;
 use flowy_user_deps::DEFAULT_USER_NAME;
 use lib_infra::box_any::BoxAny;
 use lib_infra::future::FutureResult;
+use lib_infra::util::timestamp;
 
 use crate::local_server::uid::UserIDGenerator;
 use crate::local_server::LocalServerDB;
@@ -46,6 +47,8 @@ impl UserCloudService for LocalServerUserAuthServiceImpl {
         token: None,
         device_id: params.device_id,
         encryption_type: EncryptionType::NoEncryption,
+        updated_at: timestamp(),
+        metadata: None,
       })
     })
   }
@@ -69,6 +72,8 @@ impl UserCloudService for LocalServerUserAuthServiceImpl {
         token: None,
         device_id: params.device_id,
         encryption_type: EncryptionType::NoEncryption,
+        updated_at: timestamp(),
+        metadata: None,
       })
     })
   }
@@ -104,7 +109,7 @@ impl UserCloudService for LocalServerUserAuthServiceImpl {
     FutureResult::new(async { Ok(None) })
   }
 
-  fn get_user_workspaces(&self, _uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
+  fn get_all_user_workspaces(&self, _uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
     FutureResult::new(async { Ok(vec![]) })
   }
 
diff --git a/frontend/rust-lib/flowy-server/src/supabase/api/database.rs b/frontend/rust-lib/flowy-server/src/supabase/api/database.rs
index cc2e6b664027..963978c2fca2 100644
--- a/frontend/rust-lib/flowy-server/src/supabase/api/database.rs
+++ b/frontend/rust-lib/flowy-server/src/supabase/api/database.rs
@@ -30,6 +30,7 @@ where
     &self,
     object_id: &str,
     collab_type: CollabType,
+    _workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdate, Error> {
     let try_get_postgrest = self.server.try_get_weak_postgrest();
     let object_id = object_id.to_string();
@@ -53,6 +54,7 @@ where
     &self,
     object_ids: Vec<String>,
     object_ty: CollabType,
+    _workspace_id: &str,
   ) -> FutureResult<CollabObjectUpdateByOid, Error> {
     let try_get_postgrest = self.server.try_get_weak_postgrest();
     let (tx, rx) = channel();
diff --git a/frontend/rust-lib/flowy-server/src/supabase/api/document.rs b/frontend/rust-lib/flowy-server/src/supabase/api/document.rs
index 48987fcead61..9968a1c44b2d 100644
--- a/frontend/rust-lib/flowy-server/src/supabase/api/document.rs
+++ b/frontend/rust-lib/flowy-server/src/supabase/api/document.rs
@@ -27,7 +27,11 @@ where
   T: SupabaseServerService,
 {
   #[tracing::instrument(level = "debug", skip(self))]
-  fn get_document_updates(&self, document_id: &str) -> FutureResult<Vec<Vec<u8>>, Error> {
+  fn get_document_updates(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Vec<Vec<u8>>, Error> {
     let try_get_postgrest = self.server.try_get_weak_postgrest();
     let document_id = document_id.to_string();
     let (tx, rx) = channel();
@@ -52,6 +56,7 @@ where
     &self,
     document_id: &str,
     limit: usize,
+    _workspace_id: &str,
   ) -> FutureResult<Vec<DocumentSnapshot>, Error> {
     let try_get_postgrest = self.server.try_get_postgrest();
     let document_id = document_id.to_string();
@@ -72,7 +77,11 @@ where
   }
 
   #[tracing::instrument(level = "debug", skip(self))]
-  fn get_document_data(&self, document_id: &str) -> FutureResult<Option<DocumentData>, Error> {
+  fn get_document_data(
+    &self,
+    document_id: &str,
+    workspace_id: &str,
+  ) -> FutureResult<Option<DocumentData>, Error> {
     let try_get_postgrest = self.server.try_get_weak_postgrest();
     let document_id = document_id.to_string();
     let (tx, rx) = channel();
diff --git a/frontend/rust-lib/flowy-server/src/supabase/api/user.rs b/frontend/rust-lib/flowy-server/src/supabase/api/user.rs
index 6a91aafb276a..69581d69f0dd 100644
--- a/frontend/rust-lib/flowy-server/src/supabase/api/user.rs
+++ b/frontend/rust-lib/flowy-server/src/supabase/api/user.rs
@@ -129,6 +129,8 @@ where
         token: None,
         device_id: params.device_id,
         encryption_type: EncryptionType::from_sign(&user_profile.encryption_sign),
+        updated_at: user_profile.updated_at.timestamp(),
+        metadata: None,
       })
     })
   }
@@ -158,6 +160,8 @@ where
         token: None,
         device_id: params.device_id,
         encryption_type: EncryptionType::from_sign(&response.encryption_sign),
+        updated_at: response.updated_at.timestamp(),
+        metadata: None,
       })
     })
   }
@@ -220,12 +224,13 @@ where
           workspace_id: response.latest_workspace_id,
           auth_type: AuthType::Supabase,
           encryption_type: EncryptionType::from_sign(&response.encryption_sign),
+          updated_at: response.updated_at.timestamp(),
         })),
       }
     })
   }
 
-  fn get_user_workspaces(&self, uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
+  fn get_all_user_workspaces(&self, uid: i64) -> FutureResult<Vec<UserWorkspace>, Error> {
     let try_get_postgrest = self.server.try_get_postgrest();
     FutureResult::new(async move {
       let postgrest = try_get_postgrest?;
@@ -419,7 +424,7 @@ async fn get_user_profile(
 ) -> Result<Option<UserProfileResponse>, Error> {
   let mut builder = postgrest
     .from(USER_PROFILE_VIEW)
-    .select("uid, email, name, encryption_sign, latest_workspace_id");
+    .select("uid, email, name, encryption_sign, latest_workspace_id, updated_at");
 
   match params {
     GetUserProfileParams::Uid(uid) => builder = builder.eq("uid", uid.to_string()),
diff --git a/frontend/rust-lib/flowy-server/src/supabase/entities.rs b/frontend/rust-lib/flowy-server/src/supabase/entities.rs
index d50374caed49..41518dd995b7 100644
--- a/frontend/rust-lib/flowy-server/src/supabase/entities.rs
+++ b/frontend/rust-lib/flowy-server/src/supabase/entities.rs
@@ -1,6 +1,7 @@
 use std::fmt;
 use std::fmt::Display;
 
+use chrono::{DateTime, Utc};
 use serde::Deserialize;
 use serde_json::Value;
 use uuid::Uuid;
@@ -27,6 +28,8 @@ pub(crate) struct UserProfileResponse {
 
   #[serde(deserialize_with = "deserialize_null_or_default")]
   pub encryption_sign: String,
+
+  pub updated_at: DateTime<Utc>,
 }
 
 #[derive(Debug, Deserialize)]
diff --git a/frontend/rust-lib/flowy-server/tests/supabase_test/database_test.rs b/frontend/rust-lib/flowy-server/tests/supabase_test/database_test.rs
index 6521c870eaa5..9f638bb22646 100644
--- a/frontend/rust-lib/flowy-server/tests/supabase_test/database_test.rs
+++ b/frontend/rust-lib/flowy-server/tests/supabase_test/database_test.rs
@@ -45,7 +45,7 @@ async fn supabase_create_database_test() {
   }
 
   let updates_by_oid = database_service
-    .batch_get_collab_updates(row_ids, CollabType::DatabaseRow)
+    .batch_get_collab_updates(row_ids, CollabType::DatabaseRow, "fake_workspace_id")
     .await
     .unwrap();
 
diff --git a/frontend/rust-lib/flowy-sqlite/Cargo.toml b/frontend/rust-lib/flowy-sqlite/Cargo.toml
index 81727f8e6e91..810be1006553 100644
--- a/frontend/rust-lib/flowy-sqlite/Cargo.toml
+++ b/frontend/rust-lib/flowy-sqlite/Cargo.toml
@@ -23,7 +23,6 @@ error-chain = "=0.12.0"
 openssl = { version = "0.10.45", optional = true, features = ["vendored"] }
 openssl-sys = { version = "0.9.80", optional = true, features = ["vendored"] }
 
-
 [dev-dependencies]
 tempfile = "3.5.0"
 
diff --git a/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/down.sql b/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/down.sql
new file mode 100644
index 000000000000..74e73657f700
--- /dev/null
+++ b/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/down.sql
@@ -0,0 +1,3 @@
+-- This file should undo anything in `up.sql`
+ALTER TABLE user_table
+DROP COLUMN updated_at;
diff --git a/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/up.sql b/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/up.sql
new file mode 100644
index 000000000000..c13d17e4e5e8
--- /dev/null
+++ b/frontend/rust-lib/flowy-sqlite/migrations/2023-10-24-074032_user_updated_at/up.sql
@@ -0,0 +1,3 @@
+-- Your SQL goes here
+ALTER TABLE user_table
+ADD COLUMN updated_at BIGINT NOT NULL DEFAULT 0;
diff --git a/frontend/rust-lib/flowy-sqlite/src/schema.rs b/frontend/rust-lib/flowy-sqlite/src/schema.rs
index e10785f9cf98..a5ccad50f2d5 100644
--- a/frontend/rust-lib/flowy-sqlite/src/schema.rs
+++ b/frontend/rust-lib/flowy-sqlite/src/schema.rs
@@ -32,6 +32,7 @@ diesel::table! {
         auth_type -> Integer,
         encryption_type -> Text,
         stability_ai_key -> Text,
+        updated_at -> BigInt,
     }
 }
 
diff --git a/frontend/rust-lib/flowy-user-deps/src/cloud.rs b/frontend/rust-lib/flowy-user-deps/src/cloud.rs
index 65f289e90405..bb50d388af11 100644
--- a/frontend/rust-lib/flowy-user-deps/src/cloud.rs
+++ b/frontend/rust-lib/flowy-user-deps/src/cloud.rs
@@ -95,7 +95,7 @@ pub trait UserCloudService: Send + Sync + 'static {
   ) -> FutureResult<Option<UserProfile>, FlowyError>;
 
   /// Return the all the workspaces of the user  
-  fn get_user_workspaces(&self, uid: i64) -> FutureResult<Vec<UserWorkspace>, Error>;
+  fn get_all_user_workspaces(&self, uid: i64) -> FutureResult<Vec<UserWorkspace>, Error>;
 
   fn check_user(&self, credential: UserCredentials) -> FutureResult<(), Error>;
 
diff --git a/frontend/rust-lib/flowy-user-deps/src/entities.rs b/frontend/rust-lib/flowy-user-deps/src/entities.rs
index 9edf3e17f741..e94cb6fa1fb2 100644
--- a/frontend/rust-lib/flowy-user-deps/src/entities.rs
+++ b/frontend/rust-lib/flowy-user-deps/src/entities.rs
@@ -2,9 +2,15 @@ use std::str::FromStr;
 
 use chrono::{DateTime, Utc};
 use serde::{Deserialize, Serialize};
+use serde_json::Value;
 use serde_repr::*;
 use uuid::Uuid;
 
+pub const USER_METADATA_OPEN_AI_KEY: &str = "openai_key";
+pub const USER_METADATA_STABILITY_AI_KEY: &str = "stability_ai_key";
+pub const USER_METADATA_ICON_URL: &str = "icon_url";
+pub const USER_METADATA_UPDATE_AT: &str = "updated_at";
+
 pub trait UserAuthResponse {
   fn user_id(&self) -> i64;
   fn user_name(&self) -> &str;
@@ -14,52 +20,8 @@ pub trait UserAuthResponse {
   fn user_token(&self) -> Option<String>;
   fn user_email(&self) -> Option<String>;
   fn encryption_type(&self) -> EncryptionType;
-}
-
-#[derive(Debug, Serialize, Deserialize, Clone)]
-pub struct SignInResponse {
-  pub user_id: i64,
-  pub name: String,
-  pub latest_workspace: UserWorkspace,
-  pub user_workspaces: Vec<UserWorkspace>,
-  pub email: Option<String>,
-  pub token: Option<String>,
-  pub device_id: String,
-  pub encryption_type: EncryptionType,
-}
-
-impl UserAuthResponse for SignInResponse {
-  fn user_id(&self) -> i64 {
-    self.user_id
-  }
-
-  fn user_name(&self) -> &str {
-    &self.name
-  }
-
-  fn latest_workspace(&self) -> &UserWorkspace {
-    &self.latest_workspace
-  }
-
-  fn user_workspaces(&self) -> &[UserWorkspace] {
-    &self.user_workspaces
-  }
-
-  fn device_id(&self) -> &str {
-    &self.device_id
-  }
-
-  fn user_token(&self) -> Option<String> {
-    self.token.clone()
-  }
-
-  fn user_email(&self) -> Option<String> {
-    self.email.clone()
-  }
-
-  fn encryption_type(&self) -> EncryptionType {
-    self.encryption_type.clone()
-  }
+  fn metadata(&self) -> &Option<serde_json::Value>;
+  fn updated_at(&self) -> i64;
 }
 
 #[derive(Default, Serialize, Deserialize, Debug)]
@@ -91,6 +53,8 @@ pub struct AuthResponse {
   pub token: Option<String>,
   pub device_id: String,
   pub encryption_type: EncryptionType,
+  pub updated_at: i64,
+  pub metadata: Option<serde_json::Value>,
 }
 
 impl UserAuthResponse for AuthResponse {
@@ -125,6 +89,14 @@ impl UserAuthResponse for AuthResponse {
   fn encryption_type(&self) -> EncryptionType {
     self.encryption_type.clone()
   }
+
+  fn metadata(&self) -> &Option<Value> {
+    &self.metadata
+  }
+
+  fn updated_at(&self) -> i64 {
+    self.updated_at
+  }
 }
 
 #[derive(Clone, Debug)]
@@ -196,6 +168,7 @@ pub struct UserProfile {
   pub auth_type: AuthType,
   // If the encryption_sign is not empty, which means the user has enabled the encryption.
   pub encryption_type: EncryptionType,
+  pub updated_at: i64,
 }
 
 #[derive(Serialize, Deserialize, Debug, Clone, Default, Eq, PartialEq)]
@@ -243,17 +216,37 @@ where
 {
   fn from(params: (&T, &AuthType)) -> Self {
     let (value, auth_type) = params;
+    let (icon_url, openai_key, stability_ai_key) = {
+      value
+        .metadata()
+        .as_ref()
+        .map(|m| {
+          (
+            m.get(USER_METADATA_ICON_URL)
+              .map(|v| v.to_string())
+              .unwrap_or_default(),
+            m.get(USER_METADATA_OPEN_AI_KEY)
+              .map(|v| v.to_string())
+              .unwrap_or_default(),
+            m.get(USER_METADATA_STABILITY_AI_KEY)
+              .map(|v| v.to_string())
+              .unwrap_or_default(),
+          )
+        })
+        .unwrap_or_default()
+    };
     Self {
       uid: value.user_id(),
       email: value.user_email().unwrap_or_default(),
       name: value.user_name().to_owned(),
       token: value.user_token().unwrap_or_default(),
-      icon_url: "".to_owned(),
-      openai_key: "".to_owned(),
+      icon_url,
+      openai_key,
       workspace_id: value.latest_workspace().id.to_owned(),
       auth_type: auth_type.clone(),
       encryption_type: value.encryption_type(),
-      stability_ai_key: "".to_owned(),
+      stability_ai_key,
+      updated_at: value.updated_at(),
     }
   }
 }
diff --git a/frontend/rust-lib/flowy-user/src/entities/auth.rs b/frontend/rust-lib/flowy-user/src/entities/auth.rs
index 8733e99ce1b8..311eb9747fb1 100644
--- a/frontend/rust-lib/flowy-user/src/entities/auth.rs
+++ b/frontend/rust-lib/flowy-user/src/entities/auth.rs
@@ -240,6 +240,9 @@ pub struct UserStatePB {
 pub struct AuthStateChangedPB {
   #[pb(index = 1)]
   pub state: AuthStatePB,
+
+  #[pb(index = 2)]
+  pub message: String,
 }
 
 #[derive(ProtoBuf_Enum, Debug, Clone)]
diff --git a/frontend/rust-lib/flowy-user/src/entities/user_setting.rs b/frontend/rust-lib/flowy-user/src/entities/user_setting.rs
index 6dab6b4583e1..3e4b59cde3c2 100644
--- a/frontend/rust-lib/flowy-user/src/entities/user_setting.rs
+++ b/frontend/rust-lib/flowy-user/src/entities/user_setting.rs
@@ -173,9 +173,9 @@ pub struct UserSecretPB {
 }
 
 #[derive(Default, ProtoBuf)]
-pub struct UserEncryptionSecretCheckPB {
+pub struct UserEncryptionConfigurationPB {
   #[pb(index = 1)]
-  pub is_need_secret: bool,
+  pub require_secret: bool,
 }
 
 impl From<UserCloudConfig> for UserCloudConfigPB {
@@ -241,6 +241,7 @@ impl std::default::Default for DateTimeSettingsPB {
 #[derive(ProtoBuf, Serialize, Deserialize, Debug, Clone)]
 pub struct NotificationSettingsPB {
   #[pb(index = 1)]
+  #[serde(default)]
   pub notifications_enabled: bool,
 }
 
diff --git a/frontend/rust-lib/flowy-user/src/event_handler.rs b/frontend/rust-lib/flowy-user/src/event_handler.rs
index de92c4fb569f..4e077326033b 100644
--- a/frontend/rust-lib/flowy-user/src/event_handler.rs
+++ b/frontend/rust-lib/flowy-user/src/event_handler.rs
@@ -2,6 +2,7 @@ use std::sync::Weak;
 use std::{convert::TryInto, sync::Arc};
 
 use serde_json::Value;
+use tracing::event;
 
 use flowy_error::{ErrorCode, FlowyError, FlowyResult};
 use flowy_sqlite::kv::StorePreferences;
@@ -89,7 +90,7 @@ pub async fn check_user_handler(
   Ok(())
 }
 
-#[tracing::instrument(level = "debug", skip(manager))]
+#[tracing::instrument(level = "debug", skip(manager), err)]
 pub async fn get_user_profile_handler(
   manager: AFPluginState<Weak<UserManager>>,
 ) -> DataResult<UserProfilePB, FlowyError> {
@@ -105,6 +106,12 @@ pub async fn get_user_profile_handler(
     }
   });
 
+  event!(
+    tracing::Level::DEBUG,
+    "Get user profile: {:?}",
+    user_profile
+  );
+
   data_result_ok(user_profile.into())
 }
 
@@ -330,7 +337,7 @@ pub async fn set_encrypt_secret_handler(
 #[tracing::instrument(level = "debug", skip_all, err)]
 pub async fn check_encrypt_secret_handler(
   manager: AFPluginState<Weak<UserManager>>,
-) -> DataResult<UserEncryptionSecretCheckPB, FlowyError> {
+) -> DataResult<UserEncryptionConfigurationPB, FlowyError> {
   let manager = upgrade_manager(manager)?;
   let uid = manager.get_session()?.user_id;
   let profile = manager.get_user_profile(uid).await?;
@@ -346,7 +353,9 @@ pub async fn check_encrypt_secret_handler(
     },
   };
 
-  data_result_ok(UserEncryptionSecretCheckPB { is_need_secret })
+  data_result_ok(UserEncryptionConfigurationPB {
+    require_secret: is_need_secret,
+  })
 }
 
 #[tracing::instrument(level = "debug", skip_all, err)]
diff --git a/frontend/rust-lib/flowy-user/src/event_map.rs b/frontend/rust-lib/flowy-user/src/event_map.rs
index 22b700f30023..3fc698593aec 100644
--- a/frontend/rust-lib/flowy-user/src/event_map.rs
+++ b/frontend/rust-lib/flowy-user/src/event_map.rs
@@ -272,7 +272,7 @@ pub enum UserEvent {
   #[event(input = "UserSecretPB")]
   SetEncryptionSecret = 15,
 
-  #[event(output = "UserEncryptionSecretCheckPB")]
+  #[event(output = "UserEncryptionConfigurationPB")]
   CheckEncryptionSign = 16,
 
   /// Return the all the workspaces of the user
diff --git a/frontend/rust-lib/flowy-user/src/manager.rs b/frontend/rust-lib/flowy-user/src/manager.rs
index a89c77ececad..7fe83d3ec163 100644
--- a/frontend/rust-lib/flowy-user/src/manager.rs
+++ b/frontend/rust-lib/flowy-user/src/manager.rs
@@ -5,7 +5,7 @@ use collab_user::core::MutexUserAwareness;
 use serde_json::Value;
 use tokio::sync::{Mutex, RwLock};
 use tokio_stream::StreamExt;
-use tracing::{debug, error, info, instrument};
+use tracing::{debug, error, event, info, instrument};
 
 use collab_integrate::collab_builder::AppFlowyCollabBuilder;
 use collab_integrate::RocksCollabDB;
@@ -149,6 +149,7 @@ impl UserManager {
               UserTokenState::Invalid => {
                 send_auth_state_notification(AuthStateChangedPB {
                   state: AuthStatePB::InvalidAuth,
+                  message: "Token is invalid".to_string(),
                 })
                 .send();
               },
@@ -256,6 +257,7 @@ impl UserManager {
     }
     send_auth_state_notification(AuthStateChangedPB {
       state: AuthStatePB::AuthStateSignIn,
+      message: "Sign in success".to_string(),
     })
     .send();
     Ok(user_profile)
@@ -347,16 +349,18 @@ impl UserManager {
       UserAwarenessDataSource::Remote
     };
 
-    debug!("Sign up response: {:?}", response);
+    event!(tracing::Level::DEBUG, "Sign up response: {:?}", response);
     if response.is_new_user {
       if let Some(old_user) = migration_user {
         let new_user = MigrationUser {
           user_profile: user_profile.clone(),
           session: new_session.clone(),
         };
-        info!(
+        event!(
+          tracing::Level::INFO,
           "Migrate old user data from {:?} to {:?}",
-          old_user.user_profile.uid, new_user.user_profile.uid
+          old_user.user_profile.uid,
+          new_user.user_profile.uid
         );
         self
           .migrate_local_user_to_cloud(&old_user, &new_user)
@@ -385,6 +389,7 @@ impl UserManager {
 
     send_auth_state_notification(AuthStateChangedPB {
       state: AuthStatePB::AuthStateSignIn,
+      message: "Sign up success".to_string(),
     })
     .send();
     Ok(())
@@ -400,7 +405,7 @@ impl UserManager {
     tokio::spawn(async move {
       match server.sign_out(None).await {
         Ok(_) => {},
-        Err(e) => tracing::error!("Sign out failed: {:?}", e),
+        Err(e) => event!(tracing::Level::ERROR, "{:?}", e),
       }
     });
     Ok(())
@@ -419,8 +424,12 @@ impl UserManager {
   ) -> Result<(), FlowyError> {
     let changeset = UserTableChangeset::new(params.clone());
     let session = self.get_session()?;
-    save_user_profile_change(session.user_id, self.db_pool(session.user_id)?, changeset)?;
-    self.update_user(session.user_id, None, params).await?;
+    upsert_user_profile_change(session.user_id, self.db_pool(session.user_id)?, changeset)?;
+
+    let profile = self.get_user_profile(session.user_id).await?;
+    self
+      .update_user(session.user_id, profile.token, params)
+      .await?;
     Ok(())
   }
 
@@ -460,15 +469,14 @@ impl UserManager {
       .await?
       .ok_or_else(|| FlowyError::new(ErrorCode::RecordNotFound, "User not found"))?;
 
-    if !is_user_encryption_sign_valid(old_user_profile, &new_user_profile.encryption_type.sign()) {
-      return Err(FlowyError::new(
-        ErrorCode::InvalidEncryptSecret,
-        "Invalid encryption sign",
-      ));
+    if new_user_profile.updated_at > old_user_profile.updated_at {
+      check_encryption_sign(old_user_profile, &new_user_profile.encryption_type.sign());
+
+      // Save the new user profile
+      let changeset = UserTableChangeset::from_user_profile(new_user_profile.clone());
+      let _ = upsert_user_profile_change(uid, self.database.get_pool(uid)?, changeset);
     }
 
-    let changeset = UserTableChangeset::from_user_profile(new_user_profile.clone());
-    let _ = save_user_profile_change(uid, self.database.get_pool(uid)?, changeset);
     Ok(new_user_profile)
   }
 
@@ -488,6 +496,10 @@ impl UserManager {
     Ok(self.get_session()?.user_id)
   }
 
+  pub fn workspace_id(&self) -> Result<String, FlowyError> {
+    Ok(self.get_session()?.user_workspace.id)
+  }
+
   pub fn token(&self) -> Result<Option<String>, FlowyError> {
     Ok(None)
   }
@@ -495,13 +507,12 @@ impl UserManager {
   async fn update_user(
     &self,
     uid: i64,
-    token: Option<String>,
+    token: String,
     params: UpdateUserProfileParams,
   ) -> Result<(), FlowyError> {
     let server = self.cloud_services.get_user_service()?;
-    let token = token.to_owned();
     tokio::spawn(async move {
-      let credentials = UserCredentials::new(token, Some(uid), None);
+      let credentials = UserCredentials::new(Some(token), Some(uid), None);
       server.update_user(credentials, params).await
     })
     .await
@@ -607,6 +618,7 @@ impl UserManager {
   ) -> Result<(), FlowyError> {
     let user_profile = UserProfile::from((response, auth_type));
     let uid = user_profile.uid;
+    event!(tracing::Level::DEBUG, "Save new history user: {:?}", uid);
     self.add_historical_user(
       uid,
       response.device_id(),
@@ -614,7 +626,9 @@ impl UserManager {
       auth_type,
       self.user_dir(uid),
     );
+    event!(tracing::Level::DEBUG, "Save new history user workspace");
     save_user_workspaces(uid, self.db_pool(uid)?, response.user_workspaces())?;
+    event!(tracing::Level::INFO, "Save new user profile to disk");
     self
       .save_user(uid, (user_profile, auth_type.clone()).into())
       .await?;
@@ -634,12 +648,12 @@ impl UserManager {
     if session.user_id == user_update.uid {
       debug!("Receive user update: {:?}", user_update);
       let user_profile = self.get_user_profile(user_update.uid).await?;
-      if !is_user_encryption_sign_valid(&user_profile, &user_update.encryption_sign) {
+      if !check_encryption_sign(&user_profile, &user_update.encryption_sign) {
         return Ok(());
       }
 
       // Save the user profile change
-      save_user_profile_change(
+      upsert_user_profile_change(
         user_update.uid,
         self.db_pool(user_update.uid)?,
         UserTableChangeset::from(user_update),
@@ -679,24 +693,30 @@ impl UserManager {
   }
 }
 
-fn is_user_encryption_sign_valid(user_profile: &UserProfile, encryption_sign: &str) -> bool {
+fn check_encryption_sign(user_profile: &UserProfile, encryption_sign: &str) -> bool {
   // If the local user profile's encryption sign is not equal to the user update's encryption sign,
   // which means the user enable encryption in another device, we should logout the current user.
   let is_valid = user_profile.encryption_type.sign() == encryption_sign;
   if !is_valid {
     send_auth_state_notification(AuthStateChangedPB {
       state: AuthStatePB::InvalidAuth,
+      message: "Encryption configuration was changed".to_string(),
     })
     .send();
   }
   is_valid
 }
 
-fn save_user_profile_change(
+fn upsert_user_profile_change(
   uid: i64,
   pool: Arc<ConnectionPool>,
   changeset: UserTableChangeset,
 ) -> FlowyResult<()> {
+  event!(
+    tracing::Level::DEBUG,
+    "Update user profile with changeset: {:?}",
+    changeset
+  );
   let conn = pool.get()?;
   diesel_update_table!(user_table, changeset, &*conn);
   let user: UserProfile = user_table::dsl::user_table
@@ -713,5 +733,5 @@ fn save_user_profile_change(
 fn save_user_token(uid: i64, pool: Arc<ConnectionPool>, token: String) -> FlowyResult<()> {
   let params = UpdateUserProfileParams::new(uid).with_token(token);
   let changeset = UserTableChangeset::new(params);
-  save_user_profile_change(uid, pool, changeset)
+  upsert_user_profile_change(uid, pool, changeset)
 }
diff --git a/frontend/rust-lib/flowy-user/src/notification.rs b/frontend/rust-lib/flowy-user/src/notification.rs
index 38083ea1977d..b3d15ba19ca4 100644
--- a/frontend/rust-lib/flowy-user/src/notification.rs
+++ b/frontend/rust-lib/flowy-user/src/notification.rs
@@ -21,6 +21,7 @@ impl std::convert::From<UserNotification> for i32 {
   }
 }
 
+#[tracing::instrument(level = "trace")]
 pub(crate) fn send_notification(id: &str, ty: UserNotification) -> NotificationBuilder {
   NotificationBuilder::new(id, ty, USER_OBSERVABLE_SOURCE)
 }
diff --git a/frontend/rust-lib/flowy-user/src/services/user_sql.rs b/frontend/rust-lib/flowy-user/src/services/user_sql.rs
index 0ee53f225fb0..b60343443058 100644
--- a/frontend/rust-lib/flowy-user/src/services/user_sql.rs
+++ b/frontend/rust-lib/flowy-user/src/services/user_sql.rs
@@ -19,6 +19,7 @@ pub struct UserTable {
   pub(crate) auth_type: i32,
   pub(crate) encryption_type: String,
   pub(crate) stability_ai_key: String,
+  pub(crate) updated_at: i64,
 }
 
 impl UserTable {
@@ -43,6 +44,7 @@ impl From<(UserProfile, AuthType)> for UserTable {
       auth_type: auth_type as i32,
       encryption_type,
       stability_ai_key: user_profile.stability_ai_key,
+      updated_at: user_profile.updated_at,
     }
   }
 }
@@ -60,6 +62,7 @@ impl From<UserTable> for UserProfile {
       auth_type: AuthType::from(table.auth_type),
       encryption_type: EncryptionType::from_str(&table.encryption_type).unwrap_or_default(),
       stability_ai_key: table.stability_ai_key,
+      updated_at: table.updated_at,
     }
   }
 }
diff --git a/frontend/rust-lib/flowy-user/src/services/user_workspace.rs b/frontend/rust-lib/flowy-user/src/services/user_workspace.rs
index 76023704ad85..2684f31bf828 100644
--- a/frontend/rust-lib/flowy-user/src/services/user_workspace.rs
+++ b/frontend/rust-lib/flowy-user/src/services/user_workspace.rs
@@ -74,7 +74,7 @@ impl UserManager {
     if let Ok(service) = self.cloud_services.get_user_service() {
       if let Ok(pool) = self.db_pool(uid) {
         tokio::spawn(async move {
-          if let Ok(new_user_workspaces) = service.get_user_workspaces(uid).await {
+          if let Ok(new_user_workspaces) = service.get_all_user_workspaces(uid).await {
             let _ = save_user_workspaces(uid, pool, &new_user_workspaces);
             let repeated_workspace_pbs = RepeatedUserWorkspacePB::from(new_user_workspaces);
             send_notification(&uid.to_string(), UserNotification::DidUpdateUserWorkspaces)
diff --git a/frontend/scripts/code_generation/env/generate_env.cmd b/frontend/scripts/code_generation/env/generate_env.cmd
deleted file mode 100644
index d15d078dddfc..000000000000
--- a/frontend/scripts/code_generation/env/generate_env.cmd
+++ /dev/null
@@ -1,17 +0,0 @@
-@echo off
-
-REM Store the current working directory
-set "original_dir=%CD%"
-
-REM Change the current working directory to the script's location
-cd /d "%~dp0"
-
-REM Navigate to the project root
-cd ..\..\..\appflowy_flutter
-
-REM Navigate to the appflowy_flutter directory and generate files
-echo Generating env files
-call flutter packages pub get >nul 2>&1 && call dart run build_runner clean && call dart run build_runner build --delete-conflicting-outputs
-echo Done generating env files
-
-cd /d "%original_dir%"
diff --git a/frontend/scripts/code_generation/env/generate_env.sh b/frontend/scripts/code_generation/env/generate_env.sh
deleted file mode 100755
index fcadc3b252f2..000000000000
--- a/frontend/scripts/code_generation/env/generate_env.sh
+++ /dev/null
@@ -1,19 +0,0 @@
-#!/bin/bash
-
-# Store the current working directory
-original_dir=$(pwd)
-
-cd "$(dirname "$0")"
-
-# Navigate to the project root
-cd ../../../appflowy_flutter
-
-# Navigate to the appflowy_flutter directory and generate files
-echo "Generating env files"
-# flutter clean >/dev/null 2>&1 && flutter packages pub get >/dev/null 2>&1 && dart run build_runner clean &&
-flutter packages pub get >/dev/null 2>&1
-dart run build_runner clean && dart run build_runner build --delete-conflicting-outputs
-echo "Done generating env files"
-
-# Return to the original directory
-cd "$original_dir"
diff --git a/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.cmd b/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.cmd
index d7ada3b641d7..72cdd54cae2f 100644
--- a/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.cmd
+++ b/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.cmd
@@ -15,7 +15,7 @@ REM   the appflowy_flutter/assets/translation directory
 echo Copying resources/flowy_icons to appflowy_flutter/assets/flowy_icons
 xcopy /E /Y /I ..\resources\flowy_icons assets\flowy_icons
 
-call flutter packages pub get
+REM call flutter packages pub get
 
 echo Generating FlowySvg class
 call dart run flowy_svg
diff --git a/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.sh b/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.sh
index fb6eee67c65a..f969e49f4437 100755
--- a/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.sh
+++ b/frontend/scripts/code_generation/flowy_icons/generate_flowy_icons.sh
@@ -1,5 +1,13 @@
 #!/bin/bash
 
+no_pub_get=false
+
+while getopts 's' flag; do
+  case "${flag}" in
+    s) no_pub_get=true ;;
+  esac
+done
+
 echo "Generating flowy icon files"
 
 # Store the current working directory
@@ -14,7 +22,9 @@ rm -rf assets/flowy_icons/
 mkdir -p assets/flowy_icons/
 rsync -r ../resources/flowy_icons/ assets/flowy_icons/
 
-flutter packages pub get
+if [ "$no_pub_get" = false ]; then
+  flutter packages pub get
+fi
 
 echo "Generating FlowySvg classes"
 dart run flowy_svg
diff --git a/frontend/scripts/code_generation/freezed/generate_freezed.cmd b/frontend/scripts/code_generation/freezed/generate_freezed.cmd
index 4b607948fad4..64d7e8754e64 100644
--- a/frontend/scripts/code_generation/freezed/generate_freezed.cmd
+++ b/frontend/scripts/code_generation/freezed/generate_freezed.cmd
@@ -11,7 +11,8 @@ cd ..\..\..\appflowy_flutter
 
 REM Navigate to the appflowy_flutter directory and generate files
 echo Generating files for appflowy_flutter
-call flutter clean >nul 2>&1 && call flutter packages pub get >nul 2>&1 && call dart run build_runner clean && call dart run build_runner build -d
+REM call flutter packages pub get
+call dart run build_runner clean && call dart run build_runner build -d
 echo Done generating files for appflowy_flutter
 
 echo Generating files for packages
@@ -24,7 +25,7 @@ for /D %%d in (*) do (
     if exist "pubspec.yaml" (
         echo Generating freezed files in %%d...
         echo Please wait while we clean the project and fetch the dependencies.
-        call flutter clean >nul 2>&1 && call flutter packages pub get >nul 2>&1 && call dart run build_runner clean && call dart run build_runner build -d
+        call dart run build_runner clean && call dart run build_runner build -d
         echo Done running build command in %%d
     ) else (
         echo No pubspec.yaml found in %%d, it can't be a Dart project. Skipping.
diff --git a/frontend/scripts/code_generation/freezed/generate_freezed.sh b/frontend/scripts/code_generation/freezed/generate_freezed.sh
index 01f578d3dc16..24e4e55fa3bc 100755
--- a/frontend/scripts/code_generation/freezed/generate_freezed.sh
+++ b/frontend/scripts/code_generation/freezed/generate_freezed.sh
@@ -1,5 +1,13 @@
 #!/bin/bash
 
+no_pub_get=false
+
+while getopts 's' flag; do
+  case "${flag}" in
+    s) no_pub_get=true ;;
+  esac
+done
+
 # Store the current working directory
 original_dir=$(pwd)
 
@@ -10,9 +18,12 @@ cd ../../../appflowy_flutter
 
 # Navigate to the appflowy_flutter directory and generate files
 echo "Generating files for appflowy_flutter"
-# flutter clean >/dev/null 2>&1 && flutter packages pub get >/dev/null 2>&1 && dart run build_runner clean &&
-flutter packages pub get >/dev/null 2>&1
-dart run build_runner build -d
+
+if [ "$no_pub_get" = false ]; then
+  flutter packages pub get >/dev/null 2>&1
+fi
+
+dart run build_runner clean && dart run build_runner build -d
 echo "Done generating files for appflowy_flutter"
 
 echo "Generating files for packages"
@@ -25,8 +36,10 @@ for d in */; do
   if [ -f "pubspec.yaml" ]; then
     echo "Generating freezed files in $d..."
     echo "Please wait while we clean the project and fetch the dependencies."
-    flutter packages pub get >/dev/null 2>&1
-    dart run build_runner build -d
+    if [ "$no_pub_get" = false ]; then
+      flutter packages pub get >/dev/null 2>&1
+    fi
+    dart run build_runner clean && dart run build_runner build -d
     echo "Done running build command in $d"
   else
     echo "No pubspec.yaml found in $d, it can\'t be a Dart project. Skipping."
diff --git a/frontend/scripts/code_generation/generate.cmd b/frontend/scripts/code_generation/generate.cmd
index 1dc853d2a221..855c288ab3d0 100644
--- a/frontend/scripts/code_generation/generate.cmd
+++ b/frontend/scripts/code_generation/generate.cmd
@@ -26,15 +26,6 @@ call generate_freezed.cmd %*
 REM Return to the main script directory
 cd ..
 
-echo Generating env files using build_runner
-cd env
-REM Allow execution permissions on CI
-chmod +x generate_env.cmd
-call generate_env.cmd %*
-
-REM Return to the main script directory
-cd ..
-
 echo Generating svg files using flowy_svg
 cd flowy_icons
 REM Allow execution permissions on CI
diff --git a/frontend/scripts/code_generation/generate.sh b/frontend/scripts/code_generation/generate.sh
index 567feddc7dcc..f71ceba2df28 100755
--- a/frontend/scripts/code_generation/generate.sh
+++ b/frontend/scripts/code_generation/generate.sh
@@ -26,15 +26,6 @@ chmod +x ./generate_freezed.sh
 # Return to the main script directory
 cd ..
 
-echo "Generating env files using build_runner"
-cd env
-# Allow execution permissions on CI
-chmod +x ./generate_env.sh
-./generate_env.sh "$@"
-
-# Return to the main script directory
-cd ..
-
 echo "Generating svg files using flowy_svg"
 cd flowy_icons
 # Allow execution permissions on CI
diff --git a/frontend/scripts/code_generation/language_files/generate_language_files.cmd b/frontend/scripts/code_generation/language_files/generate_language_files.cmd
index 470f1654e5c8..7b14503810f0 100644
--- a/frontend/scripts/code_generation/language_files/generate_language_files.cmd
+++ b/frontend/scripts/code_generation/language_files/generate_language_files.cmd
@@ -15,7 +15,7 @@ REM   the appflowy_flutter/assets/translation directory
 echo Copying resources/translations to appflowy_flutter/assets/translations
 xcopy /E /Y /I ..\resources\translations assets\translations
 
-call flutter packages pub get
+REM call flutter packages pub get
 
 echo Specifying source directory for AppFlowy Localizations.
 call dart run easy_localization:generate -S assets/translations/
diff --git a/frontend/scripts/code_generation/language_files/generate_language_files.sh b/frontend/scripts/code_generation/language_files/generate_language_files.sh
index d93c88d1a304..03bf7a906ad6 100755
--- a/frontend/scripts/code_generation/language_files/generate_language_files.sh
+++ b/frontend/scripts/code_generation/language_files/generate_language_files.sh
@@ -1,5 +1,13 @@
 #!/bin/bash
 
+no_pub_get=false
+
+while getopts 's' flag; do
+  case "${flag}" in
+    s) no_pub_get=true ;;
+  esac
+done
+
 echo "Generating language files"
 
 # Store the current working directory
@@ -16,7 +24,9 @@ rm -rf assets/translations/
 mkdir -p assets/translations/
 cp -f ../resources/translations/*.json assets/translations/
 
-flutter packages pub get
+if [ "$no_pub_get" = false ]; then
+  flutter packages pub get
+fi
 
 echo "Specifying source directory for AppFlowy Localizations."
 dart run easy_localization:generate -S assets/translations/
diff --git a/frontend/scripts/docker-buildfiles/Dockerfile b/frontend/scripts/docker-buildfiles/Dockerfile
index d874ec7805aa..eecf5fd48596 100644
--- a/frontend/scripts/docker-buildfiles/Dockerfile
+++ b/frontend/scripts/docker-buildfiles/Dockerfile
@@ -47,8 +47,10 @@ RUN flutter doctor
 RUN dart pub global activate protoc_plugin 20.0.1
 
 # Install build dependencies for AppFlowy
-RUN sudo pacman -S --noconfirm git libkeybinder3 sqlite clang rsync libnotify
-RUN source ~/.cargo/env && cargo install --force cargo-make duckscript_cli
+RUN yay -S --noconfirm jemalloc4 cargo-make cargo-binstall
+RUN sudo pacman -S --noconfirm git libkeybinder3 sqlite clang rsync libnotify rocksdb zstd
+RUN sudo ln -s /usr/bin/sha1sum /usr/bin/shasum
+RUN source ~/.cargo/env && cargo binstall duckscript_cli -y
 
 # Build AppFlowy
 COPY . /appflowy
@@ -58,7 +60,7 @@ RUN cd frontend && \
     source ~/.cargo/env && \
     cargo make appflowy-flutter-deps-tools && \
     cargo make flutter_clean && \
-    cargo make -p production-linux-x86_64 appflowy-linux
+    OPENSSL_STATIC=1 ZSTD_SYS_USE_PKG_CONFIG=1 ROCKSDB_LIB_DIR="/usr/lib/" cargo make -p production-linux-x86_64 appflowy-linux
 
 
 #================
diff --git a/frontend/scripts/makefile/flutter.toml b/frontend/scripts/makefile/flutter.toml
index 8d0bd8cd6c78..9f6b2a5369b1 100644
--- a/frontend/scripts/makefile/flutter.toml
+++ b/frontend/scripts/makefile/flutter.toml
@@ -94,6 +94,14 @@ run_task = { name = [
 ] }
 script_runner = "@shell"
 
+[tasks.appflowy-make-product-dev]
+run_task = { name = [
+  "set-app-version",
+  "flutter-build",
+  "copy-to-product",
+] }
+
+
 [tasks.copy-to-product]
 mac_alias = "copy-to-product-macos"
 windows_alias = "copy-to-product-windows"
@@ -227,8 +235,9 @@ script = [
   cd appflowy_flutter
   flutter clean
   flutter pub get
+  flutter packages pub get 
   cd ../
-  sh scripts/code_generation/generate.sh
+  sh scripts/code_generation/generate.sh -s
   """
 ]
 
@@ -239,6 +248,7 @@ script = [
   cd ./appflowy_flutter/
   exec cmd.exe /c flutter clean
   exec cmd.exe /c flutter pub get
+  exec cmd.exe /c flutter packages pub get
   cd ../
   exec scripts/code_generation/generate.cmd
   """,
diff --git a/frontend/scripts/makefile/mobile.toml b/frontend/scripts/makefile/mobile.toml
index 746a951543f0..7291d159e86b 100644
--- a/frontend/scripts/makefile/mobile.toml
+++ b/frontend/scripts/makefile/mobile.toml
@@ -26,8 +26,13 @@ script = [
   """
     cd rust-lib/
     rustup show
-    echo cargo lipo --targets ${RUST_COMPILE_TARGET} --features "${FLUTTER_DESKTOP_FEATURES}"
-    cargo lipo --targets ${RUST_COMPILE_TARGET} --features "${FLUTTER_DESKTOP_FEATURES}"
+    if [ "${BUILD_FLAG}" == "debug" ]; then
+      echo "🚀 🚀 🚀  Building for debug"
+      cargo lipo --targets ${RUST_COMPILE_TARGET} --features "${FLUTTER_DESKTOP_FEATURES}"
+    else
+      echo "🚀 🚀 🚀  Building for release"
+      cargo lipo --targets ${RUST_COMPILE_TARGET} --features "${FLUTTER_DESKTOP_FEATURES}" --release
+    fi
     cd ../
   """,
 ]
diff --git a/frontend/scripts/makefile/tests.toml b/frontend/scripts/makefile/tests.toml
index 0ce5b6f49c06..c5e946b1066e 100644
--- a/frontend/scripts/makefile/tests.toml
+++ b/frontend/scripts/makefile/tests.toml
@@ -36,8 +36,33 @@ cd appflowy_flutter
 flutter test --dart-define=RUST_LOG=${RUST_LOG} -j, --concurrency=1 --coverage
 '''
 
+[tasks.dart_unit_test_no_build]
+script = '''
+cargo make --profile test-macos-$(uname -m) run_dart_unit_test_no_build
+'''
+
+[tasks.dart_unit_test_no_build.windows]
+script = '''
+cargo make --profile test-windows run_dart_unit_test_no_build
+'''
+
+[tasks.dart_unit_test_no_build.linux]
+script = '''
+cargo make --profile test-linux run_dart_unit_test_no_build
+'''
+
+[tasks.run_dart_unit_test_no_build]
+env = { RUST_LOG = "info" }
+dependencies = ["copy-from-build-to-sandbox-folder"]
+description = "Run flutter unit tests"
+script = '''
+cd appflowy_flutter
+flutter test --dart-define=RUST_LOG=${RUST_LOG} -j, --concurrency=1 --coverage
+'''
+script_runner = "@shell"
+
 [tasks.rust_unit_test]
-run_task = { name = ["rust_lib_unit_test", "shared_lib_unit_test"] }
+run_task = { name = ["rust_lib_unit_test"] }
 
 [tasks.supabase_unit_test]
 env = { RUST_LOG = "info" }
@@ -323,4 +348,49 @@ script = [
     ${dest}
   """,
 ]
-script_runner = "@duckscript"
\ No newline at end of file
+script_runner = "@duckscript"
+
+[tasks.copy-from-build-to-sandbox-folder]
+mac_alias = "copy-from-build-to-sandbox-folder-macos"
+windows_alias = "copy-from-build-to-sandbox-folder-windows"
+linux_alias = "copy-from-build-to-sandbox-folder-linux"
+
+[tasks.copy-from-build-to-sandbox-folder-windows]
+private = true
+script = [
+  """
+    # Copy the appflowy_backend lib to system temp directory for flutter unit test.
+    lib = set ${LIB_NAME}.${TEST_LIB_EXT}
+    dest = set ${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/appflowy_flutter/.sandbox/${lib}
+    dart_ffi_dir= set ${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/appflowy_flutter/windows/flutter/dart_ffi
+    rm ${dest}
+
+    cp ${dart_ffi_dir}/${lib} ${dest}
+  """,
+]
+script_runner = "@duckscript"
+
+[tasks.copy-from-build-to-sandbox-folder-macos]
+private = true
+script = [
+  """
+    echo "This is not possible for mac because the tests wont work with .a lib"
+    exit 127
+  """,
+]
+script_runner = "@duckscript"
+
+[tasks.copy-from-build-to-sandbox-folder-linux]
+private = true
+script = [
+  """
+    # Copy the appflowy_backend lib to system temp directory for flutter unit test.
+    lib = set lib${LIB_NAME}.${TEST_LIB_EXT}
+    dest = set ${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/appflowy_flutter/.sandbox/${lib}
+    dart_ffi_dir= set ${CARGO_MAKE_WORKSPACE_WORKING_DIRECTORY}/appflowy_flutter/linux/flutter/dart_ffi
+    rm ${dest}
+
+    cp ${dart_ffi_dir}/${lib} ${dest}
+  """,
+]
+script_runner = "@duckscript"