fix: url unchanged after create block#1323
Conversation
WalkthroughThe changes introduce improved asynchronous handling and safer data access across several modules related to block creation and management. Route handlers and service methods now include null checks and use optional chaining to prevent runtime errors. The block creation workflow is refactored to return promises, allowing for proper chaining and post-processing, such as updating global state and triggering notifications only after successful completion. Notification mechanisms are unified to use a consistent interface. Additionally, internal logic is adjusted to delegate block initialization to a meta API, streamlining the process and ensuring proper sequencing of actions. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant SaveNewBlock.vue
participant useBlock.ts
participant blockSetting.tsx
participant MetaAPI
participant Server
User->>SaveNewBlock.vue: Click "Add Block"
SaveNewBlock.vue->>useBlock.ts: createBlock() or createEmptyBlock()
useBlock.ts->>MetaAPI: saveBlock(block)
MetaAPI->>blockSetting.tsx: createBlock(params)
blockSetting.tsx->>Server: POST /material-center/api/block/create
Server-->>blockSetting.tsx: Block creation response
blockSetting.tsx-->>MetaAPI: Promise resolves with block data
MetaAPI-->>useBlock.ts: Promise resolves
useBlock.ts-->>SaveNewBlock.vue: Promise resolves
SaveNewBlock.vue->>MetaAPI: updateBlockId(block.id)
SaveNewBlock.vue->>MaterialsPlugin: Activate plugin
SaveNewBlock.vue->>Dialog: Close dialog
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
⏰ Context from checks skipped due to timeout of 90000ms (1)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/plugins/block/src/js/blockSetting.tsx (1)
588-588: Typo in success message.There's an extra exclamation mark in the success message.
- useNotify({ message: '新建区块成功！!', type: 'success' }) + useNotify({ message: '新建区块成功！', type: 'success' })
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
mockServer/src/routes/main-routes.js(1 hunks)mockServer/src/services/blockCategory.js(1 hunks)packages/plugins/block/src/SaveNewBlock.vue(2 hunks)packages/plugins/block/src/composable/useBlock.ts(3 hunks)packages/plugins/block/src/js/blockSetting.tsx(3 hunks)packages/plugins/materials/src/composable/useResource.ts(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: push-check
🔇 Additional comments (11)
mockServer/src/services/blockCategory.js (1)
50-54: Added null check for categories improves robustness.This change adds proper error handling to prevent runtime errors when no matching category is found in the database, allowing the function to gracefully continue execution.
packages/plugins/materials/src/composable/useResource.ts (1)
116-116: Improved null/undefined handling with optional chaining.Using optional chaining (
?.length) prevents potential runtime errors when accessing the length property on an undefined or nullpublic_scope_tenantsobject.mockServer/src/routes/main-routes.js (1)
107-108: Properly await block creation and safely extract category ID.These changes improve the block creation workflow by:
- Properly awaiting the asynchronous block creation operation
- Using optional chaining and fallback logic to safely extract the category ID
This ensures that block creation completes before updating the category service, preventing race conditions and potential errors.
packages/plugins/block/src/SaveNewBlock.vue (2)
46-46: Added necessary imports for meta API access.The added imports enable access to the global service for updating the block ID in the URL.
91-97: Fixed URL update after block creation.This is the core fix that addresses the main issue. Now the code:
- Captures the returned promise from block creation
- Updates the global block ID in the URL only after block creation completes successfully
- Then activates the Materials plugin and closes the dialog
This sequential flow ensures the URL parameter is properly updated before navigating away from the current view.
packages/plugins/block/src/composable/useBlock.ts (2)
373-375: Good refactoring to delegate block initialization to the meta API.This change properly delegates block creation to the
saveBlockmethod from theBlockManagemeta API, which allows for centralized handling of block initialization and ensures the block ID is retrieved from the server before subsequent operations.
392-394: Consistent pattern applied to createEmptyBlock.Good consistency by applying the same pattern to
createEmptyBlockas was done withcreateBlock, ensuring both methods properly return promises that resolve with the server-generated block data.packages/plugins/block/src/js/blockSetting.tsx (4)
580-581: Good improvement to return the Promise.This change enables proper promise chaining by explicitly returning the Promise from the API call, which is crucial for the fix where the URL needs to be updated only after the server returns the block ID.
597-598: Important fix to return data to the caller.This is a critical part of the fix - returning the data (including the new block ID) enables the caller to update the URL parameter after block creation.
656-656: UI improvement with notification.Good switch from modal message to notification for a more consistent and less intrusive user experience.
728-728: Consistent Promise handling in saveBlock.This change ensures the promise from either updateBlock or createBlock is properly returned to the caller, allowing for proper async flow control.
3 participants
English | 简体中文
PR
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
Background and solution
问题现象：在设计器区块插件中，新建区块后。url blockid参数没有更新，导致画布上下文不正确，可能渲染出错误的页面
关联Bug： #1311，另外 #1312 pr修改方案并非解决url参数的问题
原因：在设计器区块插件中，新建区块后，此时新区块数据未保存到服务器，所以拿不到新区块的id。导致url参数中的blockid无法更新
解决方案：在新建区块后，立即向服务器发起请求，使用新的区块id来更新url参数。（新建页面也是类似的逻辑，所以新建页面后url可以正常更新）
What is the current behavior?
Issue Number: N/A
What is the new behavior?
before：
aflter：
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit
Summary by CodeRabbit
Bug Fixes
New Features
Refactor