import { useEffect, useState } from 'react';
import { getCodeFromUrl, useGithubStore } from './store';
import { useShallow } from 'zustand/react/shallow';

export const Callback = () => {
  const [code, setCode] = useState('');
  const githubStore = useGithubStore(
    useShallow((state) => {
      return {
        getToken: state.getToken,
        githubToken: state.githubToken,
      };
    }),
  );
  useEffect(() => {
    setCode(getCodeFromUrl());
    githubStore.getToken();
  }, []);
  return (
    <div className='w-full h-full'>
      <div className='p-4'>
        <h1>Callback</h1>
        <p>code: {code}</p>
        <p>access_token: {githubStore.githubToken}</p>
      </div>
    </div>
  );
};
