import { useBrowser } from '@arcblock/react-hooks';
import { detectWalletExtension } from '@arcblock/ux/lib/Util';
import { useCreation, useRequest } from 'ahooks';
import intersection from 'lodash/intersection';
import { OAUTH_PROVIDER } from '@arcblock/ux/lib/Util/constant';

import { useOAuth } from '../../OAuth';
import { checkSameProtocol, getWebWalletUrl } from '../../utils';

export default function useMethodList({
  enabledConnectTypes = [],
  allowWallet = true,
  passkeyBehavior = 'none',
  webWalletUrl = getWebWalletUrl(),
  action,
  sourceAppPid,
  mode = 'dialog',
  blocklet = globalThis.blocklet,
  isSmallView = false,
}) {
  const actionList = ['login', 'invite', 'connect-to-did-space', 'connect-to-did-domain', 'destroy-self'];
  const { getOAuthConfigList } = useOAuth();
  const browser = useBrowser();
  const extension = detectWalletExtension();
  const { data: oauthConfigList = [] } = useRequest(
    async () => {
      const data = await getOAuthConfigList({ sourceAppPid });
      return data;
    },
    { refreshDeps: [sourceAppPid] }
  );

  const oauthProviderList = useCreation(() => {
    // return [];
    const showProviders = intersection(Object.keys(OAUTH_PROVIDER), enabledConnectTypes);
    const result = oauthConfigList.filter((item) => showProviders.includes(item.provider));
    return result;
  }, [oauthConfigList, enabledConnectTypes]);

  const showOAuthLogin = useCreation(() => {
    if (!actionList.includes(action)) {
      return false;
    }
    return oauthProviderList.length > 0;
  }, [oauthProviderList, action]);

  const showMobileLogin = useCreation(() => {
    let _allowWallet = allowWallet;
    if (!actionList.includes(action)) {
      _allowWallet = true;
    }
    return _allowWallet && enabledConnectTypes.includes('mobile');
  }, [allowWallet, enabledConnectTypes, action]);

  const isSameProtocol = checkSameProtocol(webWalletUrl);
  const showWebLogin = useCreation(() => {
    let _allowWallet = allowWallet;
    if (!actionList.includes(action)) {
      _allowWallet = true;
    }
    return (
      _allowWallet &&
      enabledConnectTypes.includes('web') &&
      (isSameProtocol || extension) &&
      (!browser.mobile.any || extension)
    );
  }, [allowWallet, enabledConnectTypes, browser?.mobile?.any, action]);

  const showPasskeyLogin = useCreation(() => {
    // NOTICE: 允许所有 action 都展示 passkey
    // if (!actionList.includes(action)) {
    //   return false;
    // }
    return passkeyBehavior !== 'none' && !browser.wallet && !browser.arcSphere;
  }, [action]);

  const showEmailLogin = useCreation(() => {
    if (!actionList.includes(action)) {
      return false;
    }
    // FIXME: @zhanghan 这里是临时用于控制是否展示邮箱登录，待确认没问题后，需要移除
    if (!['true', undefined, null].includes(blocklet?.DID_CONNECT_ALLOW_EMAIL)) {
      return false;
    }
    return blocklet?.settings?.notification?.email?.enabled ?? false;
  }, [action, blocklet]);

  const hideChooseList = useCreation(() => {
    return false;
    // NOTICE: 先保留这部分逻辑，后续根据需求调整
    // if (showOAuthLogin || showPasskeyLogin) {
    //   return false;
    // }
    // return true;
  });

  const hideQRCode = useCreation(() => {
    if (mode === 'drawer' || (isSmallView && browser.mobile.any)) {
      return true;
    }
    if (actionList.includes(action) && !showMobileLogin) {
      return true;
    }
    return false;
  }, [mode, isSmallView]);

  const result = {
    hideQRCode,
    hideChooseList,

    showOAuthLogin,
    showMobileLogin,
    showWebLogin,
    showPasskeyLogin,
    showEmailLogin,

    oauthProviderList,
  };

  return result;
}
