74 lines
2.4 KiB
Svelte
74 lines
2.4 KiB
Svelte
|
<script lang="ts">
|
||
|
|
import { Container, Row, Col, Card, CardHeader, CardBody, CardTitle, FormCheck, Button, Spinner } from 'sveltestrap';
|
||
|
|
import FaUserLock from 'svelte-icons/fa/FaUserLock.svelte';
|
||
|
|
|
||
|
|
import api from '../api';
|
||
|
|
import { MemberPrivacy, System } from '../api/types';
|
||
|
|
const user: System = JSON.parse(localStorage.getItem("pk-user"));
|
||
|
|
|
||
|
|
const capitalize = (str: string) => str[0].toUpperCase() + str.substr(1);
|
||
|
|
|
||
|
|
let loading = false;
|
||
|
|
|
||
|
|
// kinda hacked together from typescript's Required<T> type
|
||
|
|
const privacy: { [P in keyof MemberPrivacy]-?: boolean; } = {
|
||
|
|
avatar_privacy: false,
|
||
|
|
birthday_privacy: false,
|
||
|
|
description_privacy: false,
|
||
|
|
metadata_privacy: false,
|
||
|
|
name_privacy: false,
|
||
|
|
pronoun_privacy: false,
|
||
|
|
visibility: false,
|
||
|
|
};
|
||
|
|
let setPrivate = true;
|
||
|
|
|
||
|
|
async function submit() {
|
||
|
|
loading = true;
|
||
|
|
const data = {};
|
||
|
|
Object.keys(privacy).filter(x => privacy[x]).forEach(key => data[key] = setPrivate ? "private" : "public");
|
||
|
|
await api().private.bulk_privacy.member.post({ data });
|
||
|
|
loading = false;
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<Container>
|
||
|
|
<Row>
|
||
|
|
<Col class="mx-auto" xs={12} lg={11} xl={10}>
|
||
|
|
<Card class="mb-4">
|
||
|
|
<CardHeader>
|
||
|
|
<CardTitle style="margin-top: 8px; outline: none;">
|
||
|
|
<div class="icon d-inline-block">
|
||
|
|
<FaUserLock />
|
||
|
|
</div> Bulk member privacy
|
||
|
|
</CardTitle>
|
||
|
|
</CardHeader>
|
||
|
|
<CardBody style="border-left: 4px solid #{user.color}">
|
||
|
|
<b>Apply the selected privacy options</b> (<i>and leave the unselected options untouched</i>):
|
||
|
|
<br><br>
|
||
|
|
|
||
|
|
{#each Object.keys(privacy) as key}
|
||
|
|
<FormCheck bind:checked={privacy[key]} label={capitalize(key.split("_")[0])}/>
|
||
|
|
{/each}
|
||
|
|
|
||
|
|
<br>
|
||
|
|
<Button on:click={() => Object.keys(privacy).forEach(x => privacy[x] = true)}>Select all</Button>
|
||
|
|
<Button on:click={() => Object.keys(privacy).forEach(x => privacy[x] = false)}>Select none</Button>
|
||
|
|
<br><br>
|
||
|
|
|
||
|
|
<input type="checkbox" bind:checked={setPrivate} class="form-check-input" id="privacy">
|
||
|
|
<label for="privacy"> Check this box to set all selected privacy settings as <b>private</b>.
|
||
|
|
Uncheck to set to <b>public</b>.</label>
|
||
|
|
<br><br>
|
||
|
|
|
||
|
|
<Button color="primary" on:click={submit} bind:disabled={loading}>
|
||
|
|
{#if loading}
|
||
|
|
<Spinner />
|
||
|
|
{:else}
|
||
|
|
Submit
|
||
|
|
{/if}
|
||
|
|
</Button>
|
||
|
|
</CardBody>
|
||
|
|
</Card>
|
||
|
|
</Col>
|
||
|
|
</Row>
|
||
|
|
</Container>
|