From 0fecaf60ebbd3b979d554ef7f09c0dc435ebe07e Mon Sep 17 00:00:00 2001
From: zhangmo8 <wegi866@gmail.com>
Date: Thu, 27 Aug 2026 10:52:15 +0800
Subject: [PATCH 1/3] fix(skills): restore manual import entry

---
 .../src/pages/plugins/SkillsPluginsPage.vue   |  53 +-
 .../plugins/skills/InstallFromGitDialog.vue   | 332 ++++++++++++
 .../plugins/skills/SkillInstallDialog.vue     | 491 ++++++++++++++++++
 .../components/SkillsPluginsPage.test.ts      |  65 ++-
 4 files changed, 931 insertions(+), 10 deletions(-)
 create mode 100644 src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
 create mode 100644 src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue

diff --git a/src/renderer/src/pages/plugins/SkillsPluginsPage.vue b/src/renderer/src/pages/plugins/SkillsPluginsPage.vue
index a408faf91..20984159b 100644
--- a/src/renderer/src/pages/plugins/SkillsPluginsPage.vue
+++ b/src/renderer/src/pages/plugins/SkillsPluginsPage.vue
@@ -8,8 +8,14 @@ import { Separator } from '@shadcn/components/ui/separator'
 import { Skeleton } from '@shadcn/components/ui/skeleton'
 import { ScrollArea } from '@shadcn/components/ui/scroll-area'
 import { Switch } from '@shadcn/components/ui/switch'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuTrigger
+} from '@shadcn/components/ui/dropdown-menu'
 import { DcButton } from '@dc-ui/components/button'
 import { DcEmpty } from '@dc-ui/components/empty'
+import { DcDropdownActionItem } from '@dc-ui/components/dropdown-action-item'
 import { createConfigClient } from '@api/ConfigClient'
 import { createSkillClient } from '@api/SkillClient'
 import type { Agent } from '@shared/types/agent-interface'
@@ -24,9 +30,11 @@ import {
 import { resolveGuidedOnboardingStepTarget } from '@shared/guidedOnboarding'
 import GuidedOnboardingOverlay from '@/components/onboarding/GuidedOnboardingOverlay.vue'
 import ImportSkillsFromAgentDialog from './skills/ImportSkillsFromAgentDialog.vue'
+import InstallFromGitDialog from './skills/InstallFromGitDialog.vue'
 import SkillCard from './skills/SkillCard.vue'
 import SkillDetailDialog from './skills/SkillDetailDialog.vue'
 import SkillImportExportTab from './skills/SkillImportExportTab.vue'
+import SkillInstallDialog from './skills/SkillInstallDialog.vue'
 
 type SkillsView = 'skills' | 'syncDirectory'
 
@@ -45,6 +53,8 @@ const agentUpdatePendingId = ref<string | null>(null)
 const activeView = ref<SkillsView>('skills')
 const searchQuery = ref('')
 const externalImportOpen = ref(false)
+const installDialogOpen = ref(false)
+const gitDialogOpen = ref(false)
 const detailDialogOpen = ref(false)
 const selectedSkill = ref<UnifiedSkillItem | null>(null)
 const skillDetail = ref<SkillDetail | null>(null)
@@ -366,15 +376,38 @@ onUnmounted(() => {
                 {{ t('settings.skills.syncDirectory.action') }}
               </DcButton>
 
-              <DcButton
-                data-testid="skills-import-action"
-                size="sm"
-                :disabled="operationPending"
-                @click="externalImportOpen = true"
-              >
-                <Icon icon="lucide:download" class="mr-1 size-4" />
-                {{ t('settings.skills.agentImport.menuItem') }}
-              </DcButton>
+              <DropdownMenu>
+                <DropdownMenuTrigger as-child>
+                  <DcButton
+                    data-testid="skills-import-action"
+                    size="sm"
+                    :disabled="operationPending"
+                  >
+                    <Icon icon="lucide:plus" class="mr-1 size-4" />
+                    {{ t('settings.skills.addSkill') }}
+                  </DcButton>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent align="end" class="w-56">
+                  <DcDropdownActionItem
+                    data-testid="skills-import-from-agent"
+                    icon="lucide:copy-plus"
+                    :label="t('settings.skills.agentImport.menuItem')"
+                    @select="externalImportOpen = true"
+                  />
+                  <DcDropdownActionItem
+                    data-testid="skills-import-basic"
+                    icon="lucide:folder-plus"
+                    :label="t('settings.skills.install.basicTitle')"
+                    @select="installDialogOpen = true"
+                  />
+                  <DcDropdownActionItem
+                    data-testid="skills-import-git"
+                    icon="lucide:git-branch"
+                    :label="t('settings.skills.git.menuItem')"
+                    @select="gitDialogOpen = true"
+                  />
+                </DropdownMenuContent>
+              </DropdownMenu>
             </div>
           </div>
         </template>
@@ -453,6 +486,8 @@ onUnmounted(() => {
         :agents="agents"
         @imported="loadPage(true)"
       />
+      <SkillInstallDialog v-model:open="installDialogOpen" />
+      <InstallFromGitDialog v-model:open="gitDialogOpen" />
       <SkillDetailDialog
         ref="detailDialogRef"
         :open="detailDialogOpen"
diff --git a/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue b/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
new file mode 100644
index 000000000..9538e7f4f
--- /dev/null
+++ b/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
@@ -0,0 +1,332 @@
+<template>
+  <Dialog :open="open" @update:open="handleOpenChange">
+    <DialogContent v-if="open" class="sm:max-w-2xl">
+      <DialogHeader>
+        <DialogTitle>{{ t('settings.skills.git.title') }}</DialogTitle>
+        <DialogDescription>
+          {{ t('settings.skills.git.description') }}
+        </DialogDescription>
+      </DialogHeader>
+
+      <div class="space-y-4 py-2">
+        <div class="flex gap-2">
+          <Input
+            v-model="repoUrl"
+            :placeholder="t('settings.skills.git.placeholder')"
+            :disabled="scanning || installing"
+          />
+          <DcButton :disabled="!repoUrl.trim() || scanning || installing" @click="scan">
+            <Spinner v-if="scanning" data-icon="inline-start" />
+            <Icon v-else icon="lucide:search" data-icon="inline-start" />
+            {{ t('settings.skills.git.scan') }}
+          </DcButton>
+        </div>
+
+        <div v-if="error" class="rounded-md border border-destructive/30 px-3 py-2 text-sm">
+          <div class="font-medium text-destructive">{{ t('settings.skills.git.failed') }}</div>
+          <div class="mt-1 text-xs text-muted-foreground">
+            {{ t('common.error.requestFailed') }}
+          </div>
+        </div>
+
+        <DcInlineError v-if="operationError" :error="operationError" class="mb-2" />
+
+        <div v-if="scanResult" class="space-y-3">
+          <div class="flex items-center justify-between gap-2 text-sm">
+            <div>
+              {{ t('settings.skills.git.detectedFormat') }}
+              <DcBadge variant="outline">{{
+                t(`settings.skills.git.format.${scanResult.repoFormat}`)
+              }}</DcBadge>
+            </div>
+            <div class="text-xs text-muted-foreground">
+              {{ t('settings.skills.git.selectedCount', { count: selectedNames.size }) }}
+            </div>
+          </div>
+
+          <div class="max-h-72 overflow-auto rounded-md border">
+            <div
+              v-if="scanResult.skills.length === 0"
+              class="px-3 py-8 text-center text-sm text-muted-foreground"
+            >
+              {{ t('settings.skills.git.empty') }}
+            </div>
+            <label
+              v-for="skill in scanResult.skills"
+              :key="skill.relativePath"
+              class="flex cursor-pointer items-start gap-2 border-b px-3 py-2 last:border-b-0"
+              :class="{ 'cursor-not-allowed opacity-60': !skill.valid }"
+            >
+              <Checkbox
+                :checked="selectedNames.has(skill.name)"
+                :disabled="installing || !skill.valid"
+                @update:checked="toggleSkill(skill.name)"
+              />
+              <span class="min-w-0 flex-1">
+                <span class="flex items-center gap-2">
+                  <span class="truncate text-sm font-medium" :title="skill.name">
+                    {{ skill.name }}
+                  </span>
+                  <DcBadge v-if="skill.conflict" variant="outline" class="shrink-0">
+                    {{ t('settings.skills.git.conflict') }}
+                  </DcBadge>
+                  <DcBadge v-if="!skill.valid" variant="destructive" class="shrink-0">
+                    {{ t('settings.skills.git.invalid') }}
+                  </DcBadge>
+                </span>
+                <span
+                  class="block truncate text-xs text-muted-foreground"
+                  :title="skill.valid ? skill.description : t('settings.skills.git.invalid')"
+                >
+                  {{ skill.valid ? skill.description : t('settings.skills.git.invalid') }}
+                </span>
+                <span
+                  class="block truncate font-mono text-xs text-muted-foreground"
+                  :title="skill.relativePath"
+                >
+                  {{ skill.relativePath }}
+                </span>
+              </span>
+            </label>
+          </div>
+
+          <div class="space-y-2 rounded-md border px-3 py-3">
+            <div class="text-sm font-medium">{{ t('settings.skills.git.strategy') }}</div>
+            <RadioGroup v-model="strategy" class="grid gap-2 sm:grid-cols-3">
+              <label class="flex items-center gap-2 text-sm">
+                <RadioGroupItem value="rename" :disabled="installing" />
+                {{ t('settings.skills.git.rename') }}
+              </label>
+              <label class="flex items-center gap-2 text-sm">
+                <RadioGroupItem value="overwrite" :disabled="installing" />
+                {{ t('settings.skills.git.overwrite') }}
+              </label>
+              <label class="flex items-center gap-2 text-sm">
+                <RadioGroupItem value="skip" :disabled="installing" />
+                {{ t('settings.skills.git.skip') }}
+              </label>
+            </RadioGroup>
+          </div>
+        </div>
+      </div>
+
+      <DialogFooter class="gap-2 sm:gap-0">
+        <DcFormActions
+          :submit-status="installStatus"
+          :submit-icon="'lucide:download'"
+          :submit-disabled="!canInstall"
+          :cancel-disabled="installing"
+          :submit-label="t('settings.skills.git.install')"
+          @cancel="handleOpenChange(false)"
+          @submit="install"
+        />
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { Icon } from '@iconify/vue'
+import { DcBadge } from '@dc-ui/components/badge'
+import { DcButton } from '@dc-ui/components/button'
+import { Checkbox } from '@shadcn/components/ui/checkbox'
+import { Spinner } from '@shadcn/components/ui/spinner'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from '@shadcn/components/ui/dialog'
+import { Input } from '@shadcn/components/ui/input'
+import { RadioGroup, RadioGroupItem } from '@shadcn/components/ui/radio-group'
+import { DcInlineError } from '@dc-ui/components/inline-error'
+import { useDcFormSubmit } from '@dc-ui/components/form'
+import { DcFormActions } from '@dc-ui/components/form-actions'
+import { createSkillClient } from '@api/SkillClient'
+import type { GitSkillRepoScanResult, SkillInstallConflictStrategy } from '@shared/types/skill'
+
+const props = defineProps<{
+  open: boolean
+}>()
+
+const emit = defineEmits<{
+  'update:open': [value: boolean]
+}>()
+
+const { t } = useI18n()
+const skillClient = createSkillClient()
+
+const repoUrl = ref('https://github.com/op7418/guizang-ppt-skill')
+const scanResult = ref<GitSkillRepoScanResult | null>(null)
+const selectedNames = ref<Set<string>>(new Set())
+const strategy = ref<SkillInstallConflictStrategy>('rename')
+const scanning = ref(false)
+const error = ref(false)
+const operationError = ref<string | null>(null)
+const contextVersion = ref(0)
+let scanRequestId = 0
+let installRequestId = 0
+let installGeneration = 0
+const installing = ref(false)
+const { status: installStatus, run: runInstall } = useDcFormSubmit()
+
+const isCurrentContext = (version: number) => props.open && version === contextVersion.value
+
+const logFailure = (message: string, cause: unknown) => {
+  console.error(message, cause)
+}
+
+const beginInstall = (): number | null => {
+  if (installing.value) return null
+  const generation = ++installGeneration
+  installing.value = true
+  return generation
+}
+
+const isCurrentInstall = (generation: number) =>
+  generation === installGeneration && installing.value
+
+const handleOpenChange = (open: boolean) => {
+  if (!open && installing.value) return
+  emit('update:open', open)
+}
+
+const canInstall = computed(
+  () =>
+    Boolean(scanResult.value) &&
+    selectedNames.value.size > 0 &&
+    !scanning.value &&
+    !installing.value
+)
+
+const scan = async () => {
+  const requestId = ++scanRequestId
+  const requestedRepoUrl = repoUrl.value.trim()
+  error.value = false
+  scanResult.value = null
+  selectedNames.value = new Set()
+  scanning.value = true
+  try {
+    const result = await skillClient.scanGitSkillRepo(requestedRepoUrl)
+    if (requestId !== scanRequestId || !isCurrentContext(contextVersion.value)) return
+
+    scanResult.value = result
+    selectedNames.value = new Set(
+      result.skills.filter((skill) => skill.valid).map((skill) => skill.name)
+    )
+  } catch (cause) {
+    if (requestId !== scanRequestId || !isCurrentContext(contextVersion.value)) return
+    error.value = true
+    logFailure('[InstallFromGitDialog] Failed to scan repository', cause)
+    scanResult.value = null
+    selectedNames.value = new Set()
+  } finally {
+    if (requestId === scanRequestId && isCurrentContext(contextVersion.value)) {
+      scanning.value = false
+    }
+  }
+}
+
+const toggleSkill = (name: string) => {
+  if (installing.value) return
+  const next = new Set(selectedNames.value)
+  if (next.has(name)) {
+    next.delete(name)
+  } else {
+    next.add(name)
+  }
+  selectedNames.value = next
+}
+
+const install = async () => {
+  if (!scanResult.value || !canInstall.value) return
+  const operationContextVersion = contextVersion.value
+  const generation = beginInstall()
+  if (generation === null) return
+  const requestId = ++installRequestId
+  error.value = false
+  operationError.value = null
+  await runInstall(async () => {
+    const scannedRepoUrl = scanResult.value?.repoUrl ?? ''
+    const input = {
+      repoUrl: scannedRepoUrl,
+      skillNames: [...selectedNames.value],
+      strategy: strategy.value
+    }
+    const results = await skillClient.installFromGit(input)
+    if (!isCurrentInstall(generation) || requestId !== installRequestId) return
+    const surfaceCurrent =
+      operationContextVersion === contextVersion.value && isCurrentContext(contextVersion.value)
+
+    const requestedNames = new Set(input.skillNames)
+    const installedSourceNames = new Set(
+      results
+        .filter((result) => result.success)
+        .map((result) => {
+          if (result.sourceSkillName && requestedNames.has(result.sourceSkillName)) {
+            return result.sourceSkillName
+          }
+          return result.skillName && requestedNames.has(result.skillName)
+            ? result.skillName
+            : undefined
+        })
+        .filter((name): name is string => Boolean(name))
+    )
+    const installed = installedSourceNames.size
+    const failed = input.skillNames.length - installed
+    if (failed > 0) {
+      if (surfaceCurrent) {
+        selectedNames.value = new Set(
+          input.skillNames.filter((skillName) => !installedSourceNames.has(skillName))
+        )
+      }
+      installing.value = false
+      operationError.value = t('settings.skills.git.successMessage', {
+        count: installed,
+        failed: failed || selectedNames.value.size
+      })
+      throw new Error('Git repository install was incomplete')
+    }
+    installing.value = false
+    if (surfaceCurrent) {
+      emit('update:open', false)
+    }
+  }).catch((cause) => {
+    if (!isCurrentInstall(generation) || requestId !== installRequestId) return
+    if (!operationError.value) {
+      logFailure('[InstallFromGitDialog] Failed to install repository skills', cause)
+      operationError.value = t('common.error.requestFailed')
+      installing.value = false
+    }
+  })
+}
+
+watch(
+  () => props.open,
+  (open) => {
+    if (!open) {
+      contextVersion.value += 1
+      scanRequestId += 1
+      error.value = false
+      operationError.value = null
+      scanResult.value = null
+      selectedNames.value = new Set()
+      scanning.value = false
+    }
+  }
+)
+
+watch(repoUrl, () => {
+  if (installing.value) return
+  scanRequestId += 1
+  error.value = false
+  operationError.value = null
+  scanResult.value = null
+  selectedNames.value = new Set()
+  scanning.value = false
+})
+</script>
diff --git a/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue b/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue
new file mode 100644
index 000000000..65c1c93d4
--- /dev/null
+++ b/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue
@@ -0,0 +1,491 @@
+<template>
+  <Dialog v-model:open="isOpen">
+    <DialogContent class="sm:max-w-md">
+      <DialogHeader>
+        <DialogTitle>{{ t('settings.skills.install.title') }}</DialogTitle>
+        <DialogDescription>
+          {{ t('settings.skills.install.description') }}
+        </DialogDescription>
+      </DialogHeader>
+
+      <Tabs v-model="activeTab" class="w-full">
+        <TabsList class="grid w-full grid-cols-3">
+          <TabsTrigger value="folder" :disabled="installing">
+            <Icon icon="lucide:folder" class="w-4 h-4 mr-1" />
+            {{ t('settings.skills.install.tabFolder') }}
+          </TabsTrigger>
+          <TabsTrigger value="zip" :disabled="installing">
+            <Icon icon="lucide:file-archive" class="w-4 h-4 mr-1" />
+            {{ t('settings.skills.install.tabZip') }}
+          </TabsTrigger>
+          <TabsTrigger value="url" :disabled="installing">
+            <Icon icon="lucide:link" class="w-4 h-4 mr-1" />
+            {{ t('settings.skills.install.tabUrl') }}
+          </TabsTrigger>
+        </TabsList>
+
+        <TabsContent value="folder" class="mt-4">
+          <div
+            class="rounded-lg border-2 border-dashed p-8 text-center transition-colors"
+            :class="
+              installing
+                ? 'cursor-not-allowed opacity-60'
+                : dragActive === 'folder'
+                  ? 'border-primary bg-primary/5'
+                  : 'cursor-pointer hover:border-primary/50'
+            "
+            @click="selectFolder"
+            @dragenter.prevent="onDragEnter('folder')"
+            @dragover.prevent
+            @dragleave.prevent="onDragLeave"
+            @drop.prevent="handleDrop($event)"
+          >
+            <Icon
+              v-if="!installing"
+              icon="lucide:folder-open"
+              class="pointer-events-none mx-auto mb-2 size-10 text-muted-foreground"
+            />
+            <Spinner
+              v-else
+              class="pointer-events-none mx-auto mb-2 size-10 text-muted-foreground"
+            />
+            <p class="pointer-events-none text-sm text-muted-foreground">
+              {{ t('settings.skills.install.folderHint') }}
+            </p>
+          </div>
+          <p class="mt-2 text-xs text-muted-foreground/70">
+            {{ t('settings.skills.install.folderTip') }}
+          </p>
+        </TabsContent>
+
+        <TabsContent value="zip" class="mt-4">
+          <div
+            class="rounded-lg border-2 border-dashed p-8 text-center transition-colors"
+            :class="
+              installing
+                ? 'cursor-not-allowed opacity-60'
+                : dragActive === 'zip'
+                  ? 'border-primary bg-primary/5'
+                  : 'cursor-pointer hover:border-primary/50'
+            "
+            @click="selectZip"
+            @dragenter.prevent="onDragEnter('zip')"
+            @dragover.prevent
+            @dragleave.prevent="onDragLeave"
+            @drop.prevent="handleDrop($event)"
+          >
+            <Icon
+              v-if="!installing"
+              icon="lucide:file-archive"
+              class="pointer-events-none mx-auto mb-2 size-10 text-muted-foreground"
+            />
+            <Spinner
+              v-else
+              class="pointer-events-none mx-auto mb-2 size-10 text-muted-foreground"
+            />
+            <p class="pointer-events-none text-sm text-muted-foreground">
+              {{ t('settings.skills.install.zipHint') }}
+            </p>
+          </div>
+        </TabsContent>
+
+        <TabsContent value="url" class="mt-4 space-y-4">
+          <div class="space-y-2">
+            <Input
+              v-model="installUrl"
+              :placeholder="t('settings.skills.install.urlPlaceholder')"
+              :disabled="installing"
+            />
+            <p class="text-xs text-muted-foreground/70">
+              {{ t('settings.skills.install.urlHint') }}
+            </p>
+          </div>
+          <DcSubmitButton
+            class="w-full"
+            :status="installStatus"
+            :disabled="!installUrl.trim() || installing"
+            @click="installFromUrl"
+          >
+            {{ t('settings.skills.install.installButton') }}
+          </DcSubmitButton>
+        </TabsContent>
+      </Tabs>
+
+      <div
+        v-if="validationError"
+        class="rounded-md border border-destructive/30 px-3 py-2 text-sm text-destructive"
+      >
+        {{ validationError }}
+      </div>
+      <DcInlineError v-if="operationError" :error="operationError" class="mt-2" />
+    </DialogContent>
+  </Dialog>
+
+  <!-- Conflict confirmation dialog -->
+  <DcConfirmDialog
+    :open="conflictDialogOpen"
+    :title="t('settings.skills.conflict.title')"
+    :description="t('settings.skills.conflict.description', { name: conflictSkillName })"
+    :danger="false"
+    :confirm-label="t('settings.skills.conflict.overwrite')"
+    :cancel-label="t('common.cancel')"
+    :confirm-attrs="{ 'data-testid': 'skill-conflict-overwrite' }"
+    @update:open="handleConflictOpenChange"
+    @confirm="handleConflictOverwrite"
+    @cancel="handleConflictCancel"
+  />
+</template>
+
+<script setup lang="ts">
+import { computed, ref, shallowRef, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { Icon } from '@iconify/vue'
+import { Spinner } from '@shadcn/components/ui/spinner'
+import { Input } from '@shadcn/components/ui/input'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shadcn/components/ui/tabs'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle
+} from '@shadcn/components/ui/dialog'
+import { DcConfirmDialog } from '@dc-ui/components/confirm-dialog'
+import { notifyRenderer } from '@renderer-notifications/rendererNotificationPort'
+import { DcInlineError } from '@dc-ui/components/inline-error'
+import { DcSubmitButton, useDcFormSubmit } from '@dc-ui/components/form'
+import { createSkillClient } from '@api/SkillClient'
+import { createDeviceClient } from '@api/DeviceClient'
+import { createFileClient } from '@api/FileClient'
+import type { SkillInstallResult } from '@shared/types/skill'
+
+const props = defineProps<{
+  open: boolean
+}>()
+
+const emit = defineEmits<{
+  'update:open': [value: boolean]
+}>()
+
+const { t } = useI18n()
+const skillClient = createSkillClient()
+const deviceClient = createDeviceClient()
+const fileClient = createFileClient()
+
+const isOpen = computed({
+  get: () => props.open,
+  set: (value) => {
+    if (!value && installing.value) return
+    emit('update:open', value)
+  }
+})
+
+const activeTab = ref('folder')
+const installUrl = ref('')
+const validationError = ref('')
+const operationError = ref<string | null>(null)
+const { status: installStatus, run: runInstall } = useDcFormSubmit()
+
+// Drag and drop state: which zone is currently being dragged over
+const dragActive = ref<'folder' | 'zip' | null>(null)
+
+type ConflictRequest =
+  | { status: 'idle' }
+  | { status: 'confirming'; skillName: string; overwrite: () => Promise<void> }
+  | { status: 'pending'; skillName: string; overwrite: () => Promise<void> }
+
+// Preserve request identity so a settled overwrite cannot clear a newer conflict.
+const conflictRequest = shallowRef<ConflictRequest>({ status: 'idle' })
+const conflictDialogOpen = computed(() => conflictRequest.value.status === 'confirming')
+const conflictSkillName = computed(() =>
+  conflictRequest.value.status === 'idle' ? '' : conflictRequest.value.skillName
+)
+const contextVersion = ref(0)
+let pickerRequestId = 0
+let installRequestId = 0
+let installGeneration = 0
+const installing = ref(false)
+
+const isCurrentContext = (version: number) => props.open && version === contextVersion.value
+
+const logFailure = (message: string, error: unknown) => {
+  console.error(message, error)
+}
+
+const beginInstall = (): number | null => {
+  if (installing.value) return null
+  const generation = ++installGeneration
+  installing.value = true
+  return generation
+}
+
+const isCurrentInstall = (generation: number) =>
+  generation === installGeneration && installing.value
+
+const showValidationError = (message: string) => {
+  validationError.value = message
+}
+
+// Invalidate non-cancellable picker and IPC results when the dialog closes.
+watch(
+  () => props.open,
+  (open) => {
+    if (!open) {
+      contextVersion.value += 1
+      pickerRequestId += 1
+      conflictRequest.value = { status: 'idle' }
+      dragActive.value = null
+      validationError.value = ''
+      operationError.value = null
+    }
+  }
+)
+
+// Folder / ZIP / URL installation
+const executeInstall = async (
+  request: () => Promise<SkillInstallResult>,
+  retryWithOverwrite: () => Promise<void>
+) => {
+  const version = contextVersion.value
+  if (!isCurrentContext(version)) return
+  const generation = beginInstall()
+  if (generation === null) return
+  const requestId = ++installRequestId
+  validationError.value = ''
+  operationError.value = null
+  await runInstall(async () => {
+    try {
+      const result = await request()
+      if (!isCurrentInstall(generation) || requestId !== installRequestId) return
+      handleInstallResult(result, retryWithOverwrite, isCurrentContext(version))
+    } catch (error) {
+      if (!isCurrentInstall(generation) || requestId !== installRequestId) return
+      showError(error)
+      throw error
+    }
+  }).catch(() => {
+    // runInstall already settled the status to error; the inline error is
+    // set by showError/handleInstallResult, keep a fallback for edge cases.
+    if (!operationError.value) {
+      operationError.value = t('common.error.requestFailed')
+      installing.value = false
+    }
+  })
+}
+
+const selectFolder = async () => {
+  if (installing.value) return
+  const requestId = ++pickerRequestId
+  const version = contextVersion.value
+  try {
+    const result = await deviceClient.selectDirectory()
+    if (requestId !== pickerRequestId || !isCurrentContext(version)) return
+    if (!result.canceled && result.filePaths.length > 0) {
+      await tryInstallFromFolder(result.filePaths[0], false)
+    }
+  } catch (error) {
+    if (requestId === pickerRequestId && isCurrentContext(version)) {
+      logFailure('[SkillInstallDialog] Failed to select a folder', error)
+      validationError.value = t('common.error.requestFailed')
+    }
+  }
+}
+
+const tryInstallFromFolder = async (folderPath: string, overwrite = false) => {
+  await executeInstall(
+    () => skillClient.installFromFolder(folderPath, { overwrite }),
+    () => tryInstallFromFolder(folderPath, true)
+  )
+}
+
+const selectZip = async () => {
+  if (installing.value) return
+  const requestId = ++pickerRequestId
+  const version = contextVersion.value
+  try {
+    const result = await deviceClient.selectFiles({
+      filters: [{ name: 'ZIP Files', extensions: ['zip'] }]
+    })
+    if (requestId !== pickerRequestId || !isCurrentContext(version)) return
+    if (!result.canceled && result.filePaths.length > 0) {
+      await tryInstallFromZip(result.filePaths[0], false)
+    }
+  } catch (error) {
+    if (requestId === pickerRequestId && isCurrentContext(version)) {
+      logFailure('[SkillInstallDialog] Failed to select a ZIP archive', error)
+      validationError.value = t('common.error.requestFailed')
+    }
+  }
+}
+
+const tryInstallFromZip = async (zipPath: string, overwrite = false) => {
+  await executeInstall(
+    () => skillClient.installFromZip(zipPath, { overwrite }),
+    () => tryInstallFromZip(zipPath, true)
+  )
+}
+
+// Drag and drop handlers
+const onDragEnter = (zone: 'folder' | 'zip') => {
+  if (installing.value) return
+  dragActive.value = zone
+}
+
+const onDragLeave = () => {
+  dragActive.value = null
+}
+
+const handleDrop = async (event: DragEvent) => {
+  dragActive.value = null
+  if (installing.value) return
+
+  const items = event.dataTransfer?.items
+  const files = event.dataTransfer?.files
+  if (!items || items.length === 0) return
+
+  if (items.length > 1 || (files && files.length > 1)) {
+    showDropError()
+    return
+  }
+
+  const item = items[0]
+  const entry = item.webkitGetAsEntry?.()
+  const file = item.getAsFile?.()
+  if (!file) {
+    showDropError()
+    return
+  }
+
+  const path = fileClient.getPathForFile(file)
+  if (!path) {
+    showDropError()
+    return
+  }
+
+  // Route by dropped content type, independent of the active tab
+  if (entry?.isDirectory) {
+    await tryInstallFromFolder(path)
+  } else if (file.name.toLowerCase().endsWith('.zip')) {
+    await tryInstallFromZip(path)
+  } else {
+    showDropError()
+  }
+}
+
+const showDropError = () => {
+  showValidationError(t('settings.skills.install.dragInvalid'))
+}
+
+// URL validation helper
+const isValidUrl = (url: string): boolean => {
+  try {
+    const parsed = new URL(url)
+    return ['http:', 'https:'].includes(parsed.protocol)
+  } catch {
+    return false
+  }
+}
+
+const installFromUrl = async () => {
+  if (!installUrl.value || installing.value) return
+  const url = installUrl.value.trim()
+  if (!isValidUrl(url)) {
+    showValidationError(t('settings.skills.install.urlHint'))
+    return
+  }
+  await tryInstallFromUrl(url, false)
+}
+
+const tryInstallFromUrl = async (url: string, overwrite = false) => {
+  await executeInstall(
+    () => skillClient.installFromUrl(url, { overwrite }),
+    () => tryInstallFromUrl(url, true)
+  )
+}
+
+// Common result handling
+const handleInstallResult = (
+  result: SkillInstallResult,
+  retryWithOverwrite: () => Promise<void>,
+  surfaceCurrent: boolean
+) => {
+  if (result.success) {
+    installing.value = false
+    if (surfaceCurrent) {
+      installUrl.value = ''
+      isOpen.value = false
+    }
+  } else if (result.errorCode === 'conflict') {
+    if (!surfaceCurrent) {
+      notifyRenderer({
+        kind: 'error',
+        code: 'settings.skills.installConflict',
+        title: t('settings.skills.conflict.title'),
+        description: t('settings.skills.conflict.description', {
+          name: result.existingSkillName || result.skillName || ''
+        })
+      })
+      installing.value = false
+      return
+    }
+    installing.value = false
+    conflictRequest.value = {
+      status: 'confirming',
+      skillName: result.existingSkillName || result.skillName || '',
+      overwrite: retryWithOverwrite
+    }
+  } else {
+    console.error('[SkillInstallDialog] Skill installation was rejected', {
+      errorCode: result.errorCode ?? 'UnknownError'
+    })
+    operationError.value = t('common.error.requestFailed')
+    installing.value = false
+    throw new Error('Skill installation was rejected')
+  }
+}
+
+const handleConflictCancel = () => {
+  if (conflictRequest.value.status === 'confirming') {
+    conflictRequest.value = { status: 'idle' }
+  }
+}
+
+const handleConflictOpenChange = (open: boolean) => {
+  if (!open) handleConflictCancel()
+}
+
+const runConflictOverwrite = async (
+  request: Extract<ConflictRequest, { status: 'confirming' }>,
+  pendingRequest: Extract<ConflictRequest, { status: 'pending' }>
+): Promise<void> => {
+  try {
+    await request.overwrite()
+  } catch (error) {
+    showError(error)
+  } finally {
+    if (conflictRequest.value === pendingRequest) {
+      conflictRequest.value = { status: 'idle' }
+    }
+  }
+}
+
+const handleConflictOverwrite = () => {
+  const request = conflictRequest.value
+  if (request.status !== 'confirming') return
+  const pendingRequest = { ...request, status: 'pending' as const }
+  conflictRequest.value = pendingRequest
+  void runConflictOverwrite(request, pendingRequest)
+}
+
+const showError = (error: unknown) => {
+  logFailure('[SkillInstallDialog] Skill installation failed', error)
+  operationError.value = t('common.error.requestFailed')
+  installing.value = false
+}
+
+watch([activeTab, installUrl], () => {
+  if (installing.value) return
+  validationError.value = ''
+  operationError.value = null
+})
+</script>
diff --git a/test/renderer/components/SkillsPluginsPage.test.ts b/test/renderer/components/SkillsPluginsPage.test.ts
index a40a1eb82..c2c994a4b 100644
--- a/test/renderer/components/SkillsPluginsPage.test.ts
+++ b/test/renderer/components/SkillsPluginsPage.test.ts
@@ -60,6 +60,36 @@ const passthrough = (name: string) =>
     template: '<div><slot name="actions" /><slot /></div>'
   })
 
+const DropdownActionItemStub = defineComponent({
+  name: 'DcDropdownActionItem',
+  inheritAttrs: false,
+  props: { icon: String, label: String, disabled: Boolean },
+  emits: ['select'],
+  template:
+    '<button v-bind="$attrs" :disabled="disabled" @click="$emit(\'select\')">{{ label }}</button>'
+})
+
+const ImportSkillsFromAgentDialogStub = defineComponent({
+  name: 'ImportSkillsFromAgentDialog',
+  props: { open: Boolean },
+  emits: ['update:open', 'imported'],
+  template: '<div data-testid="agent-import-dialog" :data-open="String(open)" />'
+})
+
+const SkillInstallDialogStub = defineComponent({
+  name: 'SkillInstallDialog',
+  props: { open: Boolean },
+  emits: ['update:open'],
+  template: '<div data-testid="install-dialog" :data-open="String(open)" />'
+})
+
+const InstallFromGitDialogStub = defineComponent({
+  name: 'InstallFromGitDialog',
+  props: { open: Boolean },
+  emits: ['update:open'],
+  template: '<div data-testid="git-install-dialog" :data-open="String(open)" />'
+})
+
 const deferred = <T>() => {
   let resolve!: (value: T) => void
   const promise = new Promise<T>((nextResolve) => {
@@ -164,7 +194,13 @@ const mountSkillsPluginsPage = async () => {
           template:
             '<button data-testid="sync-directory-view" @click="$emit(\'busy-change\', true)" />'
         }),
-        ImportSkillsFromAgentDialog: true,
+        DropdownMenu: passthrough('DropdownMenu'),
+        DropdownMenuTrigger: passthrough('DropdownMenuTrigger'),
+        DropdownMenuContent: passthrough('DropdownMenuContent'),
+        DcDropdownActionItem: DropdownActionItemStub,
+        ImportSkillsFromAgentDialog: ImportSkillsFromAgentDialogStub,
+        SkillInstallDialog: SkillInstallDialogStub,
+        InstallFromGitDialog: InstallFromGitDialogStub,
         SkillDetailDialog: SkillDetailDialogStub,
         Icon: true
       }
@@ -316,4 +352,31 @@ describe('SkillsPluginsPage', () => {
 
     expect(mocks.skillClient.deleteSkill).toHaveBeenCalledWith('review', ['agent-a', 'agent-b'])
   })
+
+  it('exposes manual Skill import entries from the Add Skill menu', async () => {
+    const wrapper = await mountSkillsPluginsPage()
+    await flushPromises()
+
+    expect(wrapper.get('[data-testid="skills-import-action"]')).toBeTruthy()
+    expect(wrapper.get('[data-testid="skills-import-from-agent"]').text()).toContain(
+      'settings.skills.agentImport.menuItem'
+    )
+    expect(wrapper.get('[data-testid="skills-import-basic"]').text()).toContain(
+      'settings.skills.install.basicTitle'
+    )
+    expect(wrapper.get('[data-testid="skills-import-git"]').text()).toContain(
+      'settings.skills.git.menuItem'
+    )
+
+    await wrapper.get('[data-testid="skills-import-basic"]').trigger('click')
+    expect(wrapper.get('[data-testid="install-dialog"]').attributes('data-open')).toBe('true')
+    wrapper.get('[data-testid="install-dialog"]').trigger('update:open', false)
+
+    await wrapper.get('[data-testid="skills-import-git"]').trigger('click')
+    expect(wrapper.get('[data-testid="git-install-dialog"]').attributes('data-open')).toBe('true')
+    wrapper.get('[data-testid="git-install-dialog"]').trigger('update:open', false)
+
+    await wrapper.get('[data-testid="skills-import-from-agent"]').trigger('click')
+    expect(wrapper.get('[data-testid="agent-import-dialog"]').attributes('data-open')).toBe('true')
+  })
 })

From d1cebd4a62b1cfcde26c133b53b5be1b5d475ed2 Mon Sep 17 00:00:00 2001
From: zhangmo8 <wegi866@gmail.com>
Date: Thu, 27 Aug 2026 11:24:05 +0800
Subject: [PATCH 2/3] chore(icons): regenerate icon collections

---
 src/renderer/src/lib/icons/icon-collections.generated.ts | 6 ++++++
 src/renderer/src/lib/icons/icon-whitelist.generated.ts   | 2 ++
 2 files changed, 8 insertions(+)

diff --git a/src/renderer/src/lib/icons/icon-collections.generated.ts b/src/renderer/src/lib/icons/icon-collections.generated.ts
index fd445afb6..2b6b9bc6d 100644
--- a/src/renderer/src/lib/icons/icon-collections.generated.ts
+++ b/src/renderer/src/lib/icons/icon-collections.generated.ts
@@ -209,6 +209,9 @@ export const lucideIconCollection = {
     copy: {
       body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></g>'
     },
+    'copy-plus': {
+      body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M15 12v6m-3-3h6"/><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></g>'
+    },
     'corner-down-left': {
       body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M20 4v7a4 4 0 0 1-4 4H4"/><path d="m9 10l-5 5l5 5"/></g>'
     },
@@ -254,6 +257,9 @@ export const lucideIconCollection = {
     file: {
       body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"/><path d="M14 2v5a1 1 0 0 0 1 1h5"/></g>'
     },
+    'file-archive': {
+      body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M13.659 22H18a2 2 0 0 0 2-2V8a2.4 2.4 0 0 0-.706-1.706l-3.588-3.588A2.4 2.4 0 0 0 14 2H6a2 2 0 0 0-2 2v11.5"/><path d="M14 2v5a1 1 0 0 0 1 1h5M8 12v-1m0 7v-2m0-9V6"/><circle cx="8" cy="20" r="2"/></g>'
+    },
     'file-code': {
       body: '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"/><path d="M14 2v5a1 1 0 0 0 1 1h5m-10 4.5L8 15l2 2.5m4-5l2 2.5l-2 2.5"/></g>'
     },
diff --git a/src/renderer/src/lib/icons/icon-whitelist.generated.ts b/src/renderer/src/lib/icons/icon-whitelist.generated.ts
index 74f21149e..7fc52dc13 100644
--- a/src/renderer/src/lib/icons/icon-whitelist.generated.ts
+++ b/src/renderer/src/lib/icons/icon-whitelist.generated.ts
@@ -76,6 +76,7 @@ export const GENERATED_ICON_WHITELIST: Record<GeneratedIconCollectionKey, readon
     'command',
     'compass',
     'copy',
+    'copy-plus',
     'corner-down-left',
     'corner-up-left',
     'database',
@@ -91,6 +92,7 @@ export const GENERATED_ICON_WHITELIST: Record<GeneratedIconCollectionKey, readon
     'eye',
     'eye-off',
     'file',
+    'file-archive',
     'file-code',
     'file-cog',
     'file-diff',

From 1ad2c5cd46ff0203ddd3440f4e372e8440f2b2ac Mon Sep 17 00:00:00 2001
From: zhangmo8 <wegi866@gmail.com>
Date: Thu, 27 Aug 2026 11:27:21 +0800
Subject: [PATCH 3/3] fix(skills): address review feedback

---
 .../plugins/skills/InstallFromGitDialog.vue   | 14 ++++++------
 .../plugins/skills/SkillInstallDialog.vue     | 22 ++++++++++++-------
 .../components/SkillsPluginsPage.test.ts      |  8 +++++--
 3 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue b/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
index 9538e7f4f..59a67bdba 100644
--- a/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
+++ b/src/renderer/src/pages/plugins/skills/InstallFromGitDialog.vue
@@ -160,7 +160,7 @@ const emit = defineEmits<{
 const { t } = useI18n()
 const skillClient = createSkillClient()
 
-const repoUrl = ref('https://github.com/op7418/guizang-ppt-skill')
+const repoUrl = ref('https://github.com/op7418/guizang-ppt-skill') // sample repo pre-filled for convenience
 const scanResult = ref<GitSkillRepoScanResult | null>(null)
 const selectedNames = ref<Set<string>>(new Set())
 const strategy = ref<SkillInstallConflictStrategy>('rename')
@@ -283,12 +283,12 @@ const install = async () => {
         selectedNames.value = new Set(
           input.skillNames.filter((skillName) => !installedSourceNames.has(skillName))
         )
+        operationError.value = t('settings.skills.git.successMessage', {
+          count: installed,
+          failed: failed || selectedNames.value.size
+        })
       }
       installing.value = false
-      operationError.value = t('settings.skills.git.successMessage', {
-        count: installed,
-        failed: failed || selectedNames.value.size
-      })
       throw new Error('Git repository install was incomplete')
     }
     installing.value = false
@@ -297,10 +297,10 @@ const install = async () => {
     }
   }).catch((cause) => {
     if (!isCurrentInstall(generation) || requestId !== installRequestId) return
-    if (!operationError.value) {
+    installing.value = false
+    if (isCurrentContext(contextVersion.value) && !operationError.value) {
       logFailure('[InstallFromGitDialog] Failed to install repository skills', cause)
       operationError.value = t('common.error.requestFailed')
-      installing.value = false
     }
   })
 }
diff --git a/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue b/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue
index 65c1c93d4..61cc6900c 100644
--- a/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue
+++ b/src/renderer/src/pages/plugins/skills/SkillInstallDialog.vue
@@ -184,7 +184,7 @@ const activeTab = ref('folder')
 const installUrl = ref('')
 const validationError = ref('')
 const operationError = ref<string | null>(null)
-const { status: installStatus, run: runInstall } = useDcFormSubmit()
+const { status: installStatus, run: runInstall, reset: resetInstallStatus } = useDcFormSubmit()
 
 // Drag and drop state: which zone is currently being dragged over
 const dragActive = ref<'folder' | 'zip' | null>(null)
@@ -263,14 +263,20 @@ const executeInstall = async (
       showError(error)
       throw error
     }
-  }).catch(() => {
-    // runInstall already settled the status to error; the inline error is
-    // set by showError/handleInstallResult, keep a fallback for edge cases.
-    if (!operationError.value) {
-      operationError.value = t('common.error.requestFailed')
-      installing.value = false
-    }
   })
+    .then(() => {
+      // A conflict leaves the overwrite confirmation open; do not let the
+      // submit button settle into a misleading success state.
+      if (conflictRequest.value.status !== 'idle') resetInstallStatus()
+    })
+    .catch(() => {
+      // runInstall already settled the status to error; the inline error is
+      // set by showError/handleInstallResult, keep a fallback for edge cases.
+      if (!operationError.value) {
+        operationError.value = t('common.error.requestFailed')
+        installing.value = false
+      }
+    })
 }
 
 const selectFolder = async () => {
diff --git a/test/renderer/components/SkillsPluginsPage.test.ts b/test/renderer/components/SkillsPluginsPage.test.ts
index c2c994a4b..310a34868 100644
--- a/test/renderer/components/SkillsPluginsPage.test.ts
+++ b/test/renderer/components/SkillsPluginsPage.test.ts
@@ -370,11 +370,15 @@ describe('SkillsPluginsPage', () => {
 
     await wrapper.get('[data-testid="skills-import-basic"]').trigger('click')
     expect(wrapper.get('[data-testid="install-dialog"]').attributes('data-open')).toBe('true')
-    wrapper.get('[data-testid="install-dialog"]').trigger('update:open', false)
+    wrapper.findComponent(SkillInstallDialogStub).vm.$emit('update:open', false)
+    await flushPromises()
+    expect(wrapper.get('[data-testid="install-dialog"]').attributes('data-open')).toBe('false')
 
     await wrapper.get('[data-testid="skills-import-git"]').trigger('click')
     expect(wrapper.get('[data-testid="git-install-dialog"]').attributes('data-open')).toBe('true')
-    wrapper.get('[data-testid="git-install-dialog"]').trigger('update:open', false)
+    wrapper.findComponent(InstallFromGitDialogStub).vm.$emit('update:open', false)
+    await flushPromises()
+    expect(wrapper.get('[data-testid="git-install-dialog"]').attributes('data-open')).toBe('false')
 
     await wrapper.get('[data-testid="skills-import-from-agent"]').trigger('click')
     expect(wrapper.get('[data-testid="agent-import-dialog"]').attributes('data-open')).toBe('true')