import PropTypes from 'prop-types';
import React, { useMemo, useCallback } from 'react';
import { Stack, Tooltip } from '@mui/material';
import { OAUTH_SCOPES } from '@abtnode/constant';
import { joinURL } from 'ufo';
import { useNodeContext } from '../../contexts/node';
import { useBlockletContext } from '../../contexts/blocklet';
import ClickToCopy from '../../click-to-copy';
import { jsx as _jsx } from "react/jsx-runtime";
export function ScopeChips({
  scope = '',
  ...props
}) {
  if (!scope) return null;
  const scopes = scope.split(' ').filter(Boolean);
  return /*#__PURE__*/_jsx(Stack, {
    direction: "row",
    ...props,
    sx: [{
      flexWrap: 'wrap',
      gap: 1
    },
    // eslint-disable-next-line react/prop-types
    ...(Array.isArray(props.sx) ? props.sx : [props.sx])],
    children: scopes.map(item => /*#__PURE__*/_jsx(React.Fragment, {
      children: /*#__PURE__*/_jsx(Tooltip, {
        title: OAUTH_SCOPES[item],
        children: /*#__PURE__*/_jsx(ClickToCopy, {
          children: item
        })
      })
    }, item))
  });
}
ScopeChips.propTypes = {
  scope: PropTypes.string
};
export const useClientLogo = logoUri => {
  const {
    prefix
  } = useNodeContext();
  const {
    blocklet
  } = useBlockletContext();
  const apiPath = joinURL(prefix, '/api/media/upload', blocklet.appPid);
  const getClientLogoUrl = useCallback(uri => {
    if (!uri) return '';
    if (uri.startsWith('http')) {
      return uri;
    }
    return `${joinURL(prefix, '/api/media/upload', blocklet.appPid)}/${uri}`;
  }, [prefix, blocklet.appPid]);
  const clientLogoUrl = useMemo(() => getClientLogoUrl(logoUri), [logoUri, getClientLogoUrl]);
  return {
    clientLogoUrl,
    apiPath,
    getClientLogoUrl
  };
};