import { Chip, Tooltip } from "@mui/material";
import { useSnackbar } from "../hooks/context_providers/SnackbarProvider";

export function CopyTextChip(p: { text: string }): React.ReactElement {
  const snackbar = useSnackbar();

  const copyTextToClipboard = () => {
    navigator.clipboard.writeText(p.text);
    snackbar(`'${p.text}' was copied to clipboard.`);
  };

  return (
    <Tooltip title="Copy to clipboard">
      <Chip
        label={p.text}
        variant="outlined"
        style={{ margin: "5px" }}
        onClick={copyTextToClipboard}
      />
    </Tooltip>
  );
}