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": { "dependencies": {
"@emotion/react": "^11.11.3", "@emotion/react": "^11.11.3",
"@emotion/styled": "^11.11.0", "@emotion/styled": "^11.11.0",
"@mui/icons-material": "^5.15.4",
"@mui/material": "^5.15.3", "@mui/material": "^5.15.3",
"@mui/system": "^5.15.3", "@mui/system": "^5.15.3",
"@mui/x-date-pickers": "^6.18.7", "@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 { useNavigate, useParams } from "react-router-dom";
import { Event, EventTypes, createEvent } from '../types/Event'; import { Event, EventTypes, createEvent } from '../types/Event';
import Grid from '@mui/material/Unstable_Grid2' 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 AvailabilityPicker from "../components/AvailabilityPicker";
import dayjs, { Dayjs } from "dayjs"; import dayjs, { Dayjs } from "dayjs";
import utils from "../utils"; import utils from "../utils";
@ -12,6 +12,7 @@ import localizedFormat from 'dayjs/plugin/localizedFormat';
import duration from 'dayjs/plugin/duration'; import duration from 'dayjs/plugin/duration';
import { AvailabilityDay, UserAvailabilityHeatmap } from "../types/Availabilities"; import { AvailabilityDay, UserAvailabilityHeatmap } from "../types/Availabilities";
import toast from "react-hot-toast"; import toast from "react-hot-toast";
import { ContentCopy as CopyToClipboardIcon } from '@mui/icons-material'
dayjs.extend(utc) dayjs.extend(utc)
dayjs.extend(timezone) dayjs.extend(timezone)
@ -183,7 +184,20 @@ export default function ExistingEventPage() {
<Typography>You've been invited to...</Typography> <Typography>You've been invited to...</Typography>
</Grid> </Grid>
<Grid xs={12}> <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> </Grid>
{ {
(event.description !== null) && (event.description !== null) &&

View file

@ -186,7 +186,7 @@
dependencies: dependencies:
regenerator-runtime "^0.14.0" regenerator-runtime "^0.14.0"
"@babel/runtime@^7.23.2": "@babel/runtime@^7.23.2", "@babel/runtime@^7.23.7":
version "7.23.8" version "7.23.8"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.8.tgz#8ee6fe1ac47add7122902f257b8ddf55c898f650" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.8.tgz#8ee6fe1ac47add7122902f257b8ddf55c898f650"
integrity sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw== 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" resolved "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.15.3.tgz"
integrity sha512-sWeihiVyxdJjpLkp8SHkTy9kt2M/o11M60G1MzwljGL2BXdM3Ktzqv5QaQHdi00y7Y1ulvtI3GOSxP2xU8mQJw== 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": "@mui/material@^5.15.3":
version "5.15.3" version "5.15.3"
resolved "https://registry.npmjs.org/@mui/material/-/material-5.15.3.tgz" resolved "https://registry.npmjs.org/@mui/material/-/material-5.15.3.tgz"