* wip: add crud for services and integrations * feat: remove services * feat: move integration definitions to homarr/definitions, add temporary test connection solution without actual request * feat: add integration count badge * feat: add translation for integrations * feat: add notifications and translate them * feat: add notice to integration forms about test connection * chore: fix ci check issues * feat: add confirm modals for integration deletion and secret card cancellation, change ordering for list page, add name property to integrations * refactor: move revalidate path action * chore: fix ci check issues * chore: install missing dependencies * chore: fix ci check issues * chore: address pull request feedback
60 lines
1.5 KiB
TypeScript
60 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { useMemo, useState } from "react";
|
|
import Link from "next/link";
|
|
|
|
import { getIntegrationName, integrationKinds } from "@homarr/definitions";
|
|
import { useI18n } from "@homarr/translation/client";
|
|
import {
|
|
Group,
|
|
IconSearch,
|
|
Menu,
|
|
ScrollArea,
|
|
Stack,
|
|
Text,
|
|
TextInput,
|
|
} from "@homarr/ui";
|
|
|
|
import { IntegrationAvatar } from "../_avatar";
|
|
|
|
export const IntegrationCreateDropdownContent = () => {
|
|
const t = useI18n();
|
|
const [search, setSearch] = useState("");
|
|
|
|
const filteredKinds = useMemo(() => {
|
|
return integrationKinds.filter((kind) =>
|
|
kind.includes(search.toLowerCase()),
|
|
);
|
|
}, [search]);
|
|
|
|
return (
|
|
<Stack>
|
|
<TextInput
|
|
leftSection={<IconSearch stroke={1.5} size={20} />}
|
|
placeholder={t("integration.page.list.search")}
|
|
value={search}
|
|
onChange={(e) => setSearch(e.target.value)}
|
|
/>
|
|
|
|
{filteredKinds.length > 0 ? (
|
|
<ScrollArea.Autosize mah={384}>
|
|
{filteredKinds.map((kind) => (
|
|
<Menu.Item
|
|
component={Link}
|
|
href={`/integrations/new?kind=${kind}`}
|
|
key={kind}
|
|
>
|
|
<Group>
|
|
<IntegrationAvatar kind={kind} size="sm" />
|
|
<Text size="sm">{getIntegrationName(kind)}</Text>
|
|
</Group>
|
|
</Menu.Item>
|
|
))}
|
|
</ScrollArea.Autosize>
|
|
) : (
|
|
<Menu.Item disabled>{t("common.noResults")}</Menu.Item>
|
|
)}
|
|
</Stack>
|
|
);
|
|
};
|