import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
import { Box, Button, ClickAwayListener, Grow, MenuItem, MenuList, Paper, Popper, Typography } from '@mui/material';
import { Icon } from '@iconify/react';
import PropTypes from 'prop-types';
import { useRef, useState } from 'react';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
export default function InstallButton({
  downloadUrl,
  installUrl,
  handleSetTip,
  isPack,
  disabled
}) {
  const {
    t
  } = useLocaleContext();
  const [open, setOpen] = useState(false);
  const anchorRef = useRef(null);
  const handleToggle = () => {
    setOpen(!open);
  };
  const handleClose = event => {
    if (anchorRef.current && anchorRef.current.contains(event.target)) {
      return;
    }
    setOpen(false);
  };
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(Button, {
      disabled: disabled,
      ref: anchorRef,
      onClick: handleToggle,
      children: /*#__PURE__*/_jsx(Box, {
        component: Icon,
        sx: {
          fontSize: 18
        },
        icon: "bxs:download"
      })
    }), /*#__PURE__*/_jsx(Popper, {
      sx: {
        zIndex: 10
      },
      open: open,
      anchorEl: anchorRef.current,
      placement: "bottom-end",
      role: undefined,
      transition: true,
      disablePortal: true,
      children: ({
        TransitionProps
      }) => /*#__PURE__*/_jsx(Grow, {
        ...TransitionProps,
        style: {
          transformOrigin: 'center top'
        },
        children: /*#__PURE__*/_jsx(Paper, {
          children: /*#__PURE__*/_jsx(ClickAwayListener, {
            onClickAway: handleClose,
            children: /*#__PURE__*/_jsxs(MenuList, {
              id: "split-button-menu",
              autoFocusItem: true,
              sx: {
                maxHeight: 300,
                overflowY: 'auto',
                zIndex: 10
              },
              children: [isPack && /*#__PURE__*/_jsx(Box, {
                component: "a",
                href: installUrl,
                target: "_blank",
                rel: "noreferrer",
                sx: {
                  textDecoration: 'none'
                },
                children: /*#__PURE__*/_jsxs(MenuItem, {
                  sx: {
                    color: '#333'
                  },
                  children: [/*#__PURE__*/_jsx(Box, {
                    component: Icon,
                    sx: {
                      mr: 1
                    },
                    icon: "ic:round-install-desktop"
                  }), /*#__PURE__*/_jsx(Typography, {
                    variant: "inherit",
                    children: t('blocklet.publish.installToThisServer')
                  })]
                })
              }), /*#__PURE__*/_jsxs(MenuItem, {
                onClick: handleSetTip,
                children: [/*#__PURE__*/_jsx(Box, {
                  component: Icon,
                  sx: {
                    mr: 1
                  },
                  icon: "iconamoon:copy"
                }), /*#__PURE__*/_jsx(Typography, {
                  variant: "inherit",
                  children: t('blocklet.publish.copyInstallUrl')
                })]
              }), /*#__PURE__*/_jsx(Box, {
                component: "a",
                href: downloadUrl,
                target: "_blank",
                rel: "noreferrer",
                sx: {
                  textDecoration: 'none'
                },
                children: /*#__PURE__*/_jsxs(MenuItem, {
                  sx: {
                    color: '#333'
                  },
                  children: [/*#__PURE__*/_jsx(Box, {
                    component: Icon,
                    sx: {
                      mr: 1
                    },
                    icon: "ph:download"
                  }), /*#__PURE__*/_jsx(Typography, {
                    variant: "inherit",
                    children: t('common.download')
                  })]
                })
              })]
            })
          })
        })
      })
    })]
  });
}
InstallButton.propTypes = {
  disabled: PropTypes.bool.isRequired,
  isPack: PropTypes.bool.isRequired,
  downloadUrl: PropTypes.string.isRequired,
  installUrl: PropTypes.string.isRequired,
  handleSetTip: PropTypes.func.isRequired
};