import { FC, useCallback } from 'react';
import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
import useSWR from 'swr';
import { GithubComponent } from '@gitroom/frontend/components/settings/github.component';
export const GithubOnboarding: FC = () => {
  const fetch = useFetch();
  const load = useCallback(async (path: string) => {
    const { github } = await (await fetch('/settings/github')).json();
    if (!github) {
      return false;
    }
    const emptyOnes = github.find((p: { login: string }) => !p.login);
    const { organizations } = emptyOnes
      ? await (await fetch(`/settings/organizations/${emptyOnes.id}`)).json()
      : {
          organizations: [],
        };
    return {
      github,
      organizations,
    };
  }, []);
  const { isLoading: isLoadingSettings, data: loadAll } = useSWR(
    'load-all',
    load
  );
  if (!loadAll) {
    return null;
  }
  return (
    <GithubComponent
      github={loadAll.github}
      organizations={loadAll.organizations}
    />
  );
};