feat: AI Copilot suggestion toggle button

Add showAISuggestions state + 'Sug' toggle button in Copilot
Prompt header. When hidden, suggestion list is unmounted
(showAISuggestions ? ... : null). Button styling: visible
state = bg-zinc-800/zinc-400, hidden = indigo-950/indigo-400.
This commit is contained in:
2026-07-28 20:11:23 +07:00
parent ad29df46d2
commit c09ad7f48d
2 changed files with 10 additions and 5 deletions
+8 -3
View File
@@ -7223,6 +7223,7 @@ const App = () => {
const [aiProcessing, setAiProcessing] = useState(false);
const [aiSuggestions, setAiSuggestions] = useState([]);
const [showAiTypeahead, setShowAiTypeahead] = useState(false);
const [showAISuggestions, setShowAISuggestions] = useState(true);
const [selectedProviderId, setSelectedProviderId] = useState('');
const [exportSettings, setExportSettings] = useState({
sampleRate: '44100',
@@ -16229,7 +16230,7 @@ const App = () => {
}, "Chưa có hành động nào.") : aiActionLog.map((entry, i) => /*#__PURE__*/React.createElement("div", {
key: i,
className: `text-xs font-mono py-0.5 border-b border-zinc-900 last:border-0 ${entry.type === 'error' ? 'text-red-400' : entry.type === 'status' ? 'text-zinc-400 italic' : entry.type === 'undo' ? 'text-amber-400' : 'text-zinc-300'}`
}, new Date(entry.time).toLocaleTimeString(), entry.text)))), /*#__PURE__*/React.createElement("div", {
}, new Date(entry.time).toLocaleTimeString(), entry.text)))), showAISuggestions ? /*#__PURE__*/React.createElement("div", {
className: "flex flex-col gap-1 mb-1 shrink-0"
}, /*#__PURE__*/React.createElement("div", {
className: "flex items-center gap-1 text-[10px] font-bold text-zinc-400 uppercase"
@@ -16254,7 +16255,7 @@ const App = () => {
className: "text-zinc-200 font-semibold"
}, p.name)), /*#__PURE__*/React.createElement("span", {
className: "text-[9px] text-zinc-500 shrink-0"
}, p.category))))), /*#__PURE__*/React.createElement("div", {
}, p.category))))) : null, /*#__PURE__*/React.createElement("div", {
className: "border-t border-zinc-800 pt-1.5 mt-1 shrink-0"
}, /*#__PURE__*/React.createElement("div", {
className: "text-xs font-bold text-zinc-400 uppercase mb-1 flex items-center gap-1"
@@ -16263,7 +16264,11 @@ const App = () => {
}, /*#__PURE__*/React.createElement("i", {
"data-lucide": "message-square",
className: "w-3 h-3"
})), " Copilot Prompt"), /*#__PURE__*/React.createElement("textarea", {
})), " Copilot Prompt", /*#__PURE__*/React.createElement("button", {
onClick: () => setShowAISuggestions(!showAISuggestions),
className: "ml-auto text-[9px] px-1.5 py-0.5 rounded border font-semibold " + (showAISuggestions ? 'bg-zinc-800 text-zinc-400 border-zinc-700 hover:bg-zinc-700' : 'bg-indigo-950/40 text-indigo-400 border-indigo-800/50 hover:bg-indigo-900/50'),
title: showAISuggestions ? 'Ẩn AI Suggestion' : 'Hiện AI Suggestion'
}, "Sug")), /*#__PURE__*/React.createElement("textarea", {
value: aiPrompt,
onChange: e => {
const v = e.target.value;