litruv
d59945eb4c
All checks were successful
Trigger cinny-mobile / dispatch (push) Successful in 2s
Render the equipped nameplate behind the larger settings avatar with blur-aware sidebar controls, adjustable opacity, and immediate collectible cache invalidation.
32 lines
925 B
TypeScript
32 lines
925 B
TypeScript
import { Icon, Icons } from '../../../components/icons';
|
|
import React from 'react';
|
|
|
|
import { useAtom } from 'jotai';
|
|
import { SidebarAvatar, SidebarItem, SidebarItemTooltip } from '../../../components/sidebar';
|
|
import { searchModalAtom } from '../../../state/searchModal';
|
|
import * as sidebarCss from '../../../components/sidebar/Sidebar.css';
|
|
|
|
export function SearchTab() {
|
|
const [opened, setOpen] = useAtom(searchModalAtom);
|
|
|
|
const open = () => setOpen(true);
|
|
|
|
return (
|
|
<SidebarItem active={opened}>
|
|
<SidebarItemTooltip tooltip="Search">
|
|
{(triggerRef) => (
|
|
<SidebarAvatar
|
|
as="button"
|
|
ref={triggerRef}
|
|
className={sidebarCss.SidebarSearchAvatar}
|
|
outlined
|
|
onClick={open}
|
|
>
|
|
<Icon src={Icons.Search} filled={opened} />
|
|
</SidebarAvatar>
|
|
)}
|
|
</SidebarItemTooltip>
|
|
</SidebarItem>
|
|
);
|
|
}
|