29950f08bb
* refactor agent skills to read from translation keys instead of hardcoded strings * add missing sql agent description key * Remove fallbacks * adjust translation * swap to factor pattern * normalize translations (#5147) * normalize translations * run translator job * translations --------- Co-authored-by: Timothy Carambat <rambat1010@gmail.com> --------- Co-authored-by: Timothy Carambat <rambat1010@gmail.com>
52 lines
1.4 KiB
JavaScript
52 lines
1.4 KiB
JavaScript
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { DefaultBadge } from "../Badges/default";
|
|
import Toggle from "@/components/lib/Toggle";
|
|
|
|
export default function DefaultSkillPanel({
|
|
title,
|
|
description,
|
|
image,
|
|
icon,
|
|
enabled = true,
|
|
toggleSkill,
|
|
skill,
|
|
}) {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<div className="p-2">
|
|
<div className="flex flex-col gap-y-[18px] max-w-[500px]">
|
|
<div className="flex w-full justify-between items-center">
|
|
<div className="flex items-center gap-x-2">
|
|
{icon &&
|
|
React.createElement(icon, {
|
|
size: 24,
|
|
color: "var(--theme-text-primary)",
|
|
weight: "bold",
|
|
})}
|
|
<label
|
|
htmlFor="name"
|
|
className="text-theme-text-primary text-md font-bold"
|
|
>
|
|
{title}
|
|
</label>
|
|
<DefaultBadge title={title} />
|
|
</div>
|
|
<Toggle
|
|
size="lg"
|
|
enabled={enabled}
|
|
onChange={() => toggleSkill(skill)}
|
|
/>
|
|
</div>
|
|
<img src={image} alt={title} className="w-full rounded-md" />
|
|
<p className="text-theme-text-secondary text-opacity-60 text-xs font-medium py-1.5">
|
|
{description}
|
|
<br />
|
|
<br />
|
|
{t("agent.skill.default_skill")}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|