Skip to content

B
bit-pm
提交 d651a6aa authored 作者: Will Chen's avatar Will Chen
浏览文件
操作

max height for proposal details

上级 3b2fb12d
隐藏空白字符变更
内嵌 并排
正在显示 包含 126 行增加 和 103 行删除
src/components/chat/ChatInput.tsx
浏览文件 @ d651a6aa
...@@ -345,6 +345,19 @@ function ChatInputActions({ ...@@ -345,6 +345,19 @@ function ChatInputActions({
const otherFilesChanged = const otherFilesChanged =
proposal.filesChanged?.filter((f: FileChange) => !f.isServerFunction) ?? []; proposal.filesChanged?.filter((f: FileChange) => !f.isServerFunction) ?? [];
function formatTitle({
title,
isDetailsVisible,
}: {
title: string;
isDetailsVisible: boolean;
}) {
if (isDetailsVisible) {
return title;
}
return title.slice(0, 60) + "...";
}
return ( return (
<div className="border-b border-border"> <div className="border-b border-border">
<div className="p-2"> <div className="p-2">
...@@ -360,7 +373,9 @@ function ChatInputActions({ ...@@ -360,7 +373,9 @@ function ChatInputActions({
) : ( ) : (
<ChevronDown size={16} className="mr-1 flex-shrink-0" /> <ChevronDown size={16} className="mr-1 flex-shrink-0" />
)} )}
<span className="font-medium">{proposal.title}</span> <span className="font-medium">
{formatTitle({ title: proposal.title, isDetailsVisible })}
</span>
</div> </div>
<div className="text-xs text-muted-foreground ml-6"> <div className="text-xs text-muted-foreground ml-6">
<ProposalSummary <ProposalSummary
...@@ -414,112 +429,120 @@ function ChatInputActions({ ...@@ -414,112 +429,120 @@ function ChatInputActions({
</div> </div>
</div> </div>
{isDetailsVisible && ( <div className="overflow-y-auto max-h-[calc(100vh-300px)]">
<div className="p-3 border-t border-border bg-muted/50 text-sm"> {isDetailsVisible && (
{!!proposal.securityRisks.length && ( <div className="p-3 border-t border-border bg-muted/50 text-sm">
<div className="mb-3"> {!!proposal.securityRisks.length && (
<h4 className="font-semibold mb-1">Security Risks</h4> <div className="mb-3">
<ul className="space-y-1"> <h4 className="font-semibold mb-1">Security Risks</h4>
{proposal.securityRisks.map((risk, index) => ( <ul className="space-y-1">
<li key={index} className="flex items-start space-x-2"> {proposal.securityRisks.map((risk, index) => (
{risk.type === "warning" ? ( <li key={index} className="flex items-start space-x-2">
<AlertTriangle {risk.type === "warning" ? (
size={16} <AlertTriangle
className="text-yellow-500 mt-0.5 flex-shrink-0" size={16}
/> className="text-yellow-500 mt-0.5 flex-shrink-0"
) : ( />
<AlertOctagon ) : (
size={16} <AlertOctagon
className="text-red-500 mt-0.5 flex-shrink-0" size={16}
/> className="text-red-500 mt-0.5 flex-shrink-0"
)} />
<div> )}
<span className="font-medium">{risk.title}:</span>{" "} <div>
<span>{risk.description}</span> <span className="font-medium">{risk.title}:</span>{" "}
</div> <span>{risk.description}</span>
</li> </div>
))} </li>
</ul> ))}
</div> </ul>
)} </div>
)}
{proposal.sqlQueries?.length > 0 && ( {proposal.sqlQueries?.length > 0 && (
<div className="mb-3"> <div className="mb-3">
<h4 className="font-semibold mb-1">SQL Queries</h4> <h4 className="font-semibold mb-1">SQL Queries</h4>
<ul className="space-y-2"> <ul className="space-y-2">
{proposal.sqlQueries.map((query, index) => ( {proposal.sqlQueries.map((query, index) => (
<SqlQueryItem key={index} query={query} /> <SqlQueryItem key={index} query={query} />
))} ))}
</ul> </ul>
</div> </div>
)} )}
{proposal.packagesAdded?.length > 0 && ( {proposal.packagesAdded?.length > 0 && (
<div className="mb-3"> <div className="mb-3">
<h4 className="font-semibold mb-1">Packages Added</h4> <h4 className="font-semibold mb-1">Packages Added</h4>
<ul className="space-y-1"> <ul className="space-y-1">
{proposal.packagesAdded.map((pkg, index) => ( {proposal.packagesAdded.map((pkg, index) => (
<li <li
key={index} key={index}
className="flex items-center space-x-2" className="flex items-center space-x-2"
onClick={() => { onClick={() => {
IpcClient.getInstance().openExternalUrl( IpcClient.getInstance().openExternalUrl(
`https://www.npmjs.com/package/${pkg}` `https://www.npmjs.com/package/${pkg}`
); );
}} }}
> >
<Package <Package
size={16} size={16}
className="text-muted-foreground flex-shrink-0" className="text-muted-foreground flex-shrink-0"
/> />
<span className="cursor-pointer text-blue-500 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"> <span className="cursor-pointer text-blue-500 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300">
{pkg} {pkg}
</span> </span>
</li> </li>
))} ))}
</ul> </ul>
</div> </div>
)} )}
{serverFunctions.length > 0 && ( {serverFunctions.length > 0 && (
<div className="mb-3"> <div className="mb-3">
<h4 className="font-semibold mb-1">Server Functions Changed</h4> <h4 className="font-semibold mb-1">Server Functions Changed</h4>
<ul className="space-y-1"> <ul className="space-y-1">
{serverFunctions.map((file: FileChange, index: number) => ( {serverFunctions.map((file: FileChange, index: number) => (
<li key={index} className="flex items-center space-x-2"> <li key={index} className="flex items-center space-x-2">
{getIconForFileChange(file)} {getIconForFileChange(file)}
<span title={file.path} className="truncate cursor-default"> <span
{file.name} title={file.path}
</span> className="truncate cursor-default"
<span className="text-muted-foreground text-xs truncate"> >
- {file.summary} {file.name}
</span> </span>
</li> <span className="text-muted-foreground text-xs truncate">
))} - {file.summary}
</ul> </span>
</div> </li>
)} ))}
</ul>
</div>
)}
{otherFilesChanged.length > 0 && ( {otherFilesChanged.length > 0 && (
<div> <div>
<h4 className="font-semibold mb-1">Files Changed</h4> <h4 className="font-semibold mb-1">Files Changed</h4>
<ul className="space-y-1"> <ul className="space-y-1">
{otherFilesChanged.map((file: FileChange, index: number) => ( {otherFilesChanged.map((file: FileChange, index: number) => (
<li key={index} className="flex items-center space-x-2"> <li key={index} className="flex items-center space-x-2">
{getIconForFileChange(file)} {getIconForFileChange(file)}
<span title={file.path} className="truncate cursor-default"> <span
{file.name} title={file.path}
</span> className="truncate cursor-default"
<span className="text-muted-foreground text-xs truncate"> >
- {file.summary} {file.name}
</span> </span>
</li> <span className="text-muted-foreground text-xs truncate">
))} - {file.summary}
</ul> </span>
</div> </li>
)} ))}
</div> </ul>
)} </div>
)}
</div>
)}
</div>
</div> </div>
); );
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论