refactor: remove notification drawer and keep popover + detail modal
This commit is contained in:
@@ -21,7 +21,6 @@ type TaskNotificationsTriggerProps = {
|
||||
silenceTask: (taskId: string, silenced?: boolean) => Promise<void>;
|
||||
markTaskRead: (taskId: string, read?: boolean) => Promise<void>;
|
||||
className?: string;
|
||||
mobile?: boolean;
|
||||
};
|
||||
|
||||
export function TaskNotificationsTrigger({
|
||||
@@ -37,8 +36,7 @@ export function TaskNotificationsTrigger({
|
||||
openTaskDetails,
|
||||
silenceTask,
|
||||
markTaskRead,
|
||||
className,
|
||||
mobile = false
|
||||
className
|
||||
}: TaskNotificationsTriggerProps) {
|
||||
const button = (
|
||||
<button
|
||||
@@ -46,18 +44,13 @@ export function TaskNotificationsTrigger({
|
||||
aria-label="Open notifications"
|
||||
onClick={() => setIsPopoverOpen(!isPopoverOpen)}
|
||||
className={cn(
|
||||
'relative inline-flex items-center justify-center rounded-lg border border-[color:var(--line-weak)] bg-[color:var(--panel-soft)] text-[color:var(--terminal-bright)] transition hover:border-[color:var(--line-strong)] hover:bg-[color:var(--panel-bright)]',
|
||||
mobile ? 'min-w-0 flex-1 gap-1 px-2 py-1.5 text-[11px]' : 'h-10 w-10',
|
||||
'relative inline-flex h-10 w-10 items-center justify-center rounded-lg border border-[color:var(--line-weak)] bg-[color:var(--panel-soft)] text-[color:var(--terminal-bright)] transition hover:border-[color:var(--line-strong)] hover:bg-[color:var(--panel-bright)]',
|
||||
className
|
||||
)}
|
||||
>
|
||||
{unreadCount > 0 ? <BellRing className="size-4" /> : <Bell className="size-4" />}
|
||||
{mobile ? <span>Alerts</span> : null}
|
||||
{unreadCount > 0 ? (
|
||||
<span className={cn(
|
||||
'absolute inline-flex min-w-[1.15rem] items-center justify-center rounded-full bg-[color:var(--accent)] px-1 text-[10px] font-semibold text-[#00241d]',
|
||||
mobile ? 'right-1 top-1' : '-right-1.5 -top-1.5'
|
||||
)}>
|
||||
<span className="absolute -right-1.5 -top-1.5 inline-flex min-w-[1.15rem] items-center justify-center rounded-full bg-[color:var(--accent)] px-1 text-[10px] font-semibold text-[#00241d]">
|
||||
{unreadCount > 99 ? '99+' : unreadCount}
|
||||
</span>
|
||||
) : null}
|
||||
@@ -77,10 +70,7 @@ export function TaskNotificationsTrigger({
|
||||
/>
|
||||
<div
|
||||
className={cn(
|
||||
'z-50 rounded-xl border border-[color:var(--line-weak)] bg-[color:var(--panel)] p-3 shadow-[0_18px_50px_rgba(0,0,0,0.45)]',
|
||||
mobile
|
||||
? 'fixed inset-x-3 bottom-20 top-16 overflow-hidden'
|
||||
: 'absolute right-0 mt-2 h-[34rem] w-[27rem]'
|
||||
'absolute right-0 z-50 mt-2 h-[34rem] max-h-[calc(100vh-8rem)] w-[min(27rem,calc(100vw-2rem))] rounded-xl border border-[color:var(--line-weak)] bg-[color:var(--panel)] p-3 shadow-[0_18px_50px_rgba(0,0,0,0.45)]'
|
||||
)}
|
||||
>
|
||||
<div className="mb-2 flex items-center justify-between">
|
||||
|
||||
Reference in New Issue
Block a user