fix: token refresh on local (#4650 )

* fix: refresh user token on local * chore: add test
feat: improve more action in document (#4639 )
2024-02-14 09:38:05 +08:00 · 2024-02-09 15:54:05 +01:00 · 2024-02-09 14:40:06 +01:00 · 2024-02-09 10:18:52 +08:00 · 2024-02-09 00:18:51 +08:00 · 2024-02-08 23:53:05 +08:00
3176 changed files with 162464 additions and 110848 deletions
@@ -21,7 +21,7 @@ Before you mark this PR ready for review, run through this checklist!

 #### PR Checklist

- [ ] My code adheres to the [AppFlowy Style Guide](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/submitting-code/style-guides)
+- [ ] My code adheres to [AppFlowy's Conventions](https://docs.appflowy.io/docs/documentation/software-contributions/conventions)
 - [ ] I've listed at least one issue that this PR fixes in the description above.
 - [ ] I've added a test(s) to validate changes in this PR, or this PR only contains semantic changes.
 - [ ] All existing tests are passing.
@@ -0,0 +1,29 @@
+name: Build Bot
+
+on:
+  issue_comment:
+    types: [created]
+
+jobs:
+  dispatch_slash_command:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout source code
+        uses: actions/checkout@v3
+
+      # get build name from pubspec.yaml
+      - name: Get build version
+        working-directory: frontend/appflowy_flutter
+        id: get_build_name
+        run: |
+          echo "fetching version from pubspec.yaml..."
+          echo "build_name=$(grep 'version: ' pubspec.yaml | awk '{print $2}')" >> $GITHUB_OUTPUT
+
+
+      - uses: peter-evans/slash-command-dispatch@v4
+        with:
+          token: ${{ secrets.PAT }}
+          commands: build
+          static-args: |
+            ref=refs/pull/${{ github.event.issue.number }}/head
+            build_name=${{ steps.get_build_name.outputs.build_name }}
@@ -0,0 +1,42 @@
+name: build
+
+on:
+  repository_dispatch:
+    types: [build-command]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: notify appflowy_builder
+        run: |
+          platform=${{ github.event.client_payload.slash_command.args.unnamed.arg1 }}
+          build_name=${{ github.event.client_payload.slash_command.args.named.build_name }}
+          branch=${{ github.event.client_payload.slash_command.args.named.ref }}
+          build_type=""
+          arch=""
+
+          if [ "$platform" = "android" ]; then
+            build_type="apk"
+          elif [ "$platform" = "macos" ]; then
+            arch="universal"
+          fi
+
+          params=$(jq -n \
+            --arg ref "main" \
+            --arg repo "LucasXu0/AppFlowy" \
+            --arg branch "$branch" \
+            --arg build_name "$build_name" \
+            --arg build_type "$build_type" \
+            --arg arch "$arch" \
+            '{ref: $ref, inputs: {repo: $repo, branch: $branch, build_name: $build_name, build_type: $build_type, arch: $arch}} | del(.inputs | .. | select(. == ""))')
+
+          echo "params: $params"
+
+          curl -L \
+            -X POST \
+            -H "Accept: application/vnd.github+json" \
+            -H "Authorization: Bearer ${{ secrets.TOKEN }}" \
+            -H "X-GitHub-Api-Version: 2022-11-28" \
+            https://api.github.com/repos/AppFlowy-IO/AppFlowy-Builder/actions/workflows/$platform.yaml/dispatches \
+            -d "$params"
@@ -4,33 +4,392 @@ on:
  push:
    branches:
      - "main"
-      - "develop"
      - "release/*"
    paths:
      - ".github/workflows/flutter_ci.yaml"
-      - "frontend/**"
-      - "!frontend/appflowy_tauri/**"
+      - "frontend/rust-lib/**"
+      - "frontend/appflowy_flutter/**"

  pull_request:
    branches:
      - "main"
-      - "develop"
      - "release/*"
    paths:
      - ".github/workflows/flutter_ci.yaml"
-      - "frontend/**"
-      - "!frontend/appflowy_tauri/**"
+      - "frontend/rust-lib/**"
+      - "frontend/appflowy_flutter/**"

 env:
-  FLUTTER_VERSION: "3.10.1"
-  RUST_TOOLCHAIN: "1.70"
+  CARGO_TERM_COLOR: always
+  FLUTTER_VERSION: "3.18.0-0.2.pre"
+  RUST_TOOLCHAIN: "1.75"
+  CARGO_MAKE_VERSION: "0.36.6"

 concurrency:
  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
  cancel-in-progress: true

 jobs:
+  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:
+      # 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"
+          sudo rm -rf "$AGENT_TOOLSDIRECTORY"
+
+      - 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: "beta"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+
+      - 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" == "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
+          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: 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]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+    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: "beta"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+
+      - 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" == "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 flutter pub get
+        working-directory: frontend
+        run: cargo make pub_get
+
+      - name: Run Flutter unit tests
+        working-directory: frontend
+        run: |
+          if [ "$RUNNER_OS" == "macOS" ]; then
+            cargo make dart_unit_test
+          elif [ "$RUNNER_OS" == "Linux" ]; then
+            cargo make dart_unit_test_no_build
+          elif [ "$RUNNER_OS" == "Windows" ]; then
+            cargo make dart_unit_test_no_build
+          fi
+        shell: bash
+
+  cloud_integration_test:
+    needs: [ prepare ]
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ ubuntu-latest ]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: Checkout appflowy cloud code
+        uses: actions/checkout@v3
+        with:
+          repository: AppFlowy-IO/AppFlowy-Cloud
+          path: AppFlowy-Cloud
+          depth: 1
+
+      - name: Prepare appflowy cloud env
+        working-directory: AppFlowy-Cloud
+        run: |
+          # log level
+          cp deploy.env .env
+          sed -i 's|RUST_LOG=.*|RUST_LOG=trace|' .env
+          sed -i 's/GOTRUE_EXTERNAL_GOOGLE_ENABLED=.*/GOTRUE_EXTERNAL_GOOGLE_ENABLED=true/' .env
+          sed -i 's|API_EXTERNAL_URL=.*|API_EXTERNAL_URL=http://localhost|' .env
+
+      - name: Run Docker-Compose
+        working-directory: AppFlowy-Cloud
+        run: |
+          docker compose down -v --remove-orphans
+          docker compose pull
+          docker compose up -d
+          sleep 10
+
+      - name: Checkout source code
+        uses: actions/checkout@v2
+
+      - name: Install flutter
+        id: flutter
+        uses: subosito/flutter-action@v2
+        with:
+          channel: "beta"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+
+      - uses: taiki-e/install-action@v2
+        with:
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}
+
+      - name: Install prerequisites
+        working-directory: frontend
+        run: |
+          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
+        shell: bash
+
+      - name: Enable Flutter Desktop
+        run: |
+          flutter config --enable-linux-desktop
+        shell: bash
+
+      - uses: actions/download-artifact@v3
+        with:
+          name: ${{ github.run_id }}-${{ matrix.os }}
+
+      - name: Uncompressed appflowy_flutter
+        run: |
+          tar -xf appflowy_flutter.tar.gz
+          ls -al
+
+      - name: Run flutter pub get
+        working-directory: frontend
+        run: cargo make pub_get
+
+      - name: Run Flutter integration tests
+        working-directory: frontend/appflowy_flutter
+        run: |
+          export DISPLAY=:99
+          sudo Xvfb -ac :99 -screen 0 1280x1024x24 > /dev/null 2>&1 &
+          sudo apt-get install network-manager
+          docker ps -a
+          flutter test integration_test/cloud/cloud_runner.dart -d Linux --coverage
+        shell: bash
+
+  integration_test:
+    needs: [prepare]
+    if: github.event.pull_request.draft != true
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest]
+        include:
+          - os: ubuntu-latest
+            flutter_profile: development-linux-x86_64
+            target: x86_64-unknown-linux-gnu
+    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: "beta"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+
+      - 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: Uncompressed appflowy_flutter
+        run: tar -xf appflowy_flutter.tar.gz
+
+      - name: Run flutter pub get
+        working-directory: frontend
+        run: cargo make pub_get
+
+      - 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
  build:
+    needs: [prepare]
    if: github.event.pull_request.draft != true
    strategy:
      fail-fast: false
@@ -65,36 +424,22 @@ jobs:
        id: flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true

-      - uses: Swatinem/rust-cache@v2
+      - uses: taiki-e/install-action@v2
        with:
-          prefix-key: ${{ matrix.os }}
-          workspaces: |
-            frontend/rust-lib
-
-      - uses: davidB/rust-cargo-make@v1
-        with:
-          version: '0.36.6'
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}

      - 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'
+            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
-          cargo make appflowy-flutter-deps-tools
        shell: bash

      - name: Enable Flutter Desktop
@@ -109,32 +454,14 @@ jobs:
          fi
        shell: bash

-      - name: Build AppFlowy
-        working-directory: frontend
-        run: |
-          cargo make --profile ${{ matrix.flutter_profile }} appflowy-dev
-
-      - name: Flutter Analyzer
-        working-directory: frontend/appflowy_flutter
-        run: |
-          flutter analyze .
-
-      - name: Run Flutter unit tests
-        working-directory: frontend
-        run: |
-          cargo make dart_unit_test
-
-      - name: Upload coverage to Codecov
-        uses: Wandalen/wretry.action@v1.0.36
+      - uses: actions/download-artifact@v3
        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
+          name: ${{ github.run_id }}-${{ matrix.os }}

+      - name: Uncompressed appflowy_flutter
+        run: tar -xf appflowy_flutter.tar.gz
+
+      - name: Build flutter product
+        working-directory: frontend
+        run: |
+          cargo make --profile ${{ matrix.flutter_profile }} appflowy-make-product-dev
@@ -1,141 +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:
-      - 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
@@ -0,0 +1,111 @@
+name: Mobile-CI
+
+on:
+  push:
+    branches:
+      - "main"
+    paths:
+      - ".github/workflows/mobile_ci.yaml"
+      - "frontend/**"
+      - "!frontend/appflowy_tauri/**"
+
+  pull_request:
+    branches:
+      - "main"
+    paths:
+      - ".github/workflows/mobile_ci.yaml"
+      - "frontend/**"
+      - "!frontend/appflowy_tauri/**"
+
+env:
+  FLUTTER_VERSION: "3.18.0-0.2.pre"
+
+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]
+        include:
+          - os: ubuntu-latest
+            target: aarch64-linux-android
+    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"
+          sudo rm -rf "$AGENT_TOOLSDIRECTORY"
+          sudo docker image prune --all --force
+          sudo rm -rf /opt/hostedtoolcache/codeQL
+          sudo rm -rf ${GITHUB_WORKSPACE}/.git
+          sudo rm -rf $ANDROID_HOME/ndk
+
+      - name: Checkout source code
+        uses: actions/checkout@v2
+
+      - name: Install flutter
+        id: flutter
+        uses: subosito/flutter-action@v2
+        with:
+          channel: "beta"
+          flutter-version: ${{ env.FLUTTER_VERSION }}
+          cache: true
+
+      - uses: nttld/setup-ndk@v1
+        id: setup-ndk
+        with:
+          ndk-version: "r24"
+          add-to-path: true
+
+      - uses: gradle/gradle-build-action@v2
+        with:
+          gradle-version: 7.6.3
+
+      - uses: Swatinem/rust-cache@v2
+        with:
+          prefix-key: ${{ matrix.os }}
+          workspaces: |
+            frontend/rust-lib
+
+      - uses: davidB/rust-cargo-make@v1
+        with:
+          version: "0.36.6"
+
+      - name: Install prerequisites
+        working-directory: frontend
+        run: |
+          rustup target install aarch64-linux-android
+          rustup target install x86_64-linux-android
+          cargo install --force duckscript_cli
+          cargo install cargo-ndk
+          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 gcc-multilib
+          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: Build AppFlowy
+        working-directory: frontend
+        env:
+          ANDROID_NDK_HOME: ${{ steps.setup-ndk.outputs.ndk-path }}
+        run: |
+          cargo make --profile development-android appflowy-android-dev-ci
@@ -6,8 +6,8 @@ on:
      - "*"

 env:
-  FLUTTER_VERSION: "3.10.1"
-  RUST_TOOLCHAIN: "1.70"
+  FLUTTER_VERSION: "3.18.0-0.2.pre"
+  RUST_TOOLCHAIN: "1.75"

 jobs:
  create-release:
@@ -57,9 +57,8 @@ jobs:
      - name: Install flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true

      - name: Install Rust toolchain
        uses: actions-rs/toolchain@v1
@@ -70,11 +69,6 @@ jobs:
          components: rustfmt
          profile: minimal

-      - uses: Swatinem/rust-cache@v2
-        with:
-          prefix-key: appflowy-lib-cache
-          key: ${{ matrix.job.os }}-${{ matrix.job.target }}
-
      - name: Install prerequisites
        working-directory: frontend
        run: |
@@ -149,9 +143,8 @@ jobs:
      - name: Install flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true

      - name: Install Rust toolchain
        uses: actions-rs/toolchain@v1
@@ -162,11 +155,6 @@ jobs:
          components: rustfmt
          profile: minimal

-      - uses: Swatinem/rust-cache@v2
-        with:
-          prefix-key: appflowy-lib-cache
-          key: ${{ matrix.job.os }}-${{ matrix.job.target }}
-
      - name: Install prerequisites
        working-directory: frontend
        run: |
@@ -255,9 +243,8 @@ jobs:
      - name: Install flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true

      - name: Install Rust toolchain
        uses: dtolnay/rust-toolchain@stable
@@ -266,11 +253,6 @@ jobs:
          targets: ${{ matrix.job.targets }}
          components: rustfmt

-      - uses: Swatinem/rust-cache@v2
-        with:
-          prefix-key: appflowy-lib-cache
-          key: ${{ matrix.job.os }}-${{ matrix.job.target }}
-
      - name: Install prerequisites
        working-directory: frontend
        run: |
@@ -281,7 +263,7 @@ jobs:
        working-directory: frontend
        run: |
          flutter config --enable-macos-desktop
-          sh scripts/flutter_release_build/build_universal_package_for_macos.sh
+          sh scripts/flutter_release_build/build_universal_package_for_macos.sh ${{ github.ref_name }}

      - name: Codesign AppFlowy
        run: |
@@ -345,6 +327,8 @@ jobs:
      LINUX_PACKAGE_DEB_NAME: AppFlowy-${{ github.ref_name }}-linux-x86_64.deb
      LINUX_PACKAGE_RPM_NAME: AppFlowy-${{ github.ref_name }}-linux-x86_64.rpm
      LINUX_PACKAGE_TMP_RPM_NAME: AppFlowy-${{ github.ref_name }}-2.x86_64.rpm
+      LINUX_PACKAGE_TMP_APPIMAGE_NAME: AppFlowy-${{ github.ref_name }}-x86_64.AppImage
+      LINUX_PACKAGE_APPIMAGE_NAME: AppFlowy-${{ github.ref_name }}-linux-x86_64.AppImage

    strategy:
      fail-fast: false
@@ -364,9 +348,8 @@ jobs:
      - name: Install flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
-          cache: true

      - name: Install Rust toolchain
        uses: actions-rs/toolchain@v1
@@ -377,11 +360,6 @@ jobs:
          components: rustfmt
          profile: minimal

-      - uses: Swatinem/rust-cache@v2
-        with:
-          prefix-key: appflowy-lib-cache
-          key: ${{ matrix.job.os }}-${{ matrix.job.target }}
-
      - name: Install prerequisites
        working-directory: frontend
        run: |
@@ -419,11 +397,15 @@ jobs:
      - name: Build Linux package (.rpm)
        working-directory: ${{ env.LINUX_APP_RELEASE_PATH }}
        run: |
-          ls -a
          sudo alien -r ${{ env.LINUX_PACKAGE_DEB_NAME }}
-          echo '------------'
          cp -r ${{ env.LINUX_PACKAGE_TMP_RPM_NAME }} ${{ env.LINUX_PACKAGE_RPM_NAME }}
-          ls -a
+
+      - name: Build Linux package (.AppImage)
+        working-directory: frontend
+        continue-on-error: true
+        run: |
+          sh scripts/linux_distribution/appimage/build_appimage.sh ${{ github.ref_name }}
+          cp -r ${{ env.LINUX_PACKAGE_TMP_APPIMAGE_NAME }} ${{ env.LINUX_PACKAGE_APPIMAGE_NAME }}

      - name: Upload Asset
        id: upload-release-asset
@@ -458,6 +440,17 @@ jobs:
          asset_name: ${{ env.LINUX_PACKAGE_RPM_NAME }}
          asset_content_type: application/octet-stream

+      - name: Upload AppImage package
+        id: upload-release-asset-install-package-appimage
+        uses: actions/upload-release-asset@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          upload_url: ${{ needs.create-release.outputs.upload_url }}
+          asset_path: ${{ env.LINUX_APP_RELEASE_PATH }}/${{ env.LINUX_PACKAGE_APPIMAGE_NAME }}
+          asset_name: ${{ env.LINUX_PACKAGE_APPIMAGE_NAME }}
+          asset_content_type: application/octet-stream
+
  build-for-docker:
    runs-on: ubuntu-latest
    steps:
@@ -8,7 +8,6 @@ on:
      - "release/*"
    paths:
      - "frontend/rust-lib/**"
-      - "shared-lib/**"

  pull_request:
    branches:
@@ -17,15 +16,13 @@ on:
      - "release/*"
    paths:
      - "frontend/rust-lib/**"
-      - "shared-lib/**"

 env:
  CARGO_TERM_COLOR: always
-  RUST_TOOLCHAIN: "1.70"
+  RUST_TOOLCHAIN: "1.75"

 jobs:
  test-on-ubuntu:
-    environment: SUPABASE_CI
    runs-on: ubuntu-latest
    steps:
      - name: Checkout source code
@@ -52,30 +49,42 @@ jobs:
          workspaces: |
            frontend/rust-lib

-      - name: Create .env file in flowy-server
-        working-directory: frontend/rust-lib/flowy-server
-        run: |
-          touch .env.ci
-          echo SUPABASE_URL=${{ secrets.SUPABASE_URL }} >> .env.ci
-          echo SUPABASE_ANON_KEY=${{ secrets.SUPABASE_ANON_KEY }} >> .env.ci
-          echo SUPABASE_JWT_SECRET=${{ secrets.SUPABASE_JWT_SECRET }} >> .env.ci
+      - name: Checkout appflowy cloud code
+        uses: actions/checkout@v3
+        with:
+          repository: AppFlowy-IO/AppFlowy-Cloud
+          path: AppFlowy-Cloud
+          depth: 1

-      - name: Create .env file in flowy-test
-        working-directory: frontend/rust-lib/flowy-test
+      - name: Prepare appflowy cloud env
+        working-directory: AppFlowy-Cloud
        run: |
-          touch .env.ci
-          echo SUPABASE_URL=${{ secrets.SUPABASE_URL }} >> .env.ci
-          echo SUPABASE_ANON_KEY=${{ secrets.SUPABASE_ANON_KEY }} >> .env.ci
-          echo SUPABASE_JWT_SECRET=${{ secrets.SUPABASE_JWT_SECRET }} >> .env.ci
+          # log level
+          cp deploy.env .env
+          sed -i 's|RUST_LOG=.*|RUST_LOG=trace|' .env
+          sed -i 's|API_EXTERNAL_URL=.*|API_EXTERNAL_URL=http://localhost|' .env
+
+      - name: Run Docker-Compose
+        working-directory: AppFlowy-Cloud
+        run: |
+          docker pull appflowyinc/appflowy_cloud:latest
+          docker compose up -d

      - name: Run rust-lib tests
        working-directory: frontend/rust-lib
-        run: RUST_LOG=info RUST_BACKTRACE=1 cargo test --no-default-features --features="rev-sqlite"
+        env:
+          RUST_LOG: info
+          RUST_BACKTRACE: 1
+          af_cloud_test_base_url: http://localhost
+          af_cloud_test_ws_url: ws://localhost/ws
+          af_cloud_test_gotrue_url: http://localhost/gotrue
+        run: cargo test --no-default-features --features="rev-sqlite,dart" -- --nocapture
+

      - name: rustfmt rust-lib
        run: cargo fmt --all -- --check
        working-directory: frontend/rust-lib/

      - name: clippy rust-lib
-        run: cargo clippy --all
-        working-directory: frontend/rust-lib
+        run: cargo clippy --all-targets -- -D warnings
+        working-directory: frontend/rust-lib
@@ -7,12 +7,11 @@ on:
      - "release/*"
    paths:
      - "frontend/rust-lib/**"
-      - "shared-lib/**"

 env:
  CARGO_TERM_COLOR: always
-  FLUTTER_VERSION: "3.10.1"
-  RUST_TOOLCHAIN: "1.70"
+  FLUTTER_VERSION: "3.18.0-0.2.pre"
+  RUST_TOOLCHAIN: "1.75"

 jobs:
  tests:
@@ -34,7 +33,7 @@ jobs:
        id: flutter
        uses: subosito/flutter-action@v2
        with:
-          channel: "stable"
+          channel: "beta"
          flutter-version: ${{ env.FLUTTER_VERSION }}
          cache: true

@@ -9,7 +9,7 @@ on:
 env:
  NODE_VERSION: "18.16.0"
  PNPM_VERSION: "8.5.0"
-  RUST_TOOLCHAIN: "1.70"
+  RUST_TOOLCHAIN: "1.75"

 concurrency:
  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
@@ -0,0 +1,82 @@
+name: WEB-CI
+
+on:
+  pull_request:
+    branches:
+      - "main"
+    paths:
+      - ".github/workflows/web_ci.yaml"
+      - "frontend/rust-lib/**"
+      - "frontend/appflowy_web/**"
+
+env:
+  CARGO_TERM_COLOR: always
+  NODE_VERSION: "18.16.0"
+  PNPM_VERSION: "8.5.0"
+  RUST_TOOLCHAIN: "1.75"
+  CARGO_MAKE_VERSION: "0.36.6"
+
+jobs:
+  web-build:
+    if: github.event.pull_request.draft != true
+    strategy:
+      fail-fast: false
+      matrix:
+        platform: [ubuntu-latest]
+
+    runs-on: ${{ matrix.platform }}
+    steps:
+      - uses: actions/checkout@v3
+      - name: setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Cache Rust Dependencies
+        uses: Swatinem/rust-cache@v2
+        with:
+          key: rust-dependencies-${{ runner.os }}
+          workspaces: |
+            frontend/rust-lib
+            frontend/appflowy_web/appflowy_wasm
+
+      - name: Cache Node.js dependencies
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: npm-${{ runner.os }}
+
+      - name: Cache node_modules
+        uses: actions/cache@v2
+        with:
+          path: frontend/appflowy_web/node_modules
+          key: node-modules-${{ runner.os }}
+
+      - name: Install Rust toolchain
+        id: rust_toolchain
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: ${{ env.RUST_TOOLCHAIN }}
+          override: true
+          profile: minimal
+
+      - name: Install wasm-pack
+        run: cargo install wasm-pack
+
+      - uses: taiki-e/install-action@v2
+        with:
+          tool: cargo-make@${{ env.CARGO_MAKE_VERSION }}
+
+      - name: install dependencies
+        if: matrix.platform == 'ubuntu-latest'
+        working-directory: frontend
+        run: |
+          sudo apt-get update
+          npm install -g pnpm@${{ env.PNPM_VERSION }}
+          cargo make install_web_protobuf
+
+      - name: Build
+        working-directory: frontend/appflowy_web
+        run: |
+          pnpm install
+          pnpm run build_release_wasm
@@ -21,11 +21,8 @@ node_modules

 **/resources/proto

-!frontend/.vscode/settings.json
-!frontend/.vscode/tasks.json
-!frontend/.vscode/launch.json
-!frontend/.vscode/extensions.json
-!frontend/.vscode/*.code-snippets
+# ignore settings.json
+frontend/.vscode/settings.json

 # Commit the highest level pubspec.lock, but ignore the others
 pubspec.lock
@@ -38,7 +35,7 @@ pubspec.lock

 **/AppFlowy-Collab/

-# ignore the deb filegit
+# ignore generated assets
 frontend/package
 frontend/*.deb

@@ -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>
@@ -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>
@@ -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>
@@ -1,4 +1,138 @@
 # Release Notes
+## Version 0.4.8 - 02/13/2024
+### Bug Fixes
+- Fixed a possible error when loading workspaces
+
+## Version 0.4.6 - 02/03/2024
+### Bug Fixes
+- Fixed refresh token bug
+
+## Version 0.4.5 - 02/01/2024
+### Bug Fixes
+- Fixed WebSocket connection issue
+
+## Version 0.4.4 - 01/31/2024
+### New Features
+- Added functionality for uploading images to cloud storage.
+- Enabled anonymous sign-in option for mobile platform users.
+- Introduced the ability to customize cloud settings directly from the startup page.
+- Added support for inserting reminders on the mobile platform.
+- Overhauled the user interface on mobile devices, including improvements to the action bottom sheet, editor toolbar, database details page, and app bar.
+- Implemented a shortcut (F2 key) to rename the current view.
+
+### Bug Fixes
+- Fixed an issue where the font family was not displaying correctly on the mobile platform.
+- Resolved a problem with the mobile row detail title not updating correctly.
+- Fixed issues related to deleting images and refactored the image actions menu for better usability.
+- Fixed other known issues.
+
+# Release Notes
+## Version 0.4.3 - 01/16/2024
+### Bug Fixes
+- Fixed file name too long issue
+
+## Version 0.4.2 - 01/15/2024
+AppFlowy for Android is available to download on GitHub.
+If you’ve been using our desktop app, it’s important to read [this guide](https://docs.appflowy.io/docs/guides/sync-desktop-and-mobile) before logging into the mobile app.
+### New Features
+- Enhanced RTL (Right-to-Left) support for mobile platforms.
+- Optimized selection gesture system on mobile.
+- Optimized the mobile toolbar menu.
+- Improved reference menu (‘@’ menu).
+- Updated privacy policy.
+- Improved the data import process for AppFlowy by implementing a progress indicator and compressing the data to enhance efficiency.
+- Enhanced the utilization of local disk space to optimize storage consumption.
+### Bug Fixes
+- Fixed sign-in cancellation issue on mobile.
+- Resolved keyboard close bug on Android.
+
+
+## Version 0.4.1 - 01/03/2024
+### Bug fixes
+- Fix import AppFlowy data folder
+
+## Version 0.4.0 - 12/30/2023
+1. Added capability to import data from an AppFlowy data folder. For detailed information, please see [AppFlowy Data Storage Documentation](https://docs.appflowy.io/docs/appflowy/product/data-storage).
+2. Enhanced user interface and fixed various bugs.
+3. Improved the efficiency of data synchronization in AppFlowy Cloud
+
+## Version 0.3.9.1 - 12/07/2023
+
+### Bug fixes
+- Fix potential blank pages that may occur in an empty document
+
+## Version 0.3.9 - 12/07/2023
+
+### New Features
+- Support inserting a new field to the left or right of an existing one
+
+### Bug fixes
+- Fix some emojis are shown in black/white
+- Fix unable to rename a subpage of subpage
+
+## Version 0.3.8 - 11/13/2023
+
+### New Features
+- Support hiding any stack in a board
+- Support customizing page icons in menu
+- Display visual hint when card contains notes
+- Quick action for adding new stack to a board
+- Support more ways of inserting page references in documents
+- Shift + click on a checkbox to power toggle its children
+
+### Bug fixes
+- Improved color of the "Share"-button text
+- Text overflow issue in Calendar properties
+- Default font (Roboto) added to application
+- Placeholder added for the editor inside a Card
+- Toggle notifications in settings have been fixed
+- Dialog for linking board/grid/calendar opens in correct position
+- Quick add Card in Board at top, correctly adds a new Card at the top
+
+## Version 0.3.7 - 10/30/2023
+
+### New Features
+- Support showing checklist items inline in row page.
+- Support inserting date from slash menu.
+- Support renaming a stack directly by clicking on the stack name.
+- Show the detailed reminder content in the notification center.
+- Save card order in Board view.
+- Allow to hide the ungrouped stack.
+- Segmented the checklist progress bar.
+
+### Bug fixes
+- Optimize side panel animation.
+- Fix calendar with hidden date or title doesn't show options correctly.
+- Fix the horizontal scroll bar disappears in Grid view.
+- Improve setting tab UI in Grid view.
+- Improve theme of the code block.
+- Fix some UI issues.
+
+## Version 0.3.6 - 10/16/2023
+
+### New Features
+- Support setting Markdown styles through keyboard shortcuts.
+- Added Ukrainian language.
+- Support auto-hiding sidebar feature, ensuring a streamlined view even when resizing to a smaller window.
+- Support toggling the notifitcation on/off.
+- Added Lemonade theme.
+
+### Bug fixes
+- Improve Vietnamese translations.
+- Improve reminder feature.
+- Fix some UI issues.
+
+## Version 0.3.5 - 10/09/2023
+
+### New Features
+- Added support for browsing and inserting images from Unsplash.
+- Revamp and unify the emoji picker throughout AppFlowy.
+
+### Bug fixes
+- Improve layout of the settings page.
+- Improve design of the restore page banner.
+- Improve UX of the reminders.
+- Other UI fixes.

 ## Version 0.3.4 - 10/02/2023

@@ -18,7 +18,7 @@ You are in charge of your data and customizations.
 </p>

 <p align="center">
-    <a href="http://www.appflowy.io"><b>Website</b></a> •
+    <a href="https://www.appflowy.io"><b>Website</b></a> •
    <a href="https://discord.gg/9Q2xaN37tV"><b>Discord</b></a> •
    <a href="https://twitter.com/appflowy"><b>Twitter</b></a>
 </p>
@@ -47,7 +47,7 @@ You are in charge of your data and customizations.

 ## Getting Started with development

-Please view the [documentation](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy) for OS specific development instructions
+Please view the [documentation](https://docs.appflowy.io/docs/documentation/appflowy/from-source) for OS specific development instructions

 ## Roadmap

@@ -73,7 +73,7 @@ Proudly wear your T-shirt and show it to us by tagging [@appflowy](https://twitt

 [![translation badge](https://inlang.com/badge?url=github.com/AppFlowy-IO/AppFlowy)](https://inlang.com/editor/github.com/AppFlowy-IO/AppFlowy?ref=badge)

-To add translations, you can manually edit the JSON translation files in `/frontend/appflowy_flutter/assets/translations`, use the [inlang online editor](https://inlang.com/editor/github.com/AppFlowy-IO/AppFlowy), or run `npx inlang machine translate` to add missing translations.
+To add translations, you can manually edit the JSON translation files in `/frontend/resources/translations`, use the [inlang online editor](https://inlang.com/editor/github.com/AppFlowy-IO/AppFlowy), or run `npx inlang machine translate` to add missing translations.


 ## Join the community to build AppFlowy together
@@ -4,6 +4,21 @@
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
+        {
+            // This task only builds the Dart code of AppFlowy.
+            // It supports both the desktop and mobile version.
+            "name": "AF: Build Dart Only",
+            "request": "launch",
+            "program": "./lib/main.dart",
+            "type": "dart",
+            "env": {
+                "RUST_LOG": "trace",
+                "RUST_BACKTRACE": "1"
+            },
+            // uncomment the following line to testing performance.
+            // "flutterMode": "profile",
+            "cwd": "${workspaceRoot}/appflowy_flutter"
+        },
        {
            // This task builds the Rust and Dart code of AppFlowy.
            "name": "AF-desktop: Build All",
@@ -13,18 +28,7 @@
            "preLaunchTask": "AF: Build Appflowy Core",
            "env": {
                "RUST_LOG": "trace",
-                "RUST_BACKTRACE": 1
-            },
-            "cwd": "${workspaceRoot}/appflowy_flutter"
-        },
-        {
-            //  This task only builds the Dart code of AppFlowy.
-            "name": "AF-desktop: Build Dart Only",
-            "request": "launch",
-            "program": "./lib/main.dart",
-            "type": "dart",
-            "env": {
-                "RUST_LOG": "debug",
+                "RUST_BACKTRACE": "1"
            },
            "cwd": "${workspaceRoot}/appflowy_flutter"
        },
@@ -43,6 +47,17 @@
            },
            "cwd": "${workspaceRoot}/appflowy_flutter"
        },
+        {
+            "name": "AF-iOS: Build All",
+            "request": "launch",
+            "program": "./lib/main.dart",
+            "type": "dart",
+            "preLaunchTask": "AF: Build Appflowy Core For iOS",
+            "env": {
+                "RUST_LOG": "trace"
+            },
+            "cwd": "${workspaceRoot}/appflowy_flutter"
+        },
        {
            "name": "AF-iOS: Clean + Rebuild All",
            "request": "launch",
@@ -54,6 +69,17 @@
            },
            "cwd": "${workspaceRoot}/appflowy_flutter"
        },
+        {
+            "name": "AF-iOS-Simulator: Build All",
+            "request": "launch",
+            "program": "./lib/main.dart",
+            "type": "dart",
+            "preLaunchTask": "AF: Build Appflowy Core For iOS Simulator",
+            "env": {
+                "RUST_LOG": "trace"
+            },
+            "cwd": "${workspaceRoot}/appflowy_flutter"
+        },
        {
            "name": "AF-iOS-Simulator: Clean + Rebuild All",
            "request": "launch",
@@ -65,6 +91,28 @@
            },
            "cwd": "${workspaceRoot}/appflowy_flutter"
        },
+        {
+            "name": "AF-Android: Build All",
+            "request": "launch",
+            "program": "./lib/main.dart",
+            "type": "dart",
+            "preLaunchTask": "AF: Build Appflowy Core For Android",
+            "env": {
+                "RUST_LOG": "trace"
+            },
+            "cwd": "${workspaceRoot}/appflowy_flutter"
+        },
+        {
+            "name": "AF-Android: Clean + Rebuild All",
+            "request": "launch",
+            "program": "./lib/main.dart",
+            "type": "dart",
+            "preLaunchTask": "AF: Clean + Rebuild All (Android)",
+            "env": {
+                "RUST_LOG": "trace"
+            },
+            "cwd": "${workspaceRoot}/appflowy_flutter"
+        },
        {
            "name": "AF-desktop: Debug Rust",
            "request": "attach",
@@ -1,36 +0,0 @@
-{
-    "[dart]": {
-        "editor.formatOnSave": true,
-        "editor.formatOnType": true,
-        "editor.rulers": [80],
-        "editor.selectionHighlight": false,
-        "editor.suggest.snippetsPreventQuickSuggestions": false,
-        "editor.suggestSelection": "first",
-        "editor.tabCompletion": "onlySnippets",
-        "editor.wordBasedSuggestions": false,
-    },
-    "[javascript]": {
-        "editor.formatOnSave": true,
-        "editor.rulers": [80],
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    },
-    "[typescript]": {
-        "editor.formatOnSave": true,
-        "editor.rulers": [80],
-        "editor.defaultFormatter": "esbenp.prettier-vscode"
-    },
-    "svgviewer.enableautopreview": true,
-    "svgviewer.previewcolumn": "Active",
-    "svgviewer.showzoominout": true,
-    "editor.wordWrapColumn": 80,
-    "editor.minimap.maxColumn": 140,
-    "editor.wordWrap": "wordWrapColumn",
-    "dart.lineLength": 80,
-    "typescript.validate.enable": true,
-    "javascript.validate.enable": true,
-    "files.associations": {
-        "*.log.*": "log"
-    },
-    "editor.formatOnSave": true,
-    "files.eol": "\n",
-}
@@ -18,7 +18,6 @@
        "AF: Flutter Clean",
        "AF: Build Appflowy Core",
        "AF: Flutter Pub Get",
-        "AF: Flutter Package Get",
        "AF: Generate Language Files",
        "AF: Generate Freezed Files",
        "AF: Generate Svg Files"
@@ -37,7 +36,6 @@
        "AF: Flutter Clean",
        "AF: Build Appflowy Core For iOS",
        "AF: Flutter Pub Get",
-        "AF: Flutter Package Get",
        "AF: Generate Language Files",
        "AF: Generate Freezed Files",
        "AF: Generate Svg Files"
@@ -56,7 +54,6 @@
        "AF: Flutter Clean",
        "AF: Build Appflowy Core For iOS Simulator",
        "AF: Flutter Pub Get",
-        "AF: Flutter Package Get",
        "AF: Generate Language Files",
        "AF: Generate Freezed Files",
        "AF: Generate Svg Files"
@@ -66,6 +63,41 @@
        "panel": "new"
      }
    },
+    {
+      "label": "AF: Clean + Rebuild All (Android)",
+      "type": "shell",
+      "dependsOrder": "sequence",
+      "dependsOn": [
+        "AF: Dart Clean",
+        "AF: Flutter Clean",
+        "AF: Build Appflowy Core For Android",
+        "AF: Flutter Pub Get",
+        "AF: Generate Language Files",
+        "AF: Generate Freezed Files",
+        "AF: Generate Svg Files"
+      ],
+      "presentation": {
+        "reveal": "always",
+        "panel": "new"
+      }
+    },
+    {
+      "label": "AF: Build Appflowy Core",
+      "type": "shell",
+      "windows": {
+        "command": "cargo make --profile development-windows-x86 appflowy-core-dev"
+      },
+      "linux": {
+        "command": "cargo make --profile \"development-linux-$(uname -m)\" appflowy-core-dev"
+      },
+      "osx": {
+        "command": "cargo make --profile \"development-mac-$(uname -m)\" appflowy-core-dev"
+      },
+      "group": "build",
+      "options": {
+        "cwd": "${workspaceFolder}"
+      }
+    },
    {
      "label": "AF: Build Appflowy Core For iOS",
      "type": "shell",
@@ -85,17 +117,9 @@
      }
    },
    {
-      "label": "AF: Build Appflowy Core",
+      "label": "AF: Build Appflowy Core For Android",
      "type": "shell",
-      "windows": {
-        "command": "cargo make --profile development-windows-x86 appflowy-core-dev"
-      },
-      "linux": {
-        "command": "cargo make --profile \"development-linux-$(uname -m)\" appflowy-core-dev"
-      },
-      "osx": {
-        "command": "cargo make --profile \"development-mac-$(uname -m)\" appflowy-core-dev"
-      },
+      "command": "cargo make --profile development-android appflowy-core-dev-android",
      "group": "build",
      "options": {
        "cwd": "${workspaceFolder}"
@@ -108,7 +132,6 @@
      "dependsOn": [
        "AF: Flutter Clean",
        "AF: Flutter Pub Get",
-        "AF: Flutter Package Get",
        "AF: Generate Language Files",
        "AF: Generate Freezed Files",
        "AF: Generate Svg Files"
@@ -122,6 +145,15 @@
        "panel": "new"
      }
    },
+    {
+      "label": "AF: Dart Clean",
+      "type": "shell",
+      "command": "cargo make flutter_clean",
+      "group": "build",
+      "options": {
+        "cwd": "${workspaceFolder}"
+      }
+    },
    {
      "label": "AF: Flutter Clean",
      "type": "shell",
@@ -138,14 +170,6 @@
        "cwd": "${workspaceFolder}/appflowy_flutter"
      }
    },
-    {
-      "label": "AF: Flutter Package Get",
-      "type": "shell",
-      "command": "flutter packages pub get",
-      "options": {
-        "cwd": "${workspaceFolder}/appflowy_flutter"
-      }
-    },
    {
      "label": "AF: Generate Freezed Files",
      "type": "shell",
@@ -209,34 +233,18 @@
        "cwd": "${workspaceFolder}"
      }
    },
-    {
-      "label": "AF: Flutter Clean",
-      "type": "shell",
-      "command": "cargo make flutter_clean",
-      "group": "build",
-      "options": {
-        "cwd": "${workspaceFolder}"
-      }
-    },
    {
      "label": "AF: flutter build aar",
      "type": "flutter",
      "command": "flutter",
-      "args": ["build", "aar"],
+      "args": [
+        "build",
+        "aar"
+      ],
      "group": "build",
      "problemMatcher": [],
      "detail": "appflowy_flutter"
    },
-    {
-      "label": "AF: Tauri UI Dev",
-      "type": "shell",
-      "isBackground": true,
-      "command": "yarn",
-      "args": ["dev"],
-      "options": {
-        "cwd": "${workspaceFolder}/appflowy_tauri"
-      }
-    },
    {
      "label": "AF: Tauri UI Build",
      "type": "shell",
@@ -246,9 +254,10 @@
      }
    },
    {
-      "label": "AF: Tauri Dev",
+      "label": "AF: Tauri UI Dev",
      "type": "shell",
-      "command": "npm run tauri:dev",
+      "isBackground": true,
+      "command": "pnpm run tauri:dev",
      "options": {
        "cwd": "${workspaceFolder}/appflowy_tauri"
      }
@@ -265,7 +274,10 @@
      "label": "AF: Tauri Clean + Dev",
      "type": "shell",
      "dependsOrder": "sequence",
-      "dependsOn": ["AF: Tauri Clean", "AF: Tauri UI Dev"],
+      "dependsOn": [
+        "AF: Tauri Clean",
+        "AF: Tauri UI Dev"
+      ],
      "options": {
        "cwd": "${workspaceFolder}"
      }
@@ -281,10 +293,10 @@
    {
      "label": "AF: Generate Env File",
      "type": "shell",
-      "command": "dart run build_runner clean && dart run build_runner build --delete-conflicting-outputs ",
+      "command": "dart run build_runner clean && dart run build_runner build --delete-conflicting-outputs",
      "options": {
        "cwd": "${workspaceFolder}/appflowy_flutter"
      }
    }
  ]
-}
+}
@@ -10,6 +10,7 @@ extend = [
  { path = "scripts/makefile/flutter.toml" },
  { path = "scripts/makefile/tool.toml" },
  { path = "scripts/makefile/tauri.toml" },
+  { path = "scripts/makefile/web.toml" },
 ]

 [config]
@@ -25,9 +26,10 @@ CARGO_MAKE_EXTEND_WORKSPACE_MAKEFILE = true
 CARGO_MAKE_CRATE_FS_NAME = "dart_ffi"
 CARGO_MAKE_CRATE_NAME = "dart-ffi"
 LIB_NAME = "dart_ffi"
-CURRENT_APP_VERSION = "0.3.4"
+APPFLOWY_VERSION = "0.4.8"
 FLUTTER_DESKTOP_FEATURES = "dart,rev-sqlite"
 PRODUCT_NAME = "AppFlowy"
+MACOSX_DEPLOYMENT_TARGET = "11.0"
 # CRATE_TYPE: https://doc.rust-lang.org/reference/linkage.html
 # If you update the macOS's CRATE_TYPE, don't forget to update the
 # appflowy_backend.podspec
@@ -47,6 +49,8 @@ LIB_EXT = "a"
 APP_ENVIRONMENT = "local"
 FLUTTER_FLOWY_SDK_PATH = "appflowy_flutter/packages/appflowy_backend"
 TAURI_BACKEND_SERVICE_PATH = "appflowy_tauri/src/services/backend"
+WEB_BACKEND_SERVICE_PATH = "appflowy_web/src/services/backend"
+WEB_LIB_PATH= "appflowy_web/wasm-libs/af-wasm"
 # Test default config
 TEST_CRATE_TYPE = "cdylib"
 TEST_LIB_EXT = "dylib"
@@ -126,6 +130,7 @@ FLUTTER_OUTPUT_DIR = "Release"
 PRODUCT_EXT = "exe"
 CRATE_TYPE = "cdylib"
 LIB_EXT = "dll"
+BUILD_ARCHS = "x64"
 APP_ENVIRONMENT = "production"

 [env.development-linux-x86_64]
@@ -186,6 +191,31 @@ 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"
+CRATE_TYPE = "cdylib"
+FLUTTER_OUTPUT_DIR = "Debug"
+LIB_EXT = "so"
+PRODUCT_EXT = "apk"
+FLUTTER_DESKTOP_FEATURES = "dart,rev-sqlite,openssl_vendored"
+
+[env.production-android]
+BUILD_FLAG = "release"
+TARGET_OS = "android"
+CRATE_TYPE = "cdylib"
+FLUTTER_OUTPUT_DIR = "Release"
+PRODUCT_EXT = "apk"
+LIB_EXT = "so"
+
 [tasks.echo_env]
 script = ['''
    echo "-------- Env Parameters --------"
@@ -198,24 +228,10 @@ script = ['''
    echo APP_ENVIRONMENT: ${APP_ENVIRONMENT}
    echo ${platforms}
    echo ${BUILD_ARCHS}
+    echo ${BUILD_VERSION}
    ''']
 script_runner = "@shell"

-[env.development-android]
-BUILD_FLAG = "debug"
-TARGET_OS = "android"
-CRATE_TYPE = "cdylib"
-FLUTTER_OUTPUT_DIR = "Debug"
-FLUTTER_DESKTOP_FEATURES = "dart,rev-sqlite,openssl_vendored"
-
-[env.production-android]
-CARGO_PROFILE = "release"
-BUILD_FLAG = "release"
-TARGET_OS = "android"
-CRATE_TYPE = "cdylib"
-FLUTTER_OUTPUT_DIR = "Release"
-FLUTTER_DESKTOP_FEATURES = "dart,rev-sqlite,openssl_vendored"
-
 [tasks.setup-crate-type]
 private = true
 script = [
@@ -4,8 +4,8 @@
 # This file should be version controlled.

 version:
-  revision: 135454af32477f815a7525073027a3ff9eff1bfd
-  channel: stable
+  revision: 682aa387cfe4fbd71ccd5418b2c2a075729a1c66
+  channel: unknown

 project_type: app

@@ -13,11 +13,11 @@ project_type: app
 migration:
  platforms:
    - platform: root
-      create_revision: 135454af32477f815a7525073027a3ff9eff1bfd
-      base_revision: 135454af32477f815a7525073027a3ff9eff1bfd
-    - platform: windows
-      create_revision: 135454af32477f815a7525073027a3ff9eff1bfd
-      base_revision: 135454af32477f815a7525073027a3ff9eff1bfd
+      create_revision: 682aa387cfe4fbd71ccd5418b2c2a075729a1c66
+      base_revision: 682aa387cfe4fbd71ccd5418b2c2a075729a1c66
+    - platform: android
+      create_revision: 682aa387cfe4fbd71ccd5418b2c2a075729a1c66
+      base_revision: 682aa387cfe4fbd71ccd5418b2c2a075729a1c66

  # User provided section

@@ -1,7 +1,7 @@
 <h1 align="center" style="margin:0"> AppFlowy_Flutter</h1>
 <div align="center">
-  <img src="https://img.shields.io/badge/Flutter-v3.10.1-blue"/>
-  <img src="https://img.shields.io/badge/Rust-v1.65-orange"/>
+  <img src="https://img.shields.io/badge/Flutter-v3.13.19-blue"/>
+  <img src="https://img.shields.io/badge/Rust-v1.70-orange"/>
 </div>

 > Documentation for Contributors
@@ -13,11 +13,13 @@ This Repository contains the codebase for the frontend of the application, curre
 - Linux
 - macOS
 - Windows
-  > We later expect to extend support to Android and iOS devices using Flutter.
+  > We are actively working on support for Android & iOS!
+
+_Additionally, we are working on a Web version built with Tauri!_

 ### Am I Eligible to Contribute?

-Yes! You are eligible to contribute, check out the ways in which you can [contribute to AppFlowy](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/contributing-to-appflowy). Some of the ways in which you can contribute are:
+Yes! You are eligible to contribute, check out the ways in which you can [contribute to AppFlowy](https://docs.appflowy.io/docs/documentation/software-contributions/contributing-to-appflowy). Some of the ways in which you can contribute are:

 - Non-Coding Contributions
  - Documentation
@@ -26,27 +28,23 @@ Yes! You are eligible to contribute, check out the ways in which you can [contri
  - Improve Translations
 - Coding Contributions

-To contribute to `AppFlowy_Flutter` codebase specifically (coding contribution) we suggest you to have basic knowledge of Flutter. In case you are new to Flutter, we may suggest you to learn the basics and then try to contribute, get started with Flutter [here](https://flutter.dev/docs/get-started/codelab).
+To contribute to `AppFlowy_Flutter` codebase specifically (coding contribution) we suggest you to have basic knowledge of Flutter. In case you are new to Flutter, we suggest you learn the basics, and then contribute afterwards. To get started with Flutter read [here](https://flutter.dev/docs/get-started/codelab).

-### What OS Should I Use for Development?
+### What OS should I use for development?

-We support all OS for Development i.e Linux, macOS and Windows. However, most of us promote macOS and Linux over Windows. We have detailed [docs](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/environment-setup) on How to Setup `AppFlowy_Flutter` in your local system in each OS.
+We support all OS for Development i.e. Linux, MacOS and Windows. However, most of us promote macOS and Linux over Windows. We have detailed [docs](https://docs.appflowy.io/docs/documentation/appflowy/from-source/environment-setup) on how to setup `AppFlowy_Flutter` on your local system respectively per operating system.

 ### Getting Started ❇

-We have a detailed documentation, on how to [get started](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/contributing-to-appflowy) with the project, and make your first contribution. However, we do have some specific picks for you.
+We have detailed documentation on how to [get started](https://docs.appflowy.io/docs/documentation/software-contributions/contributing-to-appflowy) with the project, and make your first contribution. However, we do have some specific picks for you:

 - [Code Architecture](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/architecture/frontend/frontend/codemap)
- [Making Your First PR](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/submitting-code/submitting-your-first-pull-request)
- [The Style Guide](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/submitting-code/style-guides)
- [How to run/debug the application](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/launcher-and-tasks)
+- [Styleguide & Conventions](https://docs.appflowy.io/docs/documentation/software-contributions/conventions/naming-conventions)
+- [Making Your First PR](https://docs.appflowy.io/docs/documentation/software-contributions/submitting-code/submitting-your-first-pull-request)
+- [All AppFlowy Documentation](https://docs.appflowy.io/docs/documentation/appflowy) - Contribution guide, build and run, debugging, testing, localization, etc.

 ### Need Help?

- New to GitHub? Follow [these](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/submitting-code/setting-up-your-repositories) steps to get started
- Stuck Somewhere? Join the [Discord](https://discord.gg/9Q2xaN37tV) Group and we are there to help you!
-
-<!--
-## release check
-1. [entitlements](https://flutter.dev/desktop#setting-up-entitlements)
-2. [symbols stripped](https://flutter.dev/docs/development/platform-integration/c-interop) -->
+- New to GitHub? Follow [these](https://docs.appflowy.io/docs/documentation/software-contributions/submitting-code/setting-up-your-repositories) steps to get started
+- Stuck Somewhere? Join our [Discord](https://discord.gg/9Q2xaN37tV), we're there to help you!
+- Find out more about the [community initiatives](https://docs.appflowy.io/docs/appflowy/community).
@@ -30,10 +30,27 @@ linter:
  rules:
    - require_trailing_commas

+    - prefer_collection_literals
    - prefer_final_fields
    - prefer_final_in_for_each
    - prefer_final_locals

+    - sized_box_for_whitespace
+    - use_decorated_box
+
+    - unnecessary_parenthesis
+    - unnecessary_await_in_return
+    - unnecessary_raw_strings
+
+    - avoid_unnecessary_containers
+    - avoid_redundant_argument_values
+    - avoid_unused_constructor_parameters
+
+    - always_declare_return_types
+
+    - sort_constructors_first
+    - unawaited_futures
+
 # Additional information about this file can be found at
 # https://dart.dev/guides/language/analysis-options

@@ -11,3 +11,5 @@ GeneratedPluginRegistrant.java
 key.properties
 **/*.keystore
 **/*.jks
+
+.cxx
@@ -25,8 +25,14 @@ apply plugin: 'com.android.application'
 apply plugin: 'kotlin-android'
 apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"

+def keystoreProperties = new Properties()
+def keystorePropertiesFile = rootProject.file('key.properties')
+if (keystorePropertiesFile.exists()) {
+    keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
+}
+
 android {
-    compileSdkVersion 31
+    compileSdkVersion 34
    ndkVersion "24.0.8215888"

    compileOptions {
@@ -46,23 +52,41 @@ android {
    defaultConfig {
        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
        applicationId "io.appflowy.appflowy"
-        minSdkVersion 19
-        targetSdkVersion 31
+        minSdkVersion 29
+        targetSdkVersion 33
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
        multiDexEnabled true
+        externalNativeBuild {
+            cmake {
+                arguments "-DANDROID_ARM_NEON=TRUE", "-DANDROID_STL=c++_shared"
+            }
+        }
    }

+    signingConfigs {
+       release {
+           keyAlias keystoreProperties['keyAlias']
+           keyPassword keystoreProperties['keyPassword']
+           storeFile keystoreProperties['storeFile'] ? file(keystoreProperties['storeFile']) : null
+           storePassword keystoreProperties['storePassword']
+       }
+    }
    buildTypes {
        release {
-            // TODO: Add your own signing config for the release build.
-            // Signing with the debug keys for now, so `flutter run --release` works.
-            minifyEnabled true
-            shrinkResources true
-
+            // use release instead when publishing the application to google play.
+            // signingConfig signingConfigs.release
            signingConfig signingConfigs.debug
        }
    }
+
+    namespace 'io.appflowy.appflowy'
+
+    externalNativeBuild {
+        cmake {
+            path "src/main/CMakeLists.txt"
+        }
+    }
 }

 flutter {
@@ -1,5 +1,4 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="io.appflowy.appflowy">
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Flutter needs it to communicate with the running application
         to allow setting breakpoints, to provide hot reload, etc.
    -->
@@ -1,42 +1,55 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="io.appflowy.appflowy">
-   <application
-        android:label="appflowy_flutter"
-        android:icon="@mipmap/ic_launcher"
-        android:name="${applicationName}">
-        <activity
-            android:name=".MainActivity"
-            android:launchMode="singleTop"
-            android:theme="@style/LaunchTheme"
-            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
-            android:hardwareAccelerated="true"
-            android:windowSoftInputMode="adjustResize">
-            <!-- Specifies an Android theme to apply to this Activity as soon as
-                 the Android process has started. This theme is visible to the user
-                 while the Flutter UI initializes. After that, this theme continues
-                 to determine the Window background behind the Flutter UI. -->
-            <meta-data
-              android:name="io.flutter.embedding.android.NormalTheme"
-              android:resource="@style/NormalTheme"
-              />
-            <!-- Displays an Android View that continues showing the launch screen
-                 Drawable until Flutter paints its first frame, then this splash
-                 screen fades out. A splash screen is useful to avoid any visual
-                 gap between the end of Android's launch screen and the painting of
-                 Flutter's first frame. -->
-            <meta-data
-              android:name="io.flutter.embedding.android.SplashScreenDrawable"
-              android:resource="@drawable/launch_background"
-              />
-            <intent-filter>
-                <action android:name="android.intent.action.MAIN"/>
-                <category android:name="android.intent.category.LAUNCHER"/>
-            </intent-filter>
-        </activity>
-        <!-- Don't delete the meta-data below.
-             This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
-        <meta-data
-            android:name="flutterEmbedding"
-            android:value="2" />
-    </application>
-</manifest>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+  <application android:label="AppFlowy" android:icon="@mipmap/ic_launcher"
+    android:name="${applicationName}">
+    <activity android:name=".MainActivity"
+      android:exported="true"
+      android:launchMode="singleInstance"
+      android:theme="@style/LaunchTheme"
+      android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
+      android:hardwareAccelerated="true" android:windowSoftInputMode="adjustResize">
+      <!--
+			Specifies an Android theme to apply to this Activity as soon as
+			the Android process has started. This theme is visible to the user
+			while the Flutter UI initializes. After that, this theme continues
+			to determine the Window background behind the Flutter UI.
+			-->
+      <meta-data android:name="io.flutter.embedding.android.NormalTheme"
+        android:resource="@style/NormalTheme" />
+      <!--
+			Displays an Android View that continues showing the launch screen
+			Drawable until Flutter paints its first frame, then this splash
+			screen fades out. A splash screen is useful to avoid any visual
+			gap between the end of Android's launch screen and the painting of
+			Flutter's first frame.
+			-->
+      <meta-data android:name="io.flutter.embedding.android.SplashScreenDrawable"
+        android:resource="@drawable/launch_background" />
+      <intent-filter>
+        <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.
+		This is used by the Flutter tool to generate GeneratedPluginRegistrant.java
+		-->
+    <meta-data android:name="flutterEmbedding" android:value="2" />
+  </application>
+  <uses-permission android:name="android.permission.INTERNET" />
+  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+  <queries>
+    <intent>
+      <action android:name="android.support.customtabs.action.CustomTabsService" />
+    </intent>
+  </queries>
+</manifest>
@@ -0,0 +1,18 @@
+cmake_minimum_required(VERSION 3.10.0)
+
+project(AppFlowy)
+
+message(CONFIGURE_LOG "NDK PATH: ${ANDROID_NDK}")
+message(CONFIGURE_LOG "Copying libc++_shared.so")
+
+# arm64-v8a
+file(COPY
+    ${ANDROID_NDK}/sources/cxx-stl/llvm-libc++/libs/arm64-v8a/libc++_shared.so
+    DESTINATION ${CMAKE_CURRENT_SOURCE_DIR}/jniLibs/arm64-v8a
+)
+
+# x86_64
+file(COPY
+    ${ANDROID_NDK}/sources/cxx-stl/llvm-libc++/libs/x86_64/libc++_shared.so
+    DESTINATION ${CMAKE_CURRENT_SOURCE_DIR}/jniLibs/x86_64
+)
@@ -0,0 +1,18 @@
+#include <stdarg.h>
+#include <stdbool.h>
+#include <stdint.h>
+#include <stdlib.h>
+
+int64_t init_sdk(char *data);
+
+void async_event(int64_t port, const uint8_t *input, uintptr_t len);
+
+const uint8_t *sync_event(const uint8_t *input, uintptr_t len);
+
+int32_t set_stream_port(int64_t port);
+
+void link_me_please(void);
+
+void backend_log(int64_t level, const char *data);
+
+void set_env(const char *data);
@@ -1,5 +1,4 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    package="io.appflowy.appflowy">
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Flutter needs it to communicate with the running application
         to allow setting breakpoints, to provide hot reload, etc.
    -->
@@ -1,12 +1,12 @@
 buildscript {
-    ext.kotlin_version = '1.6.10'
+    ext.kotlin_version = '1.8.0'
    repositories {
        google()
        mavenCentral()
    }

    dependencies {
-        classpath 'com.android.tools.build:gradle:4.1.0'
+        classpath 'com.android.tools.build:gradle:7.4.2'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
 }
@@ -24,6 +24,6 @@ subprojects {
    project.evaluationDependsOn(':app')
 }

-task clean(type: Delete) {
+tasks.register("clean", Delete) {
    delete rootProject.buildDir
 }
@@ -2,3 +2,4 @@ org.gradle.jvmargs=-Xmx1536M
 android.useAndroidX=true
 android.enableJetifier=true
 org.gradle.caching=true
+android.suppressUnsupportedCompileSdk=33
@@ -1,5 +1,7 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-bin.zip
+networkTimeout=10000
+validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
@@ -73,9 +73,9 @@
          "attributes": { "subtype": "checkbox", "checkbox": true },
          "delta": [
            { "insert": "Click " },
-            { "insert": "+ New Page ", "attributes": { "code": true } },
+            { "insert": "+ New Page", "attributes": { "code": true } },
            {
-              "insert": "button at the bottom of your sidebar to add a new page."
+              "insert": " button at the bottom of your sidebar to add a new page."
            }
          ]
        },
@@ -0,0 +1 @@
+use_precompiled_binaries: true
@@ -1,21 +1 @@
-# Initial Setup
-# 1. Copy the dev.env file to .env:
-# cp dev.env .env 
-# 2. Alternatively, you can generate the .env file using the "Generate Env File" task in VSCode.
-
-# Configuring Cloud Type
-# This configuration file is used to specify the cloud type and the necessary configurations for each cloud type. The available options are:
-# Supabase: Set CLOUD_TYPE to 1
-# AppFlowy Cloud: Set CLOUD_TYPE to 2
-
-CLOUD_TYPE=1
-
-# Supabase Configuration
-# If you're using Supabase (CLOUD_TYPE=1), you need to provide the following configurations:
-SUPABASE_URL=replace-with-your-supabase-url
-SUPABASE_ANON_KEY=replace-with-your-supabase-key
-
-# AppFlowy Cloud Configuration
-# If you're using AppFlowy Cloud (CLOUD_TYPE=2), you need to provide the following configurations:
-APPFLOWY_CLOUD_BASE_URL=replace-with-your-appflowy-cloud-url
-APPFLOWY_CLOUD_BASE_WS_URL=replace-with-your-appflowy-cloud-ws-url
+APPFLOWY_CLOUD_URL=
@@ -0,0 +1 @@
+extensions:
@@ -4,6 +4,7 @@ import 'package:appflowy/workspace/presentation/settings/widgets/settings_appear
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';
+
 import 'util/util.dart';

 void main() {
@@ -15,7 +16,7 @@ void main() {
      await tester.initializeAppFlowy();

      await tester.tapGoButton();
-      tester.expectToSeeHomePage();
+      await tester.expectToSeeHomePageWithGetStartedPage();
      await tester.openSettings();

      await tester.openSettingsPage(SettingsPage.appearance);
@@ -47,7 +48,7 @@ void main() {
      await tester.initializeAppFlowy();

      await tester.tapGoButton();
-      tester.expectToSeeHomePage();
+      await tester.expectToSeeHomePageWithGetStartedPage();
      await tester.openSettings();

      await tester.openSettingsPage(SettingsPage.appearance);
@@ -1,85 +0,0 @@
-import 'package:appflowy/generated/locale_keys.g.dart';
-import 'package:appflowy/workspace/application/settings/prelude.dart';
-import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
-import 'package:easy_localization/easy_localization.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-import '../util/util.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('auth', () {
-    testWidgets('sign in with supabase', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoogleLoginInButton();
-      tester.expectToSeeHomePage();
-    });
-
-    testWidgets('sign out with supabase', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoogleLoginInButton();
-
-      // Open the setting page and sign out
-      await tester.openSettings();
-      await tester.openSettingsPage(SettingsPage.user);
-      await tester.tapButton(find.byType(SettingLogoutButton));
-
-      tester.expectToSeeText(LocaleKeys.button_OK.tr());
-      await tester.tapButtonWithName(LocaleKeys.button_OK.tr());
-
-      // Go to the sign in page again
-      await tester.pumpAndSettle(const Duration(seconds: 1));
-      tester.expectToSeeGoogleLoginButton();
-    });
-
-    testWidgets('sign in as annoymous', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapSignInAsGuest();
-
-      // should not see the sync setting page when sign in as annoymous
-      await tester.openSettings();
-      await tester.expectNoSettingsPage(SettingsPage.syncSetting);
-    });
-
-    testWidgets('enable encryption', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoogleLoginInButton();
-
-      // Open the setting page and sign out
-      await tester.openSettings();
-      await tester.openSettingsPage(SettingsPage.syncSetting);
-
-      // the switch should be off by default
-      tester.assertEnableEncryptSwitchValue(false);
-      await tester.toggleEnableEncrypt();
-
-      // the switch should be on after toggling
-      tester.assertEnableEncryptSwitchValue(true);
-
-      // the switch can not be toggled back to off
-      await tester.toggleEnableEncrypt();
-      tester.assertEnableEncryptSwitchValue(true);
-    });
-
-    testWidgets('enable sync', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoogleLoginInButton();
-
-      // Open the setting page and sign out
-      await tester.openSettings();
-      await tester.openSettingsPage(SettingsPage.syncSetting);
-
-      // the switch should be on by default
-      tester.assertEnableSyncSwitchValue(true);
-      await tester.toggleEnableSync();
-
-      // the switch should be off
-      tester.assertEnableSyncSwitchValue(false);
-
-      // the switch should be on after toggling
-      await tester.toggleEnableSync();
-      tester.assertEnableSyncSwitchValue(true);
-    });
-  });
-}
@@ -0,0 +1,103 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/plugins/database/board/presentation/widgets/board_column_header.dart';
+import 'package:appflowy/plugins/database/widgets/card/container/card_container.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:appflowy_board/appflowy_board.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/util.dart';
+
+const defaultFirstCardName = 'Card 1';
+const defaultLastCardName = 'Card 3';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('board add row test:', () {
+    testWidgets('from header', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+      final findFirstCard = find.descendant(
+        of: find.byType(AppFlowyGroupCard),
+        matching: find.byType(Text),
+      );
+
+      Text firstCardText = tester.firstWidget(findFirstCard);
+      expect(firstCardText.data, defaultFirstCardName);
+
+      await tester.tap(
+        find
+            .descendant(
+              of: find.byType(BoardColumnHeader),
+              matching: find.byWidgetPredicate(
+                (widget) => widget is FlowySvg && widget.svg == FlowySvgs.add_s,
+              ),
+            )
+            .at(1),
+      );
+      await tester.pumpAndSettle();
+
+      const newCardName = 'Card 4';
+      await tester.enterText(
+        find.descendant(
+          of: find.byType(RowCardContainer),
+          matching: find.byType(TextField),
+        ),
+        newCardName,
+      );
+      await tester.pumpAndSettle(const Duration(milliseconds: 500));
+
+      await tester.tap(find.byType(AppFlowyBoard));
+      await tester.pumpAndSettle();
+
+      firstCardText = tester.firstWidget(findFirstCard);
+      expect(firstCardText.data, newCardName);
+    });
+
+    testWidgets('from footer', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+      final findLastCard = find.descendant(
+        of: find.byType(AppFlowyGroupCard),
+        matching: find.byType(Text),
+      );
+
+      Text? lastCardText = tester.widgetList(findLastCard).last as Text;
+      expect(lastCardText.data, defaultLastCardName);
+
+      await tester.tap(
+        find
+            .descendant(
+              of: find.byType(AppFlowyGroupFooter),
+              matching: find.byType(FlowySvg),
+            )
+            .at(1),
+      );
+      await tester.pumpAndSettle();
+
+      const newCardName = 'Card 4';
+      await tester.enterText(
+        find.descendant(
+          of: find.byType(RowCardContainer),
+          matching: find.byType(TextField),
+        ),
+        newCardName,
+      );
+      await tester.pumpAndSettle(const Duration(milliseconds: 500));
+
+      await tester.tap(find.byType(AppFlowyBoard));
+      await tester.pumpAndSettle();
+
+      lastCardText = tester.widgetList(findLastCard).last as Text;
+      expect(lastCardText.data, newCardName);
+    });
+  });
+}
@@ -0,0 +1,50 @@
+import 'package:appflowy/plugins/database/widgets/cell_editor/extension.dart';
+import 'package:appflowy/plugins/database/widgets/row/row_property.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import 'package:appflowy_board/appflowy_board.dart';
+
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('board group test', () {
+    testWidgets('move row to another group', (tester) async {
+      const card1Name = 'Card 1';
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+      final card1 = find.ancestor(
+        of: find.text(card1Name),
+        matching: find.byType(AppFlowyGroupCard),
+      );
+      final doingGroup = find.text('Doing');
+      final doingGroupCenter = tester.getCenter(doingGroup);
+      final card1Center = tester.getCenter(card1);
+
+      await tester.timedDrag(
+        card1,
+        doingGroupCenter.translate(-card1Center.dx, -card1Center.dy),
+        const Duration(seconds: 1),
+      );
+      await tester.pumpAndSettle();
+      await tester.tap(card1);
+      await tester.pumpAndSettle();
+
+      final card1StatusFinder = find.descendant(
+        of: find.byType(RowPropertyList),
+        matching: find.descendant(
+          of: find.byType(SelectOptionTag),
+          matching: find.byType(Text),
+        ),
+      );
+      expect(card1StatusFinder, findsNWidgets(1));
+      final card1StatusText = tester.widget<Text>(card1StatusFinder).data;
+      expect(card1StatusText, 'Doing');
+    });
+  });
+}
@@ -0,0 +1,141 @@
+import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/plugins/database/board/presentation/widgets/board_column_header.dart';
+import 'package:appflowy/plugins/database/board/presentation/widgets/board_hidden_groups.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('board group options:', () {
+    testWidgets('expand/collapse hidden groups', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+      final collapseFinder = find.byFlowySvg(FlowySvgs.pull_left_outlined_s);
+      final expandFinder = find.byFlowySvg(FlowySvgs.hamburger_s_s);
+
+      // Is expanded by default
+      expect(collapseFinder, findsOneWidget);
+      expect(expandFinder, findsNothing);
+
+      // Collapse hidden groups
+      await tester.tap(collapseFinder);
+      await tester.pumpAndSettle();
+
+      // Is collapsed
+      expect(collapseFinder, findsNothing);
+      expect(expandFinder, findsOneWidget);
+
+      // Expand hidden groups
+      await tester.tap(expandFinder);
+      await tester.pumpAndSettle();
+
+      // Is expanded
+      expect(collapseFinder, findsOneWidget);
+      expect(expandFinder, findsNothing);
+    });
+
+    testWidgets('hide first group, and show it again', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+      // Tap the options of the first group
+      final optionsFinder = find
+          .descendant(
+            of: find.byType(BoardColumnHeader),
+            matching: find.byFlowySvg(FlowySvgs.details_horizontal_s),
+          )
+          .first;
+
+      await tester.tap(optionsFinder);
+      await tester.pumpAndSettle();
+
+      // Tap the hide option
+      await tester.tap(find.byFlowySvg(FlowySvgs.hide_s));
+      await tester.pumpAndSettle();
+
+      int shownGroups =
+          tester.widgetList(find.byType(BoardColumnHeader)).length;
+
+      // We still show Doing, Done, No Status
+      expect(shownGroups, 3);
+
+      final hiddenCardFinder = find.byType(HiddenGroupCard);
+      await tester.hoverOnWidget(hiddenCardFinder);
+      await tester.tap(find.byFlowySvg(FlowySvgs.show_m));
+      await tester.pumpAndSettle();
+
+      shownGroups = tester.widgetList(find.byType(BoardColumnHeader)).length;
+      expect(shownGroups, 4);
+    });
+  });
+
+  testWidgets('delete a group', (tester) async {
+    await tester.initializeAppFlowy();
+    await tester.tapGoButton();
+    await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+    expect(tester.widgetList(find.byType(BoardColumnHeader)).length, 4);
+
+    // tap group option button for the first group. Delete shouldn't show up
+    await tester.tapButton(
+      find
+          .descendant(
+            of: find.byType(BoardColumnHeader),
+            matching: find.byFlowySvg(FlowySvgs.details_horizontal_s),
+          )
+          .first,
+    );
+    expect(find.byFlowySvg(FlowySvgs.delete_s), findsNothing);
+
+    // dismiss the popup
+    await tester.sendKeyEvent(LogicalKeyboardKey.escape);
+    await tester.pumpAndSettle();
+
+    // tap group option button for the first group. Delete should show up
+    await tester.tapButton(
+      find
+          .descendant(
+            of: find.byType(BoardColumnHeader),
+            matching: find.byFlowySvg(FlowySvgs.details_horizontal_s),
+          )
+          .at(1),
+    );
+    expect(find.byFlowySvg(FlowySvgs.delete_s), findsOneWidget);
+
+    // Tap the delete button and confirm
+    await tester.tapButton(find.byFlowySvg(FlowySvgs.delete_s));
+    await tester.tapDialogOkButton();
+
+    // Expect number of groups to decrease by one
+    expect(tester.widgetList(find.byType(BoardColumnHeader)).length, 3);
+  });
+}
+
+extension FlowySvgFinder on CommonFinders {
+  Finder byFlowySvg(FlowySvgData svg) => _FlowySvgFinder(svg);
+}
+
+class _FlowySvgFinder extends MatchFinder {
+  _FlowySvgFinder(this.svg);
+
+  final FlowySvgData svg;
+
+  @override
+  String get description => 'flowy_svg "$svg"';
+
+  @override
+  bool matches(Element candidate) {
+    final Widget widget = candidate.widget;
+    return widget is FlowySvg && widget.svg == svg;
+  }
+}
@@ -1,11 +1,14 @@
 import 'package:appflowy/generated/locale_keys.g.dart';
-import 'package:appflowy/plugins/database_view/widgets/card/card.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:appflowy/plugins/database/widgets/card/card.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:appflowy_board/appflowy_board.dart';
 import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

 import '../util/util.dart';
+import '../util/database_test_op.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -15,36 +18,87 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Board);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
      const name = 'Card 1';
-      final card1 = find.findTextInFlowyText(name);
+      final card1 = find.text(name);
      await tester.hoverOnWidget(
        card1,
        onHover: () async {
-          final moreOption = find.byType(CardMoreOption);
+          final moreOption = find.byType(MoreCardOptionsAccessory);
          await tester.tapButton(moreOption);
        },
      );
      await tester.tapButtonWithName(LocaleKeys.button_delete.tr());
-      expect(find.findTextInFlowyText(name), findsNothing);
+      expect(find.text(name), findsNothing);
    });

    testWidgets('duplicate item in ToDo card', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Board);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
      const name = 'Card 1';
-      final card1 = find.findTextInFlowyText(name);
+      final card1 = find.text(name);
      await tester.hoverOnWidget(
        card1,
        onHover: () async {
-          final moreOption = find.byType(CardMoreOption);
+          final moreOption = find.byType(MoreCardOptionsAccessory);
          await tester.tapButton(moreOption);
        },
      );
      await tester.tapButtonWithName(LocaleKeys.button_duplicate.tr());
      expect(find.textContaining(name, findRichText: true), findsNWidgets(2));
    });
+
+    testWidgets('add new group', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Board);
+
+      // assert number of groups
+      tester.assertNumberOfGroups(4);
+
+      // scroll the board horizontally to ensure add new group button appears
+      await tester.scrollBoardToEnd();
+
+      // assert and click on add new group button
+      tester.assertNewGroupTextField(false);
+      await tester.tapNewGroupButton();
+      tester.assertNewGroupTextField(true);
+
+      // enter new group name and submit
+      await tester.enterNewGroupName('needs design', submit: true);
+
+      // assert number of groups has increased
+      tester.assertNumberOfGroups(5);
+
+      // assert text field has disappeared
+      await tester.scrollBoardToEnd();
+      tester.assertNewGroupTextField(false);
+
+      // click on add new group button
+      await tester.tapNewGroupButton();
+      tester.assertNewGroupTextField(true);
+
+      // type some things
+      await tester.enterNewGroupName('needs planning', submit: false);
+
+      // click on clear button and assert empty contents
+      await tester.clearNewGroupTextField();
+
+      // press escape to cancel
+      await tester.sendKeyEvent(LogicalKeyboardKey.escape);
+      await tester.pumpAndSettle();
+      tester.assertNewGroupTextField(false);
+
+      // click on add new group button
+      await tester.tapNewGroupButton();
+      tester.assertNewGroupTextField(true);
+
+      // press elsewhere to cancel
+      await tester.tap(find.byType(AppFlowyBoard));
+      await tester.pumpAndSettle();
+      tester.assertNewGroupTextField(false);
+    });
  });
 }
@@ -1,10 +1,14 @@
 import 'package:integration_test/integration_test.dart';

 import 'board_row_test.dart' as board_row_test;
+import 'board_add_row_test.dart' as board_add_row_test;
+import 'board_group_test.dart' as board_group_test;

 void startTesting() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  // Board integration tests
  board_row_test.main();
+  board_add_row_test.main();
+  board_group_test.main();
 }
@@ -32,8 +32,8 @@ void main() {
  const service = TestWorkspaceService(TestWorkspace.board);

  group('board', () {
-    setUpAll(() async => await service.setUpAll());
-    setUp(() async => await service.setUp());
+    setUpAll(() async => service.setUpAll());
+    setUp(() async => service.setUp());

    testWidgets('open the board with data structure in v0.2.0', (tester) async {
      await tester.initializeAppFlowy();
@@ -0,0 +1,69 @@
+// ignore_for_file: unused_import
+
+import 'dart:io';
+
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/auth/af_cloud_mock_auth_service.dart';
+import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/application/settings/prelude.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/setting_appflowy_cloud.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra/uuid.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:path/path.dart' as p;
+import 'package:integration_test/integration_test.dart';
+import '../util/dir.dart';
+import '../util/mock/mock_file_picker.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('appflowy cloud', () {
+    testWidgets('anon user and then sign in', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+
+      tester.expectToSeeText(LocaleKeys.signIn_loginStartWithAnonymous.tr());
+      await tester.tapGoButton();
+      await tester.expectToSeeHomePageWithGetStartedPage();
+
+      // reanme the name of the anon user
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      final userNameFinder = find.descendant(
+        of: find.byType(SettingsUserView),
+        matching: find.byType(UserNameInput),
+      );
+      await tester.enterText(userNameFinder, 'local_user');
+      await tester.openSettingsPage(SettingsPage.user);
+      await tester.pumpAndSettle();
+
+      // sign up with Google
+      await tester.tapGoogleLoginInButton();
+
+      // sign out
+      await tester.expectToSeeHomePage();
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      await tester.logout();
+      await tester.pumpAndSettle();
+
+      // tap the continue as anonymous button
+      await tester
+          .tapButton(find.text(LocaleKeys.signIn_loginStartWithAnonymous.tr()));
+      await tester.expectToSeeHomePage();
+
+      // New anon user name
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      final userNameInput = tester.widget(userNameFinder) as UserNameInput;
+      expect(userNameInput.name, 'Me');
+    });
+  });
+}
@@ -0,0 +1,84 @@
+// ignore_for_file: unused_import
+
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/auth/af_cloud_mock_auth_service.dart';
+import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/application/settings/prelude.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/setting_appflowy_cloud.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra/uuid.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:path/path.dart' as p;
+import 'package:integration_test/integration_test.dart';
+import '../util/mock/mock_file_picker.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('appflowy cloud auth', () {
+    testWidgets('sign in', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+      await tester.tapGoogleLoginInButton();
+      await tester.expectToSeeHomePageWithGetStartedPage();
+    });
+
+    testWidgets('sign out', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+      await tester.tapGoogleLoginInButton();
+
+      // Open the setting page and sign out
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      await tester.tapButton(find.byType(SettingLogoutButton));
+
+      tester.expectToSeeText(LocaleKeys.button_ok.tr());
+      await tester.tapButtonWithName(LocaleKeys.button_ok.tr());
+
+      // Go to the sign in page again
+      await tester.pumpAndSettle(const Duration(seconds: 1));
+      tester.expectToSeeGoogleLoginButton();
+    });
+
+    testWidgets('sign in as annoymous', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+      await tester.tapSignInAsGuest();
+
+      // should not see the sync setting page when sign in as annoymous
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      tester.expectToSeeGoogleLoginButton();
+    });
+
+    testWidgets('enable sync', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+
+      await tester.tapGoogleLoginInButton();
+      // Open the setting page and sign out
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.cloud);
+
+      // the switch should be on by default
+      tester.assertAppFlowyCloudEnableSyncSwitchValue(true);
+      await tester.toggleEnableSync(AppFlowyCloudEnableSync);
+
+      // the switch should be off
+      tester.assertAppFlowyCloudEnableSyncSwitchValue(false);
+
+      // the switch should be on after toggling
+      await tester.toggleEnableSync(AppFlowyCloudEnableSync);
+      tester.assertAppFlowyCloudEnableSyncSwitchValue(true);
+    });
+  });
+}
@@ -0,0 +1,17 @@
+import 'empty_test.dart' as preset_af_cloud_env_test;
+import 'appflowy_cloud_auth_test.dart' as appflowy_cloud_auth_test;
+// import 'document_sync_test.dart' as document_sync_test;
+import 'user_setting_sync_test.dart' as user_sync_test;
+import 'anon_user_continue_test.dart' as anon_user_continue_test;
+
+Future<void> main() async {
+  preset_af_cloud_env_test.main();
+
+  appflowy_cloud_auth_test.main();
+
+  // document_sync_test.main();
+
+  user_sync_test.main();
+
+  anon_user_continue_test.main();
+}
@@ -0,0 +1,70 @@
+// ignore_for_file: unused_import
+
+import 'dart:io';
+
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/auth/af_cloud_mock_auth_service.dart';
+import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/application/settings/prelude.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/setting_appflowy_cloud.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra/uuid.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:path/path.dart' as p;
+import 'package:integration_test/integration_test.dart';
+import '../util/dir.dart';
+import '../util/mock/mock_file_picker.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+  final email = '${uuid()}@appflowy.io';
+  const inputContent = 'Hello world, this is a test document';
+
+// The test will create a new document called Sample, and sync it to the server.
+// Then the test will logout the user, and login with the same user. The data will
+// be synced from the server.
+  group('appflowy cloud document', () {
+    testWidgets('sync local docuemnt to server', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+        email: email,
+      );
+      await tester.tapGoogleLoginInButton();
+      await tester.expectToSeeHomePageWithGetStartedPage();
+
+      // create a new document called Sample
+      await tester.createNewPage();
+
+      // focus on the editor
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.ime.insertText(inputContent);
+      expect(find.text(inputContent, findRichText: true), findsOneWidget);
+
+      // TODO(nathan): remove the await
+      // 6 seconds for data sync
+      await tester.waitForSeconds(6);
+
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      await tester.logout();
+    });
+
+    testWidgets('sync doc from server', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+        email: email,
+      );
+      await tester.tapGoogleLoginInButton();
+      await tester.expectToSeeHomePage();
+
+      // the latest document will be opened, so the content must be the inputContent
+      await tester.pumpAndSettle();
+      expect(find.text(inputContent, findRichText: true), findsOneWidget);
+    });
+  });
+}
@@ -0,0 +1,18 @@
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/util.dart';
+
+// This test is meaningless, just for preventing the CI from failing.
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('Empty', () {
+    testWidgets('set appflowy cloud', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      );
+    });
+  });
+}
@@ -0,0 +1,88 @@
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/workspace/application/settings/prelude.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/setting_supabase_cloud.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('supabase auth', () {
+    testWidgets('sign in with supabase', (tester) async {
+      await tester.initializeAppFlowy(cloudType: AuthenticatorType.supabase);
+      await tester.tapGoogleLoginInButton();
+      await tester.expectToSeeHomePageWithGetStartedPage();
+    });
+
+    testWidgets('sign out with supabase', (tester) async {
+      await tester.initializeAppFlowy(cloudType: AuthenticatorType.supabase);
+      await tester.tapGoogleLoginInButton();
+
+      // Open the setting page and sign out
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      await tester.tapButton(find.byType(SettingLogoutButton));
+
+      tester.expectToSeeText(LocaleKeys.button_ok.tr());
+      await tester.tapButtonWithName(LocaleKeys.button_ok.tr());
+
+      // Go to the sign in page again
+      await tester.pumpAndSettle(const Duration(seconds: 1));
+      tester.expectToSeeGoogleLoginButton();
+    });
+
+    testWidgets('sign in as annoymous', (tester) async {
+      await tester.initializeAppFlowy(cloudType: AuthenticatorType.supabase);
+      await tester.tapSignInAsGuest();
+
+      // should not see the sync setting page when sign in as annoymous
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      tester.expectToSeeGoogleLoginButton();
+    });
+
+    // testWidgets('enable encryption', (tester) async {
+    //   await tester.initializeAppFlowy(cloudType: CloudType.supabase);
+    //   await tester.tapGoogleLoginInButton();
+
+    //   // Open the setting page and sign out
+    //   await tester.openSettings();
+    //   await tester.openSettingsPage(SettingsPage.cloud);
+
+    //   // the switch should be off by default
+    //   tester.assertEnableEncryptSwitchValue(false);
+    //   await tester.toggleEnableEncrypt();
+
+    //   // the switch should be on after toggling
+    //   tester.assertEnableEncryptSwitchValue(true);
+
+    //   // the switch can not be toggled back to off
+    //   await tester.toggleEnableEncrypt();
+    //   tester.assertEnableEncryptSwitchValue(true);
+    // });
+
+    testWidgets('enable sync', (tester) async {
+      await tester.initializeAppFlowy(cloudType: AuthenticatorType.supabase);
+      await tester.tapGoogleLoginInButton();
+
+      // Open the setting page and sign out
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.cloud);
+
+      // the switch should be on by default
+      tester.assertSupabaseEnableSyncSwitchValue(true);
+      await tester.toggleEnableSync(SupabaseEnableSync);
+
+      // the switch should be off
+      tester.assertSupabaseEnableSyncSwitchValue(false);
+
+      // the switch should be on after toggling
+      await tester.toggleEnableSync(SupabaseEnableSync);
+      tester.assertSupabaseEnableSyncSwitchValue(true);
+    });
+  });
+}
@@ -0,0 +1,100 @@
+// ignore_for_file: unused_import
+
+import 'dart:io';
+
+import 'package:appflowy/env/cloud_env.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy/user/application/auth/af_cloud_mock_auth_service.dart';
+import 'package:appflowy/user/application/auth/auth_service.dart';
+import 'package:appflowy/workspace/application/settings/prelude.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/setting_appflowy_cloud.dart';
+import 'package:appflowy/workspace/presentation/settings/widgets/settings_user_view.dart';
+import 'package:appflowy/workspace/presentation/widgets/user_avatar.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra/uuid.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:path/path.dart' as p;
+import 'package:integration_test/integration_test.dart';
+import '../util/database_test_op.dart';
+import '../util/dir.dart';
+import '../util/emoji.dart';
+import '../util/mock/mock_file_picker.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+  final email = '${uuid()}@appflowy.io';
+  const name = 'nathan';
+
+  group('appflowy cloud setting', () {
+    testWidgets('sync user name and icon to server', (tester) async {
+      await tester.initializeAppFlowy(
+        cloudType: AuthenticatorType.appflowyCloudSelfHost,
+        email: email,
+      );
+      await tester.tapGoogleLoginInButton();
+      await tester.expectToSeeHomePageWithGetStartedPage();
+
+      await tester.openSettings();
+      await tester.openSettingsPage(SettingsPage.user);
+      final userAvatarFinder = find.descendant(
+        of: find.byType(SettingsUserView),
+        matching: find.byType(UserAvatar),
+      );
+
+      // Open icon picker dialog and select emoji
+      await tester.tap(userAvatarFinder);
+      await tester.pumpAndSettle();
+      await tester.tapEmoji('😁');
+      await tester.pumpAndSettle();
+      final UserAvatar userAvatar =
+          tester.widget(userAvatarFinder) as UserAvatar;
+      expect(userAvatar.iconUrl, '😁');
+
+      // enter user name
+      final userNameFinder = find.descendant(
+        of: find.byType(SettingsUserView),
+        matching: find.byType(UserNameInput),
+      );
+      await tester.enterText(userNameFinder, name);
+      await tester.pumpAndSettle();
+      await tester.tapEscButton();
+
+      // wait 2 seconds for the sync to finish
+      await tester.pumpAndSettle(const Duration(seconds: 2));
+    });
+  });
+
+  testWidgets('get user icon and name from server', (tester) async {
+    await tester.initializeAppFlowy(
+      cloudType: AuthenticatorType.appflowyCloudSelfHost,
+      email: email,
+    );
+    await tester.tapGoogleLoginInButton();
+    await tester.expectToSeeHomePageWithGetStartedPage();
+    await tester.pumpAndSettle();
+
+    await tester.openSettings();
+    await tester.openSettingsPage(SettingsPage.user);
+
+    // verify icon
+    final userAvatarFinder = find.descendant(
+      of: find.byType(SettingsUserView),
+      matching: find.byType(UserAvatar),
+    );
+    final UserAvatar userAvatar = tester.widget(userAvatarFinder) as UserAvatar;
+    expect(userAvatar.iconUrl, '😁');
+
+    // verify name
+    final userNameFinder = find.descendant(
+      of: find.byType(SettingsUserView),
+      matching: find.byType(UserNameInput),
+    );
+    final UserNameInput userNameInput =
+        tester.widget(userNameFinder) as UserNameInput;
+    expect(userNameInput.name, name);
+  });
+}
@@ -1,10 +1,10 @@
 import 'package:appflowy_backend/protobuf/flowy-database2/setting_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pbenum.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
-import 'util/util.dart';
+import '../util/database_test_op.dart';
+import '../util/util.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -14,7 +14,9 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Calendar);
+      await tester.createNewPageWithNameUnderParent(
+        layout: ViewLayoutPB.Calendar,
+      );

      // open setting
      await tester.tapDatabaseSettingButton();
@@ -36,7 +38,7 @@ void main() {

      // Create calendar view
      const name = 'calendar';
-      await tester.createNewPageWithName(
+      await tester.createNewPageWithNameUnderParent(
        name: name,
        layout: ViewLayoutPB.Calendar,
      );
@@ -68,16 +70,18 @@ void main() {
      await tester.tapGoButton();

      // Create the calendar view
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Calendar);
+      await tester.createNewPageWithNameUnderParent(
+        layout: ViewLayoutPB.Calendar,
+      );

      // Scroll until today's date cell is visible
      await tester.scrollToToday();

      // Hover over today's calendar cell
-      await tester.hoverOnTodayCalendarCell();
-
-      // Tap on create new event button
-      await tester.tapAddCalendarEventButton();
+      await tester.hoverOnTodayCalendarCell(
+        // Tap on create new event button
+        onHover: () async => tester.tapAddCalendarEventButton(),
+      );

      // Make sure that the event editor popup is shown
      tester.assertEventEditorOpen();
@@ -90,15 +94,9 @@ void main() {
      // Double click on today's calendar cell to create a new event
      await tester.doubleClickCalendarCell(DateTime.now());

-      // Make sure that the event editor popup is shown
-      tester.assertEventEditorOpen();
-
      // Make sure that the event is inserted in the cell
      tester.assertNumberOfEventsInCalendar(2);

-      // Dismiss the event editor popup
-      await tester.dismissEventEditor();
-
      // Click on the event
      await tester.openCalendarEvent(index: 0);
      tester.assertEventEditorOpen();
@@ -112,7 +110,7 @@ void main() {
      tester.assertNumberOfEventsOnSpecificDay(2, DateTime.now());

      // Click on the event
-      await tester.openCalendarEvent(index: 1);
+      await tester.openCalendarEvent(index: 0);
      tester.assertEventEditorOpen();

      // Click on the open icon
@@ -137,7 +135,7 @@ void main() {
      tester.assertNumberOfEventsOnSpecificDay(2, DateTime.now());

      // Delete event from row detail page
-      await tester.openCalendarEvent(index: 1);
+      await tester.openCalendarEvent(index: 0);
      await tester.openEventToRowDetailPage();
      tester.assertRowDetailPageOpened();

@@ -154,16 +152,18 @@ void main() {
      await tester.tapGoButton();

      // Create the calendar view
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Calendar);
+      await tester.createNewPageWithNameUnderParent(
+        layout: ViewLayoutPB.Calendar,
+      );

      // Create a new event on the first of this month
      final today = DateTime.now();
-      final firstOfThisMonth = DateTime(today.year, today.month, 1);
+      final firstOfThisMonth = DateTime(today.year, today.month);
      await tester.doubleClickCalendarCell(firstOfThisMonth);
      await tester.dismissEventEditor();

      // Drag and drop the event onto the next week, same day
-      await tester.dragDropRescheduleCalendarEvent(firstOfThisMonth);
+      await tester.dragDropRescheduleCalendarEvent();

      // Make sure that the event has been rescheduled to the new date
      final sameDayNextWeek = firstOfThisMonth.add(const Duration(days: 7));
@@ -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();

@@ -0,0 +1,547 @@
+import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/protobuf.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import 'package:intl/intl.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('edit grid cell:', () {
+    testWidgets('text', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        input: 'hello world',
+      );
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        content: 'hello world',
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    // Make sure the text cells are filled with the right content when there are
+    // multiple text cell
+    testWidgets('multiple text cells', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+      await tester.createNewPageWithNameUnderParent(
+        name: 'my grid',
+        layout: ViewLayoutPB.Grid,
+      );
+      await tester.createField(FieldType.RichText, 'description');
+
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        input: 'hello',
+      );
+
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        input: 'world',
+        cellIndex: 1,
+      );
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        content: 'hello',
+      );
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.RichText,
+        content: 'world',
+        cellIndex: 1,
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('number', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.Number;
+
+      // Create a number field
+      await tester.createField(fieldType, fieldType.name);
+
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: fieldType,
+        input: '-1',
+      );
+      // edit the next cell to force the previous cell at row 0 to lose focus
+      await tester.editCell(
+        rowIndex: 1,
+        fieldType: fieldType,
+        input: '0.2',
+      );
+      // -1 -> -1
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: fieldType,
+        content: '-1',
+      );
+
+      // edit the next cell to force the previous cell at row 1 to lose focus
+      await tester.editCell(
+        rowIndex: 2,
+        fieldType: fieldType,
+        input: '.1',
+      );
+      // 0.2 -> 0.2
+      tester.assertCellContent(
+        rowIndex: 1,
+        fieldType: fieldType,
+        content: '0.2',
+      );
+
+      // edit the next cell to force the previous cell at row 2 to lose focus
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: fieldType,
+        input: '',
+      );
+      // .1 -> 0.1
+      tester.assertCellContent(
+        rowIndex: 2,
+        fieldType: fieldType,
+        content: '0.1',
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('checkbox', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      await tester.assertCheckboxCell(rowIndex: 0, isSelected: false);
+      await tester.tapCheckboxCellInGrid(rowIndex: 0);
+      await tester.assertCheckboxCell(rowIndex: 0, isSelected: true);
+
+      await tester.tapCheckboxCellInGrid(rowIndex: 1);
+      await tester.tapCheckboxCellInGrid(rowIndex: 2);
+      await tester.assertCheckboxCell(rowIndex: 1, isSelected: true);
+      await tester.assertCheckboxCell(rowIndex: 2, isSelected: true);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('created time', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.CreatedTime;
+      // Create a create time field
+      // The create time field is not editable
+      await tester.createField(fieldType, fieldType.name);
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+
+      await tester.findDateEditor(findsNothing);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('last modified time', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.LastEditedTime;
+      // Create a last time field
+      // The last time field is not editable
+      await tester.createField(fieldType, fieldType.name);
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+
+      await tester.findDateEditor(findsNothing);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('date time', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.DateTime;
+      await tester.createField(fieldType, fieldType.name);
+
+      // Tap the cell to invoke the field editor
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Toggle include time
+      await tester.toggleIncludeTime();
+
+      // Dismiss the cell editor
+      await tester.dismissCellEditor();
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Turn off include time
+      await tester.toggleIncludeTime();
+
+      // Select a date
+      final today = DateTime.now();
+      await tester.selectDay(content: today.day);
+
+      await tester.dismissCellEditor();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('MMM dd, y').format(today),
+      );
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+
+      // Toggle include time
+      final now = DateTime.now();
+      await tester.toggleIncludeTime();
+
+      await tester.dismissCellEditor();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('MMM dd, y HH:mm').format(now),
+      );
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Change date format
+      await tester.tapChangeDateTimeFormatButton();
+      await tester.changeDateFormat();
+
+      await tester.dismissCellEditor();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('dd/MM/y HH:mm').format(now),
+      );
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Change time format
+      await tester.tapChangeDateTimeFormatButton();
+      await tester.changeTimeFormat();
+
+      await tester.dismissCellEditor();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('dd/MM/y hh:mm a').format(now),
+      );
+
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Clear the date and time
+      await tester.clearDate();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: '',
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('single select', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      const fieldType = FieldType.SingleSelect;
+
+      // When create a grid, it will create a single select field by default
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Tap the cell to invoke the selection option editor
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Create a new select option
+      await tester.createOption(name: 'tag 1');
+      await tester.dismissCellEditor();
+
+      // Make sure the option is created and displayed in the cell
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: 'tag 1',
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Create another select option
+      await tester.createOption(name: 'tag 2');
+      await tester.dismissCellEditor();
+
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: 'tag 2',
+      );
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsOneWidget,
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // switch to first option
+      await tester.selectOption(name: 'tag 1');
+      await tester.dismissCellEditor();
+
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: 'tag 1',
+      );
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsOneWidget,
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Deselect the currently-selected option
+      await tester.selectOption(name: 'tag 1');
+      await tester.dismissCellEditor();
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsNothing,
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('multi select', (tester) async {
+      final tags = [
+        'tag 1',
+        'tag 2',
+        'tag 3',
+        'tag 4',
+      ];
+
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.MultiSelect;
+      await tester.createField(fieldType, fieldType.name);
+
+      // Tap the cell to invoke the selection option editor
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Create a new select option
+      await tester.createOption(name: tags.first);
+      await tester.dismissCellEditor();
+
+      // Make sure the option is created and displayed in the cell
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: tags.first,
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Create some other select options
+      await tester.createOption(name: tags[1]);
+      await tester.createOption(name: tags[2]);
+      await tester.createOption(name: tags[3]);
+      await tester.dismissCellEditor();
+
+      for (final tag in tags) {
+        await tester.findSelectOptionWithNameInGrid(
+          rowIndex: 0,
+          name: tag,
+        );
+      }
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsNWidgets(4),
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Deselect all options
+      for (final tag in tags) {
+        await tester.selectOption(name: tag);
+      }
+      await tester.dismissCellEditor();
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsNothing,
+      );
+
+      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
+      await tester.findSelectOptionEditor(findsOneWidget);
+
+      // Select some options
+      await tester.selectOption(name: tags[1]);
+      await tester.selectOption(name: tags[3]);
+      await tester.dismissCellEditor();
+
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: tags[1],
+      );
+      await tester.findSelectOptionWithNameInGrid(
+        rowIndex: 0,
+        name: tags[3],
+      );
+
+      await tester.assertNumberOfSelectedOptionsInGrid(
+        rowIndex: 0,
+        matcher: findsNWidgets(2),
+      );
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('checklist', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      const fieldType = FieldType.Checklist;
+      await tester.createField(fieldType, fieldType.name);
+
+      // assert that there is no progress bar in the grid
+      tester.assertChecklistCellInGrid(rowIndex: 0, percent: null);
+
+      // tap on the first checklist cell
+      await tester.tapChecklistCellInGrid(rowIndex: 0);
+
+      // assert that the checklist editor is shown
+      tester.assertChecklistEditorVisible(visible: true);
+
+      // create a new task with enter
+      await tester.createNewChecklistTask(name: "task 0", enter: true);
+
+      // assert that the task is displayed
+      tester.assertChecklistTaskInEditor(
+        index: 0,
+        name: "task 0",
+        isChecked: false,
+      );
+
+      // update the task's name
+      await tester.renameChecklistTask(index: 0, name: "task 1");
+
+      // assert that the task's name is updated
+      tester.assertChecklistTaskInEditor(
+        index: 0,
+        name: "task 1",
+        isChecked: false,
+      );
+
+      // dismiss new task editor
+      await tester.dismissCellEditor();
+
+      // dismiss checklist cell editor
+      await tester.dismissCellEditor();
+
+      // assert that progress bar is shown in grid at 0%
+      tester.assertChecklistCellInGrid(rowIndex: 0, percent: 0);
+
+      // start editing the first checklist cell again
+      await tester.tapChecklistCellInGrid(rowIndex: 0);
+
+      // create another task with the create button
+      await tester.createNewChecklistTask(name: "task 2", button: true);
+
+      // assert that the task was inserted
+      tester.assertChecklistTaskInEditor(
+        index: 1,
+        name: "task 2",
+        isChecked: false,
+      );
+
+      // mark it as complete
+      await tester.checkChecklistTask(index: 1);
+
+      // assert that the task was checked in the editor
+      tester.assertChecklistTaskInEditor(
+        index: 1,
+        name: "task 2",
+        isChecked: true,
+      );
+
+      // dismiss checklist editor
+      await tester.dismissCellEditor();
+      await tester.dismissCellEditor();
+
+      // assert that progressbar is shown in grid at 50%
+      tester.assertChecklistCellInGrid(rowIndex: 0, percent: 0.5);
+
+      // re-open the cell editor
+      await tester.tapChecklistCellInGrid(rowIndex: 0);
+
+      // hover over first task and delete it
+      await tester.deleteChecklistTask(index: 0);
+
+      // dismiss cell editor
+      await tester.dismissCellEditor();
+
+      // assert that progressbar is shown in grid at 100%
+      tester.assertChecklistCellInGrid(rowIndex: 0, percent: 1);
+
+      // re-open the cell edior
+      await tester.tapChecklistCellInGrid(rowIndex: 0);
+
+      // delete the remaining task
+      await tester.deleteChecklistTask(index: 0);
+
+      // dismiss the cell editor
+      await tester.dismissCellEditor();
+
+      // check that the progress bar is not viisble
+      tester.assertChecklistCellInGrid(rowIndex: 0, percent: null);
+    });
+  });
+}
@@ -0,0 +1,55 @@
+import 'package:appflowy/plugins/database/grid/presentation/grid_page.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/setting_entities.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pbenum.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('database field settings', () {
+    testWidgets('field visibility', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Grid);
+
+      // create a field
+      await tester.scrollToRight(find.byType(GridPage));
+      await tester.tapNewPropertyButton();
+      await tester.renameField('New field 1');
+      await tester.dismissFieldEditor();
+
+      // hide the field
+      await tester.tapGridFieldWithName('New field 1');
+      await tester.tapHidePropertyButton();
+      tester.noFieldWithName('New field 1');
+
+      // go back to inline database view, expect field to be shown
+      await tester.tapTabBarLinkedViewByViewName('Untitled');
+      tester.findFieldWithName('New field 1');
+
+      // go back to linked database view, expect field to be hidden
+      await tester.tapTabBarLinkedViewByViewName('Grid');
+      tester.noFieldWithName('New field 1');
+
+      // use the settings button to show the field
+      await tester.tapDatabaseSettingButton();
+      await tester.tapViewPropertiesButton();
+      await tester.tapViewTogglePropertyVisibilityButtonByName('New field 1');
+      await tester.dismissFieldEditor();
+      tester.findFieldWithName('New field 1');
+
+      // open first row in popup then hide the field
+      await tester.openFirstRowDetailPage();
+      await tester.tapGridFieldWithNameInRowDetailPage('New field 1');
+      await tester.tapHidePropertyButtonInFieldEditor();
+      await tester.dismissRowDetailPage();
+      tester.noFieldWithName('New field 1');
+    });
+  });
+}
@@ -0,0 +1,392 @@
+import 'package:appflowy/plugins/database/grid/presentation/grid_page.dart';
+import 'package:appflowy/plugins/database/grid/presentation/widgets/header/type_option/select/select_option.dart';
+import 'package:appflowy/util/field_type_extension.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/protobuf.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import 'package:intl/intl.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('grid field editor:', () {
+    testWidgets('rename existing field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Invoke the field editor
+      await tester.tapGridFieldWithName('Name');
+      await tester.tapEditFieldButton();
+
+      await tester.renameField('hello world');
+      await tester.dismissFieldEditor();
+
+      await tester.tapGridFieldWithName('hello world');
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('update field type of existing field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Invoke the field editor
+      await tester.changeFieldTypeOfFieldWithName('Type', FieldType.Checkbox);
+
+      await tester.assertFieldTypeWithFieldName(
+        'Type',
+        FieldType.Checkbox,
+      );
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('create a field and rename it', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      // create a new grid
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // create a field
+      await tester.createField(FieldType.Checklist, 'checklist');
+
+      // check the field is created successfully
+      tester.findFieldWithName('checklist');
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('delete field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // create a field
+      await tester.createField(FieldType.Checkbox, 'New field 1');
+
+      // Delete the field
+      await tester.tapGridFieldWithName('New field 1');
+      await tester.tapDeletePropertyButton();
+
+      // confirm delete
+      await tester.tapDialogOkButton();
+
+      tester.noFieldWithName('New field 1');
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('duplicate field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // create a field
+      await tester.scrollToRight(find.byType(GridPage));
+      await tester.tapNewPropertyButton();
+      await tester.renameField('New field 1');
+      await tester.dismissFieldEditor();
+
+      // duplicate the field
+      await tester.tapGridFieldWithName('New field 1');
+      await tester.tapDuplicatePropertyButton();
+
+      tester.findFieldWithName('New field 1 (copy)');
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('insert field on either side of a field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      await tester.scrollToRight(find.byType(GridPage));
+
+      // insert new field to the right
+      await tester.tapGridFieldWithName('Type');
+      await tester.tapInsertFieldButton(left: false, name: 'Right');
+      await tester.dismissFieldEditor();
+      tester.findFieldWithName('Right');
+
+      // insert new field to the right
+      await tester.tapGridFieldWithName('Type');
+      await tester.tapInsertFieldButton(left: true, name: "Left");
+      await tester.dismissFieldEditor();
+      tester.findFieldWithName('Left');
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('create checklist field', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      await tester.scrollToRight(find.byType(GridPage));
+      await tester.tapNewPropertyButton();
+
+      // Open the type option menu
+      await tester.tapSwitchFieldTypeButton();
+
+      await tester.selectFieldType(FieldType.Checklist);
+
+      // After update the field type, the cells should be updated
+      await tester.findCellByFieldType(FieldType.Checklist);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('create list of fields', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      for (final fieldType in [
+        FieldType.Checklist,
+        FieldType.DateTime,
+        FieldType.Number,
+        FieldType.URL,
+        FieldType.MultiSelect,
+        FieldType.LastEditedTime,
+        FieldType.CreatedTime,
+        FieldType.Checkbox,
+      ]) {
+        await tester.scrollToRight(find.byType(GridPage));
+        await tester.tapNewPropertyButton();
+        await tester.renameField(fieldType.name);
+
+        // Open the type option menu
+        await tester.tapSwitchFieldTypeButton();
+
+        await tester.selectFieldType(fieldType);
+        await tester.dismissFieldEditor();
+
+        // After update the field type, the cells should be updated
+        await tester.findCellByFieldType(fieldType);
+        await tester.pumpAndSettle();
+      }
+    });
+
+    testWidgets('field types with empty type option editor', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      for (final fieldType in [
+        FieldType.RichText,
+        FieldType.Checkbox,
+        FieldType.Checklist,
+        FieldType.URL,
+      ]) {
+        // create the field
+        await tester.scrollToRight(find.byType(GridPage));
+        await tester.tapNewPropertyButton();
+        await tester.renameField(fieldType.i18n);
+
+        // change field type
+        await tester.tapSwitchFieldTypeButton();
+        await tester.selectFieldType(fieldType);
+        await tester.dismissFieldEditor();
+
+        // open the field editor
+        await tester.tapGridFieldWithName(fieldType.i18n);
+        await tester.tapEditFieldButton();
+
+        // check type option editor is empty
+        tester.expectEmptyTypeOptionEditor();
+        await tester.dismissFieldEditor();
+      }
+    });
+
+    testWidgets('number field type option', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+      await tester.scrollToRight(find.byType(GridPage));
+
+      // create a number field
+      await tester.tapNewPropertyButton();
+      await tester.renameField("Number");
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.Number);
+      await tester.dismissFieldEditor();
+
+      // enter some data into the first number cell
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        input: '123',
+      );
+      // edit the next cell to force the previous cell at row 0 to lose focus
+      await tester.editCell(
+        rowIndex: 1,
+        fieldType: FieldType.Number,
+        input: '0.2',
+      );
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        content: '123',
+      );
+
+      // open editor and change number format
+      await tester.tapGridFieldWithName('Number');
+      await tester.tapEditFieldButton();
+      await tester.changeNumberFieldFormat();
+      await tester.dismissFieldEditor();
+
+      // assert number format has been changed
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        content: '\$123',
+      );
+    });
+
+    testWidgets('add option', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(
+        layout: ViewLayoutPB.Grid,
+      );
+
+      // invoke the field editor
+      await tester.tapGridFieldWithName('Type');
+      await tester.tapEditFieldButton();
+
+      // tap 'add option' button
+      await tester.tapAddSelectOptionButton();
+      const text = 'Hello AppFlowy';
+      final inputField = find.descendant(
+        of: find.byType(CreateOptionTextField),
+        matching: find.byType(TextField),
+      );
+      await tester.enterText(inputField, text);
+      await tester.pumpAndSettle();
+      await tester.testTextInput.receiveAction(TextInputAction.done);
+      await tester.pumpAndSettle(const Duration(milliseconds: 500));
+
+      // check the result
+      tester.expectToSeeText(text);
+    });
+
+    testWidgets('date time field type options', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+      await tester.scrollToRight(find.byType(GridPage));
+
+      // create a date field
+      await tester.tapNewPropertyButton();
+      await tester.renameField(FieldType.DateTime.i18n);
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.DateTime);
+      await tester.dismissFieldEditor();
+
+      // edit the first date cell
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+      await tester.toggleIncludeTime();
+      final now = DateTime.now();
+      await tester.selectDay(content: now.day);
+
+      await tester.dismissCellEditor();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('MMM dd, y HH:mm').format(now),
+      );
+
+      // open editor and change date & time format
+      await tester.tapGridFieldWithName(FieldType.DateTime.i18n);
+      await tester.tapEditFieldButton();
+      await tester.changeDateFormat();
+      await tester.changeTimeFormat();
+      await tester.dismissFieldEditor();
+
+      // assert date format has been changed
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.DateTime,
+        content: DateFormat('dd/MM/y hh:mm a').format(now),
+      );
+    });
+
+    testWidgets('last modified and created at field type options',
+        (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+      final created = DateTime.now();
+
+      // create a created at field
+      await tester.tapNewPropertyButton();
+      await tester.renameField(FieldType.CreatedTime.i18n);
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.CreatedTime);
+      await tester.dismissFieldEditor();
+
+      // create a last modified field
+      await tester.tapNewPropertyButton();
+      await tester.renameField(FieldType.LastEditedTime.i18n);
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.LastEditedTime);
+      await tester.dismissFieldEditor();
+
+      final modified = DateTime.now();
+
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.CreatedTime,
+        content: DateFormat('MMM dd, y HH:mm').format(created),
+      );
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.LastEditedTime,
+        content: DateFormat('MMM dd, y HH:mm').format(modified),
+      );
+
+      // open field editor and change date & time format
+      await tester.tapGridFieldWithName(FieldType.LastEditedTime.i18n);
+      await tester.tapEditFieldButton();
+      await tester.changeDateFormat();
+      await tester.changeTimeFormat();
+      await tester.dismissFieldEditor();
+
+      // open field editor and change date & time format
+      await tester.tapGridFieldWithName(FieldType.CreatedTime.i18n);
+      await tester.tapEditFieldButton();
+      await tester.changeDateFormat();
+      await tester.changeTimeFormat();
+      await tester.dismissFieldEditor();
+
+      // assert format has been changed
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.CreatedTime,
+        content: DateFormat('dd/MM/y hh:mm a').format(created),
+      );
+      tester.assertCellContent(
+        rowIndex: 0,
+        fieldType: FieldType.LastEditedTime,
+        content: DateFormat('dd/MM/y hh:mm a').format(modified),
+      );
+    });
+  });
+}
@@ -1,10 +1,10 @@
-import 'package:appflowy/plugins/database_view/grid/presentation/widgets/filter/choicechip/checkbox.dart';
-import 'package:appflowy/plugins/database_view/grid/presentation/widgets/filter/choicechip/text.dart';
+import 'package:appflowy/plugins/database/grid/presentation/widgets/filter/choicechip/checkbox.dart';
+import 'package:appflowy/plugins/database/grid/presentation/widgets/filter/choicechip/text.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
+import '../util/database_test_op.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -0,0 +1,206 @@
+import 'package:appflowy/workspace/presentation/notifications/widgets/notification_item.dart';
+import 'package:appflowy/workspace/presentation/widgets/date_picker/widgets/reminder_selector.dart';
+import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/protobuf.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('reminder in database', () {
+    testWidgets('add date field and add reminder', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Invoke the field editor
+      await tester.tapGridFieldWithName('Type');
+      await tester.tapEditFieldButton();
+
+      // Change to date type
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.DateTime);
+      await tester.dismissFieldEditor();
+
+      // Open date picker
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Select date
+      final isToday = await tester.selectLastDateInPicker();
+
+      // Select "On day of event" reminder
+      await tester.selectReminderOption(ReminderOption.onDayOfEvent);
+
+      // Expect "On day of event" to be displayed
+      tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+      // Dismiss the cell/date editor
+      await tester.dismissCellEditor();
+
+      // Open date picker again
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Expect "On day of event" to be displayed
+      tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+      // Dismiss the cell/date editor
+      await tester.dismissCellEditor();
+
+      int tabIndex = 1;
+      final now = DateTime.now();
+      if (isToday && now.hour >= 9) {
+        tabIndex = 0;
+      }
+
+      // Open "Upcoming" in Notification hub
+      await tester.openNotificationHub(tabIndex: tabIndex);
+
+      // Expect 1 notification
+      tester.expectNotificationItems(1);
+    });
+
+    testWidgets('navigate from reminder to open row', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Invoke the field editor
+      await tester.tapGridFieldWithName('Type');
+      await tester.tapEditFieldButton();
+
+      // Change to date type
+      await tester.tapSwitchFieldTypeButton();
+      await tester.selectFieldType(FieldType.DateTime);
+      await tester.dismissFieldEditor();
+
+      // Open date picker
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Select date
+      final isToday = await tester.selectLastDateInPicker();
+
+      // Select "On day of event"-reminder
+      await tester.selectReminderOption(ReminderOption.onDayOfEvent);
+
+      // Expect "On day of event" to be displayed
+      tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+      // Dismiss the cell/date editor
+      await tester.dismissCellEditor();
+
+      // Open date picker again
+      await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+      await tester.findDateEditor(findsOneWidget);
+
+      // Expect "On day of event" to be displayed
+      tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+      // Dismiss the cell/date editor
+      await tester.dismissCellEditor();
+
+      // Create and Navigate to a new document
+      await tester.createNewPageWithNameUnderParent();
+      await tester.pumpAndSettle();
+
+      int tabIndex = 1;
+      final now = DateTime.now();
+      if (isToday && now.hour >= 9) {
+        tabIndex = 0;
+      }
+
+      // Open correct tab in Notification hub
+      await tester.openNotificationHub(tabIndex: tabIndex);
+
+      // Expect 1 notification
+      tester.expectNotificationItems(1);
+
+      // Tap on the notification
+      await tester.tap(find.byType(NotificationItem));
+      await tester.pumpAndSettle();
+
+      // Expect to see Row Editor Dialog
+      tester.expectToSeeRowDetailsPageDialog();
+    });
+
+    testWidgets(
+      'toggle include time sets reminder option correctly',
+      (tester) async {
+        await tester.initializeAppFlowy();
+        await tester.tapGoButton();
+
+        await tester.createNewPageWithNameUnderParent(
+          layout: ViewLayoutPB.Grid,
+        );
+
+        // Invoke the field editor
+        await tester.tapGridFieldWithName('Type');
+        await tester.tapEditFieldButton();
+
+        // Change to date type
+        await tester.tapSwitchFieldTypeButton();
+        await tester.selectFieldType(FieldType.DateTime);
+        await tester.dismissFieldEditor();
+
+        // Open date picker
+        await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+        await tester.findDateEditor(findsOneWidget);
+
+        // Select date
+        await tester.selectLastDateInPicker();
+
+        // Select "On day of event"-reminder
+        await tester.selectReminderOption(ReminderOption.onDayOfEvent);
+
+        // Expect "On day of event" to be displayed
+        tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+        // Dismiss the cell/date editor
+        await tester.dismissCellEditor();
+
+        // Open date picker again
+        await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+        await tester.findDateEditor(findsOneWidget);
+
+        // Expect "On day of event" to be displayed
+        tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+
+        // Toggle include time on
+        await tester.toggleIncludeTime();
+
+        // Expect "At time of event" to be displayed
+        tester.expectSelectedReminder(ReminderOption.atTimeOfEvent);
+
+        // Dismiss the cell/date editor
+        await tester.dismissCellEditor();
+
+        // Open date picker again
+        await tester.tapCellInGrid(rowIndex: 0, fieldType: FieldType.DateTime);
+        await tester.findDateEditor(findsOneWidget);
+
+        // Expect "At time of event" to be displayed
+        tester.expectSelectedReminder(ReminderOption.atTimeOfEvent);
+
+        // Select "One hour before"-reminder
+        await tester.selectReminderOption(ReminderOption.oneHourBefore);
+
+        // Expect "One hour before" to be displayed
+        tester.expectSelectedReminder(ReminderOption.oneHourBefore);
+
+        // Toggle include time off
+        await tester.toggleIncludeTime();
+
+        // Expect "On day of event" to be displayed
+        tester.expectSelectedReminder(ReminderOption.onDayOfEvent);
+      },
+    );
+  });
+}
@@ -1,40 +1,43 @@
-import 'package:appflowy/plugins/database_view/widgets/row/row_banner.dart';
+import 'package:appflowy/plugins/database/widgets/row/row_banner.dart';
 import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
-import 'util/emoji.dart';
-import 'util/util.dart';
+import '../util/database_test_op.dart';
+import '../util/emoji.dart';
+import '../util/util.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

-  group('grid', () {
-    testWidgets('row details page opens', (tester) async {
+  group('grid row detail page:', () {
+    testWidgets('opens', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();

      // Make sure that the row page is opened
      tester.assertRowDetailPageOpened();
+
+      // Each row detail page should have a document
+      await tester.assertDocumentExistInRowDetailPage();
    });

-    testWidgets('insert emoji in the row detail page', (tester) async {
+    testWidgets('add emoji', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -42,30 +45,27 @@ void main() {
      await tester.hoverRowBanner();

      await tester.openEmojiPicker();
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😀');

      // After select the emoji, the EmojiButton will show up
      await tester.tapButton(find.byType(EmojiButton));
    });

-    testWidgets('update emoji in the row detail page', (tester) async {
+    testWidgets('update emoji', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
      await tester.hoverRowBanner();
      await tester.openEmojiPicker();
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😀');

      // Update existing selected emoji
      await tester.tapButton(find.byType(EmojiButton));
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😅');

      // The emoji already displayed in the row banner
@@ -78,18 +78,17 @@ void main() {
      expect(emojiText, findsNWidgets(2));
    });

-    testWidgets('remove emoji in the row detail page', (tester) async {
+    testWidgets('remove emoji', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
      await tester.hoverRowBanner();
      await tester.openEmojiPicker();
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😀');

      // Remove the emoji
@@ -100,12 +99,12 @@ void main() {
      expect(emojiText, findsNothing);
    });

-    testWidgets('create list of fields in row detail page', (tester) async {
+    testWidgets('create list of fields', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -124,10 +123,9 @@ void main() {
        await tester.renameField(fieldType.name);

        // Open the type option menu
-        await tester.tapTypeOptionButton();
+        await tester.tapSwitchFieldTypeButton();

        await tester.selectFieldType(fieldType);
-        await tester.dismissFieldEditor();

        // After update the field type, the cells should be updated
        await tester.findCellByFieldType(fieldType);
@@ -140,7 +138,7 @@ void main() {
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -173,7 +171,7 @@ void main() {
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -216,27 +214,13 @@ void main() {
      tester.assertToggleShowHiddenFieldsVisibility(false);
    });

-    testWidgets('check document exists in row detail page', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Hover first row and then open the row page
-      await tester.openFirstRowDetailPage();
-
-      // Each row detail page should have a document
-      await tester.assertDocumentExistInRowDetailPage();
-    });
-
    testWidgets('update the contents of the document and re-open it',
        (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -245,7 +229,7 @@ void main() {
      await tester.wait(500);

      // Focus on the editor
-      final textBlock = find.byType(TextBlockComponentWidget);
+      final textBlock = find.byType(ParagraphBlockComponentWidget);
      await tester.tapAt(tester.getCenter(textBlock));
      await tester.pumpAndSettle();

@@ -276,7 +260,7 @@ void main() {
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -310,12 +294,12 @@ void main() {
      expect(tester.takeException(), isNull);
    });

-    testWidgets('delete row in row detail page', (tester) async {
+    testWidgets('delete row', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -327,12 +311,12 @@ void main() {
      await tester.assertNumberOfRowsInGridPage(2);
    });

-    testWidgets('duplicate row in row detail page', (tester) async {
+    testWidgets('duplicate row', (tester) async {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

      // Create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // Hover first row and then open the row page
      await tester.openFirstRowDetailPage();
@@ -1,9 +1,9 @@
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
-import 'util/util.dart';
+import '../util/database_test_op.dart';
+import '../util/util.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -13,7 +13,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
      await tester.tapCreateRowButtonInGrid();

      // The initial number of rows is 3
@@ -25,7 +25,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      await tester.hoverOnFirstRowOfGrid();

@@ -41,7 +41,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
      await tester.hoverOnFirstRowOfGrid();

      // Open the row menu and then click the delete
@@ -59,7 +59,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
      await tester.assertRowCountInGridPage(3);

      await tester.pumpAndSettle();
@@ -1,10 +1,10 @@
 import 'package:appflowy_backend/protobuf/flowy-database2/setting_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
-import 'util/util.dart';
+import '../util/database_test_op.dart';
+import '../util/util.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -14,7 +14,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // open setting
      await tester.tapDatabaseSettingButton();
@@ -31,7 +31,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);

      // open setting
      await tester.tapDatabaseSettingButton();
@@ -2,7 +2,7 @@ import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

-import 'util/database_test_op.dart';
+import '../util/database_test_op.dart';

 void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -16,7 +16,7 @@ void main() {
      // check the text cell
      final textCells = <String>['A', 'B', 'C', 'D', 'E', '', '', '', '', ''];
      for (final (index, content) in textCells.indexed) {
-        await tester.assertCellContent(
+        tester.assertCellContent(
          rowIndex: index,
          fieldType: FieldType.RichText,
          content: content,
@@ -34,7 +34,7 @@ void main() {
        false,
        false,
        false,
-        false
+        false,
      ];
      for (final (index, content) in checkboxCells.indexed) {
        await tester.assertCheckboxCell(
@@ -54,10 +54,10 @@ void main() {
        '10',
        '11',
        '12',
-        ''
+        '',
      ];
      for (final (index, content) in numberCells.indexed) {
-        await tester.assertCellContent(
+        tester.assertCellContent(
          rowIndex: index,
          fieldType: FieldType.Number,
          content: content,
@@ -74,7 +74,7 @@ void main() {
        '',
      ];
      for (final (index, content) in urlCells.indexed) {
-        await tester.assertCellContent(
+        tester.assertCellContent(
          rowIndex: index,
          fieldType: FieldType.URL,
          content: content,
@@ -135,7 +135,7 @@ void main() {
        null,
      ];
      for (final (index, percent) in checklistCells.indexed) {
-        await tester.assertChecklistCellInGrid(
+        tester.assertChecklistCellInGrid(
          rowIndex: index,
          percent: percent,
        );
@@ -152,11 +152,12 @@ void main() {
        'Jun 16, 2023',
        '',
        '',
-        ''
+        '',
      ];
      for (final (index, content) in dateCells.indexed) {
-        await tester.assertDateCellInGrid(
+        tester.assertCellContent(
          rowIndex: index,
+          fieldType: FieldType.DateTime,
          content: content,
        );
      }
@@ -0,0 +1,374 @@
+import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('grid', () {
+    testWidgets('add text sort', (tester) async {
+      await tester.openV020database();
+      // create a sort
+      await tester.tapDatabaseSortButton();
+      await tester.tapCreateSortByFieldType(FieldType.RichText, 'Name');
+
+      // check the text cell order
+      final textCells = <String>[
+        'A',
+        'B',
+        'C',
+        'D',
+        'E',
+        '',
+        '',
+        '',
+        '',
+        '',
+      ];
+      for (final (index, content) in textCells.indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.RichText,
+          content: content,
+        );
+      }
+
+      // open the sort menu and select order by descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapSortButtonByName('Name');
+      await tester.tapSortByDescending();
+      for (final (index, content) in <String>[
+        'E',
+        'D',
+        'C',
+        'B',
+        'A',
+        '',
+        '',
+        '',
+        '',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.RichText,
+          content: content,
+        );
+      }
+
+      // delete all sorts
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapAllSortButton();
+
+      // check the text cell order
+      for (final (index, content) in <String>[
+        'A',
+        'B',
+        'C',
+        'D',
+        'E',
+        '',
+        '',
+        '',
+        '',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.RichText,
+          content: content,
+        );
+      }
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('add checkbox sort', (tester) async {
+      await tester.openV020database();
+      // create a sort
+      await tester.tapDatabaseSortButton();
+      await tester.tapCreateSortByFieldType(FieldType.Checkbox, 'Done');
+
+      // check the checkbox cell order
+      for (final (index, content) in <bool>[
+        false,
+        false,
+        false,
+        false,
+        false,
+        true,
+        true,
+        true,
+        true,
+        true,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      // open the sort menu and select order by descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapSortButtonByName('Done');
+      await tester.tapSortByDescending();
+      for (final (index, content) in <bool>[
+        true,
+        true,
+        true,
+        true,
+        true,
+        false,
+        false,
+        false,
+        false,
+        false,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('add number sort', (tester) async {
+      await tester.openV020database();
+      // create a sort
+      await tester.tapDatabaseSortButton();
+      await tester.tapCreateSortByFieldType(FieldType.Number, 'number');
+
+      // check the number cell order
+      for (final (index, content) in <String>[
+        '-2',
+        '-1',
+        '0.1',
+        '0.2',
+        '1',
+        '2',
+        '10',
+        '11',
+        '12',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.Number,
+          content: content,
+        );
+      }
+
+      // open the sort menu and select order by descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapSortButtonByName('number');
+      await tester.tapSortByDescending();
+      for (final (index, content) in <String>[
+        '12',
+        '11',
+        '10',
+        '2',
+        '1',
+        '0.2',
+        '0.1',
+        '-1',
+        '-2',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.Number,
+          content: content,
+        );
+      }
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('add checkbox and number sort', (tester) async {
+      await tester.openV020database();
+      // create a sort
+      await tester.tapDatabaseSortButton();
+      await tester.tapCreateSortByFieldType(FieldType.Checkbox, 'Done');
+
+      // open the sort menu and sort checkbox by descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapSortButtonByName('Done');
+      await tester.tapSortByDescending();
+      for (final (index, content) in <bool>[
+        true,
+        true,
+        true,
+        true,
+        true,
+        false,
+        false,
+        false,
+        false,
+        false,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      // add another sort, this time by number descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapCreateSortByFieldTypeInSortMenu(
+        FieldType.Number,
+        'number',
+      );
+      await tester.tapSortButtonByName('number');
+      await tester.tapSortByDescending();
+
+      // check checkbox cell order
+      for (final (index, content) in <bool>[
+        true,
+        true,
+        true,
+        true,
+        true,
+        false,
+        false,
+        false,
+        false,
+        false,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      // check number cell order
+      for (final (index, content) in <String>[
+        '1',
+        '0.2',
+        '0.1',
+        '-1',
+        '-2',
+        '12',
+        '11',
+        '10',
+        '2',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.Number,
+          content: content,
+        );
+      }
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('reorder sort', (tester) async {
+      await tester.openV020database();
+      // create a sort
+      await tester.tapDatabaseSortButton();
+      await tester.tapCreateSortByFieldType(FieldType.Checkbox, 'Done');
+
+      // open the sort menu and sort checkbox by descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapSortButtonByName('Done');
+      await tester.tapSortByDescending();
+
+      // add another sort, this time by number descending
+      await tester.tapSortMenuInSettingBar();
+      await tester.tapCreateSortByFieldTypeInSortMenu(
+        FieldType.Number,
+        'number',
+      );
+      await tester.tapSortButtonByName('number');
+      await tester.tapSortByDescending();
+
+      // check checkbox cell order
+      for (final (index, content) in <bool>[
+        true,
+        true,
+        true,
+        true,
+        true,
+        false,
+        false,
+        false,
+        false,
+        false,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      // check number cell order
+      for (final (index, content) in <String>[
+        '1',
+        '0.2',
+        '0.1',
+        '-1',
+        '-2',
+        '12',
+        '11',
+        '10',
+        '2',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.Number,
+          content: content,
+        );
+      }
+
+      // reorder sort
+      await tester.tapSortMenuInSettingBar();
+      await tester.reorderSort(
+        (FieldType.Number, 'number'),
+        (FieldType.Checkbox, 'Done'),
+      );
+
+      // check checkbox cell order
+      for (final (index, content) in <bool>[
+        false,
+        false,
+        false,
+        false,
+        true,
+        true,
+        true,
+        true,
+        true,
+        false,
+      ].indexed) {
+        await tester.assertCheckboxCell(
+          rowIndex: index,
+          isSelected: content,
+        );
+      }
+
+      // check the number cell order
+      for (final (index, content) in <String>[
+        '12',
+        '11',
+        '10',
+        '2',
+        '1',
+        '0.2',
+        '0.1',
+        '-1',
+        '-2',
+        '',
+      ].indexed) {
+        tester.assertCellContent(
+          rowIndex: index,
+          fieldType: FieldType.Number,
+          content: content,
+        );
+      }
+    });
+  });
+}
@@ -0,0 +1,77 @@
+import 'package:appflowy_backend/protobuf/flowy-database2/setting_entities.pbenum.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('database', () {
+    testWidgets('create linked view', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Create board view
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Board);
+      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
+
+      // Create grid view
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Grid);
+      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Grid);
+
+      // Create calendar view
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Calendar);
+      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Calendar);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('rename and delete linked view', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Create board view
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Board);
+      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
+
+      // rename board view
+      await tester.renameLinkedView(
+        tester.findTabBarLinkViewByViewLayout(ViewLayoutPB.Board),
+        'new board',
+      );
+      final findBoard = tester.findTabBarLinkViewByViewName('new board');
+      expect(findBoard, findsOneWidget);
+
+      // delete the board
+      await tester.deleteDatebaseView(findBoard);
+      expect(tester.findTabBarLinkViewByViewName('new board'), findsNothing);
+
+      await tester.pumpAndSettle();
+    });
+
+    testWidgets('delete the last database view', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Create board view
+      await tester.tapCreateLinkedDatabaseViewButton(DatabaseLayoutPB.Board);
+      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
+
+      // delete the board
+      await tester.deleteDatebaseView(
+        tester.findTabBarLinkViewByViewLayout(ViewLayoutPB.Board),
+      );
+
+      await tester.pumpAndSettle();
+    });
+  });
+}
@@ -1,542 +0,0 @@
-import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-import 'package:intl/intl.dart';
-
-import 'util/database_test_op.dart';
-import 'util/util.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('grid cell', () {
-    testWidgets('edit text cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      await tester.editCell(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        input: 'hello world',
-      );
-
-      await tester.assertCellContent(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        content: 'hello world',
-      );
-
-      await tester.pumpAndSettle();
-    });
-
-    // Makesure the text cells are filled with the right content when there are
-    // multiple text cell
-    testWidgets('edit multiple text cells', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-      await tester.createNewPageWithName(
-        name: 'my grid',
-        layout: ViewLayoutPB.Grid,
-      );
-      await tester.createField(FieldType.RichText, 'description');
-
-      await tester.editCell(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        input: 'hello',
-      );
-
-      await tester.editCell(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        input: 'world',
-        cellIndex: 1,
-      );
-
-      await tester.assertCellContent(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        content: 'hello',
-        cellIndex: 0,
-      );
-
-      await tester.assertCellContent(
-        rowIndex: 0,
-        fieldType: FieldType.RichText,
-        content: 'world',
-        cellIndex: 1,
-      );
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit number cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      const fieldType = FieldType.Number;
-
-      // Create a number field
-      await tester.createField(fieldType, fieldType.name);
-
-      await tester.editCell(
-        rowIndex: 0,
-        fieldType: fieldType,
-        input: '-1',
-      );
-      // edit the next cell to force the previous cell at row 0 to lose focus
-      await tester.editCell(
-        rowIndex: 1,
-        fieldType: fieldType,
-        input: '0.2',
-      );
-      // -1 -> -1
-      await tester.assertCellContent(
-        rowIndex: 0,
-        fieldType: fieldType,
-        content: '-1',
-      );
-
-      // edit the next cell to force the previous cell at row 1 to lose focus
-      await tester.editCell(
-        rowIndex: 2,
-        fieldType: fieldType,
-        input: '.1',
-      );
-      // 0.2 -> 0.2
-      await tester.assertCellContent(
-        rowIndex: 1,
-        fieldType: fieldType,
-        content: '0.2',
-      );
-
-      // edit the next cell to force the previous cell at row 2 to lose focus
-      await tester.editCell(
-        rowIndex: 0,
-        fieldType: fieldType,
-        input: '',
-      );
-      // .1 -> 0.1
-      await tester.assertCellContent(
-        rowIndex: 2,
-        fieldType: fieldType,
-        content: '0.1',
-      );
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit checkbox cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      await tester.assertCheckboxCell(rowIndex: 0, isSelected: false);
-      await tester.tapCheckboxCellInGrid(rowIndex: 0);
-      await tester.assertCheckboxCell(rowIndex: 0, isSelected: true);
-
-      await tester.tapCheckboxCellInGrid(rowIndex: 1);
-      await tester.tapCheckboxCellInGrid(rowIndex: 2);
-      await tester.assertCheckboxCell(rowIndex: 1, isSelected: true);
-      await tester.assertCheckboxCell(rowIndex: 2, isSelected: true);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit create time cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      const fieldType = FieldType.CreatedTime;
-      // Create a create time field
-      // The create time field is not editable
-      await tester.createField(fieldType, fieldType.name);
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-
-      await tester.findDateEditor(findsNothing);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit last time cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      const fieldType = FieldType.LastEditedTime;
-      // Create a last time field
-      // The last time field is not editable
-      await tester.createField(fieldType, fieldType.name);
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-
-      await tester.findDateEditor(findsNothing);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit date time cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      const fieldType = FieldType.DateTime;
-      await tester.createField(fieldType, fieldType.name);
-
-      // Tap the cell to invoke the field editor
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Toggle include time
-      await tester.toggleIncludeTime();
-
-      // Dismiss the cell editor
-      await tester.dismissCellEditor();
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Turn off include time
-      await tester.toggleIncludeTime();
-
-      // Select a date
-      final today = DateTime.now();
-      await tester.selectDay(content: today.day);
-
-      await tester.dismissCellEditor();
-
-      await tester.assertDateCellInGrid(
-        rowIndex: 0,
-        content: DateFormat('MMM dd, y').format(today),
-      );
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Toggle include time
-      final now = DateTime.now();
-      await tester.toggleIncludeTime();
-
-      await tester.dismissCellEditor();
-
-      await tester.assertDateCellInGrid(
-        rowIndex: 0,
-        content: DateFormat('MMM dd, y HH:mm').format(now),
-      );
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Change date format
-      await tester.changeDateFormat();
-
-      await tester.dismissCellEditor();
-
-      await tester.assertDateCellInGrid(
-        rowIndex: 0,
-        content: DateFormat('dd/MM/y HH:mm').format(now),
-      );
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Change time format
-      await tester.changeTimeFormat();
-
-      await tester.dismissCellEditor();
-
-      await tester.assertDateCellInGrid(
-        rowIndex: 0,
-        content: DateFormat('dd/MM/y hh:mm a').format(now),
-      );
-
-      await tester.tapCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findDateEditor(findsOneWidget);
-
-      // Clear the date and time
-      await tester.clearDate();
-
-      await tester.assertDateCellInGrid(
-        rowIndex: 0,
-        content: '',
-      );
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit single select cell', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      const fieldType = FieldType.SingleSelect;
-
-      // When create a grid, it will create a single select field by default
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Tap the cell to invoke the selection option editor
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Create a new select option
-      await tester.createOption(name: 'tag 1');
-      await tester.dismissCellEditor();
-
-      // Make sure the option is created and displayed in the cell
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: 'tag 1',
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Create another select option
-      await tester.createOption(name: 'tag 2');
-      await tester.dismissCellEditor();
-
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: 'tag 2',
-      );
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsOneWidget,
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // switch to first option
-      await tester.selectOption(name: 'tag 1');
-      await tester.dismissCellEditor();
-
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: 'tag 1',
-      );
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsOneWidget,
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Deselect the currently-selected option
-      await tester.selectOption(name: 'tag 1');
-      await tester.dismissCellEditor();
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsNothing,
-      );
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('edit multi select cell', (tester) async {
-      final tags = [
-        'tag 1',
-        'tag 2',
-        'tag 3',
-        'tag 4',
-      ];
-
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      const fieldType = FieldType.MultiSelect;
-      await tester.createField(fieldType, fieldType.name);
-
-      // Tap the cell to invoke the selection option editor
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Create a new select option
-      await tester.createOption(name: tags.first);
-      await tester.dismissCellEditor();
-
-      // Make sure the option is created and displayed in the cell
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: tags.first,
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Create some other select options
-      await tester.createOption(name: tags[1]);
-      await tester.createOption(name: tags[2]);
-      await tester.createOption(name: tags[3]);
-      await tester.dismissCellEditor();
-
-      for (final tag in tags) {
-        await tester.findSelectOptionWithNameInGrid(
-          rowIndex: 0,
-          name: tag,
-        );
-      }
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsNWidgets(4),
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Deselect all options
-      for (final tag in tags) {
-        await tester.selectOption(name: tag);
-      }
-      await tester.dismissCellEditor();
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsNothing,
-      );
-
-      await tester.tapSelectOptionCellInGrid(rowIndex: 0, fieldType: fieldType);
-      await tester.findSelectOptionEditor(findsOneWidget);
-
-      // Select some options
-      await tester.selectOption(name: tags[1]);
-      await tester.selectOption(name: tags[3]);
-      await tester.dismissCellEditor();
-
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: tags[1],
-      );
-      await tester.findSelectOptionWithNameInGrid(
-        rowIndex: 0,
-        name: tags[3],
-      );
-
-      await tester.assertNumberOfSelectedOptionsInGrid(
-        rowIndex: 0,
-        matcher: findsNWidgets(2),
-      );
-
-      await tester.pumpAndSettle();
-    });
-  });
-
-  testWidgets('edit checklist cell', (tester) async {
-    await tester.initializeAppFlowy();
-    await tester.tapGoButton();
-
-    await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-    const fieldType = FieldType.Checklist;
-    await tester.createField(fieldType, fieldType.name);
-
-    // assert that there is no progress bar in the grid
-    tester.assertChecklistCellInGrid(rowIndex: 0, percent: null);
-
-    // tap on the first checklist cell
-    await tester.tapChecklistCellInGrid(rowIndex: 0);
-
-    // assert that the checklist editor is shown
-    tester.assertChecklistEditorVisible(visible: true);
-
-    // create a new task with enter
-    await tester.createNewChecklistTask(name: "task 0", enter: true);
-
-    // assert that the task is displayed
-    tester.assertChecklistTaskInEditor(
-      index: 0,
-      name: "task 0",
-      isChecked: false,
-    );
-
-    // update the task's name
-    await tester.renameChecklistTask(index: 0, name: "task 1");
-
-    // assert that the task's name is updated
-    tester.assertChecklistTaskInEditor(
-      index: 0,
-      name: "task 1",
-      isChecked: false,
-    );
-
-    // dismiss new task editor
-    await tester.dismissCellEditor();
-
-    // dismiss checklist cell editor
-    await tester.dismissCellEditor();
-
-    // assert that progress bar is shown in grid at 0%
-    tester.assertChecklistCellInGrid(rowIndex: 0, percent: 0);
-
-    // start editing the first checklist cell again
-    await tester.tapChecklistCellInGrid(rowIndex: 0);
-
-    // create another task with the create button
-    await tester.createNewChecklistTask(name: "task 2", button: true);
-
-    // assert that the task was inserted
-    tester.assertChecklistTaskInEditor(
-      index: 1,
-      name: "task 2",
-      isChecked: false,
-    );
-
-    // mark it as complete
-    await tester.checkChecklistTask(index: 1);
-
-    // assert that the task was checked in the editor
-    tester.assertChecklistTaskInEditor(
-      index: 1,
-      name: "task 2",
-      isChecked: true,
-    );
-
-    // dismiss checklist editor
-    await tester.dismissCellEditor();
-    await tester.dismissCellEditor();
-
-    // assert that progressbar is shown in grid at 50%
-    tester.assertChecklistCellInGrid(rowIndex: 0, percent: 0.5);
-
-    // re-open the cell editor
-    await tester.tapChecklistCellInGrid(rowIndex: 0);
-
-    // hover over first task and delete it
-    await tester.deleteChecklistTask(index: 0);
-
-    // dismiss cell editor
-    await tester.dismissCellEditor();
-
-    // assert that progressbar is shown in grid at 100%
-    tester.assertChecklistCellInGrid(rowIndex: 0, percent: 1);
-
-    // re-open the cell edior
-    await tester.tapChecklistCellInGrid(rowIndex: 0);
-
-    // delete the remaining task
-    await tester.deleteChecklistTask(index: 0);
-
-    // dismiss the cell editor
-    await tester.dismissCellEditor();
-
-    // check that the progress bar is not viisble
-    tester.assertChecklistCellInGrid(rowIndex: 0, percent: null);
-  });
-}
@@ -1,55 +0,0 @@
-import 'package:appflowy/plugins/database_view/grid/presentation/grid_page.dart';
-import 'package:appflowy/plugins/database_view/tar_bar/tar_bar_add_button.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pbenum.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-
-import 'util/database_test_op.dart';
-import 'util/util.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('database field settings', () {
-    testWidgets('field visibility', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.grid);
-
-      // create a field
-      await tester.scrollToRight(find.byType(GridPage));
-      await tester.tapNewPropertyButton();
-      await tester.renameField('New field 1');
-      await tester.dismissFieldEditor();
-
-      // hide the field
-      await tester.tapGridFieldWithName('New field 1');
-      await tester.tapHidePropertyButton();
-      await tester.noFieldWithName('New field 1');
-
-      // go back to inline database view, expect field to be shown
-      await tester.tapTabBarLinkedViewByViewName('Untitled');
-      await tester.findFieldWithName('New field 1');
-
-      // go back to linked database view, expect field to be hidden
-      await tester.tapTabBarLinkedViewByViewName('grid');
-      await tester.noFieldWithName('New field 1');
-
-      // use the settings button to show the field
-      await tester.tapDatabaseSettingButton();
-      await tester.tapViewPropertiesButton();
-      await tester.tapViewTogglePropertyVisibilityButtonByName('New field 1');
-      await tester.dismissFieldEditor();
-      await tester.findFieldWithName('New field 1');
-
-      // open first row in popup then hide the field
-      await tester.openFirstRowDetailPage();
-      await tester.tapGridFieldWithNameInRowDetailPage('New field 1');
-      await tester.tapHidePropertyButtonInFieldEditor();
-      await tester.dismissRowDetailPage();
-      await tester.noFieldWithName('New field 1');
-    });
-  });
-}
@@ -1,189 +0,0 @@
-import 'package:appflowy/plugins/database_view/grid/presentation/grid_page.dart';
-import 'package:appflowy/plugins/database_view/grid/presentation/widgets/header/type_option/select_option.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-
-import 'util/database_test_op.dart';
-import 'util/util.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('grid page', () {
-    testWidgets('rename existing field', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Invoke the field editor
-      await tester.tapGridFieldWithName('Name');
-      await tester.tapEditPropertyButton();
-
-      await tester.renameField('hello world');
-      await tester.dismissFieldEditor();
-
-      await tester.tapGridFieldWithName('hello world');
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('update field type of existing field', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Invoke the field editor
-      await tester.tapGridFieldWithName('Type');
-      await tester.tapEditPropertyButton();
-
-      await tester.tapTypeOptionButton();
-      await tester.selectFieldType(FieldType.Checkbox);
-      await tester.dismissFieldEditor();
-
-      await tester.assertFieldTypeWithFieldName(
-        'Type',
-        FieldType.Checkbox,
-      );
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('create a field and rename it', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      // create a new grid
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // create a field
-      await tester.createField(FieldType.Checklist, 'checklist');
-
-      // check the field is created successfully
-      await tester.findFieldWithName('checklist');
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('delete field', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // create a field
-      await tester.createField(FieldType.Checkbox, 'New field 1');
-
-      // Delete the field
-      await tester.tapGridFieldWithName('New field 1');
-      await tester.tapDeletePropertyButton();
-
-      // confirm delete
-      await tester.tapDialogOkButton();
-
-      await tester.noFieldWithName('New field 1');
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('duplicate field', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // create a field
-      await tester.scrollToRight(find.byType(GridPage));
-      await tester.tapNewPropertyButton();
-      await tester.renameField('New field 1');
-      await tester.dismissFieldEditor();
-
-      // Delete the field
-      await tester.tapGridFieldWithName('New field 1');
-      await tester.tapDuplicatePropertyButton();
-
-      await tester.findFieldWithName('New field 1 (copy)');
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('create checklist field ', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      await tester.scrollToRight(find.byType(GridPage));
-      await tester.tapNewPropertyButton();
-
-      // Open the type option menu
-      await tester.tapTypeOptionButton();
-
-      await tester.selectFieldType(FieldType.Checklist);
-
-      // After update the field type, the cells should be updated
-      await tester.findCellByFieldType(FieldType.Checklist);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('create list of fields', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      for (final fieldType in [
-        FieldType.Checklist,
-        FieldType.DateTime,
-        FieldType.Number,
-        FieldType.URL,
-        FieldType.MultiSelect,
-        FieldType.LastEditedTime,
-        FieldType.CreatedTime,
-        FieldType.Checkbox,
-      ]) {
-        await tester.scrollToRight(find.byType(GridPage));
-        await tester.tapNewPropertyButton();
-        await tester.renameField(fieldType.name);
-
-        // Open the type option menu
-        await tester.tapTypeOptionButton();
-
-        await tester.selectFieldType(fieldType);
-        await tester.dismissFieldEditor();
-
-        // After update the field type, the cells should be updated
-        await tester.findCellByFieldType(fieldType);
-        await tester.pumpAndSettle();
-      }
-    });
-
-    testWidgets('add option', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Grid,
-      );
-
-      // Invoke the field editor
-      await tester.tapGridFieldWithName('Type');
-      await tester.tapEditPropertyButton();
-
-      // tap 'add option' button
-      await tester.tapAddSelectOptionButton();
-      const text = 'Hello AppFlowy';
-      final inputField = find.descendant(
-        of: find.byType(CreateOptionTextField),
-        matching: find.byType(TextField),
-      );
-      await tester.enterText(inputField, text);
-      await tester.pumpAndSettle();
-      await tester.testTextInput.receiveAction(TextInputAction.done);
-      await tester.pumpAndSettle(const Duration(seconds: 1));
-
-      // check the result
-      tester.expectToSeeText(text);
-    });
-  });
-}
@@ -1,268 +0,0 @@
-import 'package:appflowy_backend/protobuf/flowy-database2/field_entities.pbenum.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-
-import 'util/database_test_op.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('grid', () {
-    testWidgets('add text sort', (tester) async {
-      await tester.openV020database();
-      // create a sort
-      await tester.tapDatabaseSortButton();
-      await tester.tapCreateSortByFieldType(FieldType.RichText, 'Name');
-
-      // check the text cell order
-      final textCells = <String>[
-        'A',
-        'B',
-        'C',
-        'D',
-        'E',
-        '',
-        '',
-        '',
-        '',
-        '',
-      ];
-      for (final (index, content) in textCells.indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.RichText,
-          content: content,
-        );
-      }
-
-      // open the sort menu and select order by descending
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapSortButtonByName('Name');
-      await tester.tapSortByDescending();
-      for (final (index, content) in <String>[
-        'E',
-        'D',
-        'C',
-        'B',
-        'A',
-        '',
-        '',
-        '',
-        '',
-        '',
-      ].indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.RichText,
-          content: content,
-        );
-      }
-
-      // delete all sorts
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapAllSortButton();
-
-      // check the text cell order
-      for (final (index, content) in <String>[
-        'A',
-        'B',
-        'C',
-        'D',
-        'E',
-        '',
-        '',
-        '',
-        '',
-        '',
-      ].indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.RichText,
-          content: content,
-        );
-      }
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('add checkbox sort', (tester) async {
-      await tester.openV020database();
-      // create a filter
-      await tester.tapDatabaseSortButton();
-      await tester.tapCreateSortByFieldType(FieldType.Checkbox, 'Done');
-
-      // check the checkbox cell order
-      for (final (index, content) in <bool>[
-        false,
-        false,
-        false,
-        false,
-        false,
-        true,
-        true,
-        true,
-        true,
-        true,
-      ].indexed) {
-        await tester.assertCheckboxCell(
-          rowIndex: index,
-          isSelected: content,
-        );
-      }
-
-      // open the sort menu and select order by descending
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapSortButtonByName('Done');
-      await tester.tapSortByDescending();
-      for (final (index, content) in <bool>[
-        true,
-        true,
-        true,
-        true,
-        true,
-        false,
-        false,
-        false,
-        false,
-        false,
-      ].indexed) {
-        await tester.assertCheckboxCell(
-          rowIndex: index,
-          isSelected: content,
-        );
-      }
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('add number sort', (tester) async {
-      await tester.openV020database();
-      // create a filter
-      await tester.tapDatabaseSortButton();
-      await tester.tapCreateSortByFieldType(FieldType.Number, 'number');
-
-      // check the number cell order
-      for (final (index, content) in <String>[
-        '-2',
-        '-1',
-        '0.1',
-        '0.2',
-        '1',
-        '2',
-        '10',
-        '11',
-        '12',
-        '',
-      ].indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.Number,
-          content: content,
-        );
-      }
-
-      // open the sort menu and select order by descending
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapSortButtonByName('number');
-      await tester.tapSortByDescending();
-      for (final (index, content) in <String>[
-        '12',
-        '11',
-        '10',
-        '2',
-        '1',
-        '0.2',
-        '0.1',
-        '-1',
-        '-2',
-        '',
-      ].indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.Number,
-          content: content,
-        );
-      }
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('add checkbox and number sort', (tester) async {
-      await tester.openV020database();
-      // create a filter
-      await tester.tapDatabaseSortButton();
-      await tester.tapCreateSortByFieldType(FieldType.Checkbox, 'Done');
-
-      // open the sort menu and sort checkbox by descending
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapSortButtonByName('Done');
-      await tester.tapSortByDescending();
-      for (final (index, content) in <bool>[
-        true,
-        true,
-        true,
-        true,
-        true,
-        false,
-        false,
-        false,
-        false,
-        false,
-      ].indexed) {
-        await tester.assertCheckboxCell(
-          rowIndex: index,
-          isSelected: content,
-        );
-      }
-
-      // add another sort, this time by number descending
-      await tester.tapSortMenuInSettingBar();
-      await tester.tapCreateSortByFieldTypeInSortMenu(
-        FieldType.Number,
-        'number',
-      );
-      await tester.tapSortButtonByName('number');
-      await tester.tapSortByDescending();
-
-      // check checkbox cell order
-      for (final (index, content) in <bool>[
-        true,
-        true,
-        true,
-        true,
-        true,
-        false,
-        false,
-        false,
-        false,
-        false,
-      ].indexed) {
-        await tester.assertCheckboxCell(
-          rowIndex: index,
-          isSelected: content,
-        );
-      }
-
-      // check number cell order
-      for (final (index, content) in <String>[
-        '1',
-        '0.2',
-        '0.1',
-        '-1',
-        '-2',
-        '12',
-        '11',
-        '10',
-        '2',
-        '',
-      ].indexed) {
-        await tester.assertCellContent(
-          rowIndex: index,
-          fieldType: FieldType.Number,
-          content: content,
-        );
-      }
-
-      await tester.pumpAndSettle();
-    });
-  });
-}
@@ -1,78 +0,0 @@
-import 'package:appflowy/plugins/database_view/tar_bar/tar_bar_add_button.dart';
-import 'package:appflowy_backend/protobuf/flowy-database2/setting_entities.pbenum.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
-import 'package:flutter_test/flutter_test.dart';
-import 'package:integration_test/integration_test.dart';
-
-import 'util/database_test_op.dart';
-import 'util/util.dart';
-
-void main() {
-  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
-
-  group('database', () {
-    testWidgets('create linked view', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Create board view
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.board);
-      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
-
-      // Create grid view
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.grid);
-      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Grid);
-
-      // Create calendar view
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.calendar);
-      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Calendar);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('rename and delete linked view', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Create board view
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.board);
-      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
-
-      // rename board view
-      await tester.renameLinkedView(
-        tester.findTabBarLinkViewByViewLayout(ViewLayoutPB.Board),
-        'new board',
-      );
-      final findBoard = tester.findTabBarLinkViewByViewName('new board');
-      expect(findBoard, findsOneWidget);
-
-      // delete the board
-      await tester.deleteDatebaseView(findBoard);
-      expect(tester.findTabBarLinkViewByViewName('new board'), findsNothing);
-
-      await tester.pumpAndSettle();
-    });
-
-    testWidgets('delete the last database view', (tester) async {
-      await tester.initializeAppFlowy();
-      await tester.tapGoButton();
-
-      await tester.createNewPageWithName(layout: ViewLayoutPB.Grid);
-
-      // Create board view
-      await tester.tapCreateLinkedDatabaseViewButton(AddButtonAction.board);
-      tester.assertCurrentDatabaseTagIs(DatabaseLayoutPB.Board);
-
-      // delete the board
-      await tester.deleteDatebaseView(
-        tester.findTabBarLinkViewByViewLayout(ViewLayoutPB.Board),
-      );
-
-      await tester.pumpAndSettle();
-    });
-  });
-}
@@ -1,8 +1,11 @@
 import 'package:appflowy/generated/flowy_svgs.g.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/plugins.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

+import '../util/keyboard.dart';
 import '../util/util.dart';

 void main() {
@@ -42,5 +45,51 @@ void main() {
      await tester.tapButtonWithFlowySvgData(FlowySvgs.toolbar_align_left_s);
      expect(first.attributes[blockComponentAlign], 'left');
    });
+
+    testWidgets('edit alignment using shortcut', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      // click the first line of the readme
+      await tester.editor.tapLineOfEditorAt(0);
+
+      await tester.pumpAndSettle();
+
+      final editorState = tester.editor.getCurrentEditorState();
+      final first = editorState.getNodeAtPath([0])!;
+
+      // expect to see text aligned to the right
+      await FlowyTestKeyboard.simulateKeyDownEvent(
+        [
+          LogicalKeyboardKey.control,
+          LogicalKeyboardKey.shift,
+          LogicalKeyboardKey.keyR,
+        ],
+        tester: tester,
+      );
+      expect(first.attributes[blockComponentAlign], rightAlignmentKey);
+
+      // expect to see text aligned to the center
+      await FlowyTestKeyboard.simulateKeyDownEvent(
+        [
+          LogicalKeyboardKey.control,
+          LogicalKeyboardKey.shift,
+          LogicalKeyboardKey.keyE,
+        ],
+        tester: tester,
+      );
+      expect(first.attributes[blockComponentAlign], centerAlignmentKey);
+
+      // expect to see text aligned to the left
+      await FlowyTestKeyboard.simulateKeyDownEvent(
+        [
+          LogicalKeyboardKey.control,
+          LogicalKeyboardKey.shift,
+          LogicalKeyboardKey.keyL,
+        ],
+        tester: tester,
+      );
+      expect(first.attributes[blockComponentAlign], leftAlignmentKey);
+    });
  });
 }
@@ -18,7 +18,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName();
+      await tester.createNewPageWithNameUnderParent();

      // mock the clipboard
      const lines = 3;
@@ -3,6 +3,7 @@ import 'dart:io';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/copy_and_paste/clipboard_service.dart';
 import 'package:appflowy/startup/startup.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
+import 'package:appflowy_editor_plugins/appflowy_editor_plugins.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';
@@ -219,7 +220,7 @@ void main() {
          expect(node.delta!.toJson(), [
            {
              'insert': text,
-              'attributes': {'href': url}
+              'attributes': {'href': url},
            }
          ]);
        },
@@ -276,6 +277,22 @@ void main() {
      },
    );
  });
+
+  testWidgets(
+    'auto convert url to link preview block',
+    (widgetTester) async {
+      const url = 'https://appflowy.io';
+      await widgetTester.pasteContent(
+        plainText: url,
+        (editorState) {
+          expect(editorState.document.root.children.length, 2);
+          final node = editorState.getNodeAtPath([0])!;
+          expect(node.type, LinkPreviewBlockKeys.type);
+          expect(node.attributes[LinkPreviewBlockKeys.url], url);
+        },
+      );
+    },
+  );
 }

 extension on WidgetTester {
@@ -290,7 +307,7 @@ extension on WidgetTester {
    await tapGoButton();

    // create a new document
-    await createNewPageWithName();
+    await createNewPageWithNameUnderParent();

    await beforeTest?.call(editor.getCurrentEditorState());

@@ -17,14 +17,14 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName();
+      await tester.createNewPageWithNameUnderParent();

      // expect to see a new document
      tester.expectToSeePageName(
        LocaleKeys.menuAppHeader_defaultNewPageName.tr(),
      );
      // and with one paragraph block
-      expect(find.byType(TextBlockComponentWidget), findsOneWidget);
+      expect(find.byType(ParagraphBlockComponentWidget), findsOneWidget);
    });

    testWidgets('delete the readme page and restore it', (tester) async {
@@ -35,7 +35,7 @@ void main() {
      // delete the readme page
      await tester.hoverOnPageName(
        gettingStarted,
-        onHover: () async => await tester.tapDeletePageButton(),
+        onHover: () async => tester.tapDeletePageButton(),
      );

      // the banner should show up and the readme page should be gone
@@ -59,7 +59,7 @@ void main() {
      // delete the readme page
      await tester.hoverOnPageName(
        gettingStarted,
-        onHover: () async => await tester.tapDeletePageButton(),
+        onHover: () async => tester.tapDeletePageButton(),
      );

      // the banner should show up and the readme page should be gone
@@ -0,0 +1,135 @@
+import 'package:flutter/services.dart';
+
+import 'package:appflowy/plugins/document/presentation/editor_plugins/mention/mention_page_block.dart';
+import 'package:appflowy/plugins/inline_actions/widgets/inline_actions_handler.dart';
+import 'package:appflowy/workspace/presentation/home/menu/view/view_item.dart';
+import 'package:flowy_infra/uuid.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/keyboard.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('insert inline document reference', () {
+    testWidgets('insert by slash menu', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      final name = await createDocumentToReference(tester);
+
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.pumpAndSettle();
+
+      await triggerReferenceDocumentBySlashMenu(tester);
+
+      // Search for prefix of document
+      await enterDocumentText(tester);
+
+      // Select result
+      final optionFinder = find.descendant(
+        of: find.byType(InlineActionsHandler),
+        matching: find.text(name),
+      );
+
+      await tester.tap(optionFinder);
+      await tester.pumpAndSettle();
+
+      final mentionBlock = find.byType(MentionPageBlock);
+      expect(mentionBlock, findsOneWidget);
+    });
+
+    testWidgets('insert by `[[` character shortcut', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      final name = await createDocumentToReference(tester);
+
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.pumpAndSettle();
+
+      await tester.ime.insertText('[[');
+      await tester.pumpAndSettle();
+
+      // Select result
+      await tester.editor.tapAtMenuItemWithName(name);
+      await tester.pumpAndSettle();
+
+      final mentionBlock = find.byType(MentionPageBlock);
+      expect(mentionBlock, findsOneWidget);
+    });
+
+    testWidgets('insert by `+` character shortcut', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      final name = await createDocumentToReference(tester);
+
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.pumpAndSettle();
+
+      await tester.ime.insertText('+');
+      await tester.pumpAndSettle();
+
+      // Select result
+      await tester.editor.tapAtMenuItemWithName(name);
+      await tester.pumpAndSettle();
+
+      final mentionBlock = find.byType(MentionPageBlock);
+      expect(mentionBlock, findsOneWidget);
+    });
+  });
+}
+
+Future<String> createDocumentToReference(WidgetTester tester) async {
+  final name = 'document_${uuid()}';
+
+  await tester.createNewPageWithNameUnderParent(
+    name: name,
+    openAfterCreated: false,
+  );
+
+  // This is a workaround since the openAfterCreated
+  //  option does not work in createNewPageWithName method
+  await tester.tap(find.byType(SingleInnerViewItem).first);
+  await tester.pumpAndSettle();
+
+  return name;
+}
+
+Future<void> triggerReferenceDocumentBySlashMenu(WidgetTester tester) async {
+  await tester.editor.showSlashMenu();
+  await tester.pumpAndSettle();
+
+  // Search for referenced document action
+  await enterDocumentText(tester);
+
+  // Select item
+  await FlowyTestKeyboard.simulateKeyDownEvent(
+    [
+      LogicalKeyboardKey.enter,
+    ],
+    tester: tester,
+  );
+
+  await tester.pumpAndSettle();
+}
+
+Future<void> enterDocumentText(WidgetTester tester) async {
+  await FlowyTestKeyboard.simulateKeyDownEvent(
+    [
+      LogicalKeyboardKey.keyD,
+      LogicalKeyboardKey.keyO,
+      LogicalKeyboardKey.keyC,
+      LogicalKeyboardKey.keyU,
+      LogicalKeyboardKey.keyM,
+      LogicalKeyboardKey.keyE,
+      LogicalKeyboardKey.keyN,
+      LogicalKeyboardKey.keyT,
+    ],
+    tester: tester,
+  );
+  await tester.pumpAndSettle();
+}
@@ -32,7 +32,7 @@ void main() {
      await tester.tapAt(Offset.zero);
      await tester.tapAt(Offset.zero);

-      await tester.createNewPageWithName(name: 'test');
+      await tester.createNewPageWithNameUnderParent(name: 'test');
      await tester.openPage(gettingStarted);

      // check the status again
@@ -9,12 +9,15 @@ import 'document_option_action_test.dart' as document_option_action_test;
 import 'document_text_direction_test.dart' as document_text_direction_test;
 import 'document_with_cover_image_test.dart' as document_with_cover_image_test;
 import 'document_with_database_test.dart' as document_with_database_test;
+import 'document_with_image_block_test.dart' as document_with_image_block_test;
 import 'document_with_inline_math_equation_test.dart'
    as document_with_inline_math_equation_test;
 import 'document_with_inline_page_test.dart' as document_with_inline_page_test;
 import 'document_with_outline_block_test.dart' as document_with_outline_block;
 import 'document_with_toggle_list_test.dart' as document_with_toggle_list_test;
 import 'edit_document_test.dart' as document_edit_test;
+import 'document_inline_page_reference_test.dart'
+    as document_inline_page_reference_test;

 void startTesting() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
@@ -33,4 +36,6 @@ void startTesting() {
  document_alignment_test.main();
  document_text_direction_test.main();
  document_option_action_test.main();
+  document_with_image_block_test.main();
+  document_inline_page_reference_test.main();
 }
@@ -1,4 +1,4 @@
-import 'package:appflowy/workspace/application/appearance.dart';
+import 'package:appflowy/workspace/application/settings/appearance/appearance_cubit.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';
@@ -29,8 +29,8 @@ void main() {
      // because this icons are defined in the appflowy_editor package, we can't fetch the icons by SVG data. [textDirectionItems]
      final textDirectionIconNames = [
        'toolbar/text_direction_auto',
-        'toolbar/text_direction_left',
-        'toolbar/text_direction_right',
+        'toolbar/text_direction_ltr',
+        'toolbar/text_direction_rtl',
      ];
      // no text direction items in default/LTR mode
      var button = find.byWidgetPredicate(
@@ -1,4 +1,9 @@
+import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/header/document_header_node_widget.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_emoji_mart/flutter_emoji_mart.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';

@@ -17,7 +22,6 @@ void main() {

      // Hover over cover toolbar to show 'Add Cover' and 'Add Icon' buttons
      await tester.editor.hoverOnCoverToolbar();
-      tester.expectToSeePluginAddCoverAndIconButton();

      // Insert a document cover
      await tester.editor.tapOnAddCover();
@@ -39,8 +43,6 @@ void main() {
      await tester.editor.hoverOnCover();
      await tester.editor.tapOnChangeCover();
      await tester.editor.addNetworkImageCover(imageUrl);
-      await tester.editor.switchNetworkImageCover(imageUrl);
-      await tester.editor.dismissCoverPicker();
      tester.expectToSeeDocumentCover(CoverType.file);

      // Remove the cover
@@ -53,15 +55,10 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      tester.expectToSeeDocumentIcon(null);
-
-      // Hover over cover toolbar to show the 'Add Cover' and 'Add Icon' buttons
-      await tester.editor.hoverOnCoverToolbar();
-      tester.expectToSeePluginAddCoverAndIconButton();
+      tester.expectToSeeDocumentIcon('⭐️');

      // Insert a document icon
-      await tester.editor.tapAddIconButton();
-      await tester.switchToEmojiList();
+      await tester.editor.tapGettingStartedIcon();
      await tester.tapEmoji('😀');
      tester.expectToSeeDocumentIcon('😀');

@@ -73,13 +70,11 @@ void main() {
      // Add the icon back for further testing
      await tester.editor.hoverOnCoverToolbar();
      await tester.editor.tapAddIconButton();
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😀');
      tester.expectToSeeDocumentIcon('😀');

      // Change the document icon
      await tester.editor.tapOnIconWidget();
-      await tester.switchToEmojiList();
      await tester.tapEmoji('😅');
      tester.expectToSeeDocumentIcon('😅');

@@ -93,19 +88,15 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      tester.expectToSeeDocumentIcon(null);
+      tester.expectToSeeDocumentIcon('⭐️');
      tester.expectToSeeNoDocumentCover();

-      // Hover over cover toolbar to show the 'Add Cover' and 'Add Icon' buttons
-      await tester.editor.hoverOnCoverToolbar();
-      tester.expectToSeePluginAddCoverAndIconButton();
-
      // Insert a document icon
-      await tester.editor.tapAddIconButton();
-      await tester.switchToEmojiList();
+      await tester.editor.tapGettingStartedIcon();
      await tester.tapEmoji('😀');

      // Insert a document cover
+      await tester.editor.hoverOnCoverToolbar();
      await tester.editor.tapOnAddCover();

      // Expect to see the icon and cover at the same time
@@ -116,5 +107,48 @@ void main() {
      await tester.editor.hoverOnCoverToolbar();
      tester.expectToSeeEmptyDocumentHeaderToolbar();
    });
+
+    testWidgets('shuffle icon', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.editor.tapGettingStartedIcon();
+
+      // click the shuffle button
+      await tester.tapButton(
+        find.byTooltip(LocaleKeys.emoji_random.tr()),
+      );
+      tester.expectDocumentIconNotNull();
+    });
+
+    testWidgets('change skin tone', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.editor.tapGettingStartedIcon();
+
+      final searchEmojiTextField = find.byWidgetPredicate(
+        (widget) =>
+            widget is TextField &&
+            widget.decoration!.hintText == LocaleKeys.emoji_search.tr(),
+      );
+      await tester.enterText(
+        searchEmojiTextField,
+        'hand',
+      );
+
+      // change skin tone
+      await tester.editor.changeEmojiSkinTone(EmojiSkinTone.dark);
+
+      // select an icon with skin tone
+      const hand = '👋🏿';
+      await tester.tapEmoji(hand);
+      tester.expectToSeeDocumentIcon(hand);
+      tester.expectViewHasIcon(
+        gettingStarted,
+        ViewLayoutPB.Document,
+        hand,
+      );
+    });
  });
 }
@@ -1,11 +1,11 @@
 import 'package:appflowy/generated/locale_keys.g.dart';
-import 'package:appflowy/plugins/database_view/board/presentation/board_page.dart';
-import 'package:appflowy/plugins/database_view/calendar/presentation/calendar_page.dart';
-import 'package:appflowy/plugins/database_view/grid/presentation/grid_page.dart';
-import 'package:appflowy/plugins/database_view/widgets/row/cells/text_cell/text_cell.dart';
-import 'package:appflowy/plugins/document/presentation/editor_plugins/base/link_to_page_widget.dart';
+import 'package:appflowy/plugins/database/widgets/cell/editable_cell_skeleton/text.dart';
+import 'package:appflowy/plugins/inline_actions/widgets/inline_actions_handler.dart';
+import 'package:appflowy/plugins/database/board/presentation/board_page.dart';
+import 'package:appflowy/plugins/database/calendar/presentation/calendar_page.dart';
+import 'package:appflowy/plugins/database/grid/presentation/grid_page.dart';
 import 'package:appflowy/workspace/presentation/home/menu/view/view_item.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/protobuf.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra/uuid.dart';
@@ -40,7 +40,7 @@ void main() {
          Position(path: [1]),
        ),
      );
-      final gridTextCell = find.byType(GridTextCell).first;
+      final gridTextCell = find.byType(EditableTextCell).first;
      await tester.tapButton(gridTextCell);

      expect(tester.editor.getCurrentEditorState().selection, isNull);
@@ -84,7 +84,7 @@ void main() {

      await createInlineDatabase(tester, ViewLayoutPB.Grid);

-      // validate the referenced grid is inserted
+      // validate the inline grid is created
      expect(
        find.descendant(
          of: find.byType(AppFlowyEditor),
@@ -100,7 +100,7 @@ void main() {

      await createInlineDatabase(tester, ViewLayoutPB.Board);

-      // validate the referenced grid is inserted
+      // validate the inline board is created
      expect(
        find.descendant(
          of: find.byType(AppFlowyEditor),
@@ -116,7 +116,7 @@ void main() {

      await createInlineDatabase(tester, ViewLayoutPB.Calendar);

-      // validate the referenced grid is inserted
+      // validate the inline calendar is created
      expect(
        find.descendant(
          of: find.byType(AppFlowyEditor),
@@ -136,16 +136,14 @@ Future<void> insertReferenceDatabase(
  // create a new grid
  final id = uuid();
  final name = '${layout.name}_$id';
-  await tester.createNewPageWithName(
+  await tester.createNewPageWithNameUnderParent(
    name: name,
    layout: layout,
    openAfterCreated: false,
  );
  // create a new document
-  await tester.createNewPageWithName(
+  await tester.createNewPageWithNameUnderParent(
    name: 'insert_a_reference_${layout.name}',
-    layout: ViewLayoutPB.Document,
-    openAfterCreated: true,
  );
  // tap the first line of the document
  await tester.editor.tapLineOfEditorAt(0);
@@ -155,7 +153,7 @@ Future<void> insertReferenceDatabase(
    layout.referencedMenuName,
  );

-  final linkToPageMenu = find.byType(LinkToPageMenu);
+  final linkToPageMenu = find.byType(InlineActionsHandler);
  expect(linkToPageMenu, findsOneWidget);
  final referencedDatabase = find.descendant(
    of: linkToPageMenu,
@@ -171,10 +169,8 @@ Future<void> createInlineDatabase(
 ) async {
  // create a new document
  final documentName = 'insert_a_inline_${layout.name}';
-  await tester.createNewPageWithName(
+  await tester.createNewPageWithNameUnderParent(
    name: documentName,
-    layout: ViewLayoutPB.Document,
-    openAfterCreated: true,
  );
  // tap the first line of the document
  await tester.editor.tapLineOfEditorAt(0);
@@ -0,0 +1,165 @@
+import 'dart:io';
+
+import 'package:appflowy/core/config/kv.dart';
+import 'package:appflowy/core/config/kv_keys.dart';
+import 'package:appflowy/generated/locale_keys.g.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/custom_image_block_component.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/embed_image_url_widget.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/image_placeholder.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/resizeable_image.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/unsplash_image_widget.dart';
+import 'package:appflowy/plugins/document/presentation/editor_plugins/image/upload_image_menu.dart';
+import 'package:appflowy/startup/startup.dart';
+import 'package:appflowy_editor/appflowy_editor.dart'
+    hide UploadImageMenu, ResizableImage;
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flowy_infra_ui/flowy_infra_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import 'package:path/path.dart' as p;
+import 'package:path_provider/path_provider.dart';
+import 'package:run_with_network_images/run_with_network_images.dart';
+
+import '../util/mock/mock_file_picker.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+  TestWidgetsFlutterBinding.ensureInitialized();
+
+  group('image block in document', () {
+    testWidgets('insert an image from local file', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      // create a new document
+      await tester.createNewPageWithNameUnderParent(
+        name: LocaleKeys.document_plugins_image_addAnImage.tr(),
+      );
+
+      // tap the first line of the document
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.editor.showSlashMenu();
+      await tester.editor.tapSlashMenuItemWithName('Image');
+      expect(find.byType(CustomImageBlockComponent), findsOneWidget);
+      expect(find.byType(ImagePlaceholder), findsOneWidget);
+      expect(
+        find.descendant(
+          of: find.byType(ImagePlaceholder),
+          matching: find.byType(AppFlowyPopover),
+        ),
+        findsOneWidget,
+      );
+      expect(find.byType(UploadImageMenu), findsOneWidget);
+
+      final image = await rootBundle.load('assets/test/images/sample.jpeg');
+      final tempDirectory = await getTemporaryDirectory();
+      final imagePath = p.join(tempDirectory.path, 'sample.jpeg');
+      final file = File(imagePath)
+        ..writeAsBytesSync(image.buffer.asUint8List());
+
+      mockPickFilePaths(
+        paths: [imagePath],
+      );
+
+      await getIt<KeyValueStorage>().set(KVKeys.kCloudType, '0');
+      await tester.tapButtonWithName(
+        LocaleKeys.document_imageBlock_upload_placeholder.tr(),
+      );
+      await tester.pumpAndSettle();
+      expect(find.byType(ResizableImage), findsOneWidget);
+      final node = tester.editor.getCurrentEditorState().getNodeAtPath([0])!;
+      expect(node.type, ImageBlockKeys.type);
+      expect(node.attributes[ImageBlockKeys.url], isNotEmpty);
+
+      // remove the temp file
+      file.deleteSync();
+    });
+
+    testWidgets('insert an image from network', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      // create a new document
+      await tester.createNewPageWithNameUnderParent(
+        name: LocaleKeys.document_plugins_image_addAnImage.tr(),
+      );
+
+      // tap the first line of the document
+      await tester.editor.tapLineOfEditorAt(0);
+      await tester.editor.showSlashMenu();
+      await tester.editor.tapSlashMenuItemWithName('Image');
+      expect(find.byType(CustomImageBlockComponent), findsOneWidget);
+      expect(find.byType(ImagePlaceholder), findsOneWidget);
+      expect(
+        find.descendant(
+          of: find.byType(ImagePlaceholder),
+          matching: find.byType(AppFlowyPopover),
+        ),
+        findsOneWidget,
+      );
+      expect(find.byType(UploadImageMenu), findsOneWidget);
+
+      await tester.tapButtonWithName(
+        LocaleKeys.document_imageBlock_embedLink_label.tr(),
+      );
+      const url =
+          'https://images.unsplash.com/photo-1469474968028-56623f02e42e?ixlib=rb-4.0.3&q=85&fm=jpg&crop=entropy&cs=srgb&dl=david-marcu-78A265wPiO4-unsplash.jpg&w=640';
+      await tester.enterText(
+        find.descendant(
+          of: find.byType(EmbedImageUrlWidget),
+          matching: find.byType(TextField),
+        ),
+        url,
+      );
+      await tester.tapButton(
+        find.descendant(
+          of: find.byType(EmbedImageUrlWidget),
+          matching: find.text(
+            LocaleKeys.document_imageBlock_embedLink_label.tr(),
+            findRichText: true,
+          ),
+        ),
+      );
+      await tester.pumpAndSettle();
+      expect(find.byType(ResizableImage), findsOneWidget);
+      final node = tester.editor.getCurrentEditorState().getNodeAtPath([0])!;
+      expect(node.type, ImageBlockKeys.type);
+      expect(node.attributes[ImageBlockKeys.url], url);
+    });
+
+    testWidgets('insert an image from unsplash', (tester) async {
+      await runWithNetworkImages(() async {
+        await tester.initializeAppFlowy();
+        await tester.tapGoButton();
+
+        // create a new document
+        await tester.createNewPageWithNameUnderParent(
+          name: LocaleKeys.document_plugins_image_addAnImage.tr(),
+        );
+
+        // tap the first line of the document
+        await tester.editor.tapLineOfEditorAt(0);
+        await tester.editor.showSlashMenu();
+        await tester.editor.tapSlashMenuItemWithName('Image');
+        expect(find.byType(CustomImageBlockComponent), findsOneWidget);
+        expect(find.byType(ImagePlaceholder), findsOneWidget);
+        expect(
+          find.descendant(
+            of: find.byType(ImagePlaceholder),
+            matching: find.byType(AppFlowyPopover),
+          ),
+          findsOneWidget,
+        );
+        expect(find.byType(UploadImageMenu), findsOneWidget);
+
+        await tester.tapButtonWithName(
+          'Unsplash',
+        );
+        expect(find.byType(UnsplashImageWidget), findsOneWidget);
+      });
+    });
+  });
+}
@@ -1,6 +1,5 @@
 import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/plugins.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flowy_infra_ui/style_widget/button.dart';
@@ -20,9 +19,8 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        name: LocaleKeys.document_plugins_createInlineMathEquation.tr(),
-        layout: ViewLayoutPB.Document,
+      await tester.createNewPageWithNameUnderParent(
+        name: 'math equation',
      );

      // tap the first line of the document
@@ -66,9 +64,8 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        name: LocaleKeys.document_plugins_createInlineMathEquation.tr(),
-        layout: ViewLayoutPB.Document,
+      await tester.createNewPageWithNameUnderParent(
+        name: 'math equation',
      );

      // tap the first line of the document
@@ -1,5 +1,5 @@
 import 'package:appflowy/plugins/document/presentation/editor_plugins/mention/mention_page_block.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/protobuf.dart';
 import 'package:flowy_infra/uuid.dart';
 import 'package:flowy_infra_ui/widget/error_page.dart';
 import 'package:flutter_test/flutter_test.dart';
@@ -15,7 +15,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await insertingInlinePage(tester, ViewLayoutPB.Grid);
+      await insertInlinePage(tester, ViewLayoutPB.Grid);

      final mentionBlock = find.byType(MentionPageBlock);
      expect(mentionBlock, findsOneWidget);
@@ -26,7 +26,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await insertingInlinePage(tester, ViewLayoutPB.Board);
+      await insertInlinePage(tester, ViewLayoutPB.Board);

      final mentionBlock = find.byType(MentionPageBlock);
      expect(mentionBlock, findsOneWidget);
@@ -37,7 +37,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await insertingInlinePage(tester, ViewLayoutPB.Calendar);
+      await insertInlinePage(tester, ViewLayoutPB.Calendar);

      final mentionBlock = find.byType(MentionPageBlock);
      expect(mentionBlock, findsOneWidget);
@@ -48,7 +48,7 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await insertingInlinePage(tester, ViewLayoutPB.Document);
+      await insertInlinePage(tester, ViewLayoutPB.Document);

      final mentionBlock = find.byType(MentionPageBlock);
      expect(mentionBlock, findsOneWidget);
@@ -59,13 +59,13 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      final pageName = await insertingInlinePage(tester, ViewLayoutPB.Document);
+      final pageName = await insertInlinePage(tester, ViewLayoutPB.Document);

      // rename
      const newName = 'RenameToNewPageName';
      await tester.hoverOnPageName(
        pageName,
-        onHover: () async => await tester.renamePage(newName),
+        onHover: () async => tester.renamePage(newName),
      );
      final finder = find.descendant(
        of: find.byType(MentionPageBlock),
@@ -78,13 +78,13 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      final pageName = await insertingInlinePage(tester, ViewLayoutPB.Grid);
+      final pageName = await insertInlinePage(tester, ViewLayoutPB.Grid);

      // rename
      await tester.hoverOnPageName(
        pageName,
        layout: ViewLayoutPB.Grid,
-        onHover: () async => await tester.tapDeletePageButton(),
+        onHover: () async => tester.tapDeletePageButton(),
      );
      final finder = find.descendant(
        of: find.byType(MentionPageBlock),
@@ -98,27 +98,30 @@ void main() {
 }

 /// Insert a referenced database of [layout] into the document
-Future<String> insertingInlinePage(
+Future<String> insertInlinePage(
  WidgetTester tester,
  ViewLayoutPB layout,
 ) async {
  // create a new grid
  final id = uuid();
  final name = '${layout.name}_$id';
-  await tester.createNewPageWithName(
+  await tester.createNewPageWithNameUnderParent(
    name: name,
    layout: layout,
    openAfterCreated: false,
  );
+
  // create a new document
-  await tester.createNewPageWithName(
+  await tester.createNewPageWithNameUnderParent(
    name: 'insert_a_inline_page_${layout.name}',
-    layout: ViewLayoutPB.Document,
  );
+
  // tap the first line of the document
  await tester.editor.tapLineOfEditorAt(0);
+
  // insert a inline page
  await tester.editor.showAtMenu();
  await tester.editor.tapAtMenuItemWithName(name);
+
  return name;
 }
@@ -1,4 +1,3 @@
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
@@ -24,9 +23,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -1,6 +1,5 @@
 import 'package:appflowy/generated/locale_keys.g.dart';
 import 'package:appflowy/plugins/document/presentation/editor_plugins/outline/outline_block_component.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:integration_test/integration_test.dart';
@@ -15,9 +14,8 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(
+      await tester.createNewPageWithNameUnderParent(
        name: 'outline_test',
-        layout: ViewLayoutPB.Document,
      );

      await tester.editor.tapLineOfEditorAt(0);
@@ -32,9 +30,8 @@ void main() {
      await tester.initializeAppFlowy();
      await tester.tapGoButton();

-      await tester.createNewPageWithName(
+      await tester.createNewPageWithNameUnderParent(
        name: 'outline_test',
-        layout: ViewLayoutPB.Document,
      );
      await tester.editor.tapLineOfEditorAt(0);

@@ -1,7 +1,6 @@
 import 'dart:io';

 import 'package:appflowy/plugins/document/presentation/editor_plugins/plugins.dart';
-import 'package:appflowy_backend/protobuf/flowy-folder2/protobuf.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
@@ -15,14 +14,23 @@ void main() {
  TestWidgetsFlutterBinding.ensureInitialized();

  group('toggle list in document', () {
+    Finder findToggleListIcon({
+      required bool isExpanded,
+    }) {
+      final turns = isExpanded ? 0.25 : 0.0;
+      return find.byWidgetPredicate(
+        (widget) => widget is AnimatedRotation && widget.turns == turns,
+      );
+    }
+
    void expectToggleListOpened() {
-      expect(find.byIcon(Icons.arrow_drop_down), findsOneWidget);
-      expect(find.byIcon(Icons.arrow_right), findsNothing);
+      expect(findToggleListIcon(isExpanded: true), findsOneWidget);
+      expect(findToggleListIcon(isExpanded: false), findsNothing);
    }

    void expectToggleListClosed() {
-      expect(find.byIcon(Icons.arrow_drop_down), findsNothing);
-      expect(find.byIcon(Icons.arrow_right), findsOneWidget);
+      expect(findToggleListIcon(isExpanded: false), findsOneWidget);
+      expect(findToggleListIcon(isExpanded: true), findsNothing);
    }

    testWidgets('convert > to toggle list, and click the icon to close it',
@@ -31,9 +39,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -63,7 +69,7 @@ void main() {
      expect(find.text(text2, findRichText: true), findsOneWidget);

      // Click the toggle list icon to close it
-      final toggleListIcon = find.byIcon(Icons.arrow_drop_down);
+      final toggleListIcon = find.byIcon(Icons.arrow_right);
      await tester.tapButton(toggleListIcon);

      // expect the toggle list to be closed
@@ -77,9 +83,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -88,7 +92,7 @@ void main() {
      await tester.ime.insertText('> $text');

      // Click the toggle list icon to close it
-      final toggleListIcon = find.byIcon(Icons.arrow_drop_down);
+      final toggleListIcon = find.byIcon(Icons.arrow_right);
      await tester.tapButton(toggleListIcon);

      // Press the enter key
@@ -116,9 +120,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -153,9 +155,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -164,14 +164,11 @@ void main() {

      // Press the enter key
      // Click the toggle list icon to close it
-      final toggleListIcon = find.byIcon(Icons.arrow_drop_down);
+      final toggleListIcon = find.byIcon(Icons.arrow_right);
      await tester.tapButton(toggleListIcon);

-      await tester.editor.updateSelection(
-        Selection.collapsed(
-          Position(path: [0], offset: 0),
-        ),
-      );
+      await tester.editor
+          .updateSelection(Selection.collapsed(Position(path: [0])));
      await tester.ime.insertCharacter('\n');

      final editorState = tester.editor.getCurrentEditorState();
@@ -187,9 +184,7 @@ void main() {
      await tester.tapGoButton();

      // create a new document
-      await tester.createNewPageWithName(
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent();

      // tap the first line of the document
      await tester.editor.tapLineOfEditorAt(0);
@@ -200,7 +195,7 @@ void main() {

      await tester.editor.updateSelection(
        Selection.collapsed(
-          Position(path: [0], offset: 0),
+          Position(path: [0]),
        ),
      );
      await tester.simulateKeyEvent(
@@ -1,6 +1,5 @@
 import 'dart:io';

-import 'package:appflowy_backend/protobuf/flowy-folder2/view.pb.dart';
 import 'package:appflowy_editor/appflowy_editor.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_test/flutter_test.dart';
@@ -18,10 +17,7 @@ void main() {

      // create a new document called Sample
      const pageName = 'Sample';
-      await tester.createNewPageWithName(
-        name: pageName,
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent(name: pageName);

      // focus on the editor
      await tester.editor.tapLineOfEditorAt(0);
@@ -75,10 +71,7 @@ void main() {

      // create a new document called Sample
      const pageName = 'Sample';
-      await tester.createNewPageWithName(
-        name: pageName,
-        layout: ViewLayoutPB.Document,
-      );
+      await tester.createNewPageWithNameUnderParent(name: pageName);

      // focus on the editor
      await tester.editor.tapLineOfEditorAt(0);
@@ -104,7 +97,7 @@ void main() {
  });
 }

-const _sample = r'''
+const _sample = '''
 # Heading 1
 ## Heading 2
 ### Heading 3
@@ -113,9 +106,9 @@ const _sample = r'''

 [] Type followed by bullet or num to create a list.

-[x] Click `+ New Page` button at the bottom of your sidebar to add a new page.
+[x] Click `New Page` button at the bottom of your sidebar to add a new page.

-[] Click `+` next to any page title in the sidebar to quickly add a new subpage, `Document`, `Grid`, or `Kanban Board`.
+[] Click the plus sign next to any page title in the sidebar to quickly add a new subpage, `Document`, `Grid`, or `Kanban Board`.
 ---
 * bulleted list 1

@@ -28,8 +28,8 @@ void main() {
  const service = TestWorkspaceService(TestWorkspace.emptyDocument);

  group('Tests on a workspace with only an empty document', () {
-    setUpAll(() async => await service.setUpAll());
-    setUp(() async => await service.setUp());
+    setUpAll(() async => service.setUpAll());
+    setUp(() async => service.setUp());

    testWidgets('/board shortcut creates a new board and view of the board',
        (tester) async {
@@ -0,0 +1,16 @@
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import 'util/util.dart';
+
+// This test is meaningless, just for preventing the CI from failing.
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('Empty', () {
+    testWidgets('toggle theme mode', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+    });
+  });
+}
@@ -0,0 +1,107 @@
+import 'package:appflowy_backend/protobuf/flowy-database2/protobuf.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pbenum.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+
+import '../util/database_test_op.dart';
+import '../util/util.dart';
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  group('Grid Calculations', () {
+    testWidgets('add calculation and update cell', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Change one Field to Number
+      await tester.changeFieldTypeOfFieldWithName('Type', FieldType.Number);
+
+      expect(find.text('Calculate'), findsOneWidget);
+
+      await tester.changeCalculateAtIndex(1, CalculationType.Sum);
+
+      // Enter values in cells
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        input: '100',
+      );
+
+      await tester.editCell(
+        rowIndex: 1,
+        fieldType: FieldType.Number,
+        input: '100',
+      );
+
+      // Dismiss edit cell
+      await tester.sendKeyDownEvent(LogicalKeyboardKey.enter);
+
+      await tester.pumpAndSettle(const Duration(seconds: 1));
+
+      expect(find.text('200'), findsOneWidget);
+    });
+
+    testWidgets('add calculations and remove row', (tester) async {
+      await tester.initializeAppFlowy();
+      await tester.tapGoButton();
+
+      await tester.createNewPageWithNameUnderParent(layout: ViewLayoutPB.Grid);
+
+      // Change two Fields to Number
+      await tester.changeFieldTypeOfFieldWithName('Type', FieldType.Number);
+      await tester.changeFieldTypeOfFieldWithName('Done', FieldType.Number);
+
+      expect(find.text('Calculate'), findsNWidgets(2));
+
+      await tester.changeCalculateAtIndex(1, CalculationType.Sum);
+      await tester.changeCalculateAtIndex(2, CalculationType.Min);
+
+      // Enter values in cells
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        input: '100',
+      );
+      await tester.editCell(
+        rowIndex: 1,
+        fieldType: FieldType.Number,
+        input: '150',
+      );
+      await tester.editCell(
+        rowIndex: 0,
+        fieldType: FieldType.Number,
+        input: '50',
+        cellIndex: 1,
+      );
+      await tester.editCell(
+        rowIndex: 1,
+        fieldType: FieldType.Number,
+        input: '100',
+        cellIndex: 1,
+      );
+
+      await tester.pumpAndSettle();
+
+      // Dismiss edit cell
+      await tester.sendKeyDownEvent(LogicalKeyboardKey.enter);
+      await tester.pumpAndSettle();
+
+      expect(find.text('250'), findsOneWidget);
+      expect(find.text('50'), findsNWidgets(2));
+
+      // Delete 1st row
+      await tester.hoverOnFirstRowOfGrid();
+      await tester.tapRowMenuButtonInGrid();
+      await tester.tapDeleteOnRowMenu();
+
+      await tester.pumpAndSettle(const Duration(seconds: 1));
+
+      expect(find.text('150'), findsNWidgets(2));
+      expect(find.text('100'), findsNWidgets(2));
+    });
+  });
+}
@@ -19,7 +19,7 @@ void main() {
      await tester.initializeAppFlowy();

      await tester.tapGoButton();
-      tester.expectToSeeHomePage();
+      await tester.expectToSeeHomePageWithGetStartedPage();

      await tester.openSettings();
      await tester.openSettingsPage(SettingsPage.appearance);
@@ -71,7 +71,7 @@ void main() {
      await tester.initializeAppFlowy();

      await tester.tapGoButton();
-      tester.expectToSeeHomePage();
+      await tester.expectToSeeHomePageWithGetStartedPage();

      await tester.pumpAndSettle();

@@ -33,7 +33,7 @@ void main() {
        File(path).writeAsStringSync(str);
      }
      // mock get files
-      await mockPickFilePaths(
+      mockPickFilePaths(
        paths: testFileNames
            .map((e) => p.join(context.applicationDataDirectory, e))
            .toList(),