'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';


export const LocationContext = createContext<LocationContextType>({
  geoLocation: defaultGeoLocation,
  setGeoLocation: () => {} // Default function, does nothing
});

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 className='flex'>
      <div className='mx-auto'>
        <LocationContext.Provider value={contextValue}>
          <LocationSearch />
          <WeatherNow />
        </LocationContext.Provider>
      </div>
    </main>
  );
}