'use client'
import LocationSearch from '@/components/LocationSearch';
import WeatherNow from '../components/WeatherNow'
import { createContext, useState } from 'react';
import { defaultGeoLocation } from './defaultState';
import { LocationContextType, coordType } from '@/types/types';
import { LocationContext } from '@/context/LocationContext';

export default function Home() {
  const [geoLocation, setGeoLocation] = useState<coordType>(defaultGeoLocation);

  // Create an object that will be passed to the context provider
  const contextValue: LocationContextType = {
    geoLocation,
    setGeoLocation
  };

  return (
    <main>
      <div className='mx-auto max-w-xs sm:max-w-md md:max-w-3xl text-center'>
        <LocationContext.Provider value={contextValue}>
          <LocationSearch />
          <WeatherNow />
        </LocationContext.Provider>
      </div>
    </main>
  );
}