// App.js

import { useWeatherService } from './useWeatherService';
...

function App({coords}) {
  
  const [ currentUnit, setUnit ] = useState(TEMPERATURE_UNITS.metric); 
  const [ weather, getWeather ] = useWeatherService(); // <- initializing the hook

  useEffect(() => {
    if (coords) {
      const { latitude: lat, longitude: lon } = coords;
      getWeather(lat, lon, currentUnit.sysName);   // <- calling the hook
    }
  }, [coords, currentUnit]);

  ...

  return (
    <div className="App">
      ...
    </div>
  );
}

export default geolocated()(App);




// useWeatherService.js

import { useState } from 'react';

const useWeatherService = () => {
    const [weather, setWeather] = useState();

    const getWeather = async (lat, long, unit) => {
        const weatherReq = await fetch(/* apiUrl */);
      	...
        ...
        setWeather(weather);
    }

    return [ weather, getWeather ];
}

export { useWeatherService }