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

add group list to member pages

Browse Source
This commit is contained in:
Fulmine 2022-03-19 11:45:47 +01:00
parent a7d017a22b
commit 889dc296cc
1 changed files with 66 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
src/pages/Member.svelte
View File

@ -1,12 +1,17 @@
<script lang="ts">
import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody } from "sveltestrap";
import { Container, Row, Col, Alert, Spinner, Card, CardHeader, CardBody, Accordion, AccordionItem, CardTitle } from "sveltestrap";
import Body from '../lib/member/Body.svelte';
import { useParams } from 'svelte-navigator';
import GroupBody from '../lib/group/Body.svelte';
import { useParams, Link } from 'svelte-navigator';
import { onMount } from 'svelte';
import api from "../api";
import { Member, Group } from "../api/types";
import CardsHeader from "../lib/CardsHeader.svelte";
import FaAddressCard from 'svelte-icons/fa/FaAddressCard.svelte'
import FaUsers from 'svelte-icons/fa/FaUsers.svelte'
import FaLock from 'svelte-icons/fa/FaLock.svelte'
import FaList from 'svelte-icons/fa/FaList.svelte'
import ListPagination from '../lib/ListPagination.svelte';
let loading = true;
let groupLoading = false;
@ -14,12 +19,24 @@
let err = "";
let groupErr = "";
let member: Member;
let groups: Group[];
let systemGroups: Group[];
let groups: Group[] = [];
let systemGroups: Group[] = [];
let isMainDash = false;
let isDeleted = false;
const isPage = true;
export let isPublic = true;
let settings = JSON.parse(localStorage.getItem("pk-settings"));
let currentPage = 1;
let itemsPerPage = 10;
$: indexOfLastItem = currentPage * itemsPerPage;
$: indexOfFirstItem = indexOfLastItem - itemsPerPage;
$: pageAmount = Math.ceil(groups.length / itemsPerPage);
$: slicedGroups = groups.slice(indexOfFirstItem, indexOfLastItem);
onMount(() => {
fetchMember();
});
@ -61,6 +78,11 @@
await new Promise(resolve => setTimeout(resolve, 500));
fetchGroups();
}
function updateDelete() {
isDeleted = true;
}
</script>
{#if settings && settings.appearance.color_background}
@ -72,30 +94,64 @@
<Container>
<Row>
<Col class="mx-auto" xs={12} lg={11} xl={10}>
{#if isDeleted}
<Alert color="success">Member has been successfully deleted. <Link to="/dash">Return to dash</Link></Alert>
{:else}
{#if isPublic}
<Alert color="info">You are currently <b>viewing</b> a member.</Alert>
{/if}
{#if err}
<Alert color="danger">{err}</Alert>
{:else if loading}
<Spinner/>
{:else if member && member.id}
<Card class="mb-3">
<Card class="mb-4">
<CardHeader>
<CardsHeader bind:item={member}>
<FaAddressCard slot="icon" />
</CardsHeader>
</CardHeader>
<CardBody>
<Body 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}/>
</CardBody>
</Card>
{/if}
{#if groupLoading}
fetching groups...
<Alert color="primary"><Spinner size="sm" /> Fetching groups...</Alert>
{:else if groupErr}
<Alert color="danger">{groupErr}</Alert>
{:else if groups && groups.length > 0}
{#each groups as group}
{group.name} ({group.id})<br/>
{/each}
<Card class="mb-2">
<CardHeader>
<CardTitle style="margin-top: 8px; outline: none;">
<div class="icon d-inline-block">
<FaList />
</div> Member groups
</CardTitle>
</CardHeader>
</Card>
<ListPagination bind:currentPage bind:pageAmount />
<Accordion class="mb-3" stayOpen>
{#each slicedGroups as group, index (group.id)}
{#if (!isPublic && group.privacy.visibility === "public") || isPublic}
<AccordionItem>
<CardsHeader bind:item={group} slot="header">
<FaUsers slot="icon" />
</CardsHeader>
<GroupBody isMainDash={isMainDash} bind:group bind:isPublic={isPublic}/>
</AccordionItem>
{:else}
<AccordionItem>
<CardsHeader bind:item={group} slot="header">
<FaLock slot="icon" />
</CardsHeader>
<GroupBody isMainDash={isMainDash} bind:group bind:isPublic={isPublic}/>
</AccordionItem>
{/if}
{/each}
</Accordion>
<ListPagination bind:currentPage bind:pageAmount />
{/if}
{/if}
</Col>
</Row>