smolkik_adm/VidBee
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(renderer): refine subscriptions layout (#92)

Browse Source
This commit is contained in:
Nexmoe
2026-01-13 22:20:31 +08:00
committed by GitHub
parent 43cabf65e9
commit f061b6b61e
2 changed files with 55 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/renderer/src/App.tsx
View File

@@ -1,4 +1,3 @@
import { ScrollArea } from '@renderer/components/ui/scroll-area'
import { Sidebar } from '@renderer/components/ui/sidebar'
import { Toaster } from '@renderer/components/ui/sonner'
import { TitleBar } from '@renderer/components/ui/title-bar'
@@ -256,28 +255,23 @@ function AppContent() {
{/* Custom Title Bar */}
<TitleBar platform={platform} />
<ScrollArea
className="flex-1 w-full overflow-y-auto overflow-x-hidden"
style={{ maxWidth: '100%' }}
>
<div className="w-full h-full flex flex-col min-h-0" style={{ maxWidth: '100%' }}>
<Routes>
<Route
path="/"
element={
<Home
onOpenSupportedSites={handleOpenSupportedSites}
onOpenSettings={() => handlePageChange('settings')}
/>
}
/>
<Route path="/subscriptions" element={<Subscriptions />} />
<Route path="/settings" element={<Settings />} />
<Route path="/about" element={<About />} />
<Route path="*" element={<Navigate to="/" replace />} />
</Routes>
</div>
</ScrollArea>
<div className="flex-1 h-full overflow-y-auto overflow-x-hidden">
<Routes>
<Route
path="/"
element={
<Home
onOpenSupportedSites={handleOpenSupportedSites}
onOpenSettings={() => handlePageChange('settings')}
/>
}
/>
<Route path="/subscriptions" element={<Subscriptions />} />
<Route path="/settings" element={<Settings />} />
<Route path="/about" element={<About />} />
<Route path="*" element={<Navigate to="/" replace />} />
</Routes>
</div>
</main>
<Toaster richColors={true} />

73
src/renderer/src/pages/Subscriptions.tsx
View File

@@ -319,45 +319,48 @@ export function Subscriptions() {
}, [selectedTab, sortedSubscriptions])
return (
<div className="relative">
<div className="relative w-full h-full flex flex-col">
{/* Channel Tabs Header */}
<div className="">
<div className="overflow-x-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]">
<Tabs value={selectedTab} onValueChange={setSelectedTab} className="w-auto">
<TabsList className="h-auto w-auto justify-start rounded-none border-none bg-transparent p-0 px-6">
{/* Subscription Channel Tabs */}
{sortedSubscriptions.map((subscription) => (
<SubscriptionTab
key={subscription.id}
subscription={subscription}
isActive={subscription.id === selectedTab}
onRefresh={() => refreshSubscription(subscription.id)}
onRemove={() => removeSubscription(subscription.id)}
onUpdate={(data) => handleUpdateSubscription(subscription.id, data)}
/>
))}
{/* Add RSS Button */}
<Button
className="flex h-auto w-20 flex-col items-center gap-1 rounded-2xl px-2 py-2 transition-all hover:opacity-80 bg-transparent hover:bg-neutral-100 shrink-0 grow-0"
variant="ghost"
onClick={() => setAddDialogOpen(true)}
>
<div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-full border-2 border-dashed border-muted-foreground/40 transition-colors">
<Plus className="h-5 w-5 text-muted-foreground" />
</div>
<div className="flex w-full flex-col items-center text-center">
<span className="w-full truncate text-xs font-medium">
{t('subscriptions.add.title')}
</span>
</div>
</Button>
</TabsList>
</Tabs>
</div>
<div className="flex flex-row pr-6 pb-6">
<Tabs
value={selectedTab}
onValueChange={setSelectedTab}
className="w-auto overflow-x-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]"
>
<TabsList className="h-auto w-auto justify-start rounded-none border-none bg-transparent p-0 px-6">
{/* Subscription Channel Tabs */}
{sortedSubscriptions.map((subscription) => (
<SubscriptionTab
key={subscription.id}
subscription={subscription}
isActive={subscription.id === selectedTab}
onRefresh={() => refreshSubscription(subscription.id)}
onRemove={() => removeSubscription(subscription.id)}
onUpdate={(data) => handleUpdateSubscription(subscription.id, data)}
/>
))}
</TabsList>
</Tabs>
{/* Add RSS Button */}
<Button
className="flex h-auto w-20 flex-col items-center gap-1 rounded-2xl px-2 py-2 transition-all hover:opacity-80 bg-transparent hover:bg-neutral-100 shrink-0 grow-0"
variant="ghost"
onClick={() => setAddDialogOpen(true)}
>
<div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-full border-2 border-dashed border-muted-foreground/40 transition-colors">
<Plus className="h-5 w-5 text-muted-foreground" />
</div>
<div className="flex w-full flex-col items-center text-center">
<span className="w-full truncate text-xs font-medium">
{t('subscriptions.add.title')}
</span>
</div>
</Button>
</div>
{/* Content Area */}
<div className="relative space-y-8 p-6">
<div className="overflow-y-auto relative space-y-8 p-6 pt-0">
<section className="space-y-4">
{sortedSubscriptions.length === 0 ? (
<div className="py-12 text-center text-sm text-muted-foreground">