liz/PluralKit
liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(dashboard): copy short link from pages

Browse Source
This commit is contained in:
Jake/Rads 2022-06-28 08:04:19 +02:00
parent 380b01c364
commit 5df818e367
2 changed files with 41 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
dashboard/src/pages/Group.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody, CardTitle } from "sveltestrap"; import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody, CardTitle, Tooltip } from "sveltestrap";
import Body from '../lib/group/Body.svelte'; import Body from '../lib/group/Body.svelte';
import { useParams, Link, navigate } from 'svelte-navigator'; import { useParams, Link, navigate } from 'svelte-navigator';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
@ -21,6 +21,7 @@
let systemMembers: Group[] = []; let systemMembers: Group[] = [];
let isDeleted = false; let isDeleted = false;
let notOwnSystem = false; let notOwnSystem = false;
let copied = false;
const isPage = true; const isPage = true;
export let isPublic = true; export let isPublic = true;
@ -105,6 +106,21 @@
members = members.filter(member => member.id !== event.detail); members = members.filter(member => member.id !== event.detail);
systemMembers = systemMembers.filter(member => member.id !== event.detail); systemMembers = systemMembers.filter(member => member.id !== event.detail);
} }
async function copyShortLink(event?) {
if (event) {
let ctrlDown = event.ctrlKey||event.metaKey; // mac support
if (!(ctrlDown && event.key === "c") && event.key !== "Enter") return;
}
try {
await navigator.clipboard.writeText(`https://pk.mt/g/${group.id}`);
copied = true;
await new Promise(resolve => setTimeout(resolve, 2000));
copied = false;
} catch (error) {
console.log(error);
}
}
</script> </script>
{#if settings && settings.appearance.color_background && !notOwnSystem} {#if settings && settings.appearance.color_background && !notOwnSystem}
@ -133,8 +149,11 @@
<Card class="mb-4"> <Card class="mb-4">
<CardHeader> <CardHeader>
<CardsHeader bind:item={group}> <CardsHeader bind:item={group}>
<div slot="icon" style="cursor: pointer;" id={`group-copy-${group.id}`} on:click|stopPropagation={() => copyShortLink()} on:keydown={(e) => copyShortLink(e)} tabindex={0} >
<FaUsers slot="icon" /> <FaUsers slot="icon" />
</div>
</CardsHeader> </CardsHeader>
<Tooltip placement="top" target={`group-copy-${group.id}`}>{copied ? "Copied!" : "Copy public link"}</Tooltip>
</CardHeader> </CardHeader>
<CardBody> <CardBody>
<Body on:deletion={updateDelete} on:updateMembers={updateMembers} bind:members={systemMembers} bind:group={group} isPage={isPage} isPublic={isPublic}/> <Body on:deletion={updateDelete} on:updateMembers={updateMembers} bind:members={systemMembers} bind:group={group} isPage={isPage} isPublic={isPublic}/>

20
dashboard/src/pages/Member.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody, Accordion, AccordionItem, CardTitle } from "sveltestrap"; import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody, CardTitle, Tooltip } from "sveltestrap";
import Body from '../lib/member/Body.svelte'; import Body from '../lib/member/Body.svelte';
import CardsList from '../lib/list/CardsList.svelte'; import CardsList from '../lib/list/CardsList.svelte';
import { useParams, Link, navigate } from 'svelte-navigator'; import { useParams, Link, navigate } from 'svelte-navigator';
@ -22,6 +22,7 @@
let systemMembers: Member[] = []; let systemMembers: Member[] = [];
let isDeleted = false; let isDeleted = false;
let notOwnSystem = false; let notOwnSystem = false;
let copied = false;
const isPage = true; const isPage = true;
export let isPublic = true; export let isPublic = true;
@ -107,6 +108,20 @@
systemGroups = systemGroups.filter(group => group.id !== event.detail); systemGroups = systemGroups.filter(group => group.id !== event.detail);
} }
async function copyShortLink(event?) {
if (event) {
let ctrlDown = event.ctrlKey||event.metaKey; // mac support
if (!(ctrlDown && event.key === "c") && event.key !== "Enter") return;
}
try {
await navigator.clipboard.writeText(`https://pk.mt/m/${member.id}`);
copied = true;
await new Promise(resolve => setTimeout(resolve, 2000));
copied = false;
} catch (error) {
console.log(error);
}
}
</script> </script>
{#if settings && settings.appearance.color_background && !notOwnSystem} {#if settings && settings.appearance.color_background && !notOwnSystem}
@ -135,8 +150,11 @@
<Card class="mb-4"> <Card class="mb-4">
<CardHeader> <CardHeader>
<CardsHeader bind:item={member}> <CardsHeader bind:item={member}>
<div slot="icon" style="cursor: pointer;" id={`member-copy-${member.id}`} on:click|stopPropagation={() => copyShortLink()} on:keydown={(e) => copyShortLink(e)} tabindex={0} >
<FaAddressCard slot="icon" /> <FaAddressCard slot="icon" />
</div>
</CardsHeader> </CardsHeader>
<Tooltip placement="top" target={`member-copy-${member.id}`}>{copied ? "Copied!" : "Copy public link"}</Tooltip>
</CardHeader> </CardHeader>
<CardBody> <CardBody>
<Body on:deletion={updateDelete} on:updateGroups={updateGroups} bind:groups={systemGroups} bind:member={member} isPage={isPage} isPublic={isPublic}/> <Body on:deletion={updateDelete} on:updateGroups={updateGroups} bind:groups={systemGroups} bind:member={member} isPage={isPage} isPublic={isPublic}/>