ce1ef3cbe7
* feat: add improved search * wip: add support for sorting, rename use-options to use-query-options, add use-options for local usage, add pages search group * feat: add help links from manage layout to help search mode * feat: add additional search engines * feat: add group search details * refactor: improve users search group type * feat: add apps search group, add disabled search interaction * feat: add integrations and boards for search * wip: hook issue with react * fix: hook issue regarding actions and interactions * chore: address pull request feedback * fix: format issues * feat: add additional global actions to search * chore: remove unused code * fix: search engine short key * fix: typecheck issues * fix: deepsource issues * fix: eslint issue * fix: lint issues * fix: unordered dependencies * chore: address pull request feedback
75 lines
2.5 KiB
TypeScript
75 lines
2.5 KiB
TypeScript
import { Group, Kbd, Text } from "@mantine/core";
|
|
import { IconBook2, IconBrandDiscord, IconBrandGithub } from "@tabler/icons-react";
|
|
|
|
import { useScopedI18n } from "@homarr/translation/client";
|
|
|
|
import { createGroup } from "../lib/group";
|
|
import { interaction } from "../lib/interaction";
|
|
import type { SearchMode } from "../lib/mode";
|
|
import { appIntegrationBoardMode } from "./app-integration-board";
|
|
import { commandMode } from "./command";
|
|
import { externalMode } from "./external";
|
|
import { pageMode } from "./page";
|
|
import { userGroupMode } from "./user-group";
|
|
|
|
const searchModesWithoutHelp = [userGroupMode, appIntegrationBoardMode, externalMode, commandMode, pageMode] as const;
|
|
|
|
const helpMode = {
|
|
modeKey: "help",
|
|
character: "?",
|
|
groups: [
|
|
createGroup({
|
|
keyPath: "character",
|
|
title: (t) => t("search.mode.help.group.mode.title"),
|
|
options: searchModesWithoutHelp.map(({ character, modeKey }) => ({ character, modeKey })),
|
|
component: ({ modeKey, character }) => {
|
|
const t = useScopedI18n(`search.mode.${modeKey}`);
|
|
|
|
return (
|
|
<Group px="md" py="xs" w="100%" wrap="nowrap" align="center" justify="space-between">
|
|
<Text>{t("help")}</Text>
|
|
<Kbd size="sm">{character}</Kbd>
|
|
</Group>
|
|
);
|
|
},
|
|
filter: () => true,
|
|
useInteraction: interaction.mode(({ modeKey }) => ({ mode: modeKey })),
|
|
}),
|
|
createGroup({
|
|
keyPath: "href",
|
|
title: (t) => t("search.mode.help.group.help.title"),
|
|
useOptions() {
|
|
const t = useScopedI18n("search.mode.help.group.help.option");
|
|
|
|
return [
|
|
{
|
|
label: t("documentation.label"),
|
|
icon: IconBook2,
|
|
href: "https://homarr.dev/docs/getting-started/",
|
|
},
|
|
{
|
|
label: t("submitIssue.label"),
|
|
icon: IconBrandGithub,
|
|
href: "https://github.com/ajnart/homarr/issues/new/choose",
|
|
},
|
|
{
|
|
label: t("discord.label"),
|
|
icon: IconBrandDiscord,
|
|
href: "https://discord.com/invite/aCsmEV5RgA",
|
|
},
|
|
];
|
|
},
|
|
component: (props) => (
|
|
<Group px="md" py="xs" w="100%" wrap="nowrap" align="center">
|
|
<props.icon />
|
|
<Text>{props.label}</Text>
|
|
</Group>
|
|
),
|
|
filter: () => true,
|
|
useInteraction: interaction.link(({ href }) => ({ href })),
|
|
}),
|
|
],
|
|
} satisfies SearchMode;
|
|
|
|
export const searchModes = [...searchModesWithoutHelp, helpMode] as const;
|