import React, { useEffect } from 'react';
import { useMutation } from 'react-query';
import {
  GetAssetListQuery,
  GetAssetPageListQuery,
  AssetInfo,
  CreateAssetQuery,
  AssetCategoryData,
} from '@easytwin/core';

import { AssetApi, AssetCategoryApi } from '@/server';
import { usePageQuery } from '@/hooks';

export const useAssetManage = (type?: GetAssetPageListQuery['type']) => {
  const [pageQuery, setPageQuery] = usePageQuery();

  // list
  const getAssetListReq = useMutation('getAssetList', AssetApi.getPageList);

  React.useEffect(() => {
    getAssetListReq.mutate({
      ...pageQuery,
      type,
    });
  }, [pageQuery, type]);

  // create
  const [createModalVisible, setCreateModalVisible] = React.useState<boolean>(false);
  const createAssetReq = useMutation('create', AssetApi.create, {
    onSuccess() {
      getAssetListReq.mutate({
        ...pageQuery,
        type,
      });
      setCreateModalVisible(false);
    },
  });

  // remove
  const removeAssetReq = useMutation('removeAsset', AssetApi.remove, {
    onSuccess() {
      getAssetListReq.mutate({
        ...pageQuery,
        type,
      });
    },
  });

  return {
    //
    pageQuery,
    setPageQuery,
    createModalVisible,
    setCreateModalVisible,
    //
    getAssetListReq,
    createAssetReq,
    removeAssetReq,
  };
};

export const useAsset = () => {
  const [assetList, setAssetList] = React.useState<AssetInfo[]>([]);

  const getAssetList = React.useCallback(async (query: GetAssetListQuery) => {
    const list = await AssetApi.getList(query);
    setAssetList(list);
  }, []);

  const createAsset = (query: CreateAssetQuery) => AssetApi.create(query);

  return {
    assetList,
    getAssetList,
    createAsset,
  };
};

export const useAssetCategory = () => {
  const [assetCategoryList, setAssetCategoryList] = React.useState<AssetCategoryData[]>([]);

  const getAssetCategoryList = React.useCallback(async () => {
    const list = await AssetCategoryApi.getList();
    setAssetCategoryList(list);
  }, []);

  useEffect(() => {
    getAssetCategoryList();
  }, []);

  const createAssetCategory = (query: CreateAssetQuery) => AssetApi.create(query);

  return {
    assetCategoryList,
    getAssetCategoryList,
    createAssetCategory,
  };
};