nitro/apps/frontend/src/components/navigator/views/search/NavigatorSearchSavesResultI...

49 lines
1.7 KiB
TypeScript

import {NavigatorDeleteSavedSearchComposer, NavigatorSavedSearch, NavigatorSearchComposer} from "@nitro/renderer";
import {FC, useState} from "react";
import {FaMinus} from "react-icons/fa";
import {LocalizeText, SendMessageComposer} from "../../../../api";
import {Flex, Text} from "../../../../common";
export interface NavigatorSearchSavesResultItemViewProps {
search: NavigatorSavedSearch;
}
export const NavigatorSearchSavesResultItemView: FC<NavigatorSearchSavesResultItemViewProps> = props => {
const {search = null} = props;
const [isHoverText, setIsHoverText] = useState<boolean>(false);
const [currentIndex, setCurrentIndex] = useState<number>(0);
const onHover = (searchId: number) => {
setCurrentIndex(searchId);
setIsHoverText(true);
};
const onLeave = () => {
setCurrentIndex(0);
setIsHoverText(false);
};
return (
<Flex grow pointer alignItems="center" gap={1} onMouseEnter={() => onHover(search.id)} onMouseLeave={() => onLeave()}>
{isHoverText && currentIndex === search.id && (
<FaMinus
color="red"
title={LocalizeText("navigator.tooltip.remove.saved.search")}
onClick={() => SendMessageComposer(new NavigatorDeleteSavedSearchComposer(search.id))}
/>
)}
<Text
pointer
variant="black"
title={LocalizeText("navigator.tooltip.open.saved.search")}
onClick={() => SendMessageComposer(new NavigatorSearchComposer(search.code.split(".").reverse()[0], search.filter))}
>
{search.filter !== ""
? LocalizeText("navigator.searchcode.title.query") + ": " + (!search.filter.split(":")[1] ? search.filter : search.filter.split(":")[1])
: LocalizeText(`${search.code}`)}
</Text>
</Flex>
);
};