24 lines
746 B
TypeScript
24 lines
746 B
TypeScript
 
|
import React from 'react';
|
||
|
|
import { Icon, Icons } from 'folds';
|
||
|
|
import { useAtom } from 'jotai';
|
||
|
|
import { SidebarAvatar, SidebarItem, SidebarItemTooltip } from '../../../components/sidebar';
|
||
|
|
import { bookmarksPanelAtom } from '../../../state/bookmarksPanel';
|
||
|
|
|
||
|
|
export function BookmarksTab() {
|
||
|
|
const [opened, setOpen] = useAtom(bookmarksPanelAtom);
|
||
|
|
|
||
|
|
const toggle = () => setOpen((v) => !v);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<SidebarItem active={opened}>
|
||
|
|
<SidebarItemTooltip tooltip="Saved Messages">
|
||
|
|
{(triggerRef) => (
|
||
|
|
<SidebarAvatar as="button" ref={triggerRef} outlined onClick={toggle}>
|
||
|
|
<Icon src={Icons.Star} filled={opened} />
|
||
|
|
</SidebarAvatar>
|
||
|
|
)}
|
||
|
|
</SidebarItemTooltip>
|
||
|
|
</SidebarItem>
|
||
|
|
);
|
||
|
|
}
|