60 lines
1.8 KiB
TypeScript
60 lines
1.8 KiB
TypeScript
/* -------------------------------------------------------------------------- */
|
|
/* Libraries */
|
|
/* -------------------------------------------------------------------------- */
|
|
import Searchbar from "components/Searchbar/Searchbar";
|
|
import React, { useState } from "react";
|
|
import { Scrollbars } from "react-custom-scrollbars";
|
|
|
|
const hintsValues = [
|
|
{ id: "1", caption: "Wade Cooper" },
|
|
{ id: "2", caption: "Arlene Mccoy" },
|
|
{ id: "3", caption: "Devon Webb" },
|
|
{ id: "4", caption: "Tom Cook" },
|
|
{ id: "5", caption: "Tanya Fox" },
|
|
{ id: "6", caption: "Hellen Schmidt" },
|
|
];
|
|
|
|
const hintsValues2 = [
|
|
{ id: "1", caption: "Wade Cooper2" },
|
|
{ id: "2", caption: "Arlene Mccoy2" },
|
|
{ id: "3", caption: "Devon Webb2" },
|
|
{ id: "4", caption: "Tom Cook2" },
|
|
{ id: "5", caption: "Tanya Fox2" },
|
|
{ id: "6", caption: "Hellen Schmidt2" },
|
|
];
|
|
|
|
/* -------------------------------------------------------------------------- */
|
|
/* Application root component */
|
|
/* -------------------------------------------------------------------------- */
|
|
/**
|
|
* Application root component
|
|
* @return {JSX.Element}
|
|
*/
|
|
function App() {
|
|
return <Page />;
|
|
}
|
|
|
|
function Page() {
|
|
const [hints, setHints] = useState<any[]>([]);
|
|
function delayedMock(hints: any[]): Promise<any> {
|
|
return new Promise((resolve) => setTimeout(() => resolve(hints), 2000));
|
|
}
|
|
|
|
const onChange = async (query: string) => {
|
|
console.log(query);
|
|
if (query === "ok") {
|
|
await delayedMock(hintsValues2).then((v) => setHints(v));
|
|
return;
|
|
}
|
|
console.log("touched");
|
|
await delayedMock([]).then((v) => setHints(v));
|
|
};
|
|
return (
|
|
<>
|
|
<Searchbar hints={hints} onChange={onChange} onSelected={console.log} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default App;
|