feat: support get datasource status (#3645)

2026-02-15 05:37:32 +00:00 · 2023-08-10 01:05:34 -04:00
parent 05144abd6a
commit dafd5619e6
34 changed files with 836 additions and 46 deletions
--- a/apps/README.md
+++ b/apps/README.md
@@ -8,7 +8,7 @@ AFFiNE Developer Documentation using [waku](https://github.com/dai-shi/waku).

 ## electron

-> `web` needs to be built before electron.
+> `core` needs to be built before electron.

 AFFiNE Desktop (macOS, Linux and Windows Distribution) using [Electron](https://www.electronjs.org/).

@@ -20,6 +20,10 @@ Server using [Nest.js](https://nestjs.com/).

 Storybook using [Storybook](https://storybook.js.org/).

-## Core
+## prototype

-AFFiNE Core Application using [React.js](https://reactjs.org/).
+AFFiNE Prototype using [React.js](https://reactjs.org/) + [Vite](https://vitejs.dev/).
+
+## core
+
+AFFiNE Core Application using [React.js](https://reactjs.org/) + [Webpack](https://webpack.js.org/).
--- a/apps/core/src/components/pure/workspace-slider-bar/WorkspaceSelector/workspace-selector.tsx
+++ b/apps/core/src/components/pure/workspace-slider-bar/WorkspaceSelector/workspace-selector.tsx
@@ -4,7 +4,6 @@ import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-
 import type React from 'react';
 import { useCallback } from 'react';

-import { useCurrentWorkspace } from '../../../../hooks/current/use-current-workspace';
 import type { AllWorkspace } from '../../../../shared';
 import { workspaceAvatarStyle } from './index.css';
 import {
@@ -28,9 +27,8 @@ export const WorkspaceSelector = ({
  onClick,
 }: WorkspaceSelectorProps) => {
  const [name] = useBlockSuiteWorkspaceName(
-    currentWorkspace?.blockSuiteWorkspace
+    currentWorkspace.blockSuiteWorkspace
  );
-  const [workspace] = useCurrentWorkspace();

  // Open dialog when `Enter` or `Space` pressed
  // TODO-Doma Refactor with `@radix-ui/react-dialog` or other libraries that handle these out of the box and be accessible by default
@@ -57,22 +55,20 @@ export const WorkspaceSelector = ({
        data-testid="workspace-avatar"
        className={workspaceAvatarStyle}
        size={40}
-        workspace={currentWorkspace?.blockSuiteWorkspace ?? null}
+        workspace={currentWorkspace.blockSuiteWorkspace}
      />
      <StyledSelectorWrapper>
        <StyledWorkspaceName data-testid="workspace-name">
          {name}
        </StyledWorkspaceName>
-        {workspace && (
-          <StyledWorkspaceStatus>
-            {workspace.flavour === 'local' ? (
-              <LocalWorkspaceIcon />
-            ) : (
-              <CloudWorkspaceIcon />
-            )}
-            {workspace.flavour === 'local' ? 'Local' : 'AFFiNE Cloud'}
-          </StyledWorkspaceStatus>
-        )}
+        <StyledWorkspaceStatus>
+          {currentWorkspace.flavour === 'local' ? (
+            <LocalWorkspaceIcon />
+          ) : (
+            <CloudWorkspaceIcon />
+          )}
+          {currentWorkspace.flavour === 'local' ? 'Local' : 'AFFiNE Cloud'}
+        </StyledWorkspaceStatus>
      </StyledSelectorWrapper>
    </StyledSelectorContainer>
  );
--- a/apps/prototype/README.md
+++ b/apps/prototype/README.md
@@ -0,0 +1,5 @@
+# AFFiNE Prototype
+
+> This is a prototype of the AFFiNE system to test the feasibility of the approach.
+>
+> It is not intended for production use.
--- a/apps/prototype/index.html
+++ b/apps/prototype/index.html
@@ -0,0 +1,15 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>AFFiNE Prototype</title>
+  </head>
+  <body>
+    <ul>
+      <li>
+        <a href="suite/provider-status.html">Provider status test</a>
+      </li>
+    </ul>
+  </body>
+</html>
--- a/apps/prototype/package.json
+++ b/apps/prototype/package.json
@@ -0,0 +1,40 @@
+{
+  "name": "@affine/prototype",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite --host --port 3003",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview --host --port 3003"
+  },
+  "dependencies": {
+    "@affine-test/fixtures": "workspace:*",
+    "@affine/component": "workspace:*",
+    "@affine/debug": "workspace:*",
+    "@affine/env": "workspace:*",
+    "@affine/graphql": "workspace:*",
+    "@affine/i18n": "workspace:*",
+    "@affine/jotai": "workspace:*",
+    "@affine/templates": "workspace:*",
+    "@affine/workspace": "workspace:*",
+    "@blocksuite/block-std": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@blocksuite/blocks": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@blocksuite/editor": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@blocksuite/global": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@blocksuite/icons": "^2.1.31",
+    "@blocksuite/lit": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@blocksuite/store": "0.0.0-20230809030546-32e6e21d-nightly",
+    "@toeverything/hooks": "workspace:*",
+    "@toeverything/y-indexeddb": "workspace:*",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.20",
+    "@types/react-dom": "^18.2.7",
+    "@vitejs/plugin-react-swc": "^3.3.2",
+    "typescript": "^5.1.6",
+    "vite": "^4.4.9"
+  }
+}
--- a/apps/prototype/project.json
+++ b/apps/prototype/project.json
@@ -0,0 +1,16 @@
+{
+  "name": "prototype",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "application",
+  "sourceRoot": "apps/prototype/src",
+  "targets": {
+    "build": {
+      "executor": "nx:run-script",
+      "dependsOn": ["^build"],
+      "options": {
+        "script": "build"
+      },
+      "outputs": ["{projectRoot}/dist"]
+    }
+  }
+}
--- a/apps/prototype/src/provider-status.tsx
+++ b/apps/prototype/src/provider-status.tsx
@@ -0,0 +1,57 @@
+import type { LocalIndexedDBBackgroundProvider } from '@affine/env/workspace';
+import { createIndexedDBBackgroundProvider } from '@affine/workspace/providers';
+import { assertExists } from '@blocksuite/global/utils';
+import { useDataSourceStatus } from '@toeverything/hooks/use-data-source-status';
+import React, { useCallback, useRef } from 'react';
+import ReactDOM from 'react-dom/client';
+import { Awareness } from 'y-protocols/awareness';
+import { Doc } from 'yjs';
+
+const doc = new Doc();
+const map = doc.getMap();
+const awareness = new Awareness(doc);
+
+const indexeddbProvider = createIndexedDBBackgroundProvider('test', doc, {
+  awareness,
+}) as LocalIndexedDBBackgroundProvider;
+indexeddbProvider.connect();
+
+const App = () => {
+  const counterRef = useRef(0);
+  const disposeRef = useRef<number>(0);
+  const status = useDataSourceStatus(indexeddbProvider);
+  return (
+    <div>
+      <button
+        data-testid="start-button"
+        onClick={useCallback(() => {
+          disposeRef.current = setInterval(() => {
+            const counter = counterRef.current;
+            map.set('counter', counter + 1);
+            counterRef.current = counter + 1;
+          }, 0) as any;
+        }, [])}
+      >
+        start writing
+      </button>
+      <button
+        data-testid="stop-button"
+        onClick={useCallback(() => {
+          clearInterval(disposeRef.current);
+        }, [])}
+      >
+        stop writing
+      </button>
+      <div data-testid="status">{status.type}</div>
+    </div>
+  );
+};
+
+const root = document.getElementById('root');
+assertExists(root);
+
+ReactDOM.createRoot(root).render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
--- a/apps/prototype/src/vite-env.d.ts
+++ b/apps/prototype/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
--- a/apps/prototype/suite/provider-status.html
+++ b/apps/prototype/suite/provider-status.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Provider status test</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="../src/provider-status.tsx"></script>
+  </body>
+</html>
--- a/apps/prototype/tsconfig.json
+++ b/apps/prototype/tsconfig.json
@@ -0,0 +1,40 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "moduleResolution": "bundler",
+    "outDir": "./lib"
+  },
+  "include": ["./src"],
+  "references": [
+    {
+      "path": "../../packages/component"
+    },
+    {
+      "path": "../../packages/debug"
+    },
+    {
+      "path": "../../packages/env"
+    },
+    {
+      "path": "../../packages/graphql"
+    },
+    {
+      "path": "../../packages/hooks"
+    },
+    {
+      "path": "../../packages/i18n"
+    },
+    {
+      "path": "../../packages/jotai"
+    },
+    {
+      "path": "../../packages/y-indexeddb"
+    },
+    {
+      "path": "../../packages/workspace"
+    },
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
+}
--- a/apps/prototype/tsconfig.node.json
+++ b/apps/prototype/tsconfig.node.json
@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "outDir": "./lib",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}
--- a/apps/prototype/vite.config.ts
+++ b/apps/prototype/vite.config.ts
@@ -0,0 +1,22 @@
+import { resolve } from 'node:path';
+
+import react from '@vitejs/plugin-react-swc';
+import { defineConfig } from 'vite';
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  build: {
+    target: 'ES2022',
+    sourcemap: true,
+    rollupOptions: {
+      input: {
+        'suite/provider-status': resolve(
+          __dirname,
+          'suite',
+          'provider-status.html'
+        ),
+      },
+    },
+  },
+  plugins: [react()],
+});