import { useState } from 'react';
import { toast } from 'react-toastify';

import {
  getMiniAppDetail,
  getUserGrantedPermission,
  getUserProfile,
} from '../../factory/api';
import { MiniAppErrorType } from '../../model/miniAppError';
import msgHandler from '../../utils/iframe/messageHandler';
import { RequestPermissionProps } from '../../views/RequestPermission/requestPermission';

const ns: any = {
  wn: ['mini_app_notification_center'],
  paypay_information: [
    'mini_app_payment_balance',
    'direct_debit',
    'mini_app_user_phone_number',
    'mini_app_user_email_address',
  ],
  profile_info: [
    'mini_app_user_name',
    'mini_app_user_nickname',
    'mini_app_user_avatar',
  ],
  device_info: [
    'mini_app_user_location',
    'mini_app_user_phone_camera',
    'mini_app_user_phone_album',
    'mini_app_user_contacts',
    'mini_app_device_battery',
    'mini_app_user_sms',
  ],
};

function usePermission() {
  const [photoParams, setPhotoParams] = useState({
    successCB: '',
    completeCB: '',
    failCB: '',
    sourceType: 'ALBUM',
    originId: '',
  });
  const [requestPermissionProps, setRequestPermissionProps] = useState<
    RequestPermissionProps
  >({
    visible: false,
    toggleVisible: (v) => {
      setRequestPermissionProps({
        ...requestPermissionProps,
        visible: v,
      });
    },
    permissionInfo: {},
    successCB: () => {},
    failCB: () => {},
    profileInfo: {},
  });

  const requestPermission = async (data: any) => {
    try {
      const res: any = await Promise.all([
        getUserGrantedPermission(),
        getMiniAppDetail(),
        getUserProfile(),
      ]);
      const grantedList = res[0].data.unsigned.data.scopes;
      const permissionList = res[1].data.unsigned.data.permissions;
      const result: any = Object.keys(ns).reduce((res, key) => {
        const permission = ns[key]
          .filter((k: any) => {
            return permissionList.find((item: any) => {
              return item.name === k;
            });
          })
          .map((key: any) => {
            const theItem = permissionList.find((item: any) => {
              return item.name === key;
            });
            const isGranted = grantedList.find((name: string) => {
              return name === theItem.name;
            });
            theItem.checked = isGranted ? true : false;
            return theItem;
          });
        return {
          ...res,
          ...{
            [key]: permission,
          },
        };
      }, {});
      setRequestPermissionProps({
        ...requestPermissionProps,
        ...{
          visible: true,
          permissionInfo: result,
          successCB: (res: any) =>
            msgHandler(data.originId, data.successCB, {
              granted_permissions: res,
            }),
          failCB: () => {
            msgHandler(data.originId, data.failCB, {
              errorCode: MiniAppErrorType.userCanceled,
            });
          },
          profileInfo: res[2].data.unsigned.data,
        },
      });
    } catch (error) {
      toast.error('get user granted permission failed');
    }
  };

  const takePhoto = (params: any) => {
    setPhotoParams({
      ...params,
    });
  };

  return {
    photoParams,
    takePhoto,
    requestPermission,
    requestPermissionProps,
  };
}

export default usePermission;