This PR performs a significant architectural refactoring by extracting rich text functionality into a dedicated package. Here are the key changes:
1. **New Package Creation**
- Created a new package `@blocksuite/affine-rich-text` to house rich text related functionality
- Moved rich text components, utilities, and types from `@blocksuite/affine-components` to this new package
2. **Dependency Updates**
- Updated multiple block packages to include the new `@blocksuite/affine-rich-text` as a direct dependency:
- block-callout
- block-code
- block-database
- block-edgeless-text
- block-embed
- block-list
- block-note
- block-paragraph
3. **Import Path Updates**
- Refactored all imports that previously referenced rich text functionality from `@blocksuite/affine-components/rich-text` to now use `@blocksuite/affine-rich-text`
- Updated imports for components like:
- DefaultInlineManagerExtension
- RichText types and interfaces
- Text manipulation utilities (focusTextModel, textKeymap, etc.)
- Reference node components and providers
4. **Build Configuration Updates**
- Added references to the new rich text package in the `tsconfig.json` files of all affected packages
- Maintained workspace dependencies using the `workspace:*` version specifier
The primary motivation appears to be:
1. Better separation of concerns by isolating rich text functionality
2. Improved maintainability through more modular package structure
3. Clearer dependencies between packages
4. Potential for better tree-shaking and bundle optimization
This is primarily an architectural improvement that should make the codebase more maintainable and better organized.
The primary purpose of this PR appears to be:
1. Simplifying the change notification API by removing the redundant value parameter from callbacks
2. Improving the reactive system's handling of specialized types (Text and Boxed) in flat data
3. Adding better test coverage for text handling in the flat data model
This PR implements a significant refactoring of the embed block services across multiple components (Figma, GitHub, Loom, and YouTube) in the BlockSuite codebase. Here are the key changes:
1. **Architecture Change**:
- Moves from a dynamic registration pattern to a more declarative configuration approach
- Replaces `EmbedOptionProvider.registerEmbedBlockOptions()` calls with a new `EmbedOptionConfig` factory function
2. **Service Refactoring**:
- For each embed block type (Figma, GitHub, Loom, YouTube):
- Separates configuration from service logic
- Creates new `EmbedBlockOptionConfig` constants using the new `EmbedOptionConfig` factory
- Removes the `mounted()` lifecycle hook from services where it was only used for registration
3. **Core Changes**:
- In `embed-option-service.ts`:
- Introduces new `EmbedOptionConfigIdentifier` for dependency injection
- Adds `EmbedOptionConfig` factory function for creating embed configurations
- Updates `EmbedOptionService` constructor to automatically register configurations
- Modifies DI setup to include `StdIdentifier` dependency
4. **Spec Updates**:
- Updates all block specs to include the new configuration objects
- Maintains existing functionality while using the new pattern
The main benefit of this refactoring is:
- More declarative configuration approach
- Better separation of concerns
- Reduced runtime registration code
- More predictable initialization of embed options
The new code should be more efficient as it:
- Avoids unnecessary iterations when objects aren't empty
- Has clearer path management
- Reduces redundant object traversals
1. **Table UI Enhancements - Test IDs Added**
- Added `data-testid` attributes to several table components for better testability:
- `add-column-button` for the column addition button
- `add-row-button` for the row addition button
- `drag-column-handle` for column drag handles
- `drag-row-handle` for row drag handles
2. **New Test Infrastructure**
- Added new testing utilities in `tests/kit/src/bs/`:
- `misc.ts`: Added `waitNextFrame` utility function for handling animation frame timing in tests
- `table.ts`: Added comprehensive table testing utilities including:
- `createTable`: Creates a new table with initial cells
- `getCellText`: Retrieves text from a specific table cell
- `inputToCell`: Inputs text into a specific table cell
- `clickDeleteButtonInTableMenu`: Handles table deletion operations
3. **New Collaboration Test**
- Added a new test file `tests/affine-local/e2e/blocksuite/table/collab.spec.ts` that tests table collaboration features:
- Tests synchronization between two pages (A and B)
- Verifies table operations sync correctly:
- Adding columns and rows
- Inputting cell content
- Deleting columns and rows
- Validates cell content consistency across both pages
- Tests the complete table manipulation workflow in a collaborative setting
4. **Package Configuration Update**
- Modified `tests/kit/package.json` to expose new test utilities:
- Added new export mapping: `"./bs/*": "./src/bs/*.ts"` to make the new table testing utilities accessible
This PR primarily focuses on improving table testing infrastructure and adding comprehensive collaboration tests for the table functionality, while also enhancing component testability through data-test-ids.
The main changes in this PR involve replacing the deprecated `BlockServiceWatcher` with the new `LifeCycleWatcher` across multiple files. Here's a detailed breakdown:
1. **Core Architectural Change:**
- Removed `BlockServiceWatcher` class completely (deleted file)
- Migrated to `LifeCycleWatcher` as the new standard for watching component lifecycle events
2. **Key Changes in Implementation:**
- Changed from using `blockService.specSlots` events to using `view.viewUpdated` events
- Replaced `flavour` static property with `key` static property
- Updated event handling to use more specific payload type checking
3. **Major File Changes:**
- Modified multiple block components:
- Embed synced doc block
- Frame preview
- Edgeless root spec
- AI-related components (code, image, paragraph, etc.)
- Quick search service
- Edgeless clipboard
4. **Pattern of Changes:**
The migration follows a consistent pattern:
```typescript
// Old pattern
class SomeWatcher extends BlockServiceWatcher {
static override readonly flavour = 'some:flavour';
mounted() {
this.blockService.specSlots.viewConnected.on(...)
}
}
// New pattern
class SomeWatcher extends LifeCycleWatcher {
static override key = 'some-watcher';
mounted() {
const { view } = this.std;
view.viewUpdated.on(payload => {
if (payload.type !== 'block' || payload.method !== 'add') return;
// Handle event
});
}
}
```
5. **Benefits:**
- More explicit and type-safe event handling
- Cleaner architecture by removing deprecated code
- More consistent approach to lifecycle management
- Better separation of concerns
This appears to be a significant architectural improvement that modernizes the codebase by removing deprecated patterns and standardizing on a more robust lifecycle management system.
1. **Major Architectural Change: Schema Management**
- Moved from `workspace.schema` to `store.schema` throughout the codebase
- Removed schema property from Workspace and Doc interfaces
- Added `BlockSchemaExtension` pattern across multiple block types
2. **Block Schema Extensions Added**
- Added new `BlockSchemaExtension` to numerous block types including:
- DataView, Surface, Attachment, Bookmark, Code
- Database, Divider, EdgelessText, Embed blocks (Figma, Github, HTML, etc.)
- Frame, Image, Latex, List, Note, Paragraph
- Root, Surface Reference, Table blocks
3. **Import/Export System Updates**
- Updated import functions to accept `schema` parameter:
- `importHTMLToDoc`
- `importHTMLZip`
- `importMarkdownToDoc`
- `importMarkdownZip`
- `importNotionZip`
- Modified export functions to use new schema pattern
4. **Test Infrastructure Updates**
- Updated test files to use new schema extensions
- Modified test document creation to include schema extensions
- Removed direct schema registration in favor of extensions
5. **Service Layer Changes**
- Updated various services to use `getAFFiNEWorkspaceSchema()`
- Modified transformer initialization to use document schema
- Updated collection initialization patterns
6. **Version Management**
- Removed version-related properties and methods from:
- `WorkspaceMetaImpl`
- `TestMeta`
- `DocImpl`
- Removed `blockVersions` and `workspaceVersion/pageVersion`
7. **Store and Extension Updates**
- Added new store extensions and adapters
- Updated store initialization patterns
- Added new schema-related functionality in store extension
This PR represents a significant architectural shift in how schemas are managed, moving from a workspace-centric to a store-centric approach, while introducing a more extensible block schema system through `BlockSchemaExtension`. The changes touch multiple layers of the application including core functionality, services, testing infrastructure, and import/export capabilities.
Key Changes:
1. **Code Reorganization and Consolidation**
- Created new centralized extension management through new files:
- `enableEditorExtension` in `extensions/entry/enable-editor.ts`
- `enablePreviewExtension` in `extensions/entry/enable-preview.ts`
- Removed several spec-related files that are now consolidated:
- Removed `specs/edgeless.ts`
- Removed `specs/page.ts`
- Removed `specs/preview.ts`
2. **Template Management**
- Added new `register-templates.ts` file to handle template registration
- Moved template registration logic from `specs/edgeless.ts` to this new file
- Templates now include both edgeless and sticker templates
3. **Extension Management Changes**
- Simplified extension enabling process through new centralized functions
- `enableEditorExtension` now handles both page and edgeless modes
- `enablePreviewExtension` consolidates preview-related extensions
- Removed duplicate code for extension management
4. **Preview Functionality Updates**
- Streamlined preview spec management
- Consolidated footnote configuration
- Improved theme and preview extension handling
5. **Dependencies and Effects**
- Updated how effects are registered and managed
- Simplified initialization process in `index.ts`
- More organized approach to handling framework providers
The main theme of this PR appears to be code consolidation and simplification, moving from multiple specialized files to more centralized, reusable extension management. This should make the codebase more maintainable and reduce duplication while keeping the same functionality.
The changes primarily affect the editor's extension system, preview functionality, and template management, making these systems more modular and easier to maintain.
Key Changes:
1. **Removal of Scroll Anchoring Widget**
- Removed the scroll anchoring widget import and its related implementation from `blocksuite/affine/block-root/src/common-specs/widgets.ts`
2. **Enhanced React-Lit Integration**
- Added `ReactWebComponent` type export in `packages/frontend/component/src/lit-react/index.ts`
- Refactored text renderer component to use React integration:
- Added React import and created `LitTextRenderer` component using `createReactComponentFromLit`
- Moved the component declaration to a more appropriate location
3. **AI Feature Flag Integration**
- Added feature flag check for AI functionality in `enableAIExtension`
- Only enables AI extensions if the `enable_ai` flag is true
4. **Component Restructuring**
- Moved several components and utilities to dedicated extension files
- Consolidated Lit adapter implementations
- Removed direct widget imports in favor of extension-based approach
- Reorganized editor component structure for better maintainability
5. **File Reorganization**
- Removed `specs/custom/spec-patchers.ts` and distributed its functionality across multiple extension files
- Created new extension files for various features like:
- Attachment embed views
- Doc mode service
- Doc URL handling
- Edgeless clipboard
- Mobile support
- Note configuration
- Various service patches (notification, peek view, quick search, etc.)
6. **Mobile Support Improvements**
- Refactored mobile extension enablement to be more modular
- Moved mobile-specific widget omissions into a dedicated extension
7. **Type System Improvements**
- Added more specific type imports for editors and components
- Enhanced type safety across the codebase
This PR appears to be a significant refactoring effort focused on:
1. Improving code organization through better separation of concerns
2. Enhancing the integration between React and Lit components
3. Adding feature flag support for AI capabilities
4. Making the codebase more maintainable and modular
5. Improving mobile support
6. Strengthening type safety
The changes suggest a move towards a more extension-based architecture, where functionality is more clearly separated into distinct modules rather than being centralized in larger files.
Let me analyze this diff and provide a clear description of the changes.
This PR introduces several significant changes focused on AI integration and code organization in the AFFiNE codebase:
1. **Enhanced SpecBuilder Functionality** (`blocksuite/affine/shared/src/utils/spec/spec-builder.ts`):
- Added method chaining by returning `this` from `extend`, `omit`, and `replace` methods
- Added new utility methods:
- `hasAll(target: ExtensionType[])`: Checks if all specified extensions exist
- `hasOneOf(target: ExtensionType[])`: Checks if at least one specified extension exists
2. **AI Extensions Modularization**:
- Split the large AI-related code into separate modular files under `packages/frontend/core/src/blocksuite/ai/extensions/`:
- `ai-code.ts`: Code block AI integration
- `ai-edgeless-root.ts`: Edgeless mode AI features
- `ai-image.ts`: Image block AI capabilities
- `ai-page-root.ts`: Page root AI integration
- `ai-paragraph.ts`: Paragraph block AI features
- `enable-ai.ts`: Central AI extension enablement logic
3. **Widget Improvements**:
- Enhanced `AffineAIPanelWidget` and `EdgelessCopilotWidget` with proper widget extensions
- Moved widget-specific extensions into their respective files
- Added proper type definitions and component registrations
4. **Code Organization**:
- Simplified exports in `index.ts`
- Better separation of concerns between different AI-related components
- More modular approach to AI feature integration
5. **AI Integration Architecture**:
- Introduced a new `enableAIExtension` function that handles:
- Replacing standard blocks with AI-enhanced versions
- Conditional enabling of AI features based on the current spec configuration
- Extension of AI chat capabilities
The changes primarily focus on improving code organization, maintainability, and the architecture of AI feature integration in the AFFiNE editor. The modularization will make it easier to maintain and extend AI capabilities across different block types and editor modes.
### TL;DR
Relocated AI-related code from `presets` directory to a dedicated `ai` directory for better organization and maintainability.
### What changed?
- Moved AI-related code from `blocksuite/presets/ai` to `blocksuite/ai`
- Relocated AI chat block code from `blocksuite/blocks` to `blocksuite/ai/blocks`
- Updated imports across files to reflect new directory structure
- Renamed `registerBlocksuitePresetsCustomComponents` to `registerAIEffects`
- Fixed path references in GitHub workflow file
### How to test?
1. Build and run the application
2. Verify AI functionality works as expected:
- Test AI chat blocks
- Check AI panel functionality
- Verify AI copilot features
- Ensure AI-related UI components render correctly
### Why make this change?
This restructuring improves code organization by:
- Giving AI features a dedicated directory that better reflects their importance
- Making the codebase more maintainable by grouping related AI functionality
- Reducing confusion by removing AI code from the more general `presets` directory
- Creating clearer boundaries between AI and non-AI related code
### TL;DR
Relocated AI item components from BlockSuite to the frontend codebase and updated related imports.
### What changed?
- Moved AI item components from `blocksuite/affine/components/src/ai-item` to `packages/frontend/core/src/blocksuite/presets/ai/_common/components/ai-item`
- Updated all imports referencing the old AI item component location to point to the new location
- Removed AI item exports from BlockSuite's package.json and effects registration
- Added AI item effects registration to frontend presets
### How to test?
1. Verify AI functionality works as expected in:
- Chat panels
- AI toolbars
- Edgeless copilot
- Slash menu
2. Confirm no AI-related console errors appear
3. Test error handling scenarios (unauthorized, payment required, network errors)
### Why make this change?
This change consolidates AI-related components into the frontend codebase where they are primarily used, rather than keeping them in BlockSuite. This improves code organization by placing components closer to their implementation and usage, while reducing unnecessary coupling between packages.
### TL;DR
Moved AI-related components from BlockSuite core to the frontend presets directory to better organize AI functionality.
### What changed?
- Relocated AI panel, copilot tool, and related components from BlockSuite core to frontend presets
- Moved AI widget definitions and registrations to the presets directory
- Updated imports to reference new component locations
- Removed AI component registrations from core effects.ts
- Added AI component registrations to presets effects.ts
### How to test?
1. Verify AI panel functionality works as expected in the editor
2. Test copilot tool interactions in edgeless mode
3. Confirm AI suggestions and responses still appear correctly
4. Check that AI toolbar buttons and menus function properly
5. Ensure AI error states and loading indicators display correctly
### Why make this change?
This restructuring improves code organization by moving AI-specific functionality out of the core BlockSuite library and into the frontend presets where it more logically belongs. This separation of concerns makes the codebase more maintainable and allows for better modularity of AI features.
### TL;DR
Reorganized component registration in the effects module by grouping related components into separate functions.
### What changed?
- Split the monolithic component registration into logical categories:
- Root components (page, preview, edgeless)
- Widgets (panels, toolbars, modals)
- Edgeless toolbar components (tools, menus, buttons)
- Edgeless panel components (alignment, color, style)
- Edgeless editor components (text editors, label editors)
- AI components (panels, placeholders)
- Misc components (modals, loading, previews)
- Added descriptive comments for each component group
- Maintained all existing component registrations while improving code organization
### How to test?
1. Launch the application
2. Verify all components render correctly:
- Check page/preview/edgeless views
- Test toolbar functionality
- Verify panels and modals work
- Ensure AI features function properly
- Validate edgeless editor capabilities
### Why make this change?
Improves code maintainability and readability by:
- Grouping related components together
- Making it easier to find and modify specific component registrations
- Providing better structure for future component additions
- Reducing cognitive load when working with component registrations
### TL;DR
Refactored `SpecProvider` singleton access pattern and reorganized adapter/extension code structure.
### What changed?
- Changed `SpecProvider.getInstance()` to `SpecProvider._` for cleaner singleton access
- Moved adapter/extension code from `_common` directory to dedicated `adapters` and `extensions` folders
- Consolidated adapter extensions into a single file
- Removed unused dependencies from package.json
- Deleted unnecessary schema files
- Extracted `MobileSpecsPatches` class into the mobile patching code
- Updated all references to use the new `SpecProvider._` accessor
### How to test?
- Verify all specs are properly registered and accessible via `SpecProvider._`
- Test adapter functionality for HTML, Markdown, Notion HTML and plain text
- Check mobile-specific features and patches work correctly
- Ensure preview functionality works in both page and edgeless modes
### Why make this change?
- Improves code organization by properly separating adapters and extensions
- Simplifies singleton access pattern
- Removes unnecessary dependencies and files
- Makes the codebase more maintainable by consolidating related functionality
### TL;DR
Moved image proxy middleware and adapter extensions to their respective packages and introduced a new spec provider for adapter registration.
### What changed?
- Relocated `defaultImageProxyMiddleware` from blocks to `@blocksuite/affine-block-image`
- Moved `PresentTool` from fragment-frame-panel to block-frame
- Created new adapter extension specs for HTML, Markdown, and Notion HTML
- Introduced a spec provider pattern for adapter registration
- Removed direct transformer references from RootService
- Updated imports across affected files to use new locations
### How to test?
1. Verify image proxy functionality works in exports and imports
2. Test HTML, Markdown, and Notion HTML adapters still function correctly
3. Confirm presentation mode works with the relocated PresentTool
4. Check that all file import/export operations continue to work as expected
### Why make this change?
This reorganization improves code modularity by placing features in their logical packages and introduces a more maintainable pattern for adapter registration. The spec provider pattern makes it easier to manage and extend adapter functionality while reducing coupling between components.
### TL;DR
Moved editor components from BlockSuite presets to AFFiNE core and updated imports accordingly.
### What changed?
- Relocated `EdgelessEditor` and `PageEditor` components from BlockSuite presets to AFFiNE core
- Removed basic editor examples from playground
- Updated import paths across the codebase to reference new component locations
- Added editor effects registration in AFFiNE core
- Removed editor exports from BlockSuite presets
### How to test?
1. Launch the application
2. Verify both page and edgeless editors load correctly
3. Confirm editor functionality remains intact including:
- Document editing
- Mode switching
- Editor toolbars and controls
- Multiple editor instances
### Why make this change?
This change better aligns with AFFiNE's architecture by moving editor components closer to where they are used. It reduces coupling with BlockSuite presets and gives AFFiNE more direct control over editor customization and implementation.
### TL;DR
Moved outline functionality into a dedicated fragment package and updated vanilla-extract CSS dependency.
### What changed?
- Created new `@blocksuite/affine-fragment-outline` package
- Relocated outline-related code from presets to the new fragment package
- Updated imports across affected files to reference the new package location
- Upgraded `@vanilla-extract/css` dependency from 1.14.0/1.16.1 to 1.17.0
- Added necessary package configuration and TypeScript setup for the new fragment
### How to test?
1. Verify outline functionality works as expected in both desktop and mobile views
2. Check that outline panel, viewer, and mobile menu components render correctly
3. Ensure outline navigation and interactions continue to work
4. Confirm no regressions in outline-related features
### Why make this change?
This change improves code organization by isolating outline functionality into a dedicated package, following the modular architecture pattern. This makes the codebase more maintainable and allows for better separation of concerns. The vanilla-extract CSS upgrade ensures consistency across packages and provides access to the latest features and fixes.
### TL;DR
Refactored editor access to use `EditorHost` instead of `AffineEditorContainer` and updated mode access through `DocModeProvider`.
### What changed?
- Changed editor property types from `AffineEditorContainer` to `EditorHost` across multiple components
- Updated mode access to use `DocModeProvider` service instead of direct editor mode access
- Modified editor references to use `editor.host` where appropriate
- Updated scroll and highlight utilities to work with `EditorHost`
### How to test?
1. Open a document in both page and edgeless modes
2. Verify outline panel functionality works as expected
3. Test outline viewer navigation and highlighting
4. Confirm mobile outline menu operates correctly
5. Check that frame panel and TOC features work in all modes
### Why make this change?
This change improves architectural consistency by using `EditorHost` directly and accessing mode through the proper service provider. This makes the code more maintainable and follows better dependency practices by using the correct abstraction levels.
### TL;DR
Moved frame management functionality from `blocksuite/blocks` to `@blocksuite/affine-block-frame` package.
### What changed?
- Relocated `frame-manager.ts` from `blocksuite/blocks` to `@blocksuite/affine-block-frame`
- Added new dependencies to block-frame package: `@blocksuite/affine-block-surface` and `yjs`
- Updated imports across multiple components to reference frame manager from its new location
- Moved utility functions `areSetsEqual` and `isFrameBlock` into frame-manager file
- Replaced direct EdgelessRootService references with GfxController in frame panel components
### How to test?
1. Verify frame functionality works in edgeless mode
2. Test frame creation, selection, and manipulation
3. Confirm frame navigation and presentation modes operate correctly
4. Check that frame panel and toolbar interactions remain functional
### Why make this change?
This refactoring improves code organization by consolidating frame-related functionality into a dedicated package, making the codebase more modular and easier to maintain. It also reduces dependencies between packages and provides clearer boundaries for frame-related features.
### TL;DR
Moved doc title and AI chat block components to more appropriate locations while removing unused backlink functionality.
### What changed?
- Relocated doc title component from presets to affine-components
- Moved AI chat block from presets/blocks to blocks directory
- Removed unused backlink-related code and components
- Updated imports across files to reference new component locations
- Consolidated AI-related exports through a single entry point
### How to test?
1. Verify doc title still renders correctly in documents
2. Confirm AI chat functionality works as expected
3. Check that no backlink-related features are accessible
4. Ensure all AI features continue to work through the new import paths
### Why make this change?
This reorganization improves code organization by:
- Placing components closer to their related functionality
- Removing dead/unused code around backlinks
- Simplifying the import structure for AI-related features
- Making the codebase more maintainable by consolidating related components
Mirone