import { createContext, JSX } from 'solid-js';
import { createStore } from "solid-js/store";

import { Stop } from './types';

export interface AppContextStore {
    getDisplayedStops: () => Stop[];
    setDisplayedStops: (stops: Stop[]) => void;
}

export const AppContextContext = createContext<AppContextStore>();

export function AppContextProvider(props: { children: JSX.Element }) {

    type Store = {
        displayedStops: Stop[];
    };

    const [store, setStore] = createStore<Store>({
        displayedStops: [],
    });

    const getDisplayedStops = (): Stop[] => {
        return store.displayedStops;
    }

    const setDisplayedStops = (stops: Stop[]): void => {
        console.log("setDisplayedStops=", stops);
        setStore('displayedStops', stops);
    }

    return (
        <AppContextContext.Provider value={{
            getDisplayedStops, setDisplayedStops,
        }}>
            {props.children}
        </AppContextContext.Provider>
    );
}
