inventree/InvenTree
2
0
Fork 0
mirror of https://github.com/inventree/InvenTree.git synced 2025-05-02 13:28:49 +00:00
Code

[PUI] Search tweak (#8381)

Browse Source 
* Cleanup buttons and add Tooltip

* Clearer separation

* Link cleanup
This commit is contained in:
Oliver 2024-10-29 01:31:19 +11:00 committed by GitHub
parent 234ee2b40f
commit 89946aed15
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 19 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/frontend/src/components/nav/SearchDrawer.tsx
View File

@ -14,7 +14,8 @@ import {
Space,
Stack,
Text,
TextInput
TextInput,
Tooltip
} from '@mantine/core';
import { useDebouncedValue } from '@mantine/hooks';
import {
@ -69,8 +70,8 @@ function QueryResultGroup({
return (
<Paper
withBorder
shadow="sm"
radius="xs"
p="md"
key={`paper-${query.model}`}
aria-label={`search-group-${query.model}`}
@ -100,10 +101,11 @@ function QueryResultGroup({
<Stack aria-label={`search-group-results-${query.model}`}>
{query.results.results.map((result: any) => (
<Anchor
underline="never"
onClick={(event: any) =>
onResultClick(query.model, result.pk, event)
}
key={result.pk}
key={`result-${query.model}-${result.pk}`}
>
<RenderInstance instance={result} model={query.model} />
</Anchor>
@ -376,7 +378,6 @@ export function SearchDrawer({
<TextInput
aria-label="global-search-input"
placeholder={t`Enter search text`}
radius="xs"
value={value}
onChange={(event) => setValue(event.currentTarget.value)}
leftSection={<IconSearch size="0.8rem" />}
@ -387,19 +388,22 @@ export function SearchDrawer({
}
styles={{ root: { width: '100%' } }}
/>
<ActionIcon
size="lg"
variant="outline"
radius="xs"
onClick={() => searchQuery.refetch()}
>
<IconRefresh />
</ActionIcon>
<Tooltip label={t`Refresh search results`} position="bottom-end">
<ActionIcon
size="lg"
variant="transparent"
onClick={() => searchQuery.refetch()}
>
<IconRefresh />
</ActionIcon>
</Tooltip>
<Menu>
<Menu.Target>
<ActionIcon size="lg" variant="outline" radius="xs">
<IconSettings />
</ActionIcon>
<Tooltip label={t`Search Options`} position="bottom-end">
<ActionIcon size="lg" variant="transparent">
<IconSettings />
</ActionIcon>
</Tooltip>
</Menu.Target>
<Menu.Dropdown>
<Menu.Label>{t`Search Options`}</Menu.Label>
@ -410,7 +414,6 @@ export function SearchDrawer({
onChange={(event) =>
setSearchRegex(event.currentTarget.checked)
}
radius="sm"
/>
</Menu.Item>
<Menu.Item>
@ -420,7 +423,6 @@ export function SearchDrawer({
onChange={(event) =>
setSearchWhole(event.currentTarget.checked)
}
radius="sm"
/>
</Menu.Item>
</Menu.Dropdown>