added copy link button

This commit is contained in:
2026-01-01 02:35:36 -05:00
parent b94504bb69
commit ab247d720d
2 changed files with 33 additions and 19 deletions

View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import type { CalendarEvent, CalendarSignup } from '@shared/types/calendar'
import { CircleAlert, Clock4, EllipsisVertical, MapPin, User, X } from 'lucide-vue-next';
import { CircleAlert, Clock4, EllipsisVertical, Link, MapPin, User, X } from 'lucide-vue-next';
import { computed, ref, watch } from 'vue';
import ButtonGroup from '../ui/button-group/ButtonGroup.vue';
import Button from '../ui/button/Button.vue';
@@ -14,6 +14,7 @@ import DropdownMenuItem from '../ui/dropdown-menu/DropdownMenuItem.vue';
import { Calendar } from 'lucide-vue-next';
import MemberCard from '../members/MemberCard.vue';
import Spinner from '../ui/spinner/Spinner.vue';
import { CopyLink } from '@/lib/copyLink';
const route = useRoute();
@@ -178,17 +179,20 @@ defineExpose({ forceReload })
<template>
<div v-if="loaded">
<!-- Header -->
<div class="flex items-center justify-between gap-3 border-b px-4 py-3 h-14">
<h2 class="text-lg font-semibold break-all">
<div class="flex items-center justify-between gap-3 border-b px-4 py-3 ">
<h2 class="text-lg font-semibold break-after-all">
{{ activeEvent?.name || 'Event' }}
</h2>
<div class="flex gap-4 items-center">
<div class="flex gap-2 items-center">
<DropdownMenu v-if="canEditEvent">
<DropdownMenuTrigger>
<button
<Button variant="ghost" size="icon">
<EllipsisVertical class="size-5" />
</Button>
<!-- <button
class="inline-flex flex-none size-8 items-center justify-center cursor-pointer rounded-md hover:bg-muted/40 transition">
<EllipsisVertical class="size-6" />
</button>
</button> -->
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem @click="emit('edit', activeEvent)">
@@ -202,11 +206,17 @@ defineExpose({ forceReload })
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
<button
class="inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition cursor-pointer"
<Button variant="ghost" size="icon" @click="CopyLink()">
<Link class="size-4" />
</Button>
<Button variant="ghost" size="icon" @click="emit('close')">
<X class="size-5" />
</Button>
<!-- <button
class="inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted transition cursor-pointer"
aria-label="Close" @click="emit('close')">
<X class="size-4" />
</button>
</button> -->
</div>
</div>
<!-- Body -->
@@ -293,11 +303,9 @@ defineExpose({ forceReload })
</div>
</div>
<div v-else class="flex justify-center h-full items-center">
<button
class="absolute top-4 right-4 inline-flex flex-none size-8 items-center justify-center rounded-md border hover:bg-muted/40 transition cursor-pointer z-50"
aria-label="Close" @click="emit('close')">
<X class="size-4" />
</button>
<Button variant="ghost" size="icon" @click="emit('close')">
<X class="size-5" />
</Button>
<Spinner class="size-8"></Spinner>
</div>