c1bf193211
This is unfortunately a huge diff, but now is as good as ever to do this pending chore. - Move to prettier (v3) defaults. The only thing we tweak is the tabWidth (the default is 2, we change it to 4). - Use the prettier plugin to sort imports. We were not changing the defaults of prettier much anyway, the main thing that has changed is the switching from the overridden single quotes to the default double quotes.
44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import ContentCopyIcon from "@mui/icons-material/ContentCopy";
|
|
import DoneIcon from "@mui/icons-material/Done";
|
|
import {
|
|
IconButton,
|
|
IconButtonProps,
|
|
SvgIconProps,
|
|
Tooltip,
|
|
} from "@mui/material";
|
|
import { t } from "i18next";
|
|
import { useState } from "react";
|
|
|
|
export default function CopyButton({
|
|
code,
|
|
color,
|
|
size,
|
|
}: {
|
|
code: string;
|
|
color?: IconButtonProps["color"];
|
|
size?: SvgIconProps["fontSize"];
|
|
}) {
|
|
const [copied, setCopied] = useState<boolean>(false);
|
|
|
|
const copyToClipboardHelper = (text: string) => () => {
|
|
navigator.clipboard.writeText(text);
|
|
setCopied(true);
|
|
setTimeout(() => setCopied(false), 1000);
|
|
};
|
|
return (
|
|
<Tooltip
|
|
arrow
|
|
open={copied}
|
|
title={t("COPIED")}
|
|
PopperProps={{ sx: { zIndex: 2000 } }}
|
|
>
|
|
<IconButton onClick={copyToClipboardHelper(code)} color={color}>
|
|
{copied ? (
|
|
<DoneIcon fontSize={size ?? "small"} />
|
|
) : (
|
|
<ContentCopyIcon fontSize={size ?? "small"} />
|
|
)}
|
|
</IconButton>
|
|
</Tooltip>
|
|
);
|
|
}
|