extract SettingsTrigger component to separate modal open control from SettingsModal. update HomeContent to manage modal state and pass open/onOpenChange props. remove redundant trigger button from SettingsModal for improved composability. removes embedded trigger logic from SettingsModal, enabling external state management and better integration with various UI layouts. also cleans up playwright config by centralizing testIgnore for unit tests.
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { DocumentList } from '@/components/doclist/DocumentList';
|
|
import { SettingsModal, SettingsTrigger } from '@/components/SettingsModal';
|
|
import { UserMenu } from '@/components/auth/UserMenu';
|
|
|
|
const Brand = () => (
|
|
<div className="flex items-center gap-2 min-w-0">
|
|
{/* eslint-disable-next-line @next/next/no-img-element */}
|
|
<img src="/icon.svg" alt="" className="w-5 h-5 shrink-0" aria-hidden="true" />
|
|
<h1 className="hidden sm:block text-xs sm:text-sm font-bold truncate text-foreground tracking-tight">
|
|
OpenReader
|
|
</h1>
|
|
</div>
|
|
);
|
|
|
|
export function HomeContent() {
|
|
const [settingsOpen, setSettingsOpen] = useState(false);
|
|
|
|
const appActions = (
|
|
<div className="flex flex-col gap-0.5 w-full">
|
|
<SettingsTrigger
|
|
triggerLabel="Settings"
|
|
className="w-full justify-start gap-2 px-2 py-1 text-[12px] border-transparent hover:border-accent"
|
|
onOpen={() => setSettingsOpen(true)}
|
|
/>
|
|
<UserMenu variant="sidebar" />
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<div className="w-full h-full">
|
|
<DocumentList brand={<Brand />} appActions={appActions} />
|
|
<SettingsModal open={settingsOpen} onOpenChange={setSettingsOpen} />
|
|
</div>
|
|
);
|
|
}
|