46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import { type FC, useState } from "react";
|
|
import { useTranslation } from "@/i18n/provider.js";
|
|
import { SharePanel } from "./SharePanel.js";
|
|
import "./actions.scss";
|
|
|
|
export interface ShareButtonProps {
|
|
url: string;
|
|
locale: string;
|
|
}
|
|
|
|
export const ShareButton: FC<ShareButtonProps> = ({ url, locale }) => {
|
|
const { t } = useTranslation();
|
|
const [open, setOpen] = useState(false);
|
|
|
|
return (
|
|
<div className="share-button-wrap">
|
|
<button
|
|
type="button"
|
|
className="flight-action-btn flight-action-btn--transparent"
|
|
data-testid="share-button"
|
|
title={t("BOARD.SHARE")}
|
|
onClick={() => setOpen((v) => !v)}
|
|
aria-label={t("BOARD.SHARE")}
|
|
>
|
|
<svg
|
|
width="18"
|
|
height="18"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
>
|
|
<circle cx="18" cy="5" r="3" />
|
|
<circle cx="6" cy="12" r="3" />
|
|
<circle cx="18" cy="19" r="3" />
|
|
<line x1="8.59" y1="13.51" x2="15.42" y2="17.49" />
|
|
<line x1="15.41" y1="6.51" x2="8.59" y2="10.49" />
|
|
</svg>
|
|
</button>
|
|
{open && <SharePanel url={url} locale={locale} onClose={() => setOpen(false)} />}
|
|
</div>
|
|
);
|
|
};
|