'use client';

import { createContext, useContext, ReactNode } from 'react';
import { useRouter } from 'next/navigation';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faPatreon } from '@fortawesome/free-brands-svg-icons';
import { useLocalStorageValue } from '@react-hookz/web';
import { faRightFromBracket } from '@fortawesome/free-solid-svg-icons';
import Skeleton from 'react-loading-skeleton';
import { strapiUrl } from '@/app/lib/constants';
import NextAuth from 'next-auth';
import Providers from 'next-auth/providers';

// export interface IJWT {
//   jwt: string;
//   user: IUser;
// }

// export interface IUser {
//   id: number;
//   username: string;
//   email: string;
//   provider: string;
//   confirmed: boolean;
//   blocked: boolean;
//   createdAt: string;
//   updatedAt: string;
//   isNamePublic: boolean;
//   avatar: string | null;
//   isLinkPublic: boolean;
//   vanityLink: string | null;
//   patreonBenefits: string;
// }

// export interface IAuthData {
//   accessToken: string | null;
//   user: IUser | null;
// }

// export interface IUseAuth {
//   authData: IAuthData | null | undefined;
//   setAuthData: (data: IAuthData | null) => void;
//   lastVisitedPath: string | undefined;
//   login: () => void;
//   logout: () => void;
// }

// export const AuthContext = createContext<IUseAuth | null>(null);

// interface IAuthContextProps {
//   children: ReactNode;
// }
// export function AuthProvider({ children }: IAuthContextProps): React.JSX.Element {
//   const { value: authData, set: setAuthData } = useLocalStorageValue<IAuthData | null>('authData', {
//     defaultValue: null,
//   });

//   const { value: lastVisitedPath, set: setLastVisitedPath } = useLocalStorageValue<string>('lastVisitedPath', {
//     defaultValue: '/profile',
//     initializeWithValue: false,
//   });
//   const router = useRouter();

//   const login = async () => {
//     const currentPath = window.location.pathname;
//     setLastVisitedPath(currentPath);
//     router.push(`${strapiUrl}/api/connect/patreon`);
//   };

//   const logout = () => {
//     setAuthData({ accessToken: null, user: null });
//   };

//   return (
//     <AuthContext.Provider
//       value={{
//         authData,
//         setAuthData,
//         lastVisitedPath,
//         login,
//         logout,
//       }}
//     >
//       {children}
//     </AuthContext.Provider>
//   );
// }



// export function LogoutButton() {
//   const context = useContext(AuthContext);
//   if (!context) return <></>;
//   const { logout } = context;
//   return (
//     <button
//       className="button is-secondary has-icons-left"
//       onClick={() => {
//         logout();
//       }}
//     >
//       <span className="icon is-small">
//         <FontAwesomeIcon icon={faRightFromBracket} className="fas fa-right-from-bracket" />
//       </span>
//       <span>Logout</span>
//     </button>
//   );
// }

export function useAuth(): IUseAuth {
  const context = useContext(AuthContext);
  if (!context) {
    throw new Error('useAuth must be used within an AuthProvider');
  }
  return context;
}