返回主页
HUYU IDE
HUYU IDE
自主模式
小说助手
Android Studio
import
{
useState
}
from
'react'
;
import
{
Bot
,
MessageSquare
}
from
'lucide-react'
;
export
function
AiChatPanel
({
messages
,
isLoading
,
agentMode
}) {
const
[
input
,
setInput
] =
useState
(
''
);
const
handleSend
= () => {
if
(!
input
.
trim
() ||
isLoading
)
return
;
onSend
(
input
);
setInput
(
''
); };
return
(
<
div
className
=
"flex flex-col h-full"
>
{/* AI 对话区域 */}
<
div
className
=
"flex-1 overflow-y-auto p-3"
>
{
messages
.
map
((
msg
) => (
<
div
key
={
msg
.
id
}
className
=
"mb-3"
>
{
msg
.
content
}
</
div
>
))}
</
div
>
{/* 输入区域 */}
<
div
className
=
"p-3 border-t"
>
<
input
value
={
input
}
onChange
={(
e
) =>
setInput
(
e
.
target
.
value
)}
placeholder
=
"输入消息..."
className
=
"w-full px-3 py-2 rounded-lg"
/>
</
div
>
</
div
>
); }
import
{
useState
,
useCallback
}
from
'react'
;
import
{
ChevronRight
,
ChevronDown
,
File
,
Folder
}
from
'lucide-react'
;
interface
TreeNode
{
name
:
string
;
type
:
'file'
|
'directory'
;
children
?:
TreeNode
[];
path
:
string
; }
interface
FileTreeProps
{
data
:
TreeNode
;
onFileSelect
: (
path
:
string
) =>
void
;
selectedPath
?:
string
; }
export
function
FileTree
({
data
,
onFileSelect
,
selectedPath
}:
FileTreeProps
) {
const
[
expanded
,
setExpanded
] =
useState
<
Set
<
string
>>(
new
Set
([
data
.
path
]) );
const
toggle
=
useCallback
((
path
:
string
) => {
setExpanded
(
prev
=> {
const
next
=
new
Set
(
prev
);
if
(
next
.
has
(
path
))
next
.
delete
(
path
);
else
next
.
add
(
path
);
return
next
; }); }, []);
return
(
<
div
className
=
"file-tree"
>
<
TreeNode
node
={
data
}
expanded
={
expanded
}
selectedPath
={
selectedPath
}
onToggle
={
toggle
}
onSelect
={
onFileSelect
}
/>
</
div
>
); }
import
{
memo
}
from
'react'
;
import
{
GitBranch
,
AlertCircle
,
Terminal
}
from
'lucide-react'
;
interface
StatusBarProps
{
branch
:
string
;
errors
:
number
;
warnings
:
number
;
currentFile
:
string
;
model
:
string
; }
export
const
StatusBar
=
memo
(({
branch
,
errors
,
warnings
,
currentFile
,
model
}:
StatusBarProps
) => {
return
(
<
div
className
=
"status-bar"
>
<
div
className
=
"status-left"
>
<
StatusItem
icon
={
<
Terminal
/>
}
label
=
"Terminal"
/>
<
StatusItem
icon
={
<
GitBranch
/>
}
label
={
branch
}
/>
<
StatusItem
icon
={
<
AlertCircle
/>
}
label
={
"errors: "
+
errors
+
", warnings: "
+
warnings
}
/>
</
div
>
<
div
className
=
"status-right"
>
<
span
>
{
currentFile
}
</
span
>
<
span
>
{
model
}
</
span
>
</
div
>
</
div
>
); });