mirror of
https://github.com/mvvasilev/findtheti.me.git
synced 2025-04-19 13:39:52 +03:00
Add copy to clipboard button for invite url
This commit is contained in:
parent
ee6b586477
commit
4abf196738
3 changed files with 25 additions and 3 deletions
|
@ -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",
|
||||
|
|
|
@ -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) &&
|
||||
|
|
|
@ -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"
|
||||
|
|
Loading…
Add table
Reference in a new issue