| 1 | <template> |
| 2 | <Badge :color="getTechnologyColor(action.technology)"> |
| 3 | <template #iconLeft><TechnologyIcon :action :size="14" /></template> |
| 4 | <template #value> |
| 5 | <span class="whitespace-nowrap">{{ action.technology }}</span> |
| 6 | </template> |
| 7 | </Badge> |
| 8 | </template> |
| 9 | |
| 10 | <script setup lang="ts"> |
| 11 | import type { BadgeColor } from "@/components/common/Badge.vue" |
| 12 | import type { CopilotAction } from "@/types/copilotAction.d" |
| 13 | import Badge from "@/components/common/Badge.vue" |
| 14 | import TechnologyIcon from "./TechnologyIcon.vue" |
| 15 | |
| 16 | const { action } = defineProps<{ action: CopilotAction }>() |
| 17 | |
| 18 | function getTechnologyColor(technology: string): BadgeColor | undefined { |
| 19 | if (technology.toLowerCase().includes("win")) { |
| 20 | return "primary" |
| 21 | } |
| 22 | if (technology.toLowerCase().includes("lin")) { |
| 23 | return "warning" |
| 24 | } |
| 25 | if (technology.toLowerCase().includes("mac")) { |
| 26 | return "success" |
| 27 | } |
| 28 | if (technology.toLowerCase().includes("wazuh")) { |
| 29 | return "success" |
| 30 | } |
| 31 | if (technology.toLowerCase().includes("velociraptor")) { |
| 32 | return "primary" |
| 33 | } |
| 34 | if (technology.toLowerCase().includes("network")) { |
| 35 | return "primary" |
| 36 | } |
| 37 | if (technology.toLowerCase().includes("cloud")) { |
| 38 | return "success" |
| 39 | } |
| 40 | |
| 41 | return undefined |
| 42 | } |
| 43 | </script> |