From cc0cc154b9506d1961d08cb29fbc29ad815bad69 Mon Sep 17 00:00:00 2001 From: crupest Date: Mon, 24 Aug 2020 22:59:45 +0800 Subject: ... --- Timeline/ClientApp/src/app/common/SearchInput.tsx | 126 +++++++++++----------- 1 file changed, 63 insertions(+), 63 deletions(-) (limited to 'Timeline/ClientApp/src/app/common/SearchInput.tsx') diff --git a/Timeline/ClientApp/src/app/common/SearchInput.tsx b/Timeline/ClientApp/src/app/common/SearchInput.tsx index 46fb00d1..5a0b0eaa 100644 --- a/Timeline/ClientApp/src/app/common/SearchInput.tsx +++ b/Timeline/ClientApp/src/app/common/SearchInput.tsx @@ -1,63 +1,63 @@ -import React, { useCallback } from 'react'; -import clsx from 'clsx'; -import { Spinner, Input, Button } from 'reactstrap'; -import { useTranslation } from 'react-i18next'; - -export interface SearchInputProps { - value: string; - onChange: (value: string) => void; - onButtonClick: () => void; - className?: string; - loading?: boolean; - buttonText?: string; - placeholder?: string; - additionalButton?: React.ReactNode; -} - -const SearchInput: React.FC = (props) => { - const { onChange, onButtonClick } = props; - - const { t } = useTranslation(); - - const onInputChange = useCallback( - (event: React.ChangeEvent): void => { - onChange(event.currentTarget.value); - }, - [onChange] - ); - - const onInputKeyPress = useCallback( - (event: React.KeyboardEvent): void => { - if (event.key === 'Enter') { - onButtonClick(); - } - }, - [onButtonClick] - ); - - return ( -
- -
- {props.additionalButton} -
-
- {props.loading ? ( - - ) : ( - - )} -
-
- ); -}; - -export default SearchInput; +import React, { useCallback } from "react"; +import clsx from "clsx"; +import { Spinner, Input, Button } from "reactstrap"; +import { useTranslation } from "react-i18next"; + +export interface SearchInputProps { + value: string; + onChange: (value: string) => void; + onButtonClick: () => void; + className?: string; + loading?: boolean; + buttonText?: string; + placeholder?: string; + additionalButton?: React.ReactNode; +} + +const SearchInput: React.FC = (props) => { + const { onChange, onButtonClick } = props; + + const { t } = useTranslation(); + + const onInputChange = useCallback( + (event: React.ChangeEvent): void => { + onChange(event.currentTarget.value); + }, + [onChange] + ); + + const onInputKeyPress = useCallback( + (event: React.KeyboardEvent): void => { + if (event.key === "Enter") { + onButtonClick(); + } + }, + [onButtonClick] + ); + + return ( +
+ +
+ {props.additionalButton} +
+
+ {props.loading ? ( + + ) : ( + + )} +
+
+ ); +}; + +export default SearchInput; -- cgit v1.2.3