v0.5.4-canary.29

Co-authored-by: Himself65 <himself65@outlook.com>

.commitlintrc.json

@@ -6,11 +6,13 @@
       "always",
       [
         "electron",
+        "server",
         "web",
         "docs",
         "component",
         "workspace",
         "env",
+        "graphql",
         "cli",
         "hooks",
         "i18n",
@@ -18,7 +20,8 @@
         "octobase-node",
         "templates",
         "y-indexeddb",
-        "debug"
+        "debug",
+        "theme"
       ]
     ]
   }

.eslintignore

@@ -4,3 +4,4 @@ dist
 out
 storybook-static
 affine-out
+_next

.eslintrc.js

@@ -1,8 +1,11 @@
-module.exports = {
+/**
+ * @type {import('eslint').Linter.Config}
+ */
+const config = {
   root: true,
   settings: {
     react: {
-      version: '18',
+      version: 'detect',
     },
     next: {
       rootDir: 'apps/web',
@@ -10,6 +13,7 @@ module.exports = {
   },
   extends: [
     'eslint:recommended',
+    'plugin:react-hooks/recommended',
     'plugin:react/recommended',
     'plugin:react/jsx-runtime',
     'plugin:@typescript-eslint/recommended',
@@ -30,6 +34,7 @@ module.exports = {
     'simple-import-sort',
     'import',
     'unused-imports',
+    'unicorn',
   ],
   rules: {
     'no-undef': 'off',
@@ -41,7 +46,14 @@ module.exports = {
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-empty-function': 'off',
-    '@typescript-eslint/no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        varsIgnorePattern: '^_',
+        argsIgnorePattern: '^_',
+        caughtErrorsIgnorePattern: '^_',
+      },
+    ],
     'unused-imports/no-unused-imports': 'error',
     'simple-import-sort/imports': 'error',
     'simple-import-sort/exports': 'error',
@@ -63,5 +75,28 @@ module.exports = {
         ],
       },
     ],
+    'unicorn/filename-case': [
+      'error',
+      {
+        case: 'kebabCase',
+        ignore: ['^\\[[a-zA-Z0-9-_]+\\]\\.tsx$'],
+      },
+    ],
   },
+  overrides: [
+    {
+      files: 'apps/server/**/*.ts',
+      rules: {
+        '@typescript-eslint/consistent-type-imports': 0,
+      },
+    },
+    {
+      files: '*.cjs',
+      rules: {
+        '@typescript-eslint/no-var-requires': 0,
+      },
+    },
+  ],
 };
+
+module.exports = config;

.github/CLA.md

@@ -53,3 +53,8 @@ Example:
 - Aditya Sharma, @adityash1, 2023/03/21
 - Fangdun Tsai, @fundon, 2023/03/21
 - Zhilin Liu, @lzlme, 2023/04/09
+- Skye Sun, @skyesun, 2023/04/14
+- Jordy Delgado, @Jdelgad8, 2023/04/17
+- Howard Do, @howarddo2208, 2023/04/20
+- 三咲智子 Kevin Deng, @sxzz, 2023/04/21
+- Moeyua, @moeyua, 2023/04/22

.github/ISSUE_TEMPLATE/BUG-REPORT.yml

@@ -23,6 +23,11 @@ body:
       options:
         - app.affine.pro
         - stage.affine.pro
+        - dev.affine.live
+        - affine-preview.vercel.app
+        - macOS x64
+        - macOS ARM 64
+        - Windows x64
     validations:
       required: true
   - type: dropdown

.github/actions/setup-node/action.yml

@@ -9,10 +9,6 @@ inputs:
     description: 'Run the install step.'
     required: false
     default: 'true'
-  electron-workspace-install:
-    description: 'Run the install step for the electron workspace.'
-    required: false
-    default: 'false'
   playwright-install:
     description: 'Run the install step for Playwright.'
     required: false
@@ -33,10 +29,6 @@ runs:
         scope: '@toeverything'
         cache: 'yarn'
 
-    - name: CI Module Resolve
-      shell: bash
-      run: node scripts/module-resolve/ci.cjs
-
     - name: Expose yarn config as "$GITHUB_OUTPUT"
       id: yarn-config
       shell: bash
@@ -86,17 +78,6 @@ runs:
         YARN_INSTALL_STATE_PATH: .yarn/ci-cache/install-state.gz
         HUSKY: '0'
 
-    - name: yarn install (electron)
-      if: ${{ inputs.electron-workspace-install == 'true' }}
-      shell: bash
-      run: yarn install ${{ inputs.extra-flags }}
-      working-directory: apps/electron
-      env:
-        NODE_AUTH_TOKEN: ${{ inputs.npm-token }}
-        YARN_ENABLE_GLOBAL_CACHE: 'false'
-        YARN_INSTALL_STATE_PATH: ../../.yarn/ci-cache/install-state.gz
-        HUSKY: '0'
-
     - name: Get installed Playwright version
       id: playwright-version
       if: ${{ inputs.playwright-install == 'true' }}

.github/labeler.yml

@@ -3,7 +3,7 @@ docs:
   - '**/README.md'
   - 'packages/templates/**/*'
 
-tests:
+test:
   - 'tests/**/*'
   - '**/tests/**/*'
   - '**/__tests__/**/*'
@@ -40,3 +40,5 @@ package:y-indexeddb: 'packages/y-indexeddb/**/*'
 app:web: 'apps/web/**/*'
 
 app:electron: 'apps/electron/**/*'
+
+app:server: 'apps/server/**/*'

.github/workflows/build-master.yml

@@ -1,258 +0,0 @@
-name: Build & Test
-
-on:
-  push:
-    branches: [master]
-
-jobs:
-  lint:
-    name: Lint
-    runs-on: ubuntu-latest
-    environment: development
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-      - run: yarn lint --max-warnings=0
-
-  build-storybook:
-    name: Build Storybook
-    runs-on: ubuntu-latest
-    environment: development
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-      - run: yarn build:storybook
-      - name: Upload storybook artifact
-        uses: actions/upload-artifact@v3
-        with:
-          name: storybook
-          path: ./packages/component/storybook-static
-          if-no-files-found: error
-
-  build-frontend:
-    name: Build @affine/web
-    runs-on: ubuntu-latest
-    environment: production
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-      - name: Cache Next.js
-        uses: actions/cache@v3
-        with:
-          path: |
-            ${{ github.workspace }}/apps/web/.next/cache
-          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
-          restore-keys: |
-            ${{ runner.os }}-nextjs-${{ hashFiles('**/yarn.lock') }}-
-
-      - name: Build
-        run: yarn build
-        env:
-          NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
-          NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
-          NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
-          NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
-          NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
-          NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
-          NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
-          PERFSEE_TOKEN: ${{ secrets.PERFSEE_TOKEN }}
-
-      - name: Export
-        run: yarn export
-
-      - name: Upload artifact
-        uses: actions/upload-artifact@v3
-        with:
-          name: next-js
-          path: ./apps/web/out
-          if-no-files-found: error
-
-  publish-frontend:
-    name: Push frontend image
-    runs-on: ubuntu-latest
-    needs: build-frontend
-
-    permissions:
-      contents: read
-      packages: write
-
-    env:
-      REGISTRY: ghcr.io
-      IMAGE_NAME: 'toeverything/affine-pathfinder'
-      IMAGE_TAG: canary-${{ github.sha }}
-      IMAGE_TAG_LATEST: nightly-latest
-
-    steps:
-      - name: Check out the repo
-        uses: actions/checkout@v3
-
-      - name: Download artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: next-js
-          path: ./apps/web/out
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@v2
-        with:
-          registry: ${{ env.REGISTRY }}
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: Extract metadata (tags, labels) for Docker
-        id: meta
-        uses: docker/metadata-action@v4
-        with:
-          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
-          tags: |
-            ${{ env.IMAGE_TAG }}
-            ${{ env.IMAGE_TAG_LATEST }}
-
-      - name: Build Docker image
-        uses: docker/build-push-action@v3
-        with:
-          context: .
-          push: true
-          file: ./.github/deployment/Dockerfile
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
-
-  storybook-test:
-    name: Storybook Test
-    runs-on: ubuntu-latest
-    environment: development
-    needs: [build-storybook]
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-        with:
-          playwright-install: true
-      - name: Download storybook artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: storybook
-          path: ./packages/component/storybook-static
-      - name: Run storybook tests
-        working-directory: ./packages/component
-        run: |
-          yarn exec concurrently -k -s first -n "SB,TEST" -c "magenta,blue" "yarn exec serve ./storybook-static -l 6006" "yarn exec wait-on tcp:6006 && yarn test-storybook --coverage"
-      - name: Upload storybook test coverage results
-        uses: codecov/codecov-action@v3
-        with:
-          token: ${{ secrets.CODECOV_TOKEN }}
-          files: ./packages/component/coverage/storybook/coverage-storybook.json
-          flags: storybook-test
-          name: affine
-          fail_ci_if_error: true
-
-  e2e-test:
-    name: E2E Test
-    runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-      matrix:
-        shard: [1, 2, 3, 4]
-    environment: development
-    needs: [build-frontend, build-storybook]
-    services:
-      octobase:
-        image: ghcr.io/toeverything/cloud-self-hosted:nightly-latest
-        ports:
-          - 3000:3000
-        env:
-          SIGN_KEY: 'test123'
-          RUST_LOG: 'debug'
-          JWST_DEV: '1'
-        credentials:
-          username: ${{ github.actor }}
-          password: ${{ secrets.ACTIONS_PACKAGE_PUBLISH }}
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-        with:
-          playwright-install: true
-      - name: Download artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: next-js
-          path: ./apps/web/.next
-
-      - name: Download storybook artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: storybook
-          path: ./packages/component/storybook-static
-
-      - name: Run playwright tests
-        run: yarn test --forbid-only --shard=${{ matrix.shard }}/${{ strategy.job-total }}
-        env:
-          COVERAGE: true
-
-      - name: Collect code coverage report
-        run: yarn exec nyc report -t .nyc_output --report-dir .coverage --reporter=lcov
-
-      - name: Upload e2e test coverage results
-        uses: codecov/codecov-action@v3
-        with:
-          token: ${{ secrets.CODECOV_TOKEN }}
-          files: ./.coverage/lcov.info
-          flags: e2etest
-          name: affine
-          fail_ci_if_error: true
-
-      - name: Upload test results
-        if: ${{ failure() }}
-        uses: actions/upload-artifact@v2
-        with:
-          name: test-results-e2e
-          path: ./test-results
-          if-no-files-found: ignore
-
-  unit-test:
-    name: Unit Test
-    runs-on: ubuntu-latest
-    environment: development
-    needs: build-frontend
-    services:
-      octobase:
-        image: ghcr.io/toeverything/cloud-self-hosted:nightly-latest
-        ports:
-          - 3000:3000
-        env:
-          SIGN_KEY: 'test123'
-          RUST_LOG: 'debug'
-          JWST_DEV: '1'
-        credentials:
-          username: ${{ github.actor }}
-          password: ${{ secrets.ACTIONS_PACKAGE_PUBLISH }}
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-      - name: Download artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: next-js
-          path: ./apps/web/.next
-
-      - name: Unit Test
-        run: yarn run test:unit:coverage
-
-      - name: Upload unit test coverage results
-        uses: codecov/codecov-action@v3
-        with:
-          token: ${{ secrets.CODECOV_TOKEN }}
-          files: ./.coverage/store/lcov.info
-          flags: unittest
-          name: affine
-          fail_ci_if_error: true

.github/workflows/build-test-version.yml

@@ -1,105 +0,0 @@
-name: Build Test Version
-
-on:
-  workflow_dispatch:
-    inputs:
-      tag:
-        description: 'Custom Tag. Set nightly-latest will publish to development.'
-        required: true
-        type: string
-
-# Cancels all previous workflow runs for pull requests that have not completed.
-# See https://docs.github.com/en/actions/using-jobs/using-concurrency
-concurrency:
-  # The concurrency group contains the workflow name and the branch name for
-  # pull requests or the commit hash for any other events.
-  group: ${{ github.workflow }}-${{ github.event_name == 'pull_request' && github.head_ref || github.sha }}
-  cancel-in-progress: true
-
-jobs:
-  build:
-    name: Lint and Build
-    runs-on: self-hosted
-    environment: development
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-
-      - name: Lint
-        run: |
-          yarn lint --max-warnings=0
-
-      # - name: Test
-      #   run: yarn test
-
-      - name: Build
-        run: yarn build
-        env:
-          NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
-          NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
-          NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
-          NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
-          NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
-          NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
-          NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
-
-      - name: Export
-        run: yarn export
-
-      - name: Upload artifact
-        uses: actions/upload-artifact@v3
-        with:
-          path: ./apps/web/out
-
-  push_to_registry:
-    # See https://docs.github.com/en/actions/publishing-packages/publishing-docker-images
-    name: Push Docker image to Docker Hub
-    runs-on: ubuntu-latest
-    needs: build
-
-    permissions:
-      contents: read
-      packages: write
-
-    env:
-      REGISTRY: ghcr.io
-      IMAGE_NAME: 'toeverything/affine-pathfinder-testing'
-      IMAGE_TAG: canary-${{ github.sha }}
-      IMAGE_TAG_LATEST: nightly-latest
-
-    steps:
-      - name: Check out the repo
-        uses: actions/checkout@v3
-
-      - name: Download artifact
-        uses: actions/download-artifact@v3
-        with:
-          name: artifact
-          path: apps/web/out/
-
-      - name: Log in to Docker Hub
-        uses: docker/login-action@v2
-        with:
-          registry: ${{ env.REGISTRY }}
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-
-      - name: Extract metadata (tags, labels) for Docker
-        id: meta
-        uses: docker/metadata-action@v4
-        with:
-          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
-          tags: |
-            ${{ env.IMAGE_TAG }}
-            ${{ inputs.tag }}
-
-      - name: Build and push Docker image
-        uses: docker/build-push-action@v3
-        with:
-          context: .
-          push: true
-          file: ./.github/deployment/Dockerfile
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}

.github/workflows/build.yml

@@ -1,6 +1,9 @@
 name: Build & Test
 
 on:
+  push:
+    branches:
+      - master
   pull_request:
     branches:
       - master
@@ -17,18 +20,6 @@ jobs:
         uses: ./.github/actions/setup-node
       - run: yarn lint --max-warnings=0
 
-  install-all:
-    name: Install All Dependencies
-    runs-on: ubuntu-latest
-    environment: development
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Install All Dependencies
-        uses: ./.github/actions/setup-node
-        with:
-          electron-workspace-install: true
-
   build-storybook:
     name: Build Storybook
     runs-on: ubuntu-latest
@@ -46,6 +37,23 @@ jobs:
           path: ./packages/component/storybook-static
           if-no-files-found: error
 
+  build-electron:
+    name: Build @affine/electron
+    runs-on: ubuntu-latest
+    environment: development
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - name: Build Electron
+        working-directory: apps/electron
+        run: yarn build-layers
+      - name: Upload Ubuntu desktop artifact
+        uses: actions/upload-artifact@v3
+        with:
+          name: affine-ubuntu
+          path: ./apps/electron/dist
+
   build:
     name: Build @affine/web
     runs-on: ubuntu-latest
@@ -73,6 +81,10 @@ jobs:
           NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
           NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
           NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
+          API_SERVER_PROFILE: local
+          ENABLE_DEBUG_PAGE: true
+          ENABLE_LEGACY_PROVIDER: true
+          COVERAGE: true
 
       - name: Upload artifact
         uses: actions/upload-artifact@v3
@@ -81,6 +93,85 @@ jobs:
           path: ./apps/web/.next
           if-no-files-found: error
 
+      - name: Build @affine/web for desktop
+        run: yarn build
+        env:
+          NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
+          NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
+          NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
+          NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
+          NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
+          NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
+          NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
+          API_SERVER_PROFILE: affine
+          ENABLE_DEBUG_PAGE: true
+          ENABLE_LEGACY_PROVIDER: false
+          COVERAGE: true
+
+      - name: Export static resources
+        run: yarn export
+        working-directory: apps/web
+
+      - name: Upload static resources artifact
+        uses: actions/upload-artifact@v3
+        with:
+          name: next-js-static
+          path: ./apps/web/out
+          if-no-files-found: error
+
+  server-test:
+    name: Server Test
+    runs-on: ubuntu-latest
+    environment: development
+    services:
+      postgres:
+        image: postgres
+        env:
+          POSTGRES_PASSWORD: affine
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+        ports:
+          - 5432:5432
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - name: Initialize database
+        run: |
+          psql -h localhost -U postgres -c "CREATE DATABASE affine;"
+          psql -h localhost -U postgres -c "CREATE USER affine WITH PASSWORD 'affine';"
+          psql -h localhost -U postgres -c "ALTER USER affine WITH SUPERUSER;"
+        env:
+          PGPASSWORD: affine
+      - name: Generate prisma client
+        run: |
+          yarn exec prisma generate
+          yarn exec prisma db push
+        working-directory: apps/server
+        env:
+          DATABASE_URL: postgresql://affine:affine@localhost:5432/affine
+      - name: Run init-db script
+        run: yarn exec ts-node-esm ./scripts/init-db.ts
+        working-directory: apps/server
+        env:
+          DATABASE_URL: postgresql://affine:affine@localhost:5432/affine
+      - name: Run server tests
+        run: yarn test:coverage
+        working-directory: apps/server
+        env:
+          DATABASE_URL: postgresql://affine:affine@localhost:5432/affine
+      - name: Upload server test coverage results
+        uses: codecov/codecov-action@v3
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+          files: ./apps/server/.coverage/lcov.info
+          flags: server-test
+          name: affine
+          fail_ci_if_error: true
+
   storybook-test:
     name: Storybook Test
     runs-on: ubuntu-latest
@@ -147,6 +238,10 @@ jobs:
           name: storybook
           path: ./packages/component/storybook-static
 
+      - name: Wait for Octobase Ready
+        run: |
+          node ./scripts/wait-3000-healthz.mjs
+
       - name: Run playwright tests
         run: yarn test --forbid-only --shard=${{ matrix.shard }}/${{ strategy.job-total }}
         env:
@@ -168,7 +263,54 @@ jobs:
         if: ${{ failure() }}
         uses: actions/upload-artifact@v2
         with:
-          name: test-results-e2e
+          name: test-results-e2e-${{ matrix.shard }}
+          path: ./test-results
+          if-no-files-found: ignore
+
+  dekstop-test:
+    name: Desktop Test
+    runs-on: ubuntu-latest
+    environment: development
+    strategy:
+      # all combinations: macos-latest x64, macos-latest arm64, windows-latest x64, ubuntu-latest x64
+      matrix:
+        spec:
+          - { os: macos-latest, platform: macos, arch: x64 }
+          - { os: macos-latest, platform: macos, arch: arm64 }
+          - { os: ubuntu-latest, platform: linux, arch: x64 }
+          - { os: windows-latest, platform: windows, arch: x64 }
+    needs: [build, build-electron]
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+        with:
+          playwright-install: true
+      - name: Download Ubuntu desktop artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: affine-ubuntu
+          path: ./apps/electron/dist
+
+      - name: Download static resource artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: next-js-static
+          path: ./apps/electron/resources/web-static
+
+      - name: Rebuild Electron dependences
+        run: yarn rebuild:for-electron
+        working-directory: apps/electron
+
+      - name: Run desktop tests
+        run: xvfb-run --auto-servernum --server-args="-screen 0 1280x960x24" -- yarn test
+        working-directory: apps/electron
+
+      - name: Upload test results
+        if: ${{ failure() }}
+        uses: actions/upload-artifact@v2
+        with:
+          name: test-results-e2e-${{ matrix.shard }}
           path: ./test-results
           if-no-files-found: ignore
 

.github/workflows/release-desktop-app.yml

@@ -17,6 +17,11 @@ on:
         type: boolean
         required: true
         default: true
+      build-type:
+        description: 'Build Type (canary, beta or stable)'
+        type: string
+        required: true
+        default: canary
 
 permissions:
   actions: write
@@ -29,142 +34,163 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.event_name == 'pull_request' && github.head_ref || github.sha }}
   cancel-in-progress: true
 
-jobs:
-  make-macos:
-    environment: production
-    env:
-      APPLE_ID: ${{ secrets.APPLE_ID }}
-      APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
-      APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-      NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
-      NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
-      NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
-      NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
-      NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
-      NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
-      NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
-      AFFINE_GOOGLE_CLIENT_ID: ${{ secrets.AFFINE_GOOGLE_CLIENT_ID }}
-      AFFINE_GOOGLE_CLIENT_SECRET: ${{ secrets.AFFINE_GOOGLE_CLIENT_SECRET }}
-      API_SERVER_PROFILE: prod
+env:
+  BUILD_TYPE: ${{ github.event.inputs.build-type }}
 
-    runs-on: macos-latest
-    strategy:
-      matrix:
-        arch: [x64, arm64]
+jobs:
+  before-make:
+    runs-on: ubuntu-latest
+    environment: ${{ github.ref_name == 'master' && 'production' || 'development' }}
     steps:
       - uses: actions/checkout@v3
       - name: Setup Node.js
         uses: ./.github/actions/setup-node
+      - name: generate-assets
+        working-directory: apps/electron
+        run: yarn generate-assets
+        env:
+          NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
+          NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
+          NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
+          NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
+          NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
+          NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
+          NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
+          AFFINE_GOOGLE_CLIENT_ID: ${{ secrets.AFFINE_GOOGLE_CLIENT_ID }}
+          AFFINE_GOOGLE_CLIENT_SECRET: ${{ secrets.AFFINE_GOOGLE_CLIENT_SECRET }}
+          SENTRY_ORG: ${{ secrets.SENTRY_ORG }}
+          SENTRY_PROJECT: ${{ secrets.SENTRY_PROJECT }}
+          NEXT_PUBLIC_SENTRY_DSN: ${{ secrets.NEXT_PUBLIC_SENTRY_DSN }}
+          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
+          API_SERVER_PROFILE: prod
+          ENABLE_TEST_PROPERTIES: false
+
+      - name: Upload Artifact (web-static)
+        uses: actions/upload-artifact@v3
         with:
-          electron-workspace-install: true
+          name: before-make-web-static
+          path: apps/electron/resources/web-static
 
-      - name: install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-
-      - name: add arm64 target
-        if: matrix.arch == 'arm64'
-        run: rustup target add aarch64-apple-darwin
-
-      - name: Rust cache
-        uses: swatinem/rust-cache@v2
+      - name: Upload Artifact (electron dist)
+        uses: actions/upload-artifact@v3
         with:
-          key: ${{ matrix.arch }}
-          workspaces: './packages/octobase-node -> target'
+          name: before-make-electron-dist
+          path: apps/electron/dist
+
+      - name: Upload YML Build Script
+        uses: actions/upload-artifact@v3
+        with:
+          name: release-yml-build-script
+          path: apps/electron/scripts/generate-yml.js
+
+  make-distribution:
+    environment: ${{ github.ref_name == 'master' && 'production' || 'development' }}
+    strategy:
+      # all combinations: macos-latest x64, macos-latest arm64, windows-latest x64, ubuntu-latest x64
+      matrix:
+        spec:
+          - { os: macos-latest, platform: macos, arch: x64 }
+          - { os: macos-latest, platform: macos, arch: arm64 }
+          - { os: ubuntu-latest, platform: linux, arch: x64 }
+          - { os: windows-latest, platform: windows, arch: x64 }
+    runs-on: ${{ matrix.spec.os }}
+    needs: before-make
+    env:
+      APPLE_ID: ${{ secrets.APPLE_ID }}
+      APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
+      APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
+      SKIP_GENERATE_ASSETS: 1
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - uses: actions/download-artifact@v3
+        with:
+          name: before-make-web-static
+          path: apps/electron/resources/web-static
+      - uses: actions/download-artifact@v3
+        with:
+          name: before-make-electron-dist
+          path: apps/electron/dist
 
       - name: Signing By Apple Developer ID
+        if: ${{ matrix.spec.platform == 'macos' }}
         uses: apple-actions/import-codesign-certs@v2
         with:
           p12-file-base64: ${{ secrets.CERTIFICATES_P12 }}
           p12-password: ${{ secrets.CERTIFICATES_P12_PASSWORD }}
 
-      - name: make build
-        run: yarn make-macos-${{ matrix.arch }}
+      - name: make
+        run: yarn make-${{ matrix.spec.platform }}-${{ matrix.spec.arch }}
         working-directory: apps/electron
 
-      - name: Save artifacts
+      - name: Save artifacts (mac)
+        if: ${{ matrix.spec.platform == 'macos' }}
         run: |
           mkdir -p builds
-          mv apps/electron/out/make/AFFiNE.dmg ./builds/affine-darwin-${{ matrix.arch }}-${{ github.event.inputs.version }}.dmg
+          mv apps/electron/out/*/make/*.dmg ./builds/affine-${{ env.BUILD_TYPE }}-macos-${{ matrix.spec.arch }}.dmg
+          mv apps/electron/out/*/make/zip/darwin/${{ matrix.spec.arch }}/*.zip ./builds/affine-${{ env.BUILD_TYPE }}-macos-${{ matrix.spec.arch }}.zip
+      - name: Save artifacts (windows)
+        if: ${{ matrix.spec.platform == 'windows' }}
+        run: |
+          mkdir -p builds
+          mv apps/electron/out/*/make/zip/win32/x64/AFFiNE*-win32-x64-*.zip ./builds/affine-${{ env.BUILD_TYPE }}-windows-x64.zip
+          mv apps/electron/out/*/make/squirrel.windows/x64/*.exe ./builds/affine-${{ env.BUILD_TYPE }}-windows-x64.exe
+          mv apps/electron/out/*/make/squirrel.windows/x64/*.msi ./builds/affine-${{ env.BUILD_TYPE }}-windows-x64.msi
+          mv apps/electron/out/*/make/squirrel.windows/x64/*.nupkg ./builds/affine-${{ env.BUILD_TYPE }}-windows-x64.nupkg
+
+      - name: Save artifacts (linux)
+        if: ${{ matrix.spec.platform == 'linux' }}
+        run: |
+          mkdir -p builds
+          mv apps/electron/out/*/make/zip/linux/x64/*.zip ./builds/affine-${{ env.BUILD_TYPE }}-linux-x64.zip
 
       - name: Upload Artifact
         uses: actions/upload-artifact@v3
         with:
-          name: affine-darwin-${{ matrix.arch }}-builds
-          path: builds
-
-  make-windows:
-    runs-on: windows-latest
-    environment: production
-    env:
-      APPLE_ID: ${{ secrets.APPLE_ID }}
-      APPLE_PASSWORD: ${{ secrets.APPLE_PASSWORD }}
-      APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-      NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
-      NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: ${{ secrets.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN }}
-      NEXT_PUBLIC_FIREBASE_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_PROJECT_ID }}
-      NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET: ${{ secrets.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET }}
-      NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID }}
-      NEXT_PUBLIC_FIREBASE_APP_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_APP_ID }}
-      NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID: ${{ secrets.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID }}
-      AFFINE_GOOGLE_CLIENT_ID: ${{ secrets.AFFINE_GOOGLE_CLIENT_ID }}
-      AFFINE_GOOGLE_CLIENT_SECRET: ${{ secrets.AFFINE_GOOGLE_CLIENT_SECRET }}
-      API_SERVER_PROFILE: prod
-
-    steps:
-      - uses: actions/checkout@v3
-      - name: Setup Node.js
-        uses: ./.github/actions/setup-node
-        with:
-          electron-workspace-install: true
-
-      - name: install Rust stable
-        uses: dtolnay/rust-toolchain@stable
-
-      - name: Rust cache
-        uses: swatinem/rust-cache@v2
-        with:
-          workspaces: './packages/octobase-node -> target'
-
-      - name: make build
-        run: yarn make-windows-x64
-        working-directory: apps/electron
-
-      - name: Save windows artifacts
-        run: |
-          mkdir -p builds
-          mv apps/electron/out/make/zip/win32/x64/AFFiNE-win32-x64-0.0.0.zip ./builds/affine-windows-x64-${{ github.event.inputs.version }}.zip
-
-      - name: Upload Artifact
-        uses: actions/upload-artifact@v3
-        with:
-          name: affine-windows-x64-builds
+          name: affine-${{ matrix.spec.platform }}-${{ matrix.spec.arch }}-builds
           path: builds
 
   release:
-    needs: [make-macos, make-windows]
+    needs: make-distribution
     runs-on: ubuntu-latest
-    steps:
-      - name: Download MacOS x64 Artifacts
-        uses: actions/download-artifact@v3
-        with:
-          name: affine-darwin-x64-builds
-          path: ./
 
-      - name: Download MacOS arm64 Artifacts
+    steps:
+      - name: Download Artifacts (macos-x64)
         uses: actions/download-artifact@v3
         with:
-          name: affine-darwin-arm64-builds
+          name: affine-macos-x64-builds
           path: ./
-      - name: Download Windows Artifacts
+      - name: Download Artifacts (macos-arm64)
+        uses: actions/download-artifact@v3
+        with:
+          name: affine-macos-arm64-builds
+          path: ./
+      - name: Download Artifacts (windows-x64)
         uses: actions/download-artifact@v3
         with:
           name: affine-windows-x64-builds
           path: ./
-
+      - name: Download Artifacts (linux-x64)
+        uses: actions/download-artifact@v3
+        with:
+          name: affine-linux-x64-builds
+          path: ./
+      - name: Download Artifacts
+        uses: actions/download-artifact@v3
+        with:
+          name: release-yml-build-script
+          path: ./
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+      - name: Generate Release yml
+        run: |
+          RELEASE_VERSION=${{ github.event.inputs.version }} node generate-yml.js
       - name: Create Release Draft
         uses: softprops/action-gh-release@v1
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.RELEASE_TOKEN }}
         with:
           name: Desktop APP ${{ github.event.inputs.version }}
           body: 'TODO: Add release notes here'
@@ -179,3 +205,4 @@ jobs:
             ./RELEASES
             ./*.AppImage
             ./*.apk
+            ./*.yml

.github/workflows/release.yml

@@ -0,0 +1,19 @@
+name: Release
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  release:
+    name: Try publishing npm@latest release
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: ./.github/actions/setup-node
+      - name: Try publishing to NPM
+        run: ./scripts/publish.sh
+        env:
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -5,7 +5,7 @@
 !.yarn/plugins
 !.yarn/releases
 !.yarn/sdks
-!.yarn/versions
+.yarn/versions
 
 # compiled output
 *dist
@@ -57,9 +57,8 @@ Thumbs.db
 .next
 out/
 storybook-static
+i18n-generated.ts
 
-module-resolve.js
-module-resolve.cjs
 /test-results/
 /playwright-report/
 /playwright/.cache/

.husky/pre-commit

@@ -3,7 +3,6 @@
 
 # check lockfile is up to date
 yarn install
-cd ./apps/eletron && yarn install
 
 # lint staged files
 yarn exec lint-staged

.i18n-codegen.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "./node_modules/@magic-works/i18n-codegen/schema.json",
+  "version": 1,
+  "list": [
+    {
+      "input": "./packages/i18n/src/resources/en.json",
+      "output": "./packages/i18n/src/i18n-generated",
+      "parser": {
+        "type": "i18next",
+        "contextSeparator": "$",
+        "pluralSeparator": "_"
+      },
+      "generator": {
+        "type": "i18next/react-hooks",
+        "hooks": "useAFFiNEI18N",
+        "emitTS": true,
+        "shouldUnescape": true
+      }
+    }
+  ]
+}

.prettierignore

@@ -1,2 +1 @@
 pnpm-lock.yaml
-apps/electron/layers/preload/preload.d.ts

.prettierrc

@@ -1,6 +1,6 @@
 {
-    "singleQuote": true,
-    "trailingComma": "es5",
-    "tabWidth": 2,
-    "arrowParens": "avoid"
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "arrowParens": "avoid"
 }

.vscode/settings.json

@@ -29,5 +29,14 @@
   "rust-analyzer.linkedProjects": ["packages/octobase-node/Cargo.toml"],
   "[typescriptreact]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
+  },
+  "vitest.include": [
+    "packages/**/*.spec.ts",
+    "packages/**/*.spec.tsx",
+    "apps/web/**/*.spec.ts",
+    "apps/web/**/*.spec.tsx",
+    "apps/electron/layers/**/*.spec.ts",
+    "tests/unit/**/*.spec.ts",
+    "tests/unit/**/*.spec.tsx"
+  ]
 }

.yarnrc.yml

@@ -2,7 +2,7 @@ nmMode: hardlinks-local
 
 nodeLinker: node-modules
 
-npmAuthToken: '${NODE_AUTH_TOKEN:-NONE}'
+npmAuthToken: '${NPM_TOKEN:-NONE}'
 
 npmPublishAccess: public
 
@@ -11,5 +11,9 @@ npmPublishRegistry: 'https://registry.npmjs.org'
 plugins:
   - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
     spec: '@yarnpkg/plugin-interactive-tools'
+  - path: .yarn/plugins/@yarnpkg/plugin-version.cjs
+    spec: '@yarnpkg/plugin-version'
+  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
+    spec: '@yarnpkg/plugin-workspace-tools'
 
 yarnPath: .yarn/releases/yarn-3.5.0.cjs

README.md

@@ -24,7 +24,12 @@ See https://github.com/all-?/all-contributors/issues/361#issuecomment-637166066
 
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 
-[![affine-app-logo]](https://app.affine.pro)
+[![AFFiNE Web](<https://img.shields.io/badge/-Try%20It%20Online%20%E2%86%92-rgb(84,56,255)?style=flat-square&logoColor=white&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAADAAAAAwAEwd99eAAABjElEQVRYhe1W0U3DMBB9RfyTDeoNyAYNG2QDOgJsECYgGxA26AZ4hIxgJqCZ4PjIGV+tUxK7raqiPsmKdXe5e3fOs7IiIlwSdxetfiNw7QRKAD0Ax/ssrI5QgQOw5v03AJOTJHcCL1x84LVmWzJyJlBg7P4BwCvb3pmIAbBPykZEqaulEU7YHNva1HypxUsKqIS9EvbynASs0n3ss+ciUIsuO8VvhL9emjdFBa3YO8XvALwpsZNYSqBB0PwUWgRZNksSL5GhlN0ngGd+dkpsD6AG8IGlslxwTh2fa09EBc3Dir32rRysuQlUAL54/wTAcpePPAXHPsOTGXhSEv69rAlYpZOt6DSO29J4D/TRRLJk6AvtaZSY9PkCFYVLqI9i/NF5YkkECgrXa6P4fVEn4iolrhNxRQqBZu7FqMNdZiMqAUPj2KdGZyicu1dHzlGqBHxn2sdTR53bmeJ+ebJd7LtXhGH4uQEwd0ttAPzMxGi5/6BdxTuMej41Bs59gGP+CU+Cq/4tvxH4HwR+Ab3Uqr/VGbqEAAAAAElFTkSuQmCC>)](https://app.affine.pro)
+[![AFFiNE macOS M1/M2 Chip](https://img.shields.io/badge/-macOS_M_Chip%20%E2%86%92-black?style=flat-square&logo=apple&logoColor=white)](https://affine.pro/download)
+[![AFFiNE macOS x64](https://img.shields.io/badge/-macOS_x86%20%E2%86%92-black?style=flat-square&logo=apple&logoColor=white)](https://affine.pro/download)
+[![AFFiNE Window x64](https://img.shields.io/badge/-Windows%20%E2%86%92-blue?style=flat-square&logo=windows&logoColor=white)](https://affine.pro/download)
+[![AFFiNE Linux](https://img.shields.io/badge/-Linux%20%E2%86%92-yellow?style=flat-square&logo=linux&logoColor=white)](https://affine.pro/download)
+
 [![stars-icon]](https://github.com/toeverything/AFFiNE)
 [![All Contributors][all-contributors-badge]](#contributors)
 [![codecov]](https://codecov.io/gh/toeverything/AFFiNE)
@@ -36,6 +41,8 @@ See https://github.com/all-?/all-contributors/issues/361#issuecomment-637166066
 
 </div>
 
+---
+
 <div align="center">
     <a href="http://affine.pro"><img src="https://img.shields.io/badge/-AFFiNE-06449d?style=social&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAMAAAAPkIrYAAAAP1BMVEU8b9w8b9w+b947cNw7b9w6b908b909b9w8b9w7b9w8b9w7cN08b9w7b908b9w7b9w8b907cNw8b9w8b91HcEx3NJCJAAAAFXRSTlP/3QWSgA+lHPlu6Di4XtIrxk/xRADGudUoAAAB9UlEQVR42tWYwbKjIBREG0GJKkRj/v9bZ1ZvRC99rzib11tTB9qqnKoW3/+X38vy7ifzQ1b/wk/8Q1bCv3y6Z6wFh2x2llIRGB6xRhzz6p+wVhRJD1gRZZYHrADYSyqsjFPGZtYbuFESesUysZXlcMnYyJpxTW5keQh5N7G6CUJCE2uHFNfEGiBmbmB1H4jxDawNcqbuPmtAJTtj6RZ0lpIwiR5jNmgfNtHHwLXPWfFYcS2NMdxkjac/dNaNCJPo3yf9pFuseHbDrBsRFguGs8te8Q4rXzTjVSPCIHp3FePKWbzi30xE+4zlBMmoJaGLfpLUmAmLiN4Xyibahy76WZRQMLJ2WX27on2oFvQVac8yi4p+J2forA0V8W1c++AVS1f1H6p9KKLHxk9RWKmsyB+VLC76gV65DLjokdg5KmsEMXsiDwXWSmTc9ezSoKJHoi9zUVihbMHfQOSsXB7Mrz1S1huKPde69sEsiKgNt8hYTjiWlAyENeu7IFe1D15RSEBN+yCiXw17K1RZm/w7UtJVWYN8f1ZyLlkVb2bT4vIVVrINH1dqX2YttkHmIWsfVWs646wcRFYis6fIVGpfYq1kjpGSW8kSRD+xYSmXRM0Ang9eSZioVdy/5pWaLqzIRyIpuVxYozvGf1m67I7pf/s3UXv+AP61NI2Y+BbSAAAAAElFTkSuQmCC" height=25></a>
     &nbsp;
@@ -55,7 +62,6 @@ See https://github.com/all-?/all-contributors/issues/361#issuecomment-637166066
 <em>See docs, canvas and tables are hyper merged with AFFiNE - just like the word affine (əˈfʌɪn | a-fine).</em>
 </div>
 <br />
-</div>
 
 ![img_v2_37a7cc04-ab3f-4405-ae9a-f84ceb4c948g](https://user-images.githubusercontent.com/79301703/230892907-5fd5c0c5-1665-4d75-8a35-744e0afc36a5.gif)
 
@@ -105,6 +111,14 @@ Looking for **others ways to contribute** and wondering where to start? Check ou
 
 If you have questions, you are welcome to contact us. One of the best places to get more info and learn more is in the [AFFiNE Community](https://community.affine.pro) where you can engage with other like-minded individuals.
 
+## Ecosystem
+
+| Name                                                      |                                    |                                                                                                                                                     |
+| --------------------------------------------------------- | ---------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [@affine/component](https://affine-storybook.vercel.app/) | AFFiNE Component Resources         | [![](https://img.shields.io/codecov/c/github/toeverything/affine?style=flat-square)](https://affine-storybook.vercel.app/)                          |
+| [@toeverything/y-indexeddb](packages/y-indexeddb)         | IndexedDB database adapter for Yjs | [![](https://img.shields.io/npm/dm/@toeverything/y-indexeddb?style=flat-square&color=eee)](https://www.npmjs.com/package/@toeverything/y-indexeddb) |
+| [@toeverything/theme](packages/theme)                     | AFFiNE theme                       | [![](https://img.shields.io/npm/dm/@toeverything/theme?style=flat-square&color=eee)](https://www.npmjs.com/package/@toeverything/theme)             |
+
 ## Thanks
 
 We would also like to give thanks to open-source projects that make AFFiNE possible:
@@ -123,102 +137,11 @@ Thanks a lot to the community for providing such powerful and simple libraries,
 
 # Contributors
 
-<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
-<!-- prettier-ignore-start -->
-<!-- markdownlint-disable -->
-<table>
-  <tr>
-    <td align="center"><a href="https://github.com/doodlewind"><img src="https://avatars.githubusercontent.com/u/7312949?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Yifeng Wang</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=doodlewind" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=doodlewind" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://darksky.eu.org/"><img src="https://avatars.githubusercontent.com/u/25152247?v=4?s=50" width="50px;" alt=""/><br /><sub><b>DarkSky</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=darkskygit" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=darkskygit" title="Documentation">📖</a></td>
-    <td align="center"><a href="http://zhangchi.page/"><img src="https://avatars.githubusercontent.com/u/5910926?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Chi Zhang</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=tzhangchi" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=tzhangchi" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/alt1o"><img src="https://avatars.githubusercontent.com/u/21084335?v=4?s=50" width="50px;" alt=""/><br /><sub><b>wang xinglong</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=alt1o" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=alt1o" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/Brooooooklyn"><img src="https://avatars.githubusercontent.com/u/3468483?v=4?s=50" width="50px;" alt=""/><br /><sub><b>LongYinan</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Brooooooklyn" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=Brooooooklyn" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/hwangdev97"><img src="https://avatars.githubusercontent.com/u/24713927?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Hwang</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=hwangdev97" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=hwangdev97" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/kobeshanks"><img src="https://avatars.githubusercontent.com/u/82570088?v=4?s=50" width="50px;" alt=""/><br /><sub><b>kobeshanks</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=kobeshanks" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=kobeshanks" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://pengx17.vercel.app/"><img src="https://avatars.githubusercontent.com/u/584378?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Peng Xiao</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=pengx17" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=pengx17" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://mirone.me/"><img src="https://avatars.githubusercontent.com/u/10047788?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Mirone</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Saul-Mirone" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=Saul-Mirone" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/zqran"><img src="https://avatars.githubusercontent.com/u/15389209?v=4?s=50" width="50px;" alt=""/><br /><sub><b>zqran</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=zqran" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=zqran" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://sunebear.com/"><img src="https://avatars.githubusercontent.com/u/7693264?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Shule Hsiung</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=SuneBear" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=SuneBear" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://fundon.viz.rs/"><img src="https://avatars.githubusercontent.com/u/27926?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Fangdun Tsai</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=fundon" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=fundon" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://lawvs.github.io/profile/"><img src="https://avatars.githubusercontent.com/u/18554747?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Whitewater</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=lawvs" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=lawvs" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/zuoxiaodong0815"><img src="https://avatars.githubusercontent.com/u/53252747?v=4?s=50" width="50px;" alt=""/><br /><sub><b>xiaodong zuo</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=zuoxiaodong0815" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=zuoxiaodong0815" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/Himself65"><img src="https://avatars.githubusercontent.com/u/14026360?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Himself65</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Himself65" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=Himself65" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/DiamondThree"><img src="https://avatars.githubusercontent.com/u/24630517?v=4?s=50" width="50px;" alt=""/><br /><sub><b>DiamondThree</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=DiamondThree" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=DiamondThree" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/QiShaoXuan"><img src="https://avatars.githubusercontent.com/u/22772830?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Qi</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=QiShaoXuan" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=QiShaoXuan" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://colelawrence.com/"><img src="https://avatars.githubusercontent.com/u/2925395?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Cole Lawrence</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=colelawrence" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=colelawrence" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://onetwo.ren/wiki"><img src="https://avatars.githubusercontent.com/u/3746270?v=4?s=50" width="50px;" alt=""/><br /><sub><b>lin onetwo</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=linonetwo" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=linonetwo" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/thorseraq"><img src="https://avatars.githubusercontent.com/u/20554850?v=4?s=50" width="50px;" alt=""/><br /><sub><b>x1a0t</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=thorseraq" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=thorseraq" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/HeJiachen-PM"><img src="https://avatars.githubusercontent.com/u/79301703?v=4?s=50" width="50px;" alt=""/><br /><sub><b>HeJiachen-PM</b></sub></a><br /><a href="#research-HeJiachen-PM" title="Research">🔬</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=HeJiachen-PM" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://www.notion.so/houjoe/Joe-2a85f5be01004cd2b6a5ad26fbb948b1"><img src="https://avatars.githubusercontent.com/u/22443345?v=4?s=50" width="50px;" alt=""/><br /><sub><b>houjoe</b></sub></a><br /><a href="#research-joebeijing" title="Research">🔬</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=joebeijing" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/Yipei-Operation"><img src="https://avatars.githubusercontent.com/u/79373028?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Yipei Wei</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Yipei-Operation" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/VelikaHF"><img src="https://avatars.githubusercontent.com/u/121547898?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Velika</b></sub></a><br /><a href="#design-VelikaHF" title="Design">🎨</a></td>
-    <td align="center"><a href="https://github.com/Svaney-ssman"><img src="https://avatars.githubusercontent.com/u/110808979?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Svaney</b></sub></a><br /><a href="#design-Svaney-ssman" title="Design">🎨</a></td>
-    <td align="center"><a href="http://xell.me/"><img src="https://avatars.githubusercontent.com/u/132558?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Guozhu Liu</b></sub></a><br /><a href="#design-xell" title="Design">🎨</a></td>
-    <td align="center"><a href="https://github.com/fyZheng07"><img src="https://avatars.githubusercontent.com/u/63830919?v=4?s=50" width="50px;" alt=""/><br /><sub><b>fyZheng07</b></sub></a><br /><a href="#eventOrganizing-fyZheng07" title="Event Organizing">📋</a> <a href="#userTesting-fyZheng07" title="User Testing">📓</a></td>
-    <td align="center"><a href="https://github.com/CJSS"><img src="https://avatars.githubusercontent.com/u/4605025?v=4?s=50" width="50px;" alt=""/><br /><sub><b>CJSS</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=CJSS" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/JimmFly"><img src="https://avatars.githubusercontent.com/u/102217452?v=4?s=50" width="50px;" alt=""/><br /><sub><b>JimmFly</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=JimmFly" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/mitsuhatu"><img src="https://avatars.githubusercontent.com/u/110213079?v=4?s=50" width="50px;" alt=""/><br /><sub><b>mitsuhatu</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=mitsuhatu" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=mitsuhatu" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://shockwave.me/"><img src="https://avatars.githubusercontent.com/u/15013925?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Austaras</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Austaras" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=Austaras" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/uptonking"><img src="https://avatars.githubusercontent.com/u/11391549?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Jin Yao</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=uptonking" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=uptonking" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/CarlosZoft"><img src="https://avatars.githubusercontent.com/u/62192072?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Carlos Rafael </b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=CarlosZoft" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/caleboleary"><img src="https://avatars.githubusercontent.com/u/12816579?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Caleb OLeary</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=caleboleary" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/westongraham"><img src="https://avatars.githubusercontent.com/u/89493023?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Weston Graham</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=westongraham" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/SaikaSakura"><img src="https://avatars.githubusercontent.com/u/11530942?v=4?s=50" width="50px;" alt=""/><br /><sub><b>MingLIang Wang</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=SaikaSakura" title="Code">💻</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=SaikaSakura" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/fanjing22"><img src="https://avatars.githubusercontent.com/u/109729699?v=4?s=50" width="50px;" alt=""/><br /><sub><b>fanjing22</b></sub></a><br /><a href="#design-fanjing22" title="Design">🎨</a></td>
-    <td align="center"><a href="https://github.com/pointmax"><img src="https://avatars.githubusercontent.com/u/49361135?v=4?s=50" width="50px;" alt=""/><br /><sub><b>pointmax</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=pointmax" title="Documentation">📖</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=pointmax" title="Code">💻</a></td>
-    <td align="center"><a href="https://liby.github.io/notes"><img src="https://avatars.githubusercontent.com/u/38807139?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Bryan Lee</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=liby" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/chenmoonmo"><img src="https://avatars.githubusercontent.com/u/36295999?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Simon Li</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=chenmoonmo" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/githbq"><img src="https://avatars.githubusercontent.com/u/10009709?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Bob Hu</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=githbq" title="Code">💻</a></td>
-    <td align="center"><a href="https://quavo.vercel.app/"><img src="https://avatars.githubusercontent.com/u/67266933?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Quavo</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=lucky-chap" title="Documentation">📖</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=lucky-chap" title="Code">💻</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/LuciNyan"><img src="https://avatars.githubusercontent.com/u/22126563?v=4?s=50" width="50px;" alt=""/><br /><sub><b>子瞻 Luci</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=LuciNyan" title="Code">💻</a></td>
-    <td align="center"><a href="http://blog.ipili.me/"><img src="https://avatars.githubusercontent.com/u/4948120?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Horus</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=m1911star" title="Code">💻</a> <a href="#platform-m1911star" title="Packaging/porting to new platform">📦</a></td>
-    <td align="center"><a href="https://segmentfault.com/u/qzuser_584786517d31a"><img src="https://avatars.githubusercontent.com/u/15103283?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Super.x</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=fanshyiis" title="Code">💻</a></td>
-    <td align="center"><a href="https://wangyu-1999.github.io/"><img src="https://avatars.githubusercontent.com/u/80874770?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Wang Yu</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=wangyu-1999" title="Code">💻</a></td>
-    <td align="center"><a href="https://felixc.at/"><img src="https://avatars.githubusercontent.com/u/1006477?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Felix Yan</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=felixonmars" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/lynettelopez"><img src="https://avatars.githubusercontent.com/u/32908859?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Lynette Lopez</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=lynettelopez" title="Code">💻</a></td>
-    <td align="center"><a href="http://manjusaka.itscoder.com/"><img src="https://avatars.githubusercontent.com/u/7054676?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Manjusaka</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Zheaoli" title="Code">💻</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://juejin.cn/user/2867982785579102/posts?sort=popular"><img src="https://avatars.githubusercontent.com/u/76603360?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Frozen FIsh</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=sudongyuer" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/MuhammedFaraz"><img src="https://avatars.githubusercontent.com/u/92734739?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Mohammed Faraz</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=MuhammedFaraz" title="Documentation">📖</a> <a href="https://github.com/toeverything/AFFiNE/commits?author=MuhammedFaraz" title="Code">💻</a></td>
-    <td align="center"><a href="https://pranavsriram.dev/"><img src="https://avatars.githubusercontent.com/u/28348429?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Pranav Sriram </b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Pranav4399" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/Reson-a"><img src="https://avatars.githubusercontent.com/u/20806266?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Reson-a</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=Reson-a" title="Code">💻</a></td>
-    <td align="center"><a href="https://t.me/littlepoint"><img src="https://avatars.githubusercontent.com/u/7611700?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Zhizhen He</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=hezhizhen" title="Code">💻</a></td>
-    <td align="center"><a href="https://akr.moe/"><img src="https://avatars.githubusercontent.com/u/85140972?v=4?s=50" width="50px;" alt=""/><br /><sub><b>AkaraChen</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=AkaraChen" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/suyanhanx"><img src="https://avatars.githubusercontent.com/u/24221472?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Suyan</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=suyanhanx" title="Code">💻</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://github.com/hehex9"><img src="https://avatars.githubusercontent.com/u/9209882?v=4?s=50" width="50px;" alt=""/><br /><sub><b>hehe</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=hehex9" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/albertodlc"><img src="https://avatars.githubusercontent.com/u/32411964?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Alberto de la Cruz</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=albertodlc" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/AlessioGr"><img src="https://avatars.githubusercontent.com/u/70709113?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Alessio Gravili</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=AlessioGr" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/lzlme"><img src="https://avatars.githubusercontent.com/u/117659326?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Zhilin Liu</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=lzlme" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/suica"><img src="https://avatars.githubusercontent.com/u/8041462?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Sg</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=suica" title="Code">💻</a></td>
-    <td align="center"><a href="https://sinchang.me/"><img src="https://avatars.githubusercontent.com/u/3297859?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Jeff Wen</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=sinchang" title="Code">💻</a></td>
-    <td align="center"><a href="https://m1212e.github.io/portfolio/"><img src="https://avatars.githubusercontent.com/u/14091540?v=4?s=50" width="50px;" alt=""/><br /><sub><b>m1212e</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=m1212e" title="Code">💻</a></td>
-  </tr>
-  <tr>
-    <td align="center"><a href="https://adityash1.github.io/"><img src="https://avatars.githubusercontent.com/u/65771169?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Aditya Sharma</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=adityash1" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/sheben404"><img src="https://avatars.githubusercontent.com/u/61317160?v=4?s=50" width="50px;" alt=""/><br /><sub><b>Kehan Wang</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=sheben404" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/VictorNanka"><img src="https://avatars.githubusercontent.com/u/30154366?v=4?s=50" width="50px;" alt=""/><br /><sub><b>VictorNanka</b></sub></a><br /><a href="https://github.com/toeverything/AFFiNE/commits?author=VictorNanka" title="Code">💻</a></td>
-  </tr>
-</table>
+We would like to express our gratitude to all the individuals who have already contributed to AFFiNE! If you have any AFFiNE-related project, documentation, tool or template, please feel free to contribute it by submitting a pull request to our curated list on GitHub: [awesome-affine](https://github.com/toeverything/awesome-affine).
 
-<!-- markdownlint-restore -->
-<!-- prettier-ignore-end -->
-
-<!-- ALL-CONTRIBUTORS-LIST:END -->
+<a href="https://github.com/toeverything/affine/graphs/contributors">
+  <img src="https://user-images.githubusercontent.com/5910926/233382206-312428ca-094a-4579-ae06-213961ed7eab.svg" />
+</a>
 
 ## Self-Host
 
@@ -260,11 +183,10 @@ See [LICENSE] for details.
 [jobs available]: ./docs/jobs.md
 [latest packages]: https://github.com/toeverything/AFFiNE/pkgs/container/affine-self-hosted
 [contributor license agreement]: https://github.com/toeverything/affine/edit/master/.github/CLA.md
-[affine-app-logo]: https://img.shields.io/static/v1?label=Try%20Online&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAhpJREFUWEdjZEACtnl3MxgY/0YzMjAaMzAwcCLLUYH9/T/D/7MM/5mXHp6kPANmHiOI4Zx9Xfg3C+tKBob/zlSwiAgjGPey/vkdvneq5luwA+zy7+yhn+Vwv+89NFHFhREU7IyM/6YT4WyqK/n/nymT0Tb/1mFGBkYbqptOhIH/Gf4fYbTLv/2NBgmOCOvBSr6DHPCfWNW0UEe2A2x1uRlakiXBbtpx6jND+7KXZLmPbAdURokzeJjxwi31rrzH8OX7P5IdQbYDtnUoMXBzMMEt7Fj2imH7qU/0cQBy8MNsPHL5K0P13Of0cQB68MNsJScaSI4CHk4mhq3tSnCf3n36k0FZmh3Mn7L+DcPqgx9ICgWSHeBpxsdQESUGtgRk+eqDH+H8O09/MiR3P6atA1qTJRlsdLnhPgYlPOQQCW96wPDi3R+iHUFSCKAHP8wydEeREg0kOQA9+JOgwR1qL8CQEygC9jWp0UCSA+aVysIT3JqDHxgmr38DtlRCiIVhZZ0CPNhB6QDkEGIA0Q4gZAkuxxFyBNEOQA7ml+/+MIQ1PUAxG1kelAhB6YMYQLQDCPmQUAjhcgxRDiDWcEKOxOYIohyQGyjCEGIvANaPLfhhBiNHA6hmBBXNhABRDgCV/aBQAAFQpYMrn4PUgNTCACiXEMoNRDmAkC8okR8UDhjYRumAN8sHvGMCSkAD2jUDOWDAO6ewbDQQ3XMAy/oxKownQR0AAAAASUVORK5CYII=&color=orange&message=%E2%86%92
 [rust-version-icon]: https://img.shields.io/badge/Rust-1.70.0-dea584
 [stars-icon]: https://img.shields.io/github/stars/toeverything/AFFiNE.svg?style=flat&logo=github&colorB=red&label=stars
 [codecov]: https://codecov.io/gh/toeverything/affine/branch/master/graphs/badge.svg?branch=master
-[node-version-icon]: https://img.shields.io/badge/node-%3E=18.15.0-success
+[node-version-icon]: https://img.shields.io/badge/node-%3E=18.16.0-success
 [typescript-version-icon]: https://img.shields.io/github/package-json/dependency-version/toeverything/affine/dev/typescript
 [react-version-icon]: https://img.shields.io/github/package-json/dependency-version/toeverything/affine/dev/react?color=rgb%2897%2C%20218%2C%20251%29
 [blocksuite-icon]: https://img.shields.io/github/package-json/dependency-version/toeverything/AFFiNE/@blocksuite/store?color=6880ff&filename=apps%2Fweb%2Fpackage.json&label=blocksuite

apps/electron/.yarnrc.yml

@@ -1,8 +0,0 @@
-cacheFolder: '../../.yarn/cache'
-# deferredVersionFolder: '../../.yarn/versions'
-globalFolder: '../../.yarn/global'
-installStatePath: '../../.yarn/install-state.gz'
-patchFolder: '../../.yarn/patches'
-pnpUnpluggedFolder: '../../.yarn/unplugged'
-yarnPath: '../../.yarn/releases/yarn-3.5.0.cjs'
-virtualFolder: '../../.yarn/__virtual__'

apps/electron/README.md

@@ -1,21 +1,35 @@
 # AFFiNE Electron App
 
-# ⚠️ NOTE ⚠️
-
-Due to PNPM related issues, this project is currently using **yarn 3**.
-See https://github.com/electron/forge/issues/2633
-
 ## Development
 
+To run AFFiNE Desktop Client Application locally, run the following commands:
+
+```sh
+# in repo root
+yarn install
+yarn dev
+
+# in apps/electron
+yarn generate-assets
+yarn dev # or yarn prod for production build
 ```
-# in project root, start web app at :8080
-yarn dev
 
-# build octobase-node
-yarn workspace @affine/octobase-node build
+## Troubleshooting
 
-# in /apps/electron, start electron app
-yarn dev
+### better-sqlite3 error
+
+When running tests or starting electron, you may encounter the following error:
+
+> Error: The module 'apps/electron/node_modules/better-sqlite3/build/Release/better_sqlite3.node'
+
+This is due to the fact that the `better-sqlite3` package is built for the Node.js version in Electron & in your machine. To fix this, run the following command based on different cases:
+
+```sh
+# for running unit tests, we are not using Electron's node:
+yarn rebuild better-sqlite3
+
+# for running Electron, we are using Electron's node:
+yarn postinstall
 ```
 
 ## Credits

apps/electron/dev-app-update.yml

@@ -0,0 +1,4 @@
+owner: toeverything
+repo: AFFiNE
+provider: github
+private: false

apps/electron/forge.config.js

@@ -1,7 +1,38 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const {
+  utils: { fromBuildIdentifier },
+} = require('@electron-forge/core');
+
+const path = require('node:path');
+
+const buildType = (process.env.BUILD_TYPE || 'stable').trim().toLowerCase();
+const stableBuild = buildType === 'stable';
+const productName = !stableBuild ? `AFFiNE-${buildType}` : 'AFFiNE';
+const icoPath = !stableBuild
+  ? `./resources/icons/icon_${buildType}.ico`
+  : './resources/icons/icon.ico';
+const icnsPath = !stableBuild
+  ? `./resources/icons/icon_${buildType}.icns`
+  : './resources/icons/icon.icns';
+
+const arch =
+  process.argv.indexOf('--arch') > 0
+    ? process.argv[process.argv.indexOf('--arch') + 1]
+    : process.arch;
+
+/**
+ * @type {import('@electron-forge/shared-types').ForgeConfig}
+ */
 module.exports = {
+  buildIdentifier: buildType,
   packagerConfig: {
-    name: 'AFFiNE',
-    icon: './resources/icons/icon.icns',
+    name: productName,
+    appBundleId: fromBuildIdentifier({
+      canary: 'pro.affine.canary',
+      beta: 'pro.affine.beta',
+      stable: 'pro.affine.app',
+    }),
+    icon: icnsPath,
     osxSign: {
       identity: 'Developer ID Application: TOEVERYTHING PTE. LTD.',
       'hardened-runtime': true,
@@ -14,35 +45,79 @@ module.exports = {
           teamId: process.env.APPLE_TEAM_ID,
         }
       : undefined,
+    // do we need the following line?
+    extraResource: ['./resources/app-update.yml'],
   },
   makers: [
     {
       name: '@electron-forge/maker-dmg',
       config: {
         format: 'ULFO',
-        icon: './resources/icons/icon.icns',
+        icon: icnsPath,
         name: 'AFFiNE',
+        'icon-size': 128,
+        background: './resources/icons/dmg-background.png',
+        contents: [
+          {
+            x: 176,
+            y: 192,
+            type: 'file',
+            path: path.resolve(
+              __dirname,
+              'out',
+              buildType,
+              `${productName}-darwin-${arch}`,
+              `${productName}.app`
+            ),
+          },
+          { x: 432, y: 192, type: 'link', path: '/Applications' },
+        ],
       },
     },
     {
       name: '@electron-forge/maker-zip',
       config: {
         name: 'affine',
-        iconUrl: './resources/icons/icon.ico',
-        setupIcon: './resources/icons/icon.ico',
+        iconUrl: icoPath,
+        setupIcon: icoPath,
+        platforms: ['darwin', 'linux', 'win32'],
+      },
+    },
+    {
+      name: '@electron-forge/maker-squirrel',
+      config: {
+        name: 'AFFiNE',
+        setupIcon: icoPath,
+        // loadingGif: './resources/icons/loading.gif',
       },
     },
   ],
   hooks: {
+    readPackageJson: async (_, packageJson) => {
+      // we want different package name for canary build
+      // so stable and canary will not share the same app data
+      packageJson.productName = productName;
+    },
     generateAssets: async (_, platform, arch) => {
+      if (process.env.SKIP_GENERATE_ASSETS) {
+        return;
+      }
+
       const { $ } = await import('zx');
 
+      // TODO: right now we do not need the following
+      // it is for octobase-node, but we dont use it for now.
       if (platform === 'darwin' && arch === 'arm64') {
         // In GitHub Actions runner, MacOS is always x64
         // we need to manually set TARGET to aarch64-apple-darwin
         process.env.TARGET = 'aarch64-apple-darwin';
       }
 
+      if (platform === 'win32') {
+        $.shell = 'powershell.exe';
+        $.prefix = '';
+      }
+
       // run yarn generate-assets
       await $`yarn generate-assets`;
     },

apps/electron/layers/constraints.ts

@@ -0,0 +1,7 @@
+/* eslint-disable @typescript-eslint/consistent-type-imports */
+// This file contains the main process events
+// It will guide preload and main process on the correct event types and payloads
+
+export type MainIPCHandlerMap = typeof import('./main/src/exposed').handlers;
+
+export type MainIPCEventMap = typeof import('./main/src/exposed').events;

apps/electron/layers/main/src/app-state/google-auth.ts

@@ -1,32 +0,0 @@
-import type { RequestInit } from 'undici';
-import { fetch, ProxyAgent } from 'undici';
-
-const redirectUri = 'https://affine.pro/client/auth-callback';
-
-export const oauthEndpoint = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.AFFINE_GOOGLE_CLIENT_ID}&redirect_uri=${redirectUri}&response_type=code&scope=openid https://www.googleapis.com/auth/userinfo.email profile&access_type=offline&customParameters={"prompt":"select_account"}`;
-
-const tokenEndpoint = 'https://oauth2.googleapis.com/token';
-
-export const exchangeToken = async (code: string) => {
-  const httpProxy = process.env.HTTP_PROXY || process.env.http_proxy;
-  const proxyAgent = httpProxy ? new ProxyAgent(httpProxy) : undefined;
-
-  const postData = {
-    code,
-    client_id: process.env.AFFINE_GOOGLE_CLIENT_ID || '',
-    client_secret: process.env.AFFINE_GOOGLE_CLIENT_SECRET || '',
-    redirect_uri: redirectUri,
-    grant_type: 'authorization_code',
-  };
-  const requestOptions: RequestInit = {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/x-www-form-urlencoded',
-    },
-    body: new URLSearchParams(postData).toString(),
-    dispatcher: proxyAgent,
-  };
-  return fetch(tokenEndpoint, requestOptions).then(response => {
-    return response.json();
-  });
-};

apps/electron/layers/main/src/app-state/index.ts

@@ -1,74 +0,0 @@
-import * as os from 'node:os';
-import path from 'node:path';
-
-import { Storage } from '@affine/octobase-node';
-import { app, shell } from 'electron';
-import { BrowserWindow, ipcMain, nativeTheme } from 'electron';
-import fs from 'fs-extra';
-import { parse } from 'url';
-
-import { exchangeToken, oauthEndpoint } from './google-auth';
-
-const AFFINE_ROOT = path.join(os.homedir(), '.affine');
-
-fs.ensureDirSync(AFFINE_ROOT);
-
-const logger = console;
-
-// todo: rethink this
-export const appState = {
-  storage: new Storage(path.join(AFFINE_ROOT, 'test.db')),
-};
-
-export const registerHandlers = () => {
-  ipcMain.handle('octo:workspace-sync', async (_, id) => {
-    return appState.storage.sync(id, '');
-  });
-
-  ipcMain.handle('ui:theme-change', async (_, theme) => {
-    nativeTheme.themeSource = theme;
-    logger.info('theme change', theme);
-  });
-
-  ipcMain.handle('ui:sidebar-visibility-change', async (_, visible) => {
-    // todo
-    const windows = BrowserWindow.getAllWindows();
-    windows.forEach(w => {
-      // hide window buttons when sidebar is not visible
-      w.setWindowButtonVisibility(visible);
-    });
-    logger.info('sidebar visibility change', visible);
-  });
-
-  ipcMain.handle('ui:google-sign-in', async () => {
-    logger.info('starting google sign in ...');
-    shell.openExternal(oauthEndpoint);
-
-    return new Promise<string>((resolve, reject) => {
-      const handleOpenUrl = async (_: any, url: string) => {
-        const mainWindow = BrowserWindow.getAllWindows().find(
-          w => !w.isDestroyed()
-        );
-        const urlObj = parse(url.replace('??', '?'), true);
-        if (!mainWindow || !url.startsWith('affine://')) return;
-        const token = (await exchangeToken(urlObj.query['code'] as string)) as {
-          id_token: string;
-        };
-        app.removeListener('open-url', handleOpenUrl);
-        resolve(token.id_token);
-        logger.info('google sign in successful', token);
-      };
-
-      app.on('open-url', handleOpenUrl);
-
-      setTimeout(() => {
-        reject(new Error('Timed out'));
-        app.removeListener('open-url', handleOpenUrl);
-      }, 60000);
-    });
-  });
-
-  ipcMain.handle('main:env-update', async (_, env, value) => {
-    process.env[env] = value;
-  });
-};

apps/electron/layers/main/src/context.ts

@@ -0,0 +1,12 @@
+import { app } from 'electron';
+
+export const appContext = {
+  get appName() {
+    return app.name;
+  },
+  get appDataPath() {
+    return app.getPath('sessionData');
+  },
+};
+
+export type AppContext = typeof appContext;

apps/electron/layers/main/src/events/db.ts

@@ -0,0 +1,26 @@
+import { Subject } from 'rxjs';
+
+import type { MainEventListener } from './type';
+
+export const dbSubjects = {
+  // emit workspace ids
+  dbFileMissing: new Subject<string>(),
+  // emit workspace ids
+  dbFileUpdate: new Subject<string>(),
+};
+
+export const dbEvents = {
+  onDbFileMissing: (fn: (workspaceId: string) => void) => {
+    const sub = dbSubjects.dbFileMissing.subscribe(fn);
+
+    return () => {
+      sub.unsubscribe();
+    };
+  },
+  onDbFileUpdate: (fn: (workspaceId: string) => void) => {
+    const sub = dbSubjects.dbFileUpdate.subscribe(fn);
+    return () => {
+      sub.unsubscribe();
+    };
+  },
+} satisfies Record<string, MainEventListener>;

apps/electron/layers/main/src/events/index.ts

@@ -0,0 +1,7 @@
+export * from './register';
+
+import { dbSubjects } from './db';
+
+export const subjects = {
+  db: dbSubjects,
+};

apps/electron/layers/main/src/events/register.ts

@@ -0,0 +1,30 @@
+import { app, BrowserWindow } from 'electron';
+
+import { logger } from '../logger';
+import { dbEvents } from './db';
+import { updaterEvents } from './updater';
+
+export const allEvents = {
+  db: dbEvents,
+  updater: updaterEvents,
+};
+
+function getActiveWindows() {
+  return BrowserWindow.getAllWindows().filter(win => !win.isDestroyed());
+}
+
+export function registerEvents() {
+  // register events
+  for (const [namespace, namespaceEvents] of Object.entries(allEvents)) {
+    for (const [key, eventRegister] of Object.entries(namespaceEvents)) {
+      const subscription = eventRegister((...args: any) => {
+        const chan = `${namespace}:${key}`;
+        logger.info('[ipc-event]', chan, args);
+        getActiveWindows().forEach(win => win.webContents.send(chan, ...args));
+      });
+      app.on('before-quit', () => {
+        subscription();
+      });
+    }
+  }
+}

apps/electron/layers/main/src/events/type.ts

@@ -0,0 +1 @@
+export type MainEventListener = (...args: any[]) => () => void;

apps/electron/layers/main/src/events/updater.ts

@@ -0,0 +1,21 @@
+import { Subject } from 'rxjs';
+
+import type { MainEventListener } from './type';
+
+interface UpdateMeta {
+  version: string;
+}
+
+export const updaterSubjects = {
+  // means it is ready for restart and install the new version
+  clientUpdateReady: new Subject<UpdateMeta>(),
+};
+
+export const updaterEvents = {
+  onClientUpdateReady: (fn: (versionMeta: UpdateMeta) => void) => {
+    const sub = updaterSubjects.clientUpdateReady.subscribe(fn);
+    return () => {
+      sub.unsubscribe();
+    };
+  },
+} satisfies Record<string, MainEventListener>;

apps/electron/layers/main/src/exposed.ts

@@ -0,0 +1,5 @@
+import { allEvents as events } from './events';
+import { allHandlers as handlers } from './handlers';
+
+// this will be used by preload script to expose all handlers and events to the renderer process
+export { events, handlers };

apps/electron/layers/main/src/handlers/__tests__/.gitignore

@@ -0,0 +1 @@
+tmp

apps/electron/layers/main/src/handlers/__tests__/handlers.spec.ts

@@ -0,0 +1,472 @@
+import assert from 'node:assert';
+import path from 'node:path';
+
+import fs from 'fs-extra';
+import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
+import * as Y from 'yjs';
+
+import type { MainIPCHandlerMap } from '../../../../constraints';
+
+const registeredHandlers = new Map<
+  string,
+  ((...args: any[]) => Promise<any>)[]
+>();
+
+const delay = (ms: number) => new Promise(r => setTimeout(r, ms));
+
+type WithoutFirstParameter<T> = T extends (_: any, ...args: infer P) => infer R
+  ? (...args: P) => R
+  : T;
+
+// common mock dispatcher for ipcMain.handle AND app.on
+// alternatively, we can use single parameter for T & F, eg, dispatch('workspace:list'),
+// however this is too hard to be typed correctly
+async function dispatch<
+  T extends keyof MainIPCHandlerMap,
+  F extends keyof MainIPCHandlerMap[T]
+>(
+  namespace: T,
+  functionName: F,
+  // @ts-ignore
+  ...args: Parameters<WithoutFirstParameter<MainIPCHandlerMap[T][F]>>
+): // @ts-ignore
+ReturnType<MainIPCHandlerMap[T][F]> {
+  // @ts-ignore
+  const handlers = registeredHandlers.get(namespace + ':' + functionName);
+  assert(handlers);
+
+  // we only care about the first handler here
+  return await handlers[0](null, ...args);
+}
+
+const SESSION_DATA_PATH = path.join(__dirname, './tmp', 'affine-test');
+
+const browserWindow = {
+  isDestroyed: () => {
+    return false;
+  },
+  setWindowButtonVisibility: (_v: boolean) => {
+    // will be stubbed later
+  },
+  webContents: {
+    send: (_type: string, ..._args: any[]) => {
+      // will be stubbed later
+    },
+  },
+};
+
+const ipcMain = {
+  handle: (key: string, callback: (...args: any[]) => Promise<any>) => {
+    const handlers = registeredHandlers.get(key) || [];
+    handlers.push(callback);
+    registeredHandlers.set(key, handlers);
+  },
+};
+
+const nativeTheme = {
+  themeSource: 'light',
+};
+
+function compareBuffer(a: Uint8Array | null, b: Uint8Array | null) {
+  if (
+    (a === null && b === null) ||
+    a === null ||
+    b === null ||
+    a.length !== b.length
+  ) {
+    return false;
+  }
+  for (let i = 0; i < a.length; i++) {
+    if (a[i] !== b[i]) {
+      return false;
+    }
+  }
+  return true;
+}
+
+const electronModule = {
+  app: {
+    getPath: (name: string) => {
+      assert(name === 'sessionData');
+      return SESSION_DATA_PATH;
+    },
+    name: 'affine-test',
+    on: (name: string, callback: (...args: any[]) => any) => {
+      const handlers = registeredHandlers.get(name) || [];
+      handlers.push(callback);
+      registeredHandlers.set(name, handlers);
+    },
+  },
+  BrowserWindow: {
+    getAllWindows: () => {
+      return [browserWindow];
+    },
+  },
+  nativeTheme: nativeTheme,
+  ipcMain,
+  shell: {} as Partial<Electron.Shell>,
+  dialog: {} as Partial<Electron.Dialog>,
+};
+
+// dynamically import handlers so that we can inject local variables to mocks
+vi.doMock('electron', () => {
+  return electronModule;
+});
+
+beforeEach(async () => {
+  const { registerHandlers } = await import('../register');
+  registerHandlers();
+
+  // should also register events
+  const { registerEvents } = await import('../../events');
+  registerEvents();
+});
+
+afterEach(async () => {
+  const { cleanupSQLiteDBs } = await import('../db/ensure-db');
+  await cleanupSQLiteDBs();
+  await fs.remove(SESSION_DATA_PATH);
+
+  // reset registered handlers
+  registeredHandlers.get('before-quit')?.forEach(fn => fn());
+});
+
+describe('ensureSQLiteDB', () => {
+  test('should create db file on connection if it does not exist', async () => {
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    const workspaceDB = await ensureSQLiteDB(id);
+    const file = workspaceDB.path;
+    const fileExists = await fs.pathExists(file);
+    expect(fileExists).toBe(true);
+  });
+
+  test('when db file is removed', async () => {
+    // stub webContents.send
+    const sendStub = vi.fn();
+    browserWindow.webContents.send = sendStub;
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    let workspaceDB = await ensureSQLiteDB(id);
+    const file = workspaceDB.path;
+    const fileExists = await fs.pathExists(file);
+    expect(fileExists).toBe(true);
+
+    await fs.remove(file);
+
+    // wait for 1000ms for file watcher to detect file removal
+    await delay(2000);
+
+    expect(sendStub).toBeCalledWith('db:onDbFileMissing', id);
+
+    // ensureSQLiteDB should recreate the db file
+    workspaceDB = await ensureSQLiteDB(id);
+    const fileExists2 = await fs.pathExists(file);
+    expect(fileExists2).toBe(true);
+  });
+
+  test('when db file is updated', async () => {
+    // stub webContents.send
+    const sendStub = vi.fn();
+    browserWindow.webContents.send = sendStub;
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    const workspaceDB = await ensureSQLiteDB(id);
+    const file = workspaceDB.path;
+    const fileExists = await fs.pathExists(file);
+    expect(fileExists).toBe(true);
+
+    // wait to make sure
+    await delay(500);
+
+    // writes some data to the db file
+    await fs.appendFile(file, 'random-data', { encoding: 'binary' });
+    // write again
+    await fs.appendFile(file, 'random-data', { encoding: 'binary' });
+
+    // wait for 200ms for file watcher to detect file change
+    await delay(2000);
+
+    expect(sendStub).toBeCalledWith('db:onDbFileUpdate', id);
+
+    // should only call once for multiple writes
+    expect(sendStub).toBeCalledTimes(1);
+  });
+});
+
+describe('workspace handlers', () => {
+  test('list all workspace ids', async () => {
+    const ids = ['test-workspace-id', 'test-workspace-id-2'];
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await Promise.all(ids.map(id => ensureSQLiteDB(id)));
+    const list = await dispatch('workspace', 'list');
+    expect(list.map(([id]) => id)).toEqual(ids);
+  });
+
+  test('delete workspace', async () => {
+    const ids = ['test-workspace-id', 'test-workspace-id-2'];
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await Promise.all(ids.map(id => ensureSQLiteDB(id)));
+    await dispatch('workspace', 'delete', 'test-workspace-id-2');
+    const list = await dispatch('workspace', 'list');
+    expect(list.map(([id]) => id)).toEqual(['test-workspace-id']);
+  });
+});
+
+describe('UI handlers', () => {
+  test('theme-change', async () => {
+    await dispatch('ui', 'handleThemeChange', 'dark');
+    expect(nativeTheme.themeSource).toBe('dark');
+    await dispatch('ui', 'handleThemeChange', 'light');
+    expect(nativeTheme.themeSource).toBe('light');
+  });
+
+  test('sidebar-visibility-change (macOS)', async () => {
+    vi.stubGlobal('process', { platform: 'darwin' });
+    const setWindowButtonVisibility = vi.fn();
+    browserWindow.setWindowButtonVisibility = setWindowButtonVisibility;
+    await dispatch('ui', 'handleSidebarVisibilityChange', true);
+    expect(setWindowButtonVisibility).toBeCalledWith(true);
+    await dispatch('ui', 'handleSidebarVisibilityChange', false);
+    expect(setWindowButtonVisibility).toBeCalledWith(false);
+    vi.unstubAllGlobals();
+  });
+
+  test('sidebar-visibility-change (non-macOS)', async () => {
+    vi.stubGlobal('process', { platform: 'linux' });
+    const setWindowButtonVisibility = vi.fn();
+    browserWindow.setWindowButtonVisibility = setWindowButtonVisibility;
+    await dispatch('ui', 'handleSidebarVisibilityChange', true);
+    expect(setWindowButtonVisibility).not.toBeCalled();
+    vi.unstubAllGlobals();
+  });
+});
+
+describe('db handlers', () => {
+  test('apply doc and get doc updates', async () => {
+    const workspaceId = 'test-workspace-id';
+    const bin = await dispatch('db', 'getDocAsUpdates', workspaceId);
+    // ? is this a good test?
+    expect(bin.every((byte: number) => byte === 0)).toBe(true);
+
+    const ydoc = new Y.Doc();
+    const ytext = ydoc.getText('test');
+    ytext.insert(0, 'hello world');
+    const bin2 = Y.encodeStateAsUpdate(ydoc);
+
+    await dispatch('db', 'applyDocUpdate', workspaceId, bin2);
+
+    const bin3 = await dispatch('db', 'getDocAsUpdates', workspaceId);
+    const ydoc2 = new Y.Doc();
+    Y.applyUpdate(ydoc2, bin3);
+    const ytext2 = ydoc2.getText('test');
+    expect(ytext2.toString()).toBe('hello world');
+  });
+
+  test('get non existent blob', async () => {
+    const workspaceId = 'test-workspace-id';
+    const bin = await dispatch('db', 'getBlob', workspaceId, 'non-existent-id');
+    expect(bin).toBeNull();
+  });
+
+  test('list blobs (empty)', async () => {
+    const workspaceId = 'test-workspace-id';
+    const list = await dispatch('db', 'getPersistedBlobs', workspaceId);
+    expect(list).toEqual([]);
+  });
+
+  test('CRUD blobs', async () => {
+    const testBin = new Uint8Array([1, 2, 3, 4, 5]);
+    const testBin2 = new Uint8Array([6, 7, 8, 9, 10]);
+    const workspaceId = 'test-workspace-id';
+
+    // add blob
+    await dispatch('db', 'addBlob', workspaceId, 'testBin', testBin);
+
+    // get blob
+    expect(
+      compareBuffer(
+        await dispatch('db', 'getBlob', workspaceId, 'testBin'),
+        testBin
+      )
+    ).toBe(true);
+
+    // add another blob
+    await dispatch('db', 'addBlob', workspaceId, 'testBin2', testBin2);
+    expect(
+      compareBuffer(
+        await dispatch('db', 'getBlob', workspaceId, 'testBin2'),
+        testBin2
+      )
+    ).toBe(true);
+
+    // list blobs
+    let lists = await dispatch('db', 'getPersistedBlobs', workspaceId);
+    expect(lists).toHaveLength(2);
+    expect(lists).toContain('testBin');
+    expect(lists).toContain('testBin2');
+
+    // delete blob
+    await dispatch('db', 'deleteBlob', workspaceId, 'testBin');
+    lists = await dispatch('db', 'getPersistedBlobs', workspaceId);
+    expect(lists).toEqual(['testBin2']);
+  });
+});
+
+describe('dialog handlers', () => {
+  test('revealDBFile', async () => {
+    const mockShowItemInFolder = vi.fn();
+    electronModule.shell.showItemInFolder = mockShowItemInFolder;
+
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    const db = await ensureSQLiteDB(id);
+
+    await dispatch('dialog', 'revealDBFile', id);
+    expect(mockShowItemInFolder).toBeCalledWith(db.path);
+  });
+
+  test('saveDBFileAs (skipped)', async () => {
+    const mockShowSaveDialog = vi.fn(() => {
+      return { filePath: undefined };
+    }) as any;
+    const mockShowItemInFolder = vi.fn();
+    electronModule.dialog.showSaveDialog = mockShowSaveDialog;
+    electronModule.shell.showItemInFolder = mockShowItemInFolder;
+
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await ensureSQLiteDB(id);
+
+    await dispatch('dialog', 'saveDBFileAs', id);
+    expect(mockShowSaveDialog).toBeCalled();
+    expect(mockShowItemInFolder).not.toBeCalled();
+  });
+
+  test('saveDBFileAs', async () => {
+    const newSavedPath = path.join(SESSION_DATA_PATH, 'saved-to');
+    const mockShowSaveDialog = vi.fn(() => {
+      return { filePath: newSavedPath };
+    }) as any;
+    const mockShowItemInFolder = vi.fn();
+    electronModule.dialog.showSaveDialog = mockShowSaveDialog;
+    electronModule.shell.showItemInFolder = mockShowItemInFolder;
+
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await ensureSQLiteDB(id);
+
+    await dispatch('dialog', 'saveDBFileAs', id);
+    expect(mockShowSaveDialog).toBeCalled();
+    expect(mockShowItemInFolder).toBeCalledWith(newSavedPath);
+
+    // check if file is saved to new path
+    expect(await fs.exists(newSavedPath)).toBe(true);
+  });
+
+  test('loadDBFile (skipped)', async () => {
+    const mockShowOpenDialog = vi.fn(() => {
+      return { filePaths: undefined };
+    }) as any;
+    electronModule.dialog.showOpenDialog = mockShowOpenDialog;
+
+    const res = await dispatch('dialog', 'loadDBFile');
+    expect(mockShowOpenDialog).toBeCalled();
+    expect(res.canceled).toBe(true);
+  });
+
+  test('loadDBFile (error, in app-data)', async () => {
+    const mockShowOpenDialog = vi.fn(() => {
+      return {
+        filePaths: [path.join(SESSION_DATA_PATH, 'workspaces')],
+      };
+    }) as any;
+    electronModule.dialog.showOpenDialog = mockShowOpenDialog;
+
+    const res = await dispatch('dialog', 'loadDBFile');
+    expect(mockShowOpenDialog).toBeCalled();
+    expect(res.error).toBe('DB_FILE_PATH_INVALID');
+  });
+
+  test('loadDBFile (error, not a valid db file)', async () => {
+    // create a random db file
+    const basePath = path.join(SESSION_DATA_PATH, 'random-path');
+    const dbPath = path.join(basePath, 'xxx.db');
+    await fs.ensureDir(basePath);
+    await fs.writeFile(dbPath, 'hello world');
+
+    const mockShowOpenDialog = vi.fn(() => {
+      return { filePaths: [dbPath] };
+    }) as any;
+    electronModule.dialog.showOpenDialog = mockShowOpenDialog;
+
+    const res = await dispatch('dialog', 'loadDBFile');
+    expect(mockShowOpenDialog).toBeCalled();
+    expect(res.error).toBe('DB_FILE_INVALID');
+  });
+
+  test('loadDBFile', async () => {
+    // we use ensureSQLiteDB to create a valid db file
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    const db = await ensureSQLiteDB(id);
+
+    // copy db file to dbPath
+    const basePath = path.join(SESSION_DATA_PATH, 'random-path');
+    const originDBFilePath = path.join(basePath, 'xxx.db');
+    await fs.ensureDir(basePath);
+    await fs.copyFile(db.path, originDBFilePath);
+
+    // remove db
+    await fs.remove(db.path);
+
+    // try load originDBFilePath
+    const mockShowOpenDialog = vi.fn(() => {
+      return { filePaths: [originDBFilePath] };
+    }) as any;
+    electronModule.dialog.showOpenDialog = mockShowOpenDialog;
+
+    const res = await dispatch('dialog', 'loadDBFile');
+    expect(mockShowOpenDialog).toBeCalled();
+    expect(res.workspaceId).not.toBeUndefined();
+
+    const importedDb = await ensureSQLiteDB(res.workspaceId!);
+    expect(await fs.realpath(importedDb.path)).toBe(originDBFilePath);
+    expect(importedDb.path).not.toBe(originDBFilePath);
+
+    // try load it again, will trigger error (db file already loaded)
+    const res2 = await dispatch('dialog', 'loadDBFile');
+    expect(res2.error).toBe('DB_FILE_ALREADY_LOADED');
+  });
+
+  test('moveDBFile', async () => {
+    const newPath = path.join(SESSION_DATA_PATH, 'affine-test', 'xxx');
+    const mockShowSaveDialog = vi.fn(() => {
+      return { filePath: newPath };
+    }) as any;
+    electronModule.dialog.showSaveDialog = mockShowSaveDialog;
+
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await ensureSQLiteDB(id);
+
+    const res = await dispatch('dialog', 'moveDBFile', id);
+    expect(mockShowSaveDialog).toBeCalled();
+    expect(res.filePath).toBe(newPath);
+  });
+
+  test('moveDBFile (skipped)', async () => {
+    const mockShowSaveDialog = vi.fn(() => {
+      return { filePath: null };
+    }) as any;
+    electronModule.dialog.showSaveDialog = mockShowSaveDialog;
+
+    const id = 'test-workspace-id';
+    const { ensureSQLiteDB } = await import('../db/ensure-db');
+    await ensureSQLiteDB(id);
+
+    const res = await dispatch('dialog', 'moveDBFile', id);
+    expect(mockShowSaveDialog).toBeCalled();
+    expect(res.filePath).toBe(undefined);
+  });
+});

apps/electron/layers/main/src/handlers/db/ensure-db.ts

@@ -0,0 +1,89 @@
+import { watch } from 'chokidar';
+
+import { appContext } from '../../context';
+import { subjects } from '../../events';
+import { logger } from '../../logger';
+import { debounce, ts } from '../../utils';
+import type { WorkspaceSQLiteDB } from './sqlite';
+import { openWorkspaceDatabase } from './sqlite';
+
+const dbMapping = new Map<string, Promise<WorkspaceSQLiteDB>>();
+const dbWatchers = new Map<string, () => void>();
+
+// if we removed the file, we will stop watching it
+function startWatchingDBFile(db: WorkspaceSQLiteDB) {
+  if (dbWatchers.has(db.workspaceId)) {
+    return dbWatchers.get(db.workspaceId);
+  }
+  logger.info('watch db file', db.path);
+  const watcher = watch(db.path);
+
+  const debounceOnChange = debounce(() => {
+    logger.info(
+      'db file changed on disk',
+      db.workspaceId,
+      ts() - db.lastUpdateTime,
+      'ms'
+    );
+    // reconnect db
+    db.reconnectDB();
+    subjects.db.dbFileUpdate.next(db.workspaceId);
+  }, 1000);
+
+  watcher.on('change', () => {
+    const currentTime = ts();
+    if (currentTime - db.lastUpdateTime > 100) {
+      debounceOnChange();
+    }
+  });
+
+  dbWatchers.set(db.workspaceId, () => {
+    watcher.close();
+  });
+
+  // todo: there is still a possibility that the file is deleted
+  // but we didn't get the event soon enough and another event tries to
+  // access the db
+  watcher.on('unlink', () => {
+    logger.info('db file missing', db.workspaceId);
+    subjects.db.dbFileMissing.next(db.workspaceId);
+    // cleanup
+    watcher.close().then(() => {
+      db.destroy();
+      dbWatchers.delete(db.workspaceId);
+      dbMapping.delete(db.workspaceId);
+    });
+  });
+}
+
+export async function ensureSQLiteDB(id: string) {
+  let workspaceDB = dbMapping.get(id);
+  if (!workspaceDB) {
+    logger.info('[ensureSQLiteDB] open db connection', id);
+    workspaceDB = openWorkspaceDatabase(appContext, id);
+    dbMapping.set(id, workspaceDB);
+    startWatchingDBFile(await workspaceDB);
+  }
+  return await workspaceDB;
+}
+
+export async function disconnectSQLiteDB(id: string) {
+  const dbp = dbMapping.get(id);
+  if (dbp) {
+    const db = await dbp;
+    logger.info('close db connection', id);
+    db.destroy();
+    dbWatchers.get(id)?.();
+    dbWatchers.delete(id);
+    dbMapping.delete(id);
+  }
+}
+
+export async function cleanupSQLiteDBs() {
+  for (const [id] of dbMapping) {
+    logger.info('close db connection', id);
+    await disconnectSQLiteDB(id);
+  }
+  dbMapping.clear();
+  dbWatchers.clear();
+}

apps/electron/layers/main/src/handlers/db/index.ts

@@ -0,0 +1,33 @@
+import { appContext } from '../../context';
+import type { NamespaceHandlers } from '../type';
+import { ensureSQLiteDB } from './ensure-db';
+
+export const dbHandlers = {
+  getDocAsUpdates: async (_, id: string) => {
+    const workspaceDB = await ensureSQLiteDB(id);
+    return workspaceDB.getDocAsUpdates();
+  },
+  applyDocUpdate: async (_, id: string, update: Uint8Array) => {
+    const workspaceDB = await ensureSQLiteDB(id);
+    return workspaceDB.applyUpdate(update);
+  },
+  addBlob: async (_, workspaceId: string, key: string, data: Uint8Array) => {
+    const workspaceDB = await ensureSQLiteDB(workspaceId);
+    return workspaceDB.addBlob(key, data);
+  },
+  getBlob: async (_, workspaceId: string, key: string) => {
+    const workspaceDB = await ensureSQLiteDB(workspaceId);
+    return workspaceDB.getBlob(key);
+  },
+  deleteBlob: async (_, workspaceId: string, key: string) => {
+    const workspaceDB = await ensureSQLiteDB(workspaceId);
+    return workspaceDB.deleteBlob(key);
+  },
+  getPersistedBlobs: async (_, workspaceId: string) => {
+    const workspaceDB = await ensureSQLiteDB(workspaceId);
+    return workspaceDB.getPersistentBlobKeys();
+  },
+  getDefaultStorageLocation: async () => {
+    return appContext.appDataPath;
+  },
+} satisfies NamespaceHandlers;

apps/electron/layers/main/src/handlers/db/sqlite.ts

@@ -0,0 +1,231 @@
+import path from 'node:path';
+
+import type { Database } from 'better-sqlite3';
+import sqlite from 'better-sqlite3';
+import fs from 'fs-extra';
+import * as Y from 'yjs';
+
+import type { AppContext } from '../../context';
+import { logger } from '../../logger';
+import { ts } from '../../utils';
+
+const schemas = [
+  `CREATE TABLE IF NOT EXISTS "updates" (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  data BLOB NOT NULL,
+  timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL
+)`,
+  `CREATE TABLE IF NOT EXISTS "blobs" (
+  key TEXT PRIMARY KEY NOT NULL,
+  data BLOB NOT NULL,
+  timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP NOT NULL
+)`,
+];
+
+interface UpdateRow {
+  id: number;
+  data: Buffer;
+  timestamp: string;
+}
+
+interface BlobRow {
+  key: string;
+  data: Buffer;
+  timestamp: string;
+}
+
+const SQLITE_ORIGIN = Symbol('sqlite-origin');
+
+export class WorkspaceSQLiteDB {
+  db: Database;
+  ydoc = new Y.Doc();
+  firstConnect = false;
+  lastUpdateTime = ts();
+
+  constructor(public path: string, public workspaceId: string) {
+    this.db = this.reconnectDB();
+  }
+
+  // release resources
+  destroy = () => {
+    this.db?.close();
+    this.ydoc.destroy();
+  };
+
+  getWorkspaceName = () => {
+    return this.ydoc.getMap('space:meta').get('name') as string;
+  };
+
+  reconnectDB = () => {
+    logger.log('open db', this.workspaceId);
+    if (this.db) {
+      this.db.close();
+    }
+
+    // use cached version?
+    const db = (this.db = sqlite(this.path));
+    db.exec(schemas.join(';'));
+
+    if (!this.firstConnect) {
+      this.ydoc.on('update', (update: Uint8Array, origin) => {
+        if (origin !== SQLITE_ORIGIN) {
+          this.addUpdateToSQLite(update);
+        }
+      });
+    }
+
+    Y.transact(this.ydoc, () => {
+      const updates = this.getUpdates();
+      updates.forEach(update => {
+        // give SQLITE_ORIGIN to skip self update
+        Y.applyUpdate(this.ydoc, update.data, SQLITE_ORIGIN);
+      });
+    });
+
+    this.lastUpdateTime = ts();
+
+    if (this.firstConnect) {
+      logger.info('db reconnected', this.workspaceId);
+    } else {
+      logger.info('db connected', this.workspaceId);
+    }
+
+    this.firstConnect = true;
+
+    return db;
+  };
+
+  getDocAsUpdates = () => {
+    return Y.encodeStateAsUpdate(this.ydoc);
+  };
+
+  // non-blocking and use yDoc to validate the update
+  // after that, the update is added to the db
+  applyUpdate = (data: Uint8Array) => {
+    Y.applyUpdate(this.ydoc, data);
+
+    // todo: trim the updates when the number of records is too large
+    // 1. store the current ydoc state in the db
+    // 2. then delete the old updates
+    // yjs-idb will always trim the db for the first time after DB is loaded
+    this.lastUpdateTime = ts();
+    logger.debug('applyUpdate', this.workspaceId, this.lastUpdateTime);
+  };
+
+  addBlob = (key: string, data: Uint8Array) => {
+    this.lastUpdateTime = ts();
+    try {
+      const statement = this.db.prepare(
+        'INSERT INTO blobs (key, data) VALUES (?, ?) ON CONFLICT(key) DO UPDATE SET data = ?'
+      );
+      statement.run(key, data, data);
+      return key;
+    } catch (error) {
+      logger.error('addBlob', error);
+    }
+  };
+
+  getBlob = (key: string) => {
+    try {
+      const statement = this.db.prepare('SELECT data FROM blobs WHERE key = ?');
+      const row = statement.get(key) as BlobRow;
+      if (!row) {
+        return null;
+      }
+      return row.data;
+    } catch (error) {
+      logger.error('getBlob', error);
+      return null;
+    }
+  };
+
+  deleteBlob = (key: string) => {
+    this.lastUpdateTime = ts();
+    try {
+      const statement = this.db.prepare('DELETE FROM blobs WHERE key = ?');
+      statement.run(key);
+    } catch (error) {
+      logger.error('deleteBlob', error);
+    }
+  };
+
+  getPersistentBlobKeys = () => {
+    try {
+      const statement = this.db.prepare('SELECT key FROM blobs');
+      const rows = statement.all() as BlobRow[];
+      return rows.map(row => row.key);
+    } catch (error) {
+      logger.error('getPersistentBlobKeys', error);
+      return [];
+    }
+  };
+
+  private getUpdates = () => {
+    try {
+      const statement = this.db.prepare('SELECT * FROM updates');
+      const rows = statement.all() as UpdateRow[];
+      return rows;
+    } catch (error) {
+      logger.error('getUpdates', error);
+      return [];
+    }
+  };
+
+  // batch write instead write per key stroke?
+  private addUpdateToSQLite = (data: Uint8Array) => {
+    try {
+      const start = performance.now();
+      const statement = this.db.prepare(
+        'INSERT INTO updates (data) VALUES (?)'
+      );
+      statement.run(data);
+      logger.debug(
+        'addUpdateToSQLite',
+        this.workspaceId,
+        'length:',
+        data.length,
+        performance.now() - start,
+        'ms'
+      );
+    } catch (error) {
+      logger.error('addUpdateToSQLite', error);
+    }
+  };
+}
+
+export async function getWorkspaceDBPath(
+  context: AppContext,
+  workspaceId: string
+) {
+  const basePath = path.join(context.appDataPath, 'workspaces', workspaceId);
+  await fs.ensureDir(basePath);
+  return path.join(basePath, 'storage.db');
+}
+
+export async function openWorkspaceDatabase(
+  context: AppContext,
+  workspaceId: string
+) {
+  const dbPath = await getWorkspaceDBPath(context, workspaceId);
+  return new WorkspaceSQLiteDB(dbPath, workspaceId);
+}
+
+export function isValidDBFile(path: string) {
+  try {
+    const db = sqlite(path);
+    // check if db has two tables, one for updates and onefor blobs
+    const statement = db.prepare(
+      `SELECT name FROM sqlite_schema WHERE type='table'`
+    );
+    const rows = statement.all() as { name: string }[];
+    const tableNames = rows.map(row => row.name);
+    if (!tableNames.includes('updates') || !tableNames.includes('blobs')) {
+      return false;
+    }
+    db.close();
+    return true;
+  } catch (error) {
+    logger.error('isValidDBFile', error);
+    return false;
+  }
+}

apps/electron/layers/main/src/handlers/dialog/dialog.ts

@@ -0,0 +1,293 @@
+import path from 'node:path';
+
+import { dialog, shell } from 'electron';
+import fs from 'fs-extra';
+import { nanoid } from 'nanoid';
+
+import { appContext } from '../../context';
+import { logger } from '../../logger';
+import { ensureSQLiteDB } from '../db/ensure-db';
+import { getWorkspaceDBPath, isValidDBFile } from '../db/sqlite';
+import { listWorkspaces } from '../workspace/workspace';
+
+// NOTE:
+// we are using native dialogs because HTML dialogs do not give full file paths
+
+export async function revealDBFile(workspaceId: string) {
+  const workspaceDB = await ensureSQLiteDB(workspaceId);
+  shell.showItemInFolder(workspaceDB.path);
+}
+
+// provide a backdoor to set dialog path for testing in playwright
+interface FakeDialogResult {
+  canceled?: boolean;
+  filePath?: string;
+  filePaths?: string[];
+}
+
+// result will be used in the next call to showOpenDialog
+// if it is being read once, it will be reset to undefined
+let fakeDialogResult: FakeDialogResult | undefined = undefined;
+
+function getFakedResult() {
+  const result = fakeDialogResult;
+  fakeDialogResult = undefined;
+  return result;
+}
+
+export function setFakeDialogResult(result: FakeDialogResult | undefined) {
+  fakeDialogResult = result;
+  // for convenience, we will fill filePaths with filePath if it is not set
+  if (result?.filePaths === undefined && result?.filePath !== undefined) {
+    result.filePaths = [result.filePath];
+  }
+}
+
+const ErrorMessages = [
+  'DB_FILE_ALREADY_LOADED',
+  'DB_FILE_PATH_INVALID',
+  'DB_FILE_INVALID',
+  'UNKNOWN_ERROR',
+] as const;
+
+type ErrorMessage = (typeof ErrorMessages)[number];
+
+interface SaveDBFileResult {
+  filePath?: string;
+  canceled?: boolean;
+  error?: ErrorMessage;
+}
+
+/**
+ * This function is called when the user clicks the "Save" button in the "Save Workspace" dialog.
+ *
+ * It will just copy the file to the given path
+ */
+export async function saveDBFileAs(
+  workspaceId: string
+): Promise<SaveDBFileResult> {
+  try {
+    const db = await ensureSQLiteDB(workspaceId);
+    const ret =
+      getFakedResult() ??
+      (await dialog.showSaveDialog({
+        properties: ['showOverwriteConfirmation'],
+        title: 'Save Workspace',
+        showsTagField: false,
+        buttonLabel: 'Save',
+        defaultPath: `${db.getWorkspaceName()}_${workspaceId}.db`,
+        message: 'Save Workspace as a SQLite Database file',
+      }));
+    const filePath = ret.filePath;
+    if (ret.canceled || !filePath) {
+      return {
+        canceled: true,
+      };
+    }
+
+    await fs.copyFile(db.path, filePath);
+    logger.log('saved', filePath);
+    shell.showItemInFolder(filePath);
+    return { filePath };
+  } catch (err) {
+    logger.error('saveDBFileAs', err);
+    return {
+      error: 'UNKNOWN_ERROR',
+    };
+  }
+}
+
+interface SelectDBFileLocationResult {
+  filePath?: string;
+  error?: ErrorMessage;
+  canceled?: boolean;
+}
+
+export async function selectDBFileLocation(): Promise<SelectDBFileLocationResult> {
+  try {
+    const ret =
+      getFakedResult() ??
+      (await dialog.showSaveDialog({
+        properties: ['showOverwriteConfirmation'],
+        title: 'Set database location',
+        showsTagField: false,
+        buttonLabel: 'Select',
+        defaultPath: `workspace-storage.db`,
+        message: "Select a location to store the workspace's database file",
+      }));
+    const filePath = ret.filePath;
+    if (ret.canceled || !filePath) {
+      return {
+        canceled: true,
+      };
+    }
+    // the same db file cannot be loaded twice
+    if (await dbFileAlreadyLoaded(filePath)) {
+      return {
+        error: 'DB_FILE_ALREADY_LOADED',
+      };
+    }
+    return { filePath };
+  } catch (err) {
+    logger.error('selectDBFileLocation', err);
+    return {
+      error: (err as any).message,
+    };
+  }
+}
+
+interface LoadDBFileResult {
+  workspaceId?: string;
+  error?: ErrorMessage;
+  canceled?: boolean;
+}
+
+/**
+ * This function is called when the user clicks the "Load" button in the "Load Workspace" dialog.
+ *
+ * It will
+ * - symlink the source db file to a new workspace id to app-data
+ * - return the new workspace id
+ *
+ * eg, it will create a new folder in app-data:
+ * <app-data>/<app-name>/workspaces/<workspace-id>/storage.db
+ *
+ * On the renderer side, after the UI got a new workspace id, it will
+ * update the local workspace id list and then connect to it.
+ *
+ */
+export async function loadDBFile(): Promise<LoadDBFileResult> {
+  try {
+    const ret =
+      getFakedResult() ??
+      (await dialog.showOpenDialog({
+        properties: ['openFile'],
+        title: 'Load Workspace',
+        buttonLabel: 'Load',
+        filters: [
+          {
+            name: 'SQLite Database',
+            // do we want to support other file format?
+            extensions: ['db'],
+          },
+        ],
+        message: 'Load Workspace from a SQLite Database file',
+      }));
+    const filePath = ret.filePaths?.[0];
+    if (ret.canceled || !filePath) {
+      logger.info('loadDBFile canceled');
+      return { canceled: true };
+    }
+
+    // the imported file should not be in app data dir
+    if (filePath.startsWith(path.join(appContext.appDataPath, 'workspaces'))) {
+      logger.warn('loadDBFile: db file in app data dir');
+      return { error: 'DB_FILE_PATH_INVALID' };
+    }
+
+    if (await dbFileAlreadyLoaded(filePath)) {
+      logger.warn('loadDBFile: db file already loaded');
+      return { error: 'DB_FILE_ALREADY_LOADED' };
+    }
+
+    if (!isValidDBFile(filePath)) {
+      // TODO: report invalid db file error?
+      return { error: 'DB_FILE_INVALID' }; // invalid db file
+    }
+
+    // symlink the db file to a new workspace id
+    const workspaceId = nanoid(10);
+    const linkedFilePath = await getWorkspaceDBPath(appContext, workspaceId);
+
+    await fs.ensureDir(path.join(appContext.appDataPath, 'workspaces'));
+
+    await fs.symlink(filePath, linkedFilePath);
+    logger.info(`loadDBFile, symlink: ${filePath} -> ${linkedFilePath}`);
+
+    return { workspaceId };
+  } catch (err) {
+    logger.error('loadDBFile', err);
+    return {
+      error: 'UNKNOWN_ERROR',
+    };
+  }
+}
+
+interface MoveDBFileResult {
+  filePath?: string;
+  error?: ErrorMessage;
+  canceled?: boolean;
+}
+
+/**
+ * This function is called when the user clicks the "Move" button in the "Move Workspace Storage" setting.
+ *
+ * It will
+ * - move the source db file to a new location
+ * - symlink the new location to the old db file
+ * - return the new file path
+ */
+export async function moveDBFile(
+  workspaceId: string,
+  dbFileLocation?: string
+): Promise<MoveDBFileResult> {
+  try {
+    const db = await ensureSQLiteDB(workspaceId);
+
+    // get the real file path of db
+    const realpath = await fs.realpath(db.path);
+    const isLink = realpath !== db.path;
+
+    const newFilePath =
+      dbFileLocation ||
+      (
+        getFakedResult() ||
+        (await dialog.showSaveDialog({
+          properties: ['showOverwriteConfirmation'],
+          title: 'Move Workspace Storage',
+          showsTagField: false,
+          buttonLabel: 'Save',
+          defaultPath: realpath,
+          message: 'Move Workspace storage file',
+        }))
+      ).filePath;
+
+    // skips if
+    // - user canceled the dialog
+    // - user selected the same file
+    // - user selected the same file in the link file in app data dir
+    if (!newFilePath || newFilePath === realpath || db.path === newFilePath) {
+      return {
+        canceled: true,
+      };
+    }
+
+    if (isLink) {
+      // remove the old link to unblock new link
+      await fs.unlink(db.path);
+    }
+
+    await fs.move(realpath, newFilePath, {
+      overwrite: true,
+    });
+
+    await fs.ensureSymlink(newFilePath, db.path);
+    logger.info(`openMoveDBFileDialog symlink: ${realpath} -> ${newFilePath}`);
+    db.reconnectDB();
+    return {
+      filePath: newFilePath,
+    };
+  } catch (err) {
+    logger.error('moveDBFile', err);
+    return {
+      error: 'UNKNOWN_ERROR',
+    };
+  }
+}
+
+async function dbFileAlreadyLoaded(path: string) {
+  const meta = await listWorkspaces(appContext);
+  const realpath = await fs.realpath(path);
+  const paths = meta.map(m => m[1].realpath);
+  return paths.includes(realpath);
+}

apps/electron/layers/main/src/handlers/dialog/index.ts

@@ -0,0 +1,33 @@
+import type { NamespaceHandlers } from '../type';
+import {
+  loadDBFile,
+  moveDBFile,
+  revealDBFile,
+  saveDBFileAs,
+  selectDBFileLocation,
+  setFakeDialogResult,
+} from './dialog';
+
+export const dialogHandlers = {
+  revealDBFile: async (_, workspaceId: string) => {
+    return revealDBFile(workspaceId);
+  },
+  loadDBFile: async () => {
+    return loadDBFile();
+  },
+  saveDBFileAs: async (_, workspaceId: string) => {
+    return saveDBFileAs(workspaceId);
+  },
+  moveDBFile: async (_, workspaceId: string, dbFileLocation?: string) => {
+    return moveDBFile(workspaceId, dbFileLocation);
+  },
+  selectDBFileLocation: async () => {
+    return selectDBFileLocation();
+  },
+  setFakeDialogResult: async (
+    _,
+    result: Parameters<typeof setFakeDialogResult>[0]
+  ) => {
+    return setFakeDialogResult(result);
+  },
+} satisfies NamespaceHandlers;

apps/electron/layers/main/src/handlers/index.ts

@@ -0,0 +1 @@
+export * from './register';

apps/electron/layers/main/src/handlers/register.ts

@@ -0,0 +1,63 @@
+import { ipcMain } from 'electron';
+
+import { getLogFilePath, logger, revealLogFile } from '../logger';
+import { dbHandlers } from './db';
+import { dialogHandlers } from './dialog';
+import { uiHandlers } from './ui';
+import { updaterHandlers } from './updater';
+import { workspaceHandlers } from './workspace';
+
+type IsomorphicHandler = (
+  e: Electron.IpcMainInvokeEvent,
+  ...args: any[]
+) => Promise<any>;
+
+type NamespaceHandlers = {
+  [key: string]: IsomorphicHandler;
+};
+
+export const debugHandlers = {
+  revealLogFile: async () => {
+    return revealLogFile();
+  },
+  logFilePath: async () => {
+    return getLogFilePath();
+  },
+};
+
+// Note: all of these handlers will be the single-source-of-truth for the apis exposed to the renderer process
+export const allHandlers = {
+  workspace: workspaceHandlers,
+  ui: uiHandlers,
+  db: dbHandlers,
+  dialog: dialogHandlers,
+  debug: debugHandlers,
+  updater: updaterHandlers,
+} satisfies Record<string, NamespaceHandlers>;
+
+export const registerHandlers = () => {
+  for (const [namespace, namespaceHandlers] of Object.entries(allHandlers)) {
+    for (const [key, handler] of Object.entries(namespaceHandlers)) {
+      const chan = `${namespace}:${key}`;
+      ipcMain.handle(chan, async (e, ...args) => {
+        const start = performance.now();
+        try {
+          const result = await handler(e, ...args);
+          logger.info(
+            '[ipc-api]',
+            chan,
+            args.filter(
+              arg => typeof arg !== 'function' && typeof arg !== 'object'
+            ),
+            '-',
+            (performance.now() - start).toFixed(2),
+            'ms'
+          );
+          return result;
+        } catch (error) {
+          logger.error('[ipc]', chan, error);
+        }
+      });
+    }
+  }
+};

apps/electron/layers/main/src/handlers/type.ts

@@ -0,0 +1,8 @@
+export type IsomorphicHandler = (
+  e: Electron.IpcMainInvokeEvent,
+  ...args: any[]
+) => Promise<any>;
+
+export type NamespaceHandlers = {
+  [key: string]: IsomorphicHandler;
+};

apps/electron/layers/main/src/handlers/ui/google-auth.ts

@@ -0,0 +1,58 @@
+import { app, BrowserWindow, shell } from 'electron';
+import { parse } from 'url';
+
+import { logger } from '../../logger';
+
+const redirectUri = 'https://affine.pro/client/auth-callback';
+
+export const oauthEndpoint = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.AFFINE_GOOGLE_CLIENT_ID}&redirect_uri=${redirectUri}&response_type=code&scope=openid https://www.googleapis.com/auth/userinfo.email profile&access_type=offline&customParameters={"prompt":"select_account"}`;
+
+const tokenEndpoint = 'https://oauth2.googleapis.com/token';
+
+export const getExchangeTokenParams = (code: string) => {
+  const postData = {
+    code,
+    client_id: process.env.AFFINE_GOOGLE_CLIENT_ID || '',
+    client_secret: process.env.AFFINE_GOOGLE_CLIENT_SECRET || '',
+    redirect_uri: redirectUri,
+    grant_type: 'authorization_code',
+  };
+  const requestInit: RequestInit = {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded',
+    },
+    body: new URLSearchParams(postData).toString(),
+  };
+  return { requestInit, url: tokenEndpoint };
+};
+
+export function getGoogleOauthCode() {
+  shell.openExternal(oauthEndpoint);
+
+  return new Promise<ReturnType<typeof getExchangeTokenParams>>(
+    (resolve, reject) => {
+      const handleOpenUrl = async (_: any, url: string) => {
+        const mainWindow = BrowserWindow.getAllWindows().find(
+          w => !w.isDestroyed()
+        );
+        const urlObj = parse(url.replace('??', '?'), true);
+        if (!mainWindow || !url.startsWith('affine://auth-callback')) return;
+        const code = urlObj.query['code'] as string;
+        if (!code) return;
+
+        logger.info('google sign in code received from callback', code);
+
+        app.removeListener('open-url', handleOpenUrl);
+        resolve(getExchangeTokenParams(code));
+      };
+
+      app.on('open-url', handleOpenUrl);
+
+      setTimeout(() => {
+        reject(new Error('Timed out'));
+        app.removeListener('open-url', handleOpenUrl);
+      }, 30000);
+    }
+  );
+}

apps/electron/layers/main/src/handlers/ui/index.ts

@@ -0,0 +1,23 @@
+import { BrowserWindow, nativeTheme } from 'electron';
+
+import { isMacOS } from '../../../../utils';
+import type { NamespaceHandlers } from '../type';
+import { getGoogleOauthCode } from './google-auth';
+
+export const uiHandlers = {
+  handleThemeChange: async (_, theme: (typeof nativeTheme)['themeSource']) => {
+    nativeTheme.themeSource = theme;
+  },
+  handleSidebarVisibilityChange: async (_, visible: boolean) => {
+    if (isMacOS()) {
+      const windows = BrowserWindow.getAllWindows();
+      windows.forEach(w => {
+        // hide window buttons when sidebar is not visible
+        w.setWindowButtonVisibility(visible);
+      });
+    }
+  },
+  getGoogleOauthCode: async () => {
+    return getGoogleOauthCode();
+  },
+} satisfies NamespaceHandlers;

apps/electron/layers/main/src/handlers/updater/index.ts

@@ -0,0 +1,10 @@
+import type { NamespaceHandlers } from '../type';
+import { updateClient } from './updater';
+
+export const updaterHandlers = {
+  updateClient: async () => {
+    return updateClient();
+  },
+} satisfies NamespaceHandlers;
+
+export * from './updater';

apps/electron/layers/main/src/handlers/updater/updater.ts

@@ -0,0 +1,69 @@
+import type { AppUpdater } from 'electron-updater';
+
+import { isMacOS } from '../../../../utils';
+import { updaterSubjects } from '../../events/updater';
+import { logger } from '../../logger';
+
+const buildType = (process.env.BUILD_TYPE || 'canary').trim().toLowerCase();
+const mode = process.env.NODE_ENV;
+const isDev = mode === 'development';
+
+let _autoUpdater: AppUpdater | null = null;
+
+export const updateClient = async () => {
+  _autoUpdater?.quitAndInstall();
+};
+
+export const registerUpdater = async () => {
+  // require it will cause some side effects and will break generate-main-exposed-meta,
+  // so we wrap it in a function
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const { autoUpdater } = await import('electron-updater');
+
+  _autoUpdater = autoUpdater;
+
+  autoUpdater.autoDownload = false;
+  autoUpdater.allowPrerelease = buildType !== 'stable';
+  autoUpdater.autoInstallOnAppQuit = false;
+  autoUpdater.autoRunAppAfterInstall = true;
+  autoUpdater.setFeedURL({
+    channel: buildType,
+    provider: 'github',
+    repo: 'AFFiNE',
+    owner: 'toeverything',
+    releaseType: buildType === 'stable' ? 'release' : 'prerelease',
+  });
+
+  autoUpdater.autoDownload = false;
+  autoUpdater.allowPrerelease = buildType !== 'stable';
+  autoUpdater.autoInstallOnAppQuit = false;
+  autoUpdater.autoRunAppAfterInstall = true;
+  autoUpdater.setFeedURL({
+    channel: buildType,
+    provider: 'github',
+    repo: 'AFFiNE',
+    owner: 'toeverything',
+    releaseType: buildType === 'stable' ? 'release' : 'prerelease',
+  });
+
+  if (isMacOS()) {
+    autoUpdater.on('update-available', () => {
+      autoUpdater.downloadUpdate();
+      logger.info('Update available, downloading...');
+    });
+    autoUpdater.on('download-progress', e => {
+      logger.info(`Download progress: ${e.percent}`);
+    });
+    autoUpdater.on('update-downloaded', e => {
+      updaterSubjects.clientUpdateReady.next({
+        version: e.version,
+      });
+      logger.info('Update downloaded, ready to install');
+    });
+    autoUpdater.on('error', e => {
+      logger.error('Error while updating client', e);
+    });
+    autoUpdater.forceDevUpdateConfig = isDev;
+    await autoUpdater.checkForUpdatesAndNotify();
+  }
+};

apps/electron/layers/main/src/handlers/workspace/index.ts

@@ -0,0 +1,8 @@
+import { appContext } from '../../context';
+import type { NamespaceHandlers } from '../type';
+import { deleteWorkspace, listWorkspaces } from './workspace';
+
+export const workspaceHandlers = {
+  list: async () => listWorkspaces(appContext),
+  delete: async (_, id: string) => deleteWorkspace(appContext, id),
+} satisfies NamespaceHandlers;

apps/electron/layers/main/src/handlers/workspace/workspace.ts

@@ -0,0 +1,60 @@
+import path from 'node:path';
+
+import fs from 'fs-extra';
+
+import type { AppContext } from '../../context';
+import { logger } from '../../logger';
+
+interface WorkspaceMeta {
+  path: string;
+  realpath: string;
+}
+
+export async function listWorkspaces(
+  context: AppContext
+): Promise<[workspaceId: string, meta: WorkspaceMeta][]> {
+  const basePath = path.join(context.appDataPath, 'workspaces');
+  try {
+    await fs.ensureDir(basePath);
+    const dirs = await fs.readdir(basePath, {
+      withFileTypes: true,
+    });
+
+    const meta = await Promise.all(
+      dirs.map(async dir => {
+        const dbFilePath = path.join(basePath, dir.name, 'storage.db');
+        if (dir.isDirectory() && (await fs.exists(dbFilePath))) {
+          // try read storage.db under it
+          const realpath = await fs.realpath(dbFilePath);
+          return [dir.name, { path: dbFilePath, realpath }] as [
+            string,
+            WorkspaceMeta
+          ];
+        } else {
+          return null;
+        }
+      })
+    );
+
+    return meta.filter((w): w is [string, WorkspaceMeta] => !!w);
+  } catch (error) {
+    logger.error('listWorkspaces', error);
+    return [];
+  }
+}
+
+export async function deleteWorkspace(context: AppContext, id: string) {
+  const basePath = path.join(context.appDataPath, 'workspaces', id);
+  const movedPath = path.join(
+    context.appDataPath,
+    'delete-workspaces',
+    `${id}`
+  );
+  try {
+    return await fs.move(basePath, movedPath, {
+      overwrite: true,
+    });
+  } catch (error) {
+    logger.error('deleteWorkspace', error);
+  }
+}

apps/electron/layers/main/src/index.ts

@@ -1,43 +1,39 @@
 import './security-restrictions';
 
 import { app } from 'electron';
-import path from 'path';
 
-import { registerHandlers } from './app-state';
+import { registerEvents } from './events';
+import { registerHandlers } from './handlers';
+import { registerUpdater } from './handlers/updater';
+import { logger } from './logger';
 import { restoreOrCreateWindow } from './main-window';
 import { registerProtocol } from './protocol';
 
-if (process.defaultApp) {
-  if (process.argv.length >= 2) {
-    app.setAsDefaultProtocolClient('affine', process.execPath, [
-      path.resolve(process.argv[1]),
-    ]);
-  }
-} else {
-  app.setAsDefaultProtocolClient('affine');
+// allow tests to overwrite app name through passing args
+if (process.argv.includes('--app-name')) {
+  const appNameIndex = process.argv.indexOf('--app-name');
+  const appName = process.argv[appNameIndex + 1];
+  app.setName(appName);
 }
+
 /**
  * Prevent multiple instances
  */
 const isSingleInstance = app.requestSingleInstanceLock();
 if (!isSingleInstance) {
+  logger.info('Another instance is running, exiting...');
   app.quit();
   process.exit(0);
 }
 
-app.on('second-instance', (event, argv) => {
+app.on('second-instance', () => {
   restoreOrCreateWindow();
 });
 
-app.on('open-url', async (_, url) => {
+app.on('open-url', async (_, _url) => {
   // todo: handle `affine://...` urls
 });
 
-/**
- * Disable Hardware Acceleration for more power-save
- */
-app.disableHardwareAcceleration();
-
 /**
  * Shout down background process if all windows was closed
  */
@@ -59,7 +55,9 @@ app
   .whenReady()
   .then(registerProtocol)
   .then(registerHandlers)
+  .then(registerEvents)
   .then(restoreOrCreateWindow)
+  .then(registerUpdater)
   .catch(e => console.error('Failed create window:', e));
 /**
  * Check new app version in production mode only

apps/electron/layers/main/src/logger.ts

@@ -0,0 +1,13 @@
+import { shell } from 'electron';
+import log from 'electron-log';
+
+export const logger = log;
+
+export function getLogFilePath() {
+  return log.transports.file.getFile().path;
+}
+
+export function revealLogFile() {
+  const filePath = getLogFilePath();
+  shell.showItemInFolder(filePath);
+}

apps/electron/layers/main/src/main-window.ts

@@ -3,10 +3,15 @@ import electronWindowState from 'electron-window-state';
 import { join } from 'path';
 
 import { isMacOS } from '../../utils';
+import { logger } from './logger';
 
-const IS_DEV = process.env.NODE_ENV === 'development';
+const IS_DEV: boolean =
+  process.env.NODE_ENV === 'development' && !process.env.CI;
+
+const DEV_TOOL = process.env.DEV_TOOL === 'true';
 
 async function createWindow() {
+  logger.info('create window');
   const mainWindowState = electronWindowState({
     defaultWidth: 1000,
     defaultHeight: 800,
@@ -14,12 +19,12 @@ async function createWindow() {
 
   const browserWindow = new BrowserWindow({
     titleBarStyle: isMacOS() ? 'hiddenInset' : 'default',
-    trafficLightPosition: { x: 20, y: 18 },
+    trafficLightPosition: { x: 24, y: 18 },
     x: mainWindowState.x,
     y: mainWindowState.y,
     width: mainWindowState.width,
     minWidth: 640,
-    transparent: true,
+    transparent: isMacOS(),
     visualEffectState: 'active',
     vibrancy: 'under-window',
     height: mainWindowState.height,
@@ -45,10 +50,19 @@ async function createWindow() {
    * @see https://github.com/electron/electron/issues/25012
    */
   browserWindow.on('ready-to-show', () => {
-    browserWindow.show();
-
     if (IS_DEV) {
-      browserWindow.webContents.openDevTools();
+      // do not gain focus in dev mode
+      browserWindow.showInactive();
+    } else {
+      browserWindow.show();
+    }
+
+    logger.info('main window is ready to show');
+
+    if (DEV_TOOL) {
+      browserWindow.webContents.openDevTools({
+        mode: 'detach',
+      });
     }
   });
 
@@ -61,13 +75,14 @@ async function createWindow() {
   /**
    * URL for main window.
    */
-  const pageUrl =
-    IS_DEV && process.env.DEV_SERVER_URL !== undefined
-      ? process.env.DEV_SERVER_URL
-      : 'file://./index.html'; // see protocol.ts
+  const pageUrl = process.env.DEV_SERVER_URL || 'file://./index.html'; // see protocol.ts
+
+  logger.info('loading page at', pageUrl);
 
   await browserWindow.loadURL(pageUrl);
 
+  logger.info('main window is loaded at', pageUrl);
+
   return browserWindow;
 }
 
@@ -85,9 +100,8 @@ export async function restoreOrCreateWindow() {
 
   if (browserWindow.isMinimized()) {
     browserWindow.restore();
+    logger.info('restore main window');
   }
 
-  browserWindow.focus();
-
   return browserWindow;
 }

apps/electron/layers/main/src/protocol.ts

@@ -1,25 +1,48 @@
 import { protocol, session } from 'electron';
 import { join } from 'path';
 
-export function registerProtocol() {
-  if (process.env.NODE_ENV === 'production') {
-    protocol.interceptFileProtocol('file', (request, callback) => {
-      const url = request.url.replace(/^file:\/\//, '');
-      const webStaticDir = join(__dirname, '../../../resources/web-static');
-      if (url.startsWith('./')) {
-        // if is a file type, load the file in resources
-        if (url.split('/').at(-1)?.includes('.')) {
-          const realpath = join(webStaticDir, decodeURIComponent(url));
-          callback(realpath);
-        } else {
-          // else, fallback to load the index.html instead
-          const realpath = join(webStaticDir, 'index.html');
-          console.log(realpath, 'realpath', url, 'url');
-          callback(realpath);
-        }
-      }
-    });
+protocol.registerSchemesAsPrivileged([
+  {
+    scheme: 'assets',
+    privileges: {
+      secure: false,
+      corsEnabled: true,
+      supportFetchAPI: true,
+      standard: true,
+      bypassCSP: true,
+    },
+  },
+]);
+
+function toAbsolutePath(url: string) {
+  let realpath = decodeURIComponent(url);
+  const webStaticDir = join(__dirname, '../../../resources/web-static');
+  if (url.startsWith('./')) {
+    // if is a file type, load the file in resources
+    if (url.split('/').at(-1)?.includes('.')) {
+      realpath = join(webStaticDir, decodeURIComponent(url));
+    } else {
+      // else, fallback to load the index.html instead
+      realpath = join(webStaticDir, 'index.html');
+    }
   }
+  return realpath;
+}
+
+export function registerProtocol() {
+  protocol.interceptFileProtocol('file', (request, callback) => {
+    const url = request.url.replace(/^file:\/\//, '');
+    const realpath = toAbsolutePath(url);
+    callback(realpath);
+    return true;
+  });
+
+  protocol.registerFileProtocol('assets', (request, callback) => {
+    const url = request.url.replace(/^assets:\/\//, '');
+    const realpath = toAbsolutePath(url);
+    callback(realpath);
+    return true;
+  });
 
   session.defaultSession.webRequest.onHeadersReceived(
     (responseDetails, callback) => {

apps/electron/layers/main/src/utils.ts

@@ -0,0 +1,19 @@
+export function debounce<T extends (...args: any[]) => void>(
+  fn: T,
+  delay: number
+) {
+  let timeoutId: NodeJS.Timer | undefined;
+  return (...args: Parameters<T>) => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+    }
+    timeoutId = setTimeout(() => {
+      fn(...args);
+      timeoutId = undefined;
+    }, delay);
+  };
+}
+
+export function ts() {
+  return new Date().getTime();
+}

apps/electron/layers/preload/preload.d.ts

@@ -1,12 +1,7 @@
+/* eslint-disable @typescript-eslint/consistent-type-imports */
+
 interface Window {
-    /**
-     * After analyzing the `exposeInMainWorld` calls,
-     * `packages/preload/exposedInMainWorld.d.ts` file will be generated.
-     * It contains all interfaces.
-     * `packages/preload/exposedInMainWorld.d.ts` file is required for TS is `renderer`
-     *
-     * @see https://github.com/cawa-93/dts-for-context-bridge
-     */
-    readonly apis: { workspaceSync: (id: string) => Promise<any>; onThemeChange: (theme: string) => Promise<any>; onSidebarVisibilityChange: (visible: boolean) => Promise<any>; googleSignIn: () => Promise<string>; updateEnv: (env: string, value: string) => void; };
-    readonly appInfo: { electron: boolean; isMacOS: boolean; };
+  apis?: typeof import('./src/affine-apis').apis;
+  events?: typeof import('./src/affine-apis').events;
+  appInfo?: typeof import('./src/affine-apis').appInfo;
 }

apps/electron/layers/preload/src/affine-apis.ts

@@ -0,0 +1,88 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+// NOTE: we will generate preload types from this file
+
+import { ipcRenderer } from 'electron';
+
+import type { MainIPCEventMap, MainIPCHandlerMap } from '../../constraints';
+
+type WithoutFirstParameter<T> = T extends (_: any, ...args: infer P) => infer R
+  ? (...args: P) => R
+  : T;
+
+type HandlersMap<N extends keyof MainIPCHandlerMap> = {
+  [K in keyof MainIPCHandlerMap[N]]: WithoutFirstParameter<
+    MainIPCHandlerMap[N][K]
+  >;
+};
+
+type PreloadHandlers = {
+  [N in keyof MainIPCHandlerMap]: HandlersMap<N>;
+};
+
+type MainExposedMeta = {
+  handlers: [namespace: string, handlerNames: string[]][];
+  events: [namespace: string, eventNames: string[]][];
+};
+
+// main handlers that can be invoked from the renderer process
+const apis: PreloadHandlers = (() => {
+  // the following were generated by the build script
+  // 1. bundle extra main/src/expose.ts entry
+  // 2. use generate-main-exposed-meta.mjs to generate exposed-meta.js in dist
+  //
+  // we cannot directly import main/src/handlers.ts because it will be bundled into the preload bundle
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const {
+    handlers: handlersMeta,
+  }: MainExposedMeta = require('../main/exposed-meta');
+
+  const all = handlersMeta.map(([namespace, functionNames]) => {
+    const namespaceApis = functionNames.map(name => {
+      const channel = `${namespace}:${name}`;
+      return [
+        name,
+        (...args: any[]) => {
+          return ipcRenderer.invoke(channel, ...args);
+        },
+      ];
+    });
+    return [namespace, Object.fromEntries(namespaceApis)];
+  });
+
+  return Object.fromEntries(all);
+})();
+
+// main events that can be listened to from the renderer process
+const events: MainIPCEventMap = (() => {
+  const {
+    events: eventsMeta,
+  }: MainExposedMeta = require('../main/exposed-meta');
+  const all = eventsMeta.map(([namespace, eventNames]) => {
+    const namespaceEvents = eventNames.map(name => {
+      const channel = `${namespace}:${name}`;
+      return [
+        name,
+        (callback: (...args: any[]) => void) => {
+          const fn: (
+            event: Electron.IpcRendererEvent,
+            ...args: any[]
+          ) => void = (_, ...args) => {
+            callback(...args);
+          };
+          ipcRenderer.on(channel, fn);
+          return () => {
+            ipcRenderer.off(channel, fn);
+          };
+        },
+      ];
+    });
+    return [namespace, Object.fromEntries(namespaceEvents)];
+  });
+  return Object.fromEntries(all);
+})();
+
+const appInfo = {
+  electron: true,
+};
+
+export { apis, appInfo, events };

apps/electron/layers/preload/src/index.ts

@@ -2,9 +2,9 @@
  * @module preload
  */
 
-import { contextBridge, ipcRenderer } from 'electron';
+import { contextBridge } from 'electron';
 
-import { isMacOS } from '../../utils';
+import * as affineApis from './affine-apis';
 
 /**
  * The "Main World" is the JavaScript context that your main renderer code runs in.
@@ -13,37 +13,6 @@ import { isMacOS } from '../../utils';
  * @see https://www.electronjs.org/docs/api/context-bridge
  */
 
-/**
- * After analyzing the `exposeInMainWorld` calls,
- * `packages/preload/exposedInMainWorld.d.ts` file will be generated.
- * It contains all interfaces.
- * `packages/preload/exposedInMainWorld.d.ts` file is required for TS is `renderer`
- *
- * @see https://github.com/cawa-93/dts-for-context-bridge
- */
-contextBridge.exposeInMainWorld('apis', {
-  workspaceSync: (id: string) => ipcRenderer.invoke('octo:workspace-sync', id),
-  // ui
-  onThemeChange: (theme: string) =>
-    ipcRenderer.invoke('ui:theme-change', theme),
-
-  onSidebarVisibilityChange: (visible: boolean) =>
-    ipcRenderer.invoke('ui:sidebar-visibility-change', visible),
-
-  /**
-   * Try sign in using Google and return a Google IDToken
-   */
-  googleSignIn: (): Promise<string> => ipcRenderer.invoke('ui:google-sign-in'),
-
-  /**
-   * Secret backdoor to update environment variables in main process
-   */
-  updateEnv: (env: string, value: string) => {
-    ipcRenderer.invoke('main:env-update', env, value);
-  },
-});
-
-contextBridge.exposeInMainWorld('appInfo', {
-  electron: true,
-  isMacOS: isMacOS(),
-});
+contextBridge.exposeInMainWorld('apis', affineApis.apis);
+contextBridge.exposeInMainWorld('events', affineApis.events);
+contextBridge.exposeInMainWorld('appInfo', affineApis.appInfo);

apps/electron/package.json

@@ -1,32 +1,37 @@
 {
   "name": "@affine/electron",
-  "productName": "AFFiNE",
   "private": true,
-  "version": "0.0.0",
+  "version": "0.5.4-canary.29",
   "author": "affine",
+  "repository": {
+    "url": "https://github.com/toeverything/AFFiNE",
+    "type": "git"
+  },
   "description": "AFFiNE App",
   "homepage": "https://github.com/toeverything/AFFiNE",
-  "workspaces": [
-    "../../packages/*",
-    "../../tests/fixtures"
-  ],
   "scripts": {
-    "dev": "cross-env NODE_ENV=development node scripts/dev.mjs",
-    "prod": "cross-env NODE_ENV=production node scripts/dev.mjs",
+    "dev": "yarn electron-rebuild && yarn cross-env DEV_SERVER_URL=http://localhost:8080 node scripts/dev.mjs",
+    "watch": "yarn electron-rebuild && yarn cross-env DEV_SERVER_URL=http://localhost:8080 node scripts/dev.mjs --watch",
+    "prod": "yarn electron-rebuild && yarn node scripts/dev.mjs",
+    "build-layers": "zx scripts/build-layers.mjs",
     "generate-assets": "zx scripts/generate-assets.mjs",
+    "generate-main-exposed-meta": "zx scripts/generate-main-exposed-meta.mjs",
+    "package": "electron-forge package",
     "make": "electron-forge make",
     "make-macos-arm64": "electron-forge make --platform=darwin --arch=arm64",
     "make-macos-x64": "electron-forge make --platform=darwin --arch=x64",
     "make-windows-x64": "electron-forge make --platform=win32 --arch=x64",
-    "build:octobase-node": "yarn workspace @affine/octobase-node build",
-    "postinstall": "ELECTRON_RUN_AS_NODE=1 electron scripts/update-electron-vendors.mjs"
+    "make-linux-x64": "electron-forge make --platform=linux --arch=x64",
+    "rebuild:for-unit-test": "yarn rebuild better-sqlite3",
+    "rebuild:for-electron": "yarn electron-rebuild",
+    "test": "playwright test"
   },
   "config": {
     "forge": "./forge.config.js"
   },
   "main": "./dist/layers/main/index.js",
   "devDependencies": {
-    "@affine/octobase-node": "workspace:*",
+    "@affine-test/kit": "workspace:*",
     "@electron-forge/cli": "^6.1.1",
     "@electron-forge/core": "^6.1.1",
     "@electron-forge/core-utils": "^6.1.1",
@@ -35,19 +40,29 @@
     "@electron-forge/maker-squirrel": "^6.1.1",
     "@electron-forge/maker-zip": "^6.1.1",
     "@electron-forge/shared-types": "^6.1.1",
-    "@electron/rebuild": "^3.2.10",
+    "@electron/rebuild": "^3.2.13",
     "@electron/remote": "2.0.9",
-    "dts-for-context-bridge": "^0.7.1",
-    "electron": "24.0.0",
-    "esbuild": "^0.17.16",
-    "zx": "^7.2.1"
+    "@types/better-sqlite3": "^7.6.4",
+    "@types/fs-extra": "^11.0.1",
+    "cross-env": "7.0.3",
+    "electron": "24.2.0",
+    "electron-log": "^5.0.0-beta.23",
+    "electron-squirrel-startup": "1.0.0",
+    "electron-window-state": "^5.0.3",
+    "esbuild": "^0.17.18",
+    "fs-extra": "^11.1.1",
+    "playwright": "^1.33.0",
+    "ts-node": "^10.9.1",
+    "undici": "^5.22.0",
+    "zx": "^7.2.2"
   },
   "dependencies": {
-    "cross-env": "7.0.3",
-    "electron-window-state": "^5.0.3",
-    "firebase": "^9.18.0",
-    "fs-extra": "^11.1.1",
-    "undici": "^5.21.2"
+    "better-sqlite3": "^8.3.0",
+    "chokidar": "^3.5.3",
+    "electron-updater": "^5.3.0",
+    "nanoid": "^4.0.2",
+    "rxjs": "^7.8.1",
+    "yjs": "^13.6.1"
   },
   "build": {
     "protocols": [
@@ -59,5 +74,12 @@
       }
     ]
   },
-  "packageManager": "yarn@3.5.0"
+  "stableVersion": "0.5.3",
+  "installConfig": {
+    "hoistingLimits": "workspaces"
+  },
+  "peerDependencies": {
+    "playwright": "*",
+    "ts-node": "*"
+  }
 }

apps/electron/playwright.config.ts

@@ -0,0 +1,27 @@
+import type { PlaywrightTestConfig } from '@playwright/test';
+// import { devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+const config: PlaywrightTestConfig = {
+  testDir: './tests',
+  fullyParallel: true,
+  timeout: process.env.CI ? 50_000 : 30_000,
+  use: {
+    viewport: { width: 1440, height: 800 },
+  },
+};
+
+if (process.env.CI) {
+  config.retries = 3;
+  config.workers = '50%';
+}
+
+export default config;

apps/electron/resources/app-update.yml

@@ -0,0 +1,4 @@
+owner: toeverything
+repo: AFFiNE
+provider: github
+private: false

apps/electron/scripts/build-layers.mjs

@@ -0,0 +1,28 @@
+#!/usr/bin/env zx
+import 'zx/globals';
+
+import * as esbuild from 'esbuild';
+
+import { config } from './common.mjs';
+
+const NODE_ENV =
+  process.env.NODE_ENV === 'development' ? 'development' : 'production';
+
+async function buildLayers() {
+  const common = config();
+  await esbuild.build(common.preload);
+
+  await esbuild.build({
+    ...common.main,
+    define: {
+      ...common.main.define,
+      'process.env.NODE_ENV': `"${NODE_ENV}"`,
+      'process.env.BUILD_TYPE': `"${process.env.BUILD_TYPE || 'stable'}"`,
+    },
+  });
+
+  await $`yarn workspace @affine/electron generate-main-exposed-meta`;
+}
+
+await buildLayers();
+echo('Build layers done');

apps/electron/scripts/common.mjs

@@ -1,13 +1,16 @@
-import fs from 'node:fs';
-import path from 'node:path';
-import * as url from 'node:url';
-const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
-const { node } = JSON.parse(
-  fs.readFileSync(
-    path.join(__dirname, '../electron-vendors.autogen.json'),
-    'utf-8'
-  )
-);
+import { resolve } from 'node:path';
+
+import { fileURLToPath } from 'url';
+
+export const root = fileURLToPath(new URL('..', import.meta.url));
+export const NODE_MAJOR_VERSION = 18;
+
+// hard-coded for now:
+// fixme(xp): report error if app is not running on DEV_SERVER_URL
+const DEV_SERVER_URL = process.env.DEV_SERVER_URL;
+
+/** @type 'production' | 'development'' */
+const mode = (process.env.NODE_ENV = process.env.NODE_ENV || 'development');
 
 const nativeNodeModulesPlugin = {
   name: 'native-node-modules',
@@ -23,31 +26,42 @@ const nativeNodeModulesPlugin = {
 const ENV_MACROS = ['AFFINE_GOOGLE_CLIENT_ID', 'AFFINE_GOOGLE_CLIENT_SECRET'];
 
 /** @return {{main: import('esbuild').BuildOptions, preload: import('esbuild').BuildOptions}} */
-export default () => {
-  const define = Object.fromEntries(
-    ENV_MACROS.map(key => [
+export const config = () => {
+  const define = Object.fromEntries([
+    ...ENV_MACROS.map(key => [
       'process.env.' + key,
       JSON.stringify(process.env[key] ?? ''),
-    ])
-  );
+    ]),
+    ['process.env.NODE_ENV', `"${mode}"`],
+  ]);
+
+  if (DEV_SERVER_URL) {
+    define['process.env.DEV_SERVER_URL'] = `"${DEV_SERVER_URL}"`;
+  }
+
   return {
     main: {
-      entryPoints: ['layers/main/src/index.ts'],
-      outdir: 'dist/layers/main',
+      entryPoints: [
+        resolve(root, './layers/main/src/index.ts'),
+        resolve(root, './layers/main/src/exposed.ts'),
+      ],
+      outdir: resolve(root, './dist/layers/main'),
       bundle: true,
-      target: `node${node}`,
+      target: `node${NODE_MAJOR_VERSION}`,
       platform: 'node',
-      external: ['electron'],
+      external: ['electron', 'yjs', 'better-sqlite3', 'electron-updater'],
       plugins: [nativeNodeModulesPlugin],
       define: define,
+      format: 'cjs',
     },
     preload: {
-      entryPoints: ['layers/preload/src/index.ts'],
-      outdir: 'dist/layers/preload',
+      entryPoints: [resolve(root, './layers/preload/src/index.ts')],
+      outdir: resolve(root, './dist/layers/preload'),
       bundle: true,
-      target: `node${node}`,
+      target: `node${NODE_MAJOR_VERSION}`,
       platform: 'node',
-      external: ['electron'],
+      external: ['electron', '../main/exposed-meta'],
+      plugins: [nativeNodeModulesPlugin],
       define: define,
     },
   };

apps/electron/scripts/dev.mjs

@@ -1,19 +1,15 @@
-import { spawn } from 'node:child_process';
+/* eslint-disable no-async-promise-executor */
+import { execSync, spawn } from 'node:child_process';
 import { readFileSync } from 'node:fs';
 import path from 'node:path';
-import { fileURLToPath } from 'node:url';
 
-import { generateAsync } from 'dts-for-context-bridge';
 import electronPath from 'electron';
 import * as esbuild from 'esbuild';
 
-import commonFn from './common.mjs';
+import { config, root } from './common.mjs';
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-/** @type 'production' | 'development'' */
-const mode = (process.env.NODE_ENV = process.env.NODE_ENV || 'development');
+// this means we don't spawn electron windows, mainly for testing
+const watchMode = process.argv.includes('--watch');
 
 /** Messages on stderr that match any of the contained patterns will be stripped from output */
 const stderrFilterPatterns = [
@@ -23,9 +19,9 @@ const stderrFilterPatterns = [
   /ExtensionLoadWarning/,
 ];
 
-// these are set before calling commonFn so we have a chance to override them
+// these are set before calling `config`, so we have a chance to override them
 try {
-  const devJson = readFileSync(path.resolve(__dirname, '../dev.json'), 'utf-8');
+  const devJson = readFileSync(path.resolve(root, './dev.json'), 'utf-8');
   const devEnv = JSON.parse(devJson);
   Object.assign(process.env, devEnv);
 } catch (err) {
@@ -34,14 +30,13 @@ try {
   );
 }
 
-// hard-coded for now:
-// fixme(xp): report error if app is not running on port 8080
-process.env.DEV_SERVER_URL = `http://localhost:8080`;
-
 /** @type {ChildProcessWithoutNullStreams | null} */
 let spawnProcess = null;
 
 function spawnOrReloadElectron() {
+  if (watchMode) {
+    return;
+  }
   if (spawnProcess !== null) {
     spawnProcess.off('exit', process.exit);
     spawnProcess.kill('SIGINT');
@@ -50,10 +45,12 @@ function spawnOrReloadElectron() {
 
   spawnProcess = spawn(String(electronPath), ['.']);
 
-  spawnProcess.stdout.on(
-    'data',
-    d => d.toString().trim() && console.warn(d.toString())
-  );
+  spawnProcess.stdout.on('data', d => {
+    let str = d.toString().trim();
+    if (str) {
+      console.log(str);
+    }
+  });
   spawnProcess.stderr.on('data', d => {
     const data = d.toString().trim();
     if (!data) return;
@@ -62,76 +59,80 @@ function spawnOrReloadElectron() {
     console.error(data);
   });
 
-  // Stops the watch script when the application has been quit
+  // Stops the watch script when the application has quit
   spawnProcess.on('exit', process.exit);
 }
 
-const common = commonFn();
+const common = config();
 
-async function main() {
-  async function watchPreload(onInitialBuild) {
+function watchPreload() {
+  return new Promise(async resolve => {
+    let initialBuild = false;
     const preloadBuild = await esbuild.context({
       ...common.preload,
       plugins: [
         ...(common.preload.plugins ?? []),
         {
-          name: 'affine-dev:reload-app-on-preload-change',
+          name: 'electron-dev:reload-app-on-preload-change',
           setup(build) {
-            let initialBuild = false;
             build.onEnd(() => {
-              generateAsync({
-                input: 'layers/preload/src/**/*.ts',
-                output: 'layers/preload/preload.d.ts',
-              });
               if (initialBuild) {
-                console.log(`[preload] has changed`);
+                console.log(`[preload] has changed, [re]launching electron...`);
                 spawnOrReloadElectron();
               } else {
+                resolve();
                 initialBuild = true;
-                onInitialBuild();
               }
             });
           },
         },
       ],
     });
+    // watch will trigger build.onEnd() on first run & on subsequent changes
     await preloadBuild.watch();
-  }
+  });
+}
+
+async function watchMain() {
+  return new Promise(async resolve => {
+    let initialBuild = false;
 
-  async function watchMain() {
     const mainBuild = await esbuild.context({
       ...common.main,
-      define: {
-        ...common.main.define,
-        'process.env.NODE_ENV': `"${mode}"`,
-        'process.env.DEV_SERVER_URL': `"${process.env.DEV_SERVER_URL}"`,
-      },
       plugins: [
         ...(common.main.plugins ?? []),
         {
-          name: 'affine-dev:reload-app-on-main-change',
+          name: 'electron-dev:reload-app-on-main-change',
           setup(build) {
-            let initialBuild = false;
             build.onEnd(() => {
+              execSync('yarn generate-main-exposed-meta');
+
               if (initialBuild) {
                 console.log(`[main] has changed, [re]launching electron...`);
+                spawnOrReloadElectron();
               } else {
+                resolve();
                 initialBuild = true;
               }
-              spawnOrReloadElectron();
             });
           },
         },
       ],
     });
     await mainBuild.watch();
-  }
-
-  await watchPreload(async () => {
-    await watchMain();
-    spawnOrReloadElectron();
-    console.log(`Electron is started, watching for changes...`);
   });
 }
 
+async function main() {
+  await watchMain();
+  await watchPreload();
+
+  if (watchMode) {
+    console.log(`Watching for changes...`);
+  } else {
+    spawnOrReloadElectron();
+    console.log(`Electron is started, watching for changes...`);
+  }
+}
+
 main();

apps/electron/scripts/generate-assets.mjs

@@ -3,10 +3,6 @@ import 'zx/globals';
 
 import path from 'node:path';
 
-import * as esbuild from 'esbuild';
-
-import commonFn from './common.mjs';
-
 const repoRootDir = path.join(__dirname, '..', '..', '..');
 const electronRootDir = path.join(__dirname, '..');
 const publicDistDir = path.join(electronRootDir, 'resources');
@@ -29,47 +25,48 @@ console.log('build with following dir', {
 await cleanup();
 echo('Clean up done');
 
-// step 1: build web (nextjs) dist
-cd(repoRootDir);
-await $`yarn add`;
-await $`yarn build`;
-await $`yarn export`;
-await fs.move(affineWebOutDir, publicAffineOutDir, { overwrite: true });
-
-// step 2: build electron resources
-await buildLayers();
-echo('Build layers done');
-
-// step 3: build octobase-node
-let buildOctobaseNode = 'yarn workspace @affine/octobase-node build';
-if (process.env.TARGET) {
-  buildOctobaseNode += ` --target=${process.env.TARGET}`;
+if (process.platform === 'win32') {
+  $.shell = 'powershell.exe';
+  $.prefix = '';
 }
-await $([buildOctobaseNode]);
 
-// step 4: copy octobase-node to electron dist
-await fs.ensureDir('./apps/electron/dist/layers/main/');
-await $`cp ./packages/octobase-node/octobase.*.node ./apps/electron/dist/layers/main/`;
+cd(repoRootDir);
+
+// step 1: build electron resources
+await $`yarn workspace @affine/electron build-layers`;
+
+// step 2: build web (nextjs) dist
+if (!process.env.SKIP_WEB_BUILD) {
+  process.env.ENABLE_LEGACY_PROVIDER = 'false';
+  await $`yarn build`;
+  await $`yarn export`;
+
+  // step 1.5: amend sourceMappingURL to allow debugging in devtools
+  await glob('**/*.{js,css}', { cwd: affineWebOutDir }).then(files => {
+    return files.map(async file => {
+      const dir = path.dirname(file);
+      const fullpath = path.join(affineWebOutDir, file);
+      let content = await fs.readFile(fullpath, 'utf-8');
+      // replace # sourceMappingURL=76-6370cd185962bc89.js.map
+      // to      # sourceMappingURL=assets://./{dir}/76-6370cd185962bc89.js.map
+      content = content.replace(/# sourceMappingURL=(.*)\.map/g, (_, p1) => {
+        return `# sourceMappingURL=assets://./${dir}/${p1}.map`;
+      });
+      await fs.writeFile(fullpath, content);
+    });
+  });
+
+  await fs.move(affineWebOutDir, publicAffineOutDir, { overwrite: true });
+}
 
 /// --------
 /// --------
 /// --------
 async function cleanup() {
-  await fs.emptyDir(publicAffineOutDir);
+  if (!process.env.SKIP_WEB_BUILD) {
+    await fs.emptyDir(publicAffineOutDir);
+  }
   await fs.emptyDir(path.join(electronRootDir, 'layers', 'main', 'dist'));
   await fs.emptyDir(path.join(electronRootDir, 'layers', 'preload', 'dist'));
   await fs.remove(path.join(electronRootDir, 'out'));
 }
-
-async function buildLayers() {
-  const common = commonFn();
-  await esbuild.build(common.preload);
-
-  await esbuild.build({
-    ...common.main,
-    define: {
-      ...common.main.define,
-      'process.env.NODE_ENV': `"production"`,
-    },
-  });
-}

apps/electron/scripts/generate-main-exposed-meta.mjs

@@ -0,0 +1,40 @@
+#!/usr/bin/env zx
+/* eslint-disable @typescript-eslint/no-restricted-imports */
+import 'zx/globals';
+
+const mainDistDir = path.resolve(__dirname, '../dist/layers/main');
+
+// be careful and avoid any side effects in
+const { handlers, events } = await import(
+  path.resolve(mainDistDir, 'exposed.js')
+);
+
+const handlersMeta = Object.entries(handlers).map(
+  ([namespace, namespaceHandlers]) => {
+    return [
+      namespace,
+      Object.keys(namespaceHandlers).map(handlerName => handlerName),
+    ];
+  }
+);
+
+const eventsMeta = Object.entries(events).map(
+  ([namespace, namespaceHandlers]) => {
+    return [
+      namespace,
+      Object.keys(namespaceHandlers).map(handlerName => handlerName),
+    ];
+  }
+);
+
+const meta = {
+  handlers: handlersMeta,
+  events: eventsMeta,
+};
+
+await fs.writeFile(
+  path.resolve(mainDistDir, 'exposed-meta.js'),
+  `module.exports = ${JSON.stringify(meta)};`
+);
+
+console.log('generate main exposed-meta.js done');

apps/electron/scripts/generate-yml.js

@@ -0,0 +1,63 @@
+// do not run in your local machine
+/* eslint-disable */
+const fs = require('fs');
+const path = require('path');
+const crypto = require('crypto');
+/* eslint-enable */
+
+const yml = {
+  version: process.env.RELEASE_VERSION ?? '0.0.0',
+  files: [],
+};
+
+let fileList = [];
+// TODO: maybe add `beta` and `stable`
+const BUILD_TYPE = process.env.BUILD_TYPE || 'canary';
+
+const generateYml = async () => {
+  fileList = [
+    `affine-${BUILD_TYPE}-macos-arm64.dmg`,
+    `affine-${BUILD_TYPE}-macos-arm64.zip`,
+    `affine-${BUILD_TYPE}-macos-x64.zip`,
+    `affine-${BUILD_TYPE}-macos-x64.dmg`,
+  ];
+  fileList.forEach(fileName => {
+    const filePath = path.join(__dirname, './', fileName);
+    try {
+      const fileData = fs.readFileSync(filePath);
+      const hash = crypto
+        .createHash('sha512')
+        .update(fileData)
+        .digest('base64');
+      const size = fs.statSync(filePath).size;
+
+      yml.files.push({
+        url: fileName,
+        sha512: hash,
+        size: size,
+      });
+    } catch (e) {}
+  });
+  yml.path = yml.files[0].url;
+  yml.sha512 = yml.files[0].sha512;
+  yml.releaseDate = new Date().toISOString();
+
+  const ymlStr =
+    `version: ${yml.version}\n` +
+    `files:\n` +
+    yml.files
+      .map(file => {
+        return (
+          `  - url: ${file.url}\n` +
+          `    sha512: ${file.sha512}\n` +
+          `    size: ${file.size}\n`
+        );
+      })
+      .join('') +
+    `path: ${yml.path}\n` +
+    `sha512: ${yml.sha512}\n` +
+    `releaseDate: ${yml.releaseDate}\n`;
+
+  fs.writeFileSync(`./latest-mac.yml`, ymlStr);
+};
+generateYml();

apps/electron/scripts/update-electron-vendors.mjs

@@ -1,17 +0,0 @@
-/**
- * This script should be run in electron context
- * @example
- *  ELECTRON_RUN_AS_NODE=1 electron scripts/update-electron-vendors.mjs
- */
-
-import { writeFileSync } from 'fs';
-
-const electronRelease = process.versions;
-
-const node = electronRelease.node.split('.')[0];
-const chrome = electronRelease.v8.split('.').splice(0, 2).join('');
-
-writeFileSync(
-  './electron-vendors.autogen.json',
-  JSON.stringify({ chrome, node })
-);

apps/electron/tests/basic.spec.ts

@@ -0,0 +1,79 @@
+import { expect } from '@playwright/test';
+
+import { test } from './fixture';
+
+test('new page', async ({ page, workspace }) => {
+  await page.getByTestId('new-page-button').click({
+    delay: 100,
+  });
+  await page.waitForSelector('v-line');
+  const flavour = (await workspace.current()).flavour;
+  expect(flavour).toBe('local');
+});
+
+test('app theme', async ({ page, electronApp }) => {
+  await page.waitForSelector('v-line');
+  const root = page.locator('html');
+  {
+    const themeMode = await root.evaluate(element =>
+      element.getAttribute('data-theme')
+    );
+    expect(themeMode).toBe('light');
+
+    // check if electron theme source is set to light
+    const themeSource = await electronApp.evaluate(({ nativeTheme }) => {
+      return nativeTheme.themeSource;
+    });
+
+    expect(themeSource).toBe('light');
+  }
+
+  {
+    await page.getByTestId('editor-option-menu').click();
+    await page.getByTestId('change-theme-dark').click();
+    await page.waitForTimeout(50);
+    {
+      const themeMode = await root.evaluate(element =>
+        element.getAttribute('data-theme')
+      );
+      expect(themeMode).toBe('dark');
+    }
+
+    const themeSource = await electronApp.evaluate(({ nativeTheme }) => {
+      return nativeTheme.themeSource;
+    });
+
+    expect(themeSource).toBe('dark');
+  }
+});
+
+test('affine cloud disabled', async ({ page }) => {
+  await page.getByTestId('new-page-button').click({
+    delay: 100,
+  });
+  await page.waitForSelector('v-line');
+  await page.getByTestId('current-workspace').click();
+  await page.getByTestId('sign-in-button').click();
+  await page.getByTestId('disable-affine-cloud-modal').waitFor({
+    state: 'visible',
+  });
+});
+
+test('affine onboarding button', async ({ page }) => {
+  await page.getByTestId('help-island').click();
+  await page.getByTestId('easy-guide').click();
+  const onboardingModal = page.locator('[data-testid=onboarding-modal]');
+  expect(await onboardingModal.isVisible()).toEqual(true);
+  const switchVideo = page.locator(
+    '[data-testid=onboarding-modal-switch-video]'
+  );
+  expect(await switchVideo.isVisible()).toEqual(true);
+  await page.getByTestId('onboarding-modal-next-button').click();
+  const editingVideo = page.locator(
+    '[data-testid=onboarding-modal-editing-video]'
+  );
+  expect(await editingVideo.isVisible()).toEqual(true);
+  await page.getByTestId('onboarding-modal-ok-button').click();
+
+  expect(await onboardingModal.isVisible()).toEqual(false);
+});

apps/electron/tests/fixture.ts

@@ -0,0 +1,86 @@
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference
+/// <reference path="../layers/preload/preload.d.ts" />
+
+/* eslint-disable no-empty-pattern */
+import crypto from 'node:crypto';
+import { resolve } from 'node:path';
+
+import { test as base } from '@affine-test/kit/playwright';
+import fs from 'fs-extra';
+import type { ElectronApplication, Page } from 'playwright';
+import { _electron as electron } from 'playwright';
+
+function generateUUID() {
+  return crypto.randomUUID();
+}
+
+export const test = base.extend<{
+  page: Page;
+  electronApp: ElectronApplication;
+  appInfo: {
+    appPath: string;
+    appData: string;
+    sessionData: string;
+  };
+  workspace: {
+    // get current workspace
+    current: () => Promise<any>; // todo: type
+  };
+}>({
+  page: async ({ electronApp }, use) => {
+    const page = await electronApp.firstWindow();
+    await page.getByTestId('onboarding-modal-close-button').click({
+      delay: 100,
+    });
+    if (!process.env.CI) {
+      await electronApp.evaluate(({ BrowserWindow }) => {
+        BrowserWindow.getAllWindows()[0].webContents.openDevTools({
+          mode: 'detach',
+        });
+      });
+    }
+    const logFilePath = await page.evaluate(async () => {
+      return window.apis?.debug.logFilePath();
+    });
+    await use(page);
+    await page.close();
+    if (logFilePath) {
+      const logs = await fs.readFile(logFilePath, 'utf-8');
+      console.log(logs);
+    }
+  },
+  electronApp: async ({}, use) => {
+    // a random id to avoid conflicts between tests
+    const id = generateUUID();
+    const electronApp = await electron.launch({
+      args: [resolve(__dirname, '..'), '--app-name', 'affine-test-' + id],
+      executablePath: resolve(__dirname, '../node_modules/.bin/electron'),
+      colorScheme: 'light',
+    });
+    const sessionDataPath = await electronApp.evaluate(async ({ app }) => {
+      return app.getPath('sessionData');
+    });
+    await use(electronApp);
+    await fs.rm(sessionDataPath, { recursive: true, force: true });
+  },
+  appInfo: async ({ electronApp }, use) => {
+    const appInfo = await electronApp.evaluate(async ({ app }) => {
+      return {
+        appPath: app.getAppPath(),
+        appData: app.getPath('appData'),
+        sessionData: app.getPath('sessionData'),
+      };
+    });
+    await use(appInfo);
+  },
+  workspace: async ({ page }, use) => {
+    await use({
+      current: async () => {
+        return await page.evaluate(async () => {
+          // @ts-expect-error
+          return globalThis.currentWorkspace;
+        });
+      },
+    });
+  },
+});

apps/electron/tests/setup.ts

@@ -0,0 +1,7 @@
+import { execSync } from 'node:child_process';
+
+export default async function () {
+  execSync('yarn ts-node-esm scripts/', {
+    cwd: path.join(__dirname, '..'),
+  });
+}

apps/electron/tests/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "noEmit": true
+  },
+  "include": ["**.spec.ts", "**.test.ts"]
+}

apps/electron/tests/workspace.spec.ts

@@ -0,0 +1,97 @@
+import path from 'node:path';
+
+import { expect } from '@playwright/test';
+import fs from 'fs-extra';
+
+import { test } from './fixture';
+
+test('check workspace has a DB file', async ({ appInfo, workspace }) => {
+  const w = await workspace.current();
+  const dbPath = path.join(
+    appInfo.sessionData,
+    'workspaces',
+    w.id,
+    'storage.db'
+  );
+  // check if db file exists
+  expect(await fs.exists(dbPath)).toBe(true);
+});
+
+test('move workspace db file', async ({ page, appInfo, workspace }) => {
+  const w = await workspace.current();
+  const settingButton = page.getByTestId('slider-bar-workspace-setting-button');
+  // goto settings
+  await settingButton.click();
+
+  const tmpPath = path.join(appInfo.sessionData, w.id + '-tmp.db');
+
+  // move db file to tmp folder
+  await page.evaluate(tmpPath => {
+    window.apis?.dialog.setFakeDialogResult({
+      filePath: tmpPath,
+    });
+  }, tmpPath);
+
+  await page.getByTestId('move-folder').click();
+  // check if db file exists
+  await page.waitForSelector('text="Move folder success"');
+  expect(await fs.exists(tmpPath)).toBe(true);
+});
+
+test('export then add', async ({ page, appInfo, workspace }) => {
+  const w = await workspace.current();
+  const settingButton = page.getByTestId('slider-bar-workspace-setting-button');
+  // goto settings
+  await settingButton.click();
+
+  const originalId = w.id;
+
+  const newWorkspaceName = 'new-test-name';
+
+  // change workspace name
+  await page.getByTestId('workspace-name-input').fill(newWorkspaceName);
+  await page.getByTestId('save-workspace-name').click();
+  await page.waitForSelector('text="Update workspace name success"');
+  await page.click('[data-tab-key="export"]');
+
+  const tmpPath = path.join(appInfo.sessionData, w.id + '-tmp.db');
+
+  // move db file to tmp folder
+  await page.evaluate(tmpPath => {
+    window.apis?.dialog.setFakeDialogResult({
+      filePath: tmpPath,
+    });
+  }, tmpPath);
+
+  await page.getByTestId('export-affine-backup').click();
+  await page.waitForSelector('text="Export success"');
+
+  expect(await fs.exists(tmpPath)).toBe(true);
+
+  // add workspace
+  // we are reusing the same db file so that we don't need to maintain one
+  // in the codebase
+
+  await page.getByTestId('current-workspace').click();
+  await page.getByTestId('add-or-new-workspace').click();
+
+  await page.evaluate(tmpPath => {
+    window.apis?.dialog.setFakeDialogResult({
+      filePath: tmpPath,
+    });
+  }, tmpPath);
+
+  // load the db file
+  await page.getByTestId('add-workspace').click();
+
+  // should show "Added Successfully" dialog
+  await page.waitForSelector('text="Added Successfully"');
+  await page.getByTestId('create-workspace-continue-button').click();
+
+  // sleep for a while to wait for the workspace to be added :D
+  await page.waitForTimeout(2000);
+  const newWorkspace = await workspace.current();
+  expect(newWorkspace.id).not.toBe(originalId);
+  // check its name is correct
+  await expect(page.getByTestId('workspace-name')).toHaveText(newWorkspaceName);
+});

apps/electron/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "composite": true,
+    "target": "ESNext",
+    "module": "ESNext",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "moduleResolution": "bundler",
+    "isolatedModules": false,
+    "resolveJsonModule": true,
+    "types": ["node"],
+    "outDir": "dist",
+    "noEmit": false
+  },
+  "include": ["layers", "types", "package.json"],
+  "exclude": ["out", "dist", "node_modules"],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ],
+  "ts-node": {
+    "esm": true,
+    "experimentalSpecifierResolution": "node"
+  }
+}

apps/electron/tsconfig.node.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "target": "ESNext",
+    "module": "ESNext",
+    "resolveJsonModule": true,
+    "moduleResolution": "Node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["./scripts", "package.json"]
+}

apps/server/.env.example

@@ -0,0 +1,2 @@
+SECRET_KEY="secret"
+DATABASE_URL="postgresql://affine@localhost:5432/affine"

apps/server/.gitignore

@@ -0,0 +1,2 @@
+.env
+src/schema.gql

apps/server/migrations/20230425035217_init/migration.sql

@@ -0,0 +1,59 @@
+-- CreateTable
+CREATE TABLE "users" (
+    "id" VARCHAR NOT NULL,
+    "name" VARCHAR NOT NULL,
+    "email" VARCHAR NOT NULL,
+    "token_nonce" SMALLINT NOT NULL DEFAULT 0,
+    "avatar_url" VARCHAR,
+    "password" VARCHAR,
+    "fulfilled" BOOLEAN NOT NULL DEFAULT true,
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "users_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "workspaces" (
+    "id" VARCHAR NOT NULL,
+    "public" BOOLEAN NOT NULL,
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "workspaces_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "connected_accounts" (
+    "id" VARCHAR NOT NULL,
+    "user_id" TEXT NOT NULL,
+    "provider" VARCHAR NOT NULL,
+    "provider_user_id" VARCHAR NOT NULL,
+
+    CONSTRAINT "connected_accounts_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "user_workspace_permissions" (
+    "id" VARCHAR NOT NULL,
+    "workspace_id" VARCHAR NOT NULL,
+    "entity_id" VARCHAR NOT NULL,
+    "type" SMALLINT NOT NULL,
+    "accepted" BOOLEAN NOT NULL DEFAULT false,
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "user_workspace_permissions_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "users_email_key" ON "users"("email");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "connected_accounts_provider_user_id_key" ON "connected_accounts"("provider_user_id");
+
+-- AddForeignKey
+ALTER TABLE "connected_accounts" ADD CONSTRAINT "connected_accounts_user_id_fkey" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "user_workspace_permissions" ADD CONSTRAINT "user_workspace_permissions_workspace_id_fkey" FOREIGN KEY ("workspace_id") REFERENCES "workspaces"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "user_workspace_permissions" ADD CONSTRAINT "user_workspace_permissions_entity_id_fkey" FOREIGN KEY ("entity_id") REFERENCES "users"("id") ON DELETE CASCADE ON UPDATE CASCADE;

apps/server/migrations/migration_lock.toml

@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (i.e. Git)
+provider = "postgresql"

apps/server/package.json

@@ -0,0 +1,86 @@
+{
+  "name": "@affine/server",
+  "private": true,
+  "version": "0.5.4-canary.29",
+  "description": "Affine Node.js server",
+  "type": "module",
+  "bin": {
+    "run-test": "./scripts/run-test.ts"
+  },
+  "scripts": {
+    "dev": "nodemon ./src/index.ts",
+    "test": "yarn exec ts-node-esm ./scripts/run-test.ts all",
+    "test:coverage": "c8 yarn exec ts-node-esm ./scripts/run-test.ts all",
+    "postinstall": "prisma generate"
+  },
+  "dependencies": {
+    "@apollo/server": "^4.7.1",
+    "@nestjs/apollo": "^11.0.5",
+    "@nestjs/common": "^9.4.0",
+    "@nestjs/core": "^9.4.0",
+    "@nestjs/graphql": "^11.0.5",
+    "@nestjs/platform-express": "^9.4.0",
+    "@prisma/client": "^4.13.0",
+    "bcrypt": "^5.1.0",
+    "dotenv": "^16.0.3",
+    "express": "^4.18.2",
+    "graphql": "^16.6.0",
+    "graphql-type-json": "^0.3.2",
+    "jsonwebtoken": "^9.0.0",
+    "lodash-es": "^4.17.21",
+    "prisma": "^4.13.0",
+    "reflect-metadata": "^0.1.13",
+    "rxjs": "^7.8.1"
+  },
+  "devDependencies": {
+    "@nestjs/testing": "^9.4.0",
+    "@types/bcrypt": "^5.0.0",
+    "@types/express": "^4.17.17",
+    "@types/jsonwebtoken": "^9.0.2",
+    "@types/lodash-es": "^4.17.7",
+    "@types/node": "^18.16.6",
+    "@types/supertest": "^2.0.12",
+    "c8": "^7.13.0",
+    "nodemon": "^2.0.22",
+    "supertest": "^6.3.3",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.0.4",
+    "vitest": "^0.31.0"
+  },
+  "nodemonConfig": {
+    "exec": "node",
+    "script": "./src/index.ts",
+    "nodeArgs": [
+      "--loader",
+      "ts-node/esm.mjs",
+      "--es-module-specifier-resolution",
+      "node"
+    ],
+    "ignore": [
+      "**/__tests__/**",
+      "**/dist/**"
+    ],
+    "env": {
+      "TS_NODE_TRANSPILE_ONLY": true,
+      "TS_NODE_PROJECT": "./tsconfig.json",
+      "NODE_ENV": "development",
+      "DEBUG": "affine:*",
+      "FORCE_COLOR": true,
+      "DEBUG_COLORS": true
+    },
+    "delay": 1000
+  },
+  "c8": {
+    "reporter": [
+      "text",
+      "lcov"
+    ],
+    "report-dir": ".coverage",
+    "exclude": [
+      "scripts",
+      "node_modules",
+      "**/*.spec.ts"
+    ]
+  },
+  "stableVersion": "0.5.3"
+}

apps/server/schema.prisma

@@ -0,0 +1,63 @@
+datasource db {
+  provider = "postgresql"
+  url      = env("DATABASE_URL")
+}
+
+generator client {
+  provider = "prisma-client-js"
+}
+
+model User {
+  id                String                    @id @default(uuid()) @db.VarChar
+  name              String                    @db.VarChar
+  email             String                    @unique @db.VarChar
+  tokenNonce        Int                       @default(0) @map("token_nonce") @db.SmallInt
+  avatarUrl         String?                   @map("avatar_url") @db.VarChar
+  /// Available if user signed up through OAuth providers
+  password          String?                   @db.VarChar
+  /// User may created by email collobration invitation before signup.
+  /// We will precreate a user entity in such senarios but leave fulfilled as false until they signed up
+  /// This implementation is convenient for handing unregistered user permissoin
+  fulfilled         Boolean                   @default(true)
+  createdAt         DateTime                  @default(now()) @map("created_at") @db.Timestamptz(6)
+  connectedAccounts ConnectedAccount[]
+  workspaces        UserWorkspacePermission[]
+
+  @@map("users")
+}
+
+model Workspace {
+  id        String                    @id @default(uuid()) @db.VarChar
+  public    Boolean
+  createdAt DateTime                  @default(now()) @map("created_at") @db.Timestamptz(6)
+  users     UserWorkspacePermission[]
+
+  @@map("workspaces")
+}
+
+model ConnectedAccount {
+  id             String @id @default(uuid()) @db.VarChar
+  userId         String @map("user_id")
+  /// the general provider name, e.g. google, github, facebook
+  provider       String @db.VarChar
+  /// the user id provided by OAuth providers, or other user identitive credential like `username` provided by GitHub
+  providerUserId String @unique @map("provider_user_id") @db.VarChar
+  user           User   @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@map("connected_accounts")
+}
+
+model UserWorkspacePermission {
+  id          String    @id @default(uuid()) @db.VarChar
+  workspaceId String    @map("workspace_id") @db.VarChar
+  userId      String    @map("entity_id") @db.VarChar
+  /// Read/Write/Admin/Owner
+  type        Int       @db.SmallInt
+  /// Whether the permission invitation is accepted by the user
+  accepted    Boolean   @default(false)
+  createdAt   DateTime  @default(now()) @map("created_at") @db.Timestamptz(6)
+  workspace   Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
+  user        User      @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+  @@map("user_workspace_permissions")
+}

apps/server/scripts/gen-auth-key.ts

@@ -0,0 +1,19 @@
+import crypto from 'node:crypto';
+
+import { genSalt } from 'bcrypt';
+
+const { privateKey, publicKey } = crypto.generateKeyPairSync('ec', {
+  namedCurve: 'prime256v1',
+  publicKeyEncoding: {
+    type: 'spki',
+    format: 'pem',
+  },
+  privateKeyEncoding: {
+    type: 'pkcs8',
+    format: 'pem',
+  },
+});
+
+console.log('Salt:\n', await genSalt(10));
+console.log('ECDSA Public Key:\n', publicKey);
+console.log('ECDSA Private Key:\n', privateKey);

apps/server/scripts/init-db.ts

@@ -0,0 +1,19 @@
+import userA from '@affine-test/fixtures/userA.json' assert { type: 'json' };
+import { PrismaClient } from '@prisma/client';
+const prisma = new PrismaClient();
+
+async function main() {
+  await prisma.user.create({
+    data: userA,
+  });
+}
+
+main()
+  .then(async () => {
+    await prisma.$disconnect();
+  })
+  .catch(async e => {
+    console.error(e);
+    await prisma.$disconnect();
+    process.exit(1);
+  });

apps/server/scripts/run-test.ts

@@ -0,0 +1,65 @@
+#!/usr/bin/env ts-node-esm
+import { resolve } from 'node:path';
+
+import * as p from '@clack/prompts';
+import { spawn } from 'child_process';
+import { readdir } from 'fs/promises';
+import * as process from 'process';
+import { fileURLToPath } from 'url';
+
+import pkg from '../package.json' assert { type: 'json' };
+const root = fileURLToPath(new URL('..', import.meta.url));
+const testDir = resolve(root, 'src', 'tests');
+const files = await readdir(testDir);
+
+const sharedArgs = [...pkg.nodemonConfig.nodeArgs, '--test'];
+
+const env = {
+  PATH: process.env.PATH,
+  NODE_ENV: 'test',
+  DATABASE_URL: process.env.DATABASE_URL,
+};
+
+if (process.argv[2] === 'all') {
+  const cp = spawn('node', [...sharedArgs, resolve(testDir, '*')], {
+    cwd: root,
+    env,
+    stdio: 'inherit',
+    shell: true,
+  });
+  cp.on('exit', code => {
+    process.exit(code ?? 0);
+  });
+} else {
+  const result = await p.group({
+    file: () =>
+      p.select({
+        message: 'Select a file to run',
+        options: files.map(file => ({
+          label: file,
+          value: file as any,
+        })),
+      }),
+  });
+
+  const target = resolve(testDir, result.file);
+
+  const cp = spawn(
+    'node',
+    [
+      ...sharedArgs,
+      '--test-reporter=spec',
+      '--test-reporter-destination=stdout',
+      target,
+    ],
+    {
+      cwd: root,
+      env,
+      stdio: 'inherit',
+      shell: true,
+    }
+  );
+  cp.on('exit', code => {
+    process.exit(code ?? 0);
+  });
+}

apps/server/src/app.ts

@@ -0,0 +1,17 @@
+/// <reference types="./global.d.ts" />
+import { Module } from '@nestjs/common';
+
+import { ConfigModule } from './config';
+import { GqlModule } from './graphql.module';
+import { BusinessModules } from './modules';
+import { PrismaModule } from './prisma';
+
+@Module({
+  imports: [
+    PrismaModule,
+    GqlModule,
+    ConfigModule.forRoot(),
+    ...BusinessModules,
+  ],
+})
+export class AppModule {}

apps/server/src/config/def.ts

@@ -0,0 +1,228 @@
+import type { ApolloDriverConfig } from '@nestjs/apollo';
+
+import type { LeafPaths } from '../utils/types';
+
+declare global {
+  // eslint-disable-next-line @typescript-eslint/no-namespace
+  namespace globalThis {
+    // eslint-disable-next-line no-var
+    var AFFiNE: AFFiNEConfig;
+  }
+}
+
+export const enum ExternalAccount {
+  github = 'github',
+  google = 'google',
+  firebase = 'firebase',
+}
+
+type EnvConfigType = 'string' | 'int' | 'float' | 'boolean';
+type ConfigPaths = LeafPaths<
+  Omit<
+    AFFiNEConfig,
+    | 'ENV_MAP'
+    | 'version'
+    | 'baseUrl'
+    | 'origin'
+    | 'prod'
+    | 'dev'
+    | 'test'
+    | 'deploy'
+  >,
+  '',
+  '....'
+>;
+/**
+ * parse number value from environment variables
+ */
+function int(value: string) {
+  const n = parseInt(value);
+  return Number.isNaN(n) ? undefined : n;
+}
+
+function float(value: string) {
+  const n = parseFloat(value);
+  return Number.isNaN(n) ? undefined : n;
+}
+
+function boolean(value: string) {
+  return value === '1' || value.toLowerCase() === 'true';
+}
+
+export function parseEnvValue(value: string | undefined, type?: EnvConfigType) {
+  if (typeof value === 'undefined') {
+    return;
+  }
+
+  return type === 'int'
+    ? int(value)
+    : type === 'float'
+    ? float(value)
+    : type === 'boolean'
+    ? boolean(value)
+    : value;
+}
+
+/**
+ * All Configurations that would control AFFiNE server behaviors
+ *
+ */
+export interface AFFiNEConfig {
+  ENV_MAP: Record<string, ConfigPaths | [ConfigPaths, EnvConfigType?]>;
+  /**
+   * Server Identity
+   */
+  readonly serverId: string;
+  /**
+   * System version
+   */
+  readonly version: string;
+  /**
+   * alias to `process.env.NODE_ENV`
+   *
+   * @default 'production'
+   * @env NODE_ENV
+   */
+  readonly env: string;
+  /**
+   * fast environment judge
+   */
+  get prod(): boolean;
+  get dev(): boolean;
+  get test(): boolean;
+  get deploy(): boolean;
+
+  /**
+   * Whether the server is hosted on a ssl enabled domain
+   */
+  https: boolean;
+  /**
+   * where the server get deployed.
+   *
+   * @default 'localhost'
+   * @env AFFINE_SERVER_HOST
+   */
+  host: string;
+  /**
+   * which port the server will listen on
+   *
+   * @default 3000
+   * @env AFFINE_SERVER_PORT
+   */
+  port: number;
+  /**
+   * subpath where the server get deployed if there is.
+   *
+   * @default '' // empty string
+   * @env AFFINE_SERVER_SUB_PATH
+   */
+  path: string;
+
+  /**
+   * Readonly property `baseUrl` is the full url of the server consists of `https://HOST:PORT/PATH`.
+   *
+   * if `host` is not `localhost` then the port will be ignored
+   */
+  get baseUrl(): string;
+
+  /**
+   * Readonly property `origin` is domain origin in the form of `https://HOST:PORT` without subpath.
+   *
+   * if `host` is not `localhost` then the port will be ignored
+   */
+  get origin(): string;
+
+  /**
+   * the apollo driver config
+   */
+  graphql: ApolloDriverConfig;
+  /**
+   * object storage Config
+   *
+   * all artifacts and logs will be stored on instance disk,
+   * and can not shared between instances if not configured
+   */
+  objectStorage: {
+    /**
+     * whether use remote object storage
+     */
+    enable: boolean;
+    /**
+     * used to store all uploaded builds and analysis reports
+     *
+     * the concrete type definition is not given here because different storage providers introduce
+     * significant differences in configuration
+     *
+     * @example
+     * {
+     *   provider: 'aws',
+     *   region: 'eu-west-1',
+     *   aws_access_key_id: '',
+     *   aws_secret_access_key: '',
+     *   // other aws storage config...
+     * }
+     */
+    config: Record<string, string>;
+  };
+
+  /**
+   * authentication config
+   */
+  auth: {
+    /**
+     * Application sign key secret
+     */
+    readonly salt: string;
+    /**
+     * Application access token expiration time
+     */
+    readonly accessTokenExpiresIn: string;
+    /**
+     * Application refresh token expiration time
+     */
+    readonly refreshTokenExpiresIn: string;
+    /**
+     * Application public key
+     *
+     */
+    readonly publicKey: string;
+    /**
+     * Application private key
+     *
+     */
+    readonly privateKey: string;
+    /**
+     * whether allow user to signup with email directly
+     */
+    enableSignup: boolean;
+    /**
+     * whether allow user to signup by oauth providers
+     */
+    enableOauth: boolean;
+    /**
+     * all available oauth providers
+     */
+    oauthProviders: Partial<
+      Record<
+        ExternalAccount,
+        {
+          clientId: string;
+          clientSecret: string;
+          /**
+           * uri to start oauth flow
+           */
+          authorizationUri?: string;
+          /**
+           * uri to authenticate `access_token` when user is redirected back from oauth provider with `code`
+           */
+          accessTokenUri?: string;
+          /**
+           * uri to get user info with authenticated `access_token`
+           */
+          userInfoUri?: string;
+          args?: Record<string, any>;
+        }
+      >
+    >;
+  };
+}

apps/server/src/config/default.ts

@@ -0,0 +1,72 @@
+/// <reference types="../global.d.ts" />
+
+import pkg from '../../package.json' assert { type: 'json' };
+import type { AFFiNEConfig } from './def';
+
+// Don't use this in production
+export const examplePublicKey = `-----BEGIN PUBLIC KEY-----
+MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEnxM+GhB6eNKPmTP6uH5Gpr+bmQ87
+hHGeOiCsay0w/aPwMqzAOKkZGqX+HZ9BNGy/yiXmnscey5b2vOTzxtRvxA==
+-----END PUBLIC KEY-----`;
+
+// Don't use this in production
+export const examplePrivateKey = `-----BEGIN PRIVATE KEY-----
+MIGHAgEAMBMGByqGSM49AgEGCCqGSM49AwEHBG0wawIBAQQgWOog5SFXs1Vjh/WP
+QCYPQKgf/jsNmWsvD+jYSn6mi3yhRANCAASfEz4aEHp40o+ZM/q4fkamv5uZDzuE
+cZ46IKxrLTD9o/AyrMA4qRkapf4dn0E0bL/KJeaexx7Llva85PPG1G/E
+-----END PRIVATE KEY-----`;
+
+export const getDefaultAFFiNEConfig: () => AFFiNEConfig = () => ({
+  serverId: 'affine-nestjs-server',
+  version: pkg.version,
+  ENV_MAP: {},
+  env: process.env.NODE_ENV ?? 'development',
+  get prod() {
+    return this.env === 'production';
+  },
+  get dev() {
+    return this.env === 'development';
+  },
+  get test() {
+    return this.env === 'test';
+  },
+  get deploy() {
+    return !this.dev && !this.test;
+  },
+  https: false,
+  host: 'localhost',
+  port: 3010,
+  path: '',
+  get origin() {
+    return this.dev
+      ? 'http://localhost:8080'
+      : `${this.https ? 'https' : 'http'}://${this.host}${
+          this.host === 'localhost' ? `:${this.port}` : ''
+        }`;
+  },
+  get baseUrl() {
+    return `${this.origin}${this.path}`;
+  },
+  graphql: {
+    buildSchemaOptions: {
+      numberScalarMode: 'integer',
+    },
+    introspection: true,
+    playground: true,
+    debug: true,
+  },
+  auth: {
+    salt: '$2b$10$x4VDo2nmlo74yB5jflNhlu',
+    accessTokenExpiresIn: '1h',
+    refreshTokenExpiresIn: '7d',
+    publicKey: examplePublicKey,
+    privateKey: examplePrivateKey,
+    enableSignup: true,
+    enableOauth: false,
+    oauthProviders: {},
+  },
+  objectStorage: {
+    enable: false,
+    config: {},
+  },
+});