feat: Support merging categories and groups

[gene9831]

English | 简体中文

PR

PR Checklist

Please check if your PR fulfills the following requirements:

• [x] The commit message follows our Commit Message Guidelines
• [ ] Tests for the changes have been added (for bug fixes / features)
• [ ] Docs have been added / updated (for bug fixes / features)
• [ ] Built its own designer, fully self-validated

PR Type

What kind of change does this PR introduce?

• [ ] Bugfix
• [x] Feature
• [ ] Code style update (formatting, local variables)
• [ ] Refactoring (no functional changes, no api changes)
• [ ] Build related changes
• [ ] CI related changes
• [ ] Documentation content changes
• [ ] Other... Please describe:

Background and solution

区块管理的区块分类接口与物料的区块分组接口响应基本一致，支持将分类接口和分组接口，合并成区块分组接口，实际上是将分类接口替换成分组接口

What is the current behavior?

What is the new behavior?

区块插件增加了 options.mergeCategoriesAndGroups 配置项，来决定是否合并分类和分组接口。

• 设置 mergeCategoriesAndGroups 为 false（默认值），保持原来的逻辑不变，即分类和分组接口都会调用
• 设置 mergeCategoriesAndGroups 为 true，将分类接口替换成分组接口。并且将区块管理页面的 分类 文本全部替换成了 分组 文本

注册表示例：

export default {
  // ...
  plugins: [
    Materials,
    Tree,
    Page,
-   Block,
+   [Block, { options: { ...Block.options, mergeCategoriesAndGroups: true } }],
    Datasource,
    Bridge,
    I18n,
    Script,
    State,
    Schema,
    Help,
    Robot
  ],
  // ...
}

Does this PR introduce a breaking change?

• [ ] Yes
• [x] No

Other information

Summary by CodeRabbit

Release Notes

• New Features

  • Introduced dynamic labeling for block categories and groups across various components, improving user experience.
  • Added group management functionalities, including fetching, creating, updating, and deleting groups.

• Bug Fixes

  • Enhanced validation logic for category and group handling to ensure accurate user input.

• Documentation

  • Updated comments and descriptions to reflect the new functionalities and improve clarity for future development.

[coderabbitai[bot]]

Walkthrough

The changes in this pull request introduce enhancements to the block management system within the application. A new property, options, is added to the default export object in index.js, allowing for the configuration of category and group management. Several components, including BlockConfig.vue, CategoryEdit.vue, and Main.vue, are updated to utilize dynamic labeling based on the new shouldReplaceCategoryWithGroup method. Additionally, new functions for managing groups are added in http.js, facilitating operations like fetching, creating, updating, and deleting groups.

Changes

File Path	Change Summary
packages/plugins/block/index.js	Added new property options with mergeCategoriesAndGroups: false to the default export object.
packages/plugins/block/src/BlockConfig.vue	Updated template and script for dynamic binding of category/group labels and placeholders.
packages/plugins/block/src/CategoryEdit.vue	Enhanced dynamic behavior of form fields based on category or group context; updated validation logic.
packages/plugins/block/src/Main.vue	Modified UI elements and logic for category/group management; introduced dynamic labels for UI prompts.
packages/plugins/block/src/SaveNewBlock.vue	Updated category selection label to be context-sensitive; enhanced component interactivity.
packages/plugins/block/src/composable/useBlock.js	Added shouldReplaceCategoryWithGroup function to determine category/group management logic.
packages/plugins/block/src/js/blockSetting.jsx	Introduced new functions for group management; updated existing functions to handle categories/groups.
packages/plugins/block/src/js/http.js	Added functions: fetchGroups, createGroup, updateGroup, and deleteGroup for group management.

Possibly related PRs

• #506: Involves restructuring the export object in index.js, related to the addition of the options property.
• #586: Updates to the options section in meta.js, relevant to the new options property.
• #632: Introduces a new component structure that may relate to changes in block management.
• #780: Enhancements in the chat interface may connect to overall improvements in plugin management.
• #797: Involves merging APIs and components, potentially related to structural changes in block management.
• #827: Bug fixes in the block panel's functionality may connect to enhancements in block management features.
• #830: Style refactoring in the properties panel may relate to improvements in UI and user experience.
• #832: Optimizations in the chat interface may connect to broader improvements in plugin functionality.
• #842: Enhancements in the plugin navigation panel may relate to overall improvements in the plugin management system.

Suggested labels

ospp-2024

Suggested reviewers

• hexqi
• lizhijie429

Poem

🐇 In the meadow, blocks do play,
Merging groups in a bright array.
With labels that dance and shift,
Our plugin's spirit gets a lift!
So let us cheer, both near and far,
For a block's new journey, like a shooting star! 🌟

---

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

🪧 Tips

### Chat There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai): - Review comments: Directly reply to a review comment made by CodeRabbit. Example: - `I pushed a fix in commit , please review it.` - `Generate unit testing code for this file.` - `Open a follow-up GitHub issue for this discussion.` - Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples: - `@coderabbitai generate unit testing code for this file.` - `@coderabbitai modularize this function.` - PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples: - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.` - `@coderabbitai read src/utils.ts and generate unit testing code.` - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.` - `@coderabbitai help me debug CodeRabbit configuration file.` 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) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai full review` to do a full review from scratch and review all the files again. - `@coderabbitai summary` to regenerate the summary of the PR. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository. - `@coderabbitai help` to get help. ### Other keywords and placeholders - Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. - Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description. - Add `@coderabbitai` anywhere in the PR title to generate the title automatically. ### CodeRabbit Configuration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information. - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json` ### Documentation and Community - Visit our [Documentation](https://docs.coderabbit.ai) for detailed information on how to use CodeRabbit. - Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback. - Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.