feat: bulk privacy pages

This commit is contained in:
spiral 2022-05-09 17:15:00 -04:00
parent 2662e5ab94
commit 214be4a0ee
No known key found for this signature in database
GPG Key ID: 244A11E4B0BCF40E
5 changed files with 154 additions and 1 deletions

View File

@ -14,6 +14,8 @@
import { Alert } from 'sveltestrap';
import DiscordLogin from "./pages/DiscordLogin.svelte";
import { onMount } from 'svelte';
import BulkGroupPrivacy from "./pages/BulkGroupPrivacy.svelte";
import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
// theme cdns (I might make some myself too)
let light = "https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css";
@ -67,6 +69,8 @@ import DiscordLogin from "./pages/DiscordLogin.svelte";
<Route path="dash"><Dash /></Route>
<Route path="dash/m/:id"><Member isPublic={falseBool}/></Route>
<Route path = "dash/g/:id"><Group isPublic={falseBool}/></Route>
<Route path="dash/bulk-member-privacy"><BulkMemberPrivacy/></Route>
<Route path="dash/bulk-group-privacy"><BulkGroupPrivacy/></Route>
<Route path="settings"><Settings /></Route>
<Route path="profile"><Public /></Route>
<Route path = "profile/s/:id"><Main /></Route>

View File

@ -31,7 +31,7 @@ export interface Config {
description_templates: string[];
}
interface MemberPrivacy {
export interface MemberPrivacy {
visibility?: string,
description_privacy?: string,
name_privacy?: string,

View File

@ -42,6 +42,8 @@
</Col>
</Row>
<Button style="flex: 0" color="primary" on:click={() => editMode = true}>Edit</Button>
<Button style="flex: 0" color="secondary" on:click={() => window.location.href = window.location.origin+"/dash/bulk-member-privacy"}>Bulk member privacy</Button>
<Button style="flex: 0" color="secondary" on:click={() => window.location.href = window.location.origin+"/dash/bulk-group-privacy"}>Bulk group privacy</Button>
{/if}
</CardBody>
</Card>

View File

@ -0,0 +1,73 @@
<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 { GroupPrivacy, 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 GroupPrivacy]-?: boolean; } = {
name_privacy: false,
description_privacy: false,
icon_privacy: false,
list_privacy: false,
metadata_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.group.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 group 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">&nbsp;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>

View File

@ -0,0 +1,74 @@
<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">&nbsp;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>