Add copy to clipboard button for invite url

This commit is contained in:
Miroslav Vasilev 2024-01-12 16:05:26 +02:00
parent ee6b586477
commit 4abf196738
3 changed files with 25 additions and 3 deletions

View file

@ -12,6 +12,7 @@
"dependencies": {
"@emotion/react": "^11.11.3",
"@emotion/styled": "^11.11.0",
"@mui/icons-material": "^5.15.4",
"@mui/material": "^5.15.3",
"@mui/system": "^5.15.3",
"@mui/x-date-pickers": "^6.18.7",

View file

@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
import { useNavigate, useParams } from "react-router-dom";
import { Event, EventTypes, createEvent } from '../types/Event';
import Grid from '@mui/material/Unstable_Grid2'
import { Button, TextField, Typography } from "@mui/material";
import { Button, IconButton, TextField, Tooltip, Typography } from "@mui/material";
import AvailabilityPicker from "../components/AvailabilityPicker";
import dayjs, { Dayjs } from "dayjs";
import utils from "../utils";
@ -12,6 +12,7 @@ import localizedFormat from 'dayjs/plugin/localizedFormat';
import duration from 'dayjs/plugin/duration';
import { AvailabilityDay, UserAvailabilityHeatmap } from "../types/Availabilities";
import toast from "react-hot-toast";
import { ContentCopy as CopyToClipboardIcon } from '@mui/icons-material'
dayjs.extend(utc)
dayjs.extend(timezone)
@ -183,7 +184,20 @@ export default function ExistingEventPage() {
<Typography>You've been invited to...</Typography>
</Grid>
<Grid xs={12}>
<Typography variant="h4" sx={{ wordBreak: "break-word" }} noWrap={false}>{ event.name }</Typography>
<Typography variant="h4" sx={{ wordBreak: "break-word" }} noWrap={false}>
{ event.name }
<Tooltip
title={"Copy invite to clipboard"}
arrow
>
<IconButton onClick={() => {
navigator.clipboard.writeText(window.location.toString());
toast('Copied to clipboard', { icon: <CopyToClipboardIcon/> });
}}>
<CopyToClipboardIcon/>
</IconButton>
</Tooltip>
</Typography>
</Grid>
{
(event.description !== null) &&

View file

@ -186,7 +186,7 @@
dependencies:
regenerator-runtime "^0.14.0"
"@babel/runtime@^7.23.2":
"@babel/runtime@^7.23.2", "@babel/runtime@^7.23.7":
version "7.23.8"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.8.tgz#8ee6fe1ac47add7122902f257b8ddf55c898f650"
integrity sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw==
@ -577,6 +577,13 @@
resolved "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.15.3.tgz"
integrity sha512-sWeihiVyxdJjpLkp8SHkTy9kt2M/o11M60G1MzwljGL2BXdM3Ktzqv5QaQHdi00y7Y1ulvtI3GOSxP2xU8mQJw==
"@mui/icons-material@^5.15.4":
version "5.15.4"
resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-5.15.4.tgz#fb8a5e4be2cd656c5d5b1bbad7618b3fadf8d37b"
integrity sha512-q/Yk7aokN8qGMpR7bwoDpBSeaNe6Bv7vaY9yHYodP37c64TM6ime05ueb/wgksOVszrKkNXC67E/XYbRWOoUFA==
dependencies:
"@babel/runtime" "^7.23.7"
"@mui/material@^5.15.3":
version "5.15.3"
resolved "https://registry.npmjs.org/@mui/material/-/material-5.15.3.tgz"