Skip to content

[Copilot] feat: 添加风险插件安装确认对话框以及风险插件标签特殊处理 #2013

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jul 5, 2025

Conversation

Raven95676
Copy link
Member

@Raven95676 Raven95676 commented Jul 3, 2025

Motivation

部分插件的安装需要二次确认

Modifications

添加风险插件安装确认对话框以及风险插件标签特殊处理

Check

  • 😊 我的 Commit Message 符合良好的规范
  • 👀 我的更改经过良好的测试
  • 🤓 我确保没有引入新依赖库,或者引入了新依赖库的同时将其添加到了 requirements.txtpyproject.toml 文件相应位置。
  • 😮 我的更改没有引入恶意代码

好的,这是翻译成中文的 pull request 总结:

Sourcery 总结

为安装带有 danger 标签的插件添加确认对话框,并在 UI 上以视觉方式区分它们

新功能:

  • 当安装带有 "danger" 标签的插件时,提示用户显示确认对话框
  • 使用错误颜色的标签和本地化标签显示带有 danger 标签的插件

增强功能:

  • 重构安装处理程序,使其通过检查 danger 标签的中央函数进行路由
  • 更新 ExtensionCard 组件以使用专用的安装事件包装器

文档:

  • 为 danger 警告对话框标题、消息和标签添加 i18n 条目
Original summary in English

Summary by Sourcery

Add confirmation dialog for installing danger-tagged plugins and visually distinguish them across the UI

New Features:

  • Prompt the user with a confirmation dialog when installing plugins tagged as “danger”
  • Display danger-tagged plugins with error-colored chips and localized labels

Enhancements:

  • Refactor install handlers to route through a central function that checks for danger tags
  • Update ExtensionCard component to use a dedicated install event wrapper

Documentation:

  • Add i18n entries for danger warning dialog titles, messages, and tag labels

@Raven95676 Raven95676 requested review from Soulter and IGCrystal July 3, 2025 14:18
Copy link
Contributor

sourcery-ai bot commented Jul 3, 2025

## 审查者指南

实现了风险感知的插件安装流程,针对被标记为“danger”的插件,通过集中安装操作到一个确认对话框,更新标签样式和本地化,并重构 ExtensionCard 组件中的安装事件处理。

#### 风险插件安装确认流程的顺序图

```mermaid
sequenceDiagram
    actor User
    participant ExtensionPage
    participant ExtensionCard
    participant DangerConfirmDialog
    participant InstallDialog

    User->>ExtensionCard: 点击插件上的安装
    ExtensionCard->>ExtensionPage: emit('install', plugin)
    ExtensionPage->>ExtensionPage: handleInstallPlugin(plugin)
    alt plugin has 'danger' tag
        ExtensionPage->>DangerConfirmDialog: 显示确认对话框
        User->>DangerConfirmDialog: 确认或取消
        alt Confirm
            DangerConfirmDialog->>ExtensionPage: confirmDangerInstall()
            ExtensionPage->>InstallDialog: 显示安装对话框
        else Cancel
            DangerConfirmDialog->>ExtensionPage: cancelDangerInstall()
        end
    else plugin is safe
        ExtensionPage->>InstallDialog: 显示安装对话框
    end

更新后的插件安装处理的类图

classDiagram
    class ExtensionCard {
        +installExtension()
        emits install event with extension
    }
    class ExtensionPage {
        +handleInstallPlugin(plugin)
        +confirmDangerInstall()
        +cancelDangerInstall()
        dangerConfirmDialog
        selectedDangerPlugin
    }
    ExtensionCard --|> ExtensionPage : emits install event
    ExtensionPage o-- DangerConfirmDialog : uses
    ExtensionPage o-- InstallDialog : uses
Loading

文件级别变更

变更 详情 文件
引入响应式状态和处理程序,用于确认安装“danger”插件
  • 添加 dangerConfirmDialog 和 selectedDangerPlugin refs
  • 实现 handleInstallPlugin 以根据“danger”标签进行分支
  • 定义 confirmDangerInstall 和 cancelDangerInstall 函数
dashboard/src/views/ExtensionPage.vue
连接安装按钮以使用集中的安装处理程序
  • 在 pinnedPlugins 视图中,用 handleInstallPlugin 替换内联安装绑定
  • 用 handleInstallPlugin 替换表格安装点击处理程序
dashboard/src/views/ExtensionPage.vue
为“danger”插件安装添加持久的确认对话框 UI
  • 嵌入用于危险确认的 v-dialog 标记
  • 使用 tm 键作为对话框标题、消息、确认和取消按钮
dashboard/src/views/ExtensionPage.vue
对“danger”标签应用特殊样式和本地化
  • 在表格和卡片组件中使用错误主题为“danger”芯片着色
  • 使用 tm('tags.danger') 本地化“danger”标签
dashboard/src/views/ExtensionPage.vue
dashboard/src/components/shared/ExtensionCard.vue
重构 ExtensionCard 安装事件的触发
  • 提取包装 emit('install', extension) 的 installExtension 函数
  • 在安装按钮插槽中使用 installExtension
dashboard/src/components/shared/ExtensionCard.vue
为“danger”标签和对话框添加本地化条目
  • 添加 tags.danger 键
  • 添加 dialogs.danger_warning 键(标题、消息、确认、取消)
dashboard/src/i18n/locales/en-US/features/extension.json
dashboard/src/i18n/locales/zh-CN/features/extension.json

提示和命令

与 Sourcery 互动

  • 触发新的审查: 在 pull request 上评论 @sourcery-ai review
  • 继续讨论: 直接回复 Sourcery 的审查评论。
  • 从审查评论生成 GitHub issue: 通过回复审查评论,要求 Sourcery 从审查评论创建一个 issue。您也可以回复审查评论并使用 @sourcery-ai issue 从中创建一个 issue。
  • 生成 pull request 标题: 在 pull request 标题中的任何位置写入 @sourcery-ai 以随时生成标题。您也可以在 pull request 上评论 @sourcery-ai title 以随时(重新)生成标题。
  • 生成 pull request 摘要: 在 pull request 正文中的任何位置写入 @sourcery-ai summary 以随时在您想要的位置生成 PR 摘要。您也可以在 pull request 上评论 @sourcery-ai summary 以随时(重新)生成摘要。
  • 生成审查者指南: 在 pull request 上评论 @sourcery-ai guide 以随时(重新)生成审查者指南。
  • 解决所有 Sourcery 评论: 在 pull request 上评论 @sourcery-ai resolve 以解决所有 Sourcery 评论。如果您已经处理了所有评论并且不想再看到它们,这将非常有用。
  • 驳回所有 Sourcery 审查: 在 pull request 上评论 @sourcery-ai dismiss 以驳回所有现有的 Sourcery 审查。如果您想重新开始新的审查,这将特别有用 - 不要忘记评论 @sourcery-ai review 以触发新的审查!

自定义您的体验

访问您的 dashboard 以:

  • 启用或禁用审查功能,例如 Sourcery 生成的 pull request 摘要、审查者指南等。
  • 更改审查语言。
  • 添加、删除或编辑自定义审查说明。
  • 调整其他审查设置。

获取帮助

```
Original review guide in English

Reviewer's Guide

Implements a risk-aware installation flow for plugins tagged 'danger' by centralizing install actions through a confirmation dialog, updating tag styling and localization, and refactoring install event handling in the ExtensionCard component.

Sequence diagram for risk plugin installation confirmation flow

sequenceDiagram
    actor User
    participant ExtensionPage
    participant ExtensionCard
    participant DangerConfirmDialog
    participant InstallDialog

    User->>ExtensionCard: Clicks install on plugin
    ExtensionCard->>ExtensionPage: emit('install', plugin)
    ExtensionPage->>ExtensionPage: handleInstallPlugin(plugin)
    alt plugin has 'danger' tag
        ExtensionPage->>DangerConfirmDialog: Show confirmation dialog
        User->>DangerConfirmDialog: Confirm or Cancel
        alt Confirm
            DangerConfirmDialog->>ExtensionPage: confirmDangerInstall()
            ExtensionPage->>InstallDialog: Show install dialog
        else Cancel
            DangerConfirmDialog->>ExtensionPage: cancelDangerInstall()
        end
    else plugin is safe
        ExtensionPage->>InstallDialog: Show install dialog
    end
Loading

Class diagram for updated plugin installation handling

classDiagram
    class ExtensionCard {
        +installExtension()
        emits install event with extension
    }
    class ExtensionPage {
        +handleInstallPlugin(plugin)
        +confirmDangerInstall()
        +cancelDangerInstall()
        dangerConfirmDialog
        selectedDangerPlugin
    }
    ExtensionCard --|> ExtensionPage : emits install event
    ExtensionPage o-- DangerConfirmDialog : uses
    ExtensionPage o-- InstallDialog : uses
Loading

File-Level Changes

Change Details Files
Introduce reactive state and handlers for confirming installation of 'danger' plugins
  • Add dangerConfirmDialog and selectedDangerPlugin refs
  • Implement handleInstallPlugin to branch on 'danger' tag
  • Define confirmDangerInstall and cancelDangerInstall functions
dashboard/src/views/ExtensionPage.vue
Wire install buttons to use the centralized install handler
  • Replace inline install bindings with handleInstallPlugin in pinnedPlugins view
  • Replace table install click handlers with handleInstallPlugin
dashboard/src/views/ExtensionPage.vue
Add a persistent confirmation dialog UI for 'danger' plugin installations
  • Embed v-dialog markup for danger confirmation
  • Use tm keys for dialog title, message, confirm and cancel buttons
dashboard/src/views/ExtensionPage.vue
Apply special styling and localization for 'danger' tags
  • Color 'danger' chips with error theme in table and card components
  • Localize 'danger' label using tm('tags.danger')
dashboard/src/views/ExtensionPage.vue
dashboard/src/components/shared/ExtensionCard.vue
Refactor ExtensionCard install event emission
  • Extract installExtension function wrapping emit('install', extension)
  • Use installExtension in the install button slot
dashboard/src/components/shared/ExtensionCard.vue
Add localization entries for 'danger' tag and dialogs
  • Add tags.danger key
  • Add dialogs.danger_warning keys (title, message, confirm, cancel)
dashboard/src/i18n/locales/en-US/features/extension.json
dashboard/src/i18n/locales/zh-CN/features/extension.json

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

Copy link
Contributor

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Raven95676 - 我已经查看了你的更改,它们看起来很棒!

AI 代理的提示
请解决此代码审查中的评论:
## 单独评论

### 评论 1
<location> `dashboard/src/components/shared/ExtensionCard.vue:125` </location>
<code_context>
             <v-icon icon="mdi-cogs" start></v-icon>
             {{ extension.handlers?.length }}{{ tm("card.status.handlersCount") }}
           </v-chip>
+          <v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
+            size="small" class="ml-2">
+            {{ tag === 'danger' ? tm('tags.danger') : tag }}
+          </v-chip>
         </div>
</code_context>

<issue_to_address>
将所有标签渲染为 chips 可能会导致具有许多标签的扩展的布局问题。

考虑限制显示的标签数量或实施溢出机制,以防止存在许多标签时出现布局问题。
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
          <v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
            size="small" class="ml-2">
            {{ tag === 'danger' ? tm('tags.danger') : tag }}
          </v-chip>
=======
          <v-chip
            v-for="tag in extension.tags.slice(0, 3)"
            :key="tag"
            :color="tag === 'danger' ? 'error' : 'primary'"
            label
            size="small"
            class="ml-2"
          >
            {{ tag === 'danger' ? tm('tags.danger') : tag }}
          </v-chip>
          <v-tooltip v-if="extension.tags.length > 3" location="top">
            <template #activator="{ props }">
              <v-chip
                v-bind="props"
                label
                size="small"
                class="ml-2"
                color="grey"
              >
                +{{ extension.tags.length - 3 }}
              </v-chip>
            </template>
            <span>
              {{ extension.tags.slice(3).join(', ') }}
            </span>
          </v-tooltip>
>>>>>>> REPLACE

</suggested_fix>

Sourcery 对开源是免费的 - 如果你喜欢我们的评论,请考虑分享它们 ✨
帮助我更有用!请点击每个评论上的 👍 或 👎,我将使用反馈来改进你的评论。
Original comment in English

Hey @Raven95676 - I've reviewed your changes and they look great!

Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments

### Comment 1
<location> `dashboard/src/components/shared/ExtensionCard.vue:125` </location>
<code_context>
             <v-icon icon="mdi-cogs" start></v-icon>
             {{ extension.handlers?.length }}{{ tm("card.status.handlersCount") }}
           </v-chip>
+          <v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
+            size="small" class="ml-2">
+            {{ tag === 'danger' ? tm('tags.danger') : tag }}
+          </v-chip>
         </div>
</code_context>

<issue_to_address>
Rendering all tags as chips may cause layout issues for extensions with many tags.

Consider limiting the number of displayed tags or implementing an overflow mechanism to prevent layout issues when many tags are present.
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
          <v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
            size="small" class="ml-2">
            {{ tag === 'danger' ? tm('tags.danger') : tag }}
          </v-chip>
=======
          <v-chip
            v-for="tag in extension.tags.slice(0, 3)"
            :key="tag"
            :color="tag === 'danger' ? 'error' : 'primary'"
            label
            size="small"
            class="ml-2"
          >
            {{ tag === 'danger' ? tm('tags.danger') : tag }}
          </v-chip>
          <v-tooltip v-if="extension.tags.length > 3" location="top">
            <template #activator="{ props }">
              <v-chip
                v-bind="props"
                label
                size="small"
                class="ml-2"
                color="grey"
              >
                +{{ extension.tags.length - 3 }}
              </v-chip>
            </template>
            <span>
              {{ extension.tags.slice(3).join(', ') }}
            </span>
          </v-tooltip>
>>>>>>> REPLACE

</suggested_fix>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

Comment on lines +125 to +128
<v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
size="small" class="ml-2">
{{ tag === 'danger' ? tm('tags.danger') : tag }}
</v-chip>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (bug_risk): 将所有标签渲染为 chips 可能会导致具有许多标签的扩展的布局问题。

考虑限制显示的标签数量或实施溢出机制,以防止存在许多标签时出现布局问题。

Suggested change
<v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
size="small" class="ml-2">
{{ tag === 'danger' ? tm('tags.danger') : tag }}
</v-chip>
<v-chip
v-for="tag in extension.tags.slice(0, 3)"
:key="tag"
:color="tag === 'danger' ? 'error' : 'primary'"
label
size="small"
class="ml-2"
>
{{ tag === 'danger' ? tm('tags.danger') : tag }}
</v-chip>
<v-tooltip v-if="extension.tags.length > 3" location="top">
<template #activator="{ props }">
<v-chip
v-bind="props"
label
size="small"
class="ml-2"
color="grey"
>
+{{ extension.tags.length - 3 }}
</v-chip>
</template>
<span>
{{ extension.tags.slice(3).join(', ') }}
</span>
</v-tooltip>
Original comment in English

suggestion (bug_risk): Rendering all tags as chips may cause layout issues for extensions with many tags.

Consider limiting the number of displayed tags or implementing an overflow mechanism to prevent layout issues when many tags are present.

Suggested change
<v-chip v-for="tag in extension.tags" :key="tag" :color="tag === 'danger' ? 'error' : 'primary'" label
size="small" class="ml-2">
{{ tag === 'danger' ? tm('tags.danger') : tag }}
</v-chip>
<v-chip
v-for="tag in extension.tags.slice(0, 3)"
:key="tag"
:color="tag === 'danger' ? 'error' : 'primary'"
label
size="small"
class="ml-2"
>
{{ tag === 'danger' ? tm('tags.danger') : tag }}
</v-chip>
<v-tooltip v-if="extension.tags.length > 3" location="top">
<template #activator="{ props }">
<v-chip
v-bind="props"
label
size="small"
class="ml-2"
color="grey"
>
+{{ extension.tags.length - 3 }}
</v-chip>
</template>
<span>
{{ extension.tags.slice(3).join(', ') }}
</span>
</v-tooltip>

@Soulter
Copy link
Member

Soulter commented Jul 4, 2025

有一些更改,希望给一下 push 权限,不然 push 不了提交

UPDATE: 直接打 这个 patch

@Soulter Soulter merged commit c57da04 into master Jul 5, 2025
3 checks passed
@Raven95676 Raven95676 deleted the feat/danger-plugin branch July 9, 2025 14:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants