xinyin025/LangBot
1
0
Fork 0
mirror of https://github.com/langbot-app/LangBot.git synced 2026-06-02 03:55:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: enhance layout and styling of ModelsDialog component for improved usability

Browse Source
This commit is contained in:
Junyan Qin
2026-01-05 17:58:01 +08:00
parent 1cd586634d
commit 9ea5b50802
1 changed files with 14 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
web/src/app/home/components/models-dialog/ModelsDialog.tsx
View File

@@ -429,18 +429,16 @@ export default function ModelsDialog({
}}
>
<DialogContent className="overflow-hidden p-0 h-[80vh] flex flex-col !max-w-[37rem]">
<DialogHeader className="px-6 pt-6 pb-0">
<DialogHeader className="px-6 pt-6 pb-0 flex-shrink-0">
<DialogTitle>{t('models.title')}</DialogTitle>
</DialogHeader>
<div className="flex-1 flex flex-col overflow-hidden px-6 pb-6 mt-0">
{/* Fixed LangBot Models Card */}
<div className="flex-shrink-0">
{langbotProvider && renderProviderCard(langbotProvider, true)}
</div>
<div className="flex-1 overflow-auto px-6 pb-6 mt-0">
{/* LangBot Models Card */}
{langbotProvider && renderProviderCard(langbotProvider, true)}
{/* Add Provider Button */}
<div className="flex-shrink-0 mb-3 flex justify-between items-center">
<div className="mb-3 flex justify-between items-center sticky top-0 bg-background py-2 z-10">
<span className="text-sm text-muted-foreground">
{otherProviders.length === 0
? t(
@@ -460,17 +458,15 @@ export default function ModelsDialog({
</Button>
</div>
{/* Scrollable Provider List */}
<div className="flex-1 overflow-auto">
{otherProviders.length === 0 ? (
<div className="flex flex-col items-center justify-center h-full text-muted-foreground">
<Boxes className="h-12 w-12 mb-3 opacity-50" />
<p className="text-sm">{t('models.noProviders')}</p>
</div>
) : (
otherProviders.map((p) => renderProviderCard(p))
)}
</div>
{/* Provider List */}
{otherProviders.length === 0 ? (
<div className="flex flex-col items-center justify-center py-12 text-muted-foreground">
<Boxes className="h-12 w-12 mb-3 opacity-50" />
<p className="text-sm">{t('models.noProviders')}</p>
</div>
) : (
otherProviders.map((p) => renderProviderCard(p))
)}
</div>
</DialogContent>
</Dialog>