diff --git a/web/src/App.js b/web/src/App.js index 9a8459a..300fe78 100644 --- a/web/src/App.js +++ b/web/src/App.js @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useState, useEffect, useRef } from 'react' import styled, { createGlobalStyle } from 'styled-components' import Welcome from './components/Welcome' @@ -23,20 +23,31 @@ import { isStandalone } from './util/pwa' export default function App() { const [query, setQuery] = useDeferredState(1000) - - function onChange(e) { - setQuery(e.target.value) - } + const [inputValue, setInputValue] = useState('') + const inputRef = useRef() const queryGiven = query && query.length > 0 + useEffect(() => { + setQuery(inputValue) + }, [inputValue, setQuery]) + + function onInputChange(e) { + setInputValue(e.target.value) + } + + function onLogoClick(e) { + setInputValue('') + inputRef.current.focus() + } + return ( <>
- namæ - + namæ +
@@ -126,6 +137,7 @@ const Logo = styled.div` font-weight: bold; font-size: 20px; color: #4a90e2; + cursor: pointer; ${mobile} { font-size: 15px;