import { useRouter } from 'next/router';
import { createContext, useContext, useEffect, useState } from 'react';
import { bigCommerceSDK } from '../scripts/bcSdk';
import { GetData, PostData } from '@lib/fetch';

const SessionContext = createContext({ context: '', channels: [], channelLoader: false, userPlan: {} as any });

const SessionProvider = ({ children }) => {
	const { query } = useRouter(),
		[context, setContext] = useState(''),
		[channelLoader, setChannelLoader] = useState(true),
		[userPlan, setUserPlan]	= useState<any>({}),
		[channels, setChannels] = useState([]);

	useEffect(() => {
		if (query.context) {
			//setContext("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjb250ZXh0IjoieHA5ZmNxMGtvdSIsInVzZXIiOnsiaWQiOjIyMDk2MzgsImVtYWlsIjoiZGV2ZWxvcGVyc0Byb3VuZHZpZXcuaW8iLCJsb2NhbGUiOiJlbiJ9LCJvd25lciI6eyJpZCI6MjIwOTYzOCwiZW1haWwiOiJkZXZlbG9wZXJzQHJvdW5kdmlldy5pbyJ9LCJpYXQiOjE3NDA1NTg0NTAsImV4cCI6MTc0MDY0NDg1MH0.iflESIwo75687tgKJSF_7A5X09jn28StxS1A_bia0iY")
			setContext(query.context.toString());
			// Keeps app in sync with BC (e.g. heatbeat, user logout, etc)
			bigCommerceSDK(query.context);
			//bigCommerceSDK("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjb250ZXh0IjoieHA5ZmNxMGtvdSIsInVzZXIiOnsiaWQiOjIyMDk2MzgsImVtYWlsIjoiZGV2ZWxvcGVyc0Byb3VuZHZpZXcuaW8iLCJsb2NhbGUiOiJlbiJ9LCJvd25lciI6eyJpZCI6MjIwOTYzOCwiZW1haWwiOiJkZXZlbG9wZXJzQHJvdW5kdmlldy5pbyJ9LCJpYXQiOjE3NDA1NTg0NTAsImV4cCI6MTc0MDY0NDg1MH0.iflESIwo75687tgKJSF_7A5X09jn28StxS1A_bia0iY")            
			fetchChannels(query.context.toString());
		}
		//fetchChannels("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjb250ZXh0IjoieHA5ZmNxMGtvdSIsInVzZXIiOnsiaWQiOjIyMDk2MzgsImVtYWlsIjoiZGV2ZWxvcGVyc0Byb3VuZHZpZXcuaW8iLCJsb2NhbGUiOiJlbiJ9LCJvd25lciI6eyJpZCI6MjIwOTYzOCwiZW1haWwiOiJkZXZlbG9wZXJzQHJvdW5kdmlldy5pbyJ9LCJpYXQiOjE3NDQxMDAzNjMsImV4cCI6MTc0NDE4Njc2M30.Jy0KsUlBkAliw14cU7zaK4i1utzd4HaNV61ZJPOZ8Fs")
	}, [query.context]);

	const fetchChannels = async (context: string) => {
		try {
			const { response, status }: any = await GetData(`/api/channels?context=${context}`);
			if (status === 200) {
				if (response.status === "success") {
					setChannels(response.data.channels)
					setChannelLoader(false)
					setUserPlan(response.data.userWebsitePlan)
				}
			}
			// const response = await fetch(`/api/channels?context=${context}`);
			// const data = await response.json();
			// setChannels(data);
			// setChannelLoader(false)
		} catch (error) {
			console.error('Failed to fetch channels', error);
		}
	};

	return (
		<SessionContext.Provider value={{ context, channels, channelLoader, userPlan }}>
			{children}
		</SessionContext.Provider>
	);
};

export const useSession = () => useContext(SessionContext);

export default SessionProvider;