Nero_077

align-items по умолчанию stretch. Тебе необходимо указать align-items: center родителю или align-self: center квадрату.

И спеку почитать.

Сначала через хук useState создать состояние и функцию которая его меняет
потом прописать состояние и слушатель onChange в инпуте, потом в онклике брать значение
образно:
[city,setCity] = useState('город по умолчанию') (хуки обязаны быть на самом высоком уровне функции вроде как)
потом в инпуте
< input value={city} onChange={(e)=>setCity(e.target.value)} />
ну и в онклик просто fetch($`....{city}...`)