Admin "new" route auth checking
This commit is contained in:
parent
c0c38e7aa7
commit
e2bbc2f1eb
2 changed files with 175 additions and 0 deletions
16
src/routes/admin/new/+page.server.ts
Normal file
16
src/routes/admin/new/+page.server.ts
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
import { apiBaseUrl } from "$lib/components_custom/consts";
|
||||||
|
import { redirect } from "@sveltejs/kit";
|
||||||
|
|
||||||
|
export async function load({ cookies }) {
|
||||||
|
const auth = await (await fetch(apiBaseUrl + "/v3/auth", {
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
'x-api-key': cookies.get("authToken") || ""
|
||||||
|
}
|
||||||
|
})).json();
|
||||||
|
|
||||||
|
/*if (!auth.admin && !auth.moderator) {
|
||||||
|
throw redirect(303, '/401');
|
||||||
|
}*/
|
||||||
|
console.log("WARNING: Admin Auth Check is disabled! DO NOT USE IN PRODUCTION")
|
||||||
|
}
|
159
src/routes/admin/new/+page.svelte
Normal file
159
src/routes/admin/new/+page.svelte
Normal file
|
@ -0,0 +1,159 @@
|
||||||
|
<svelte:options runes={true} />
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { Separator } from '$lib/components/ui/separator';
|
||||||
|
import * as Collapsible from "$lib/components/ui/collapsible";
|
||||||
|
import { Button } from '$lib/components/ui/button';
|
||||||
|
import { CaretDown, CaretRight } from 'radix-icons-svelte';
|
||||||
|
import { Checkbox } from '$lib/components/ui/checkbox';
|
||||||
|
import { Label } from '$lib/components/ui/label';
|
||||||
|
|
||||||
|
// Dummy Data, Replace with API fetch
|
||||||
|
function defaultGroups() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
checked: false,
|
||||||
|
name: "Test Group 1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
checked: false,
|
||||||
|
name: "Test Group 2"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
type Group = {
|
||||||
|
id: number,
|
||||||
|
checked: boolean,
|
||||||
|
name: string
|
||||||
|
}
|
||||||
|
|
||||||
|
type Game = {
|
||||||
|
id: number,
|
||||||
|
checked: boolean,
|
||||||
|
name: string,
|
||||||
|
groups: Array<Group>
|
||||||
|
}
|
||||||
|
|
||||||
|
let games: Array<Game> = $state([
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
checked: false,
|
||||||
|
name: "Test 1",
|
||||||
|
groups: defaultGroups()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
checked: false,
|
||||||
|
name: "Test 2",
|
||||||
|
groups: defaultGroups()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
checked: false,
|
||||||
|
name: "Test 3",
|
||||||
|
groups: defaultGroups()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
checked: false,
|
||||||
|
name: "Test 4",
|
||||||
|
groups: defaultGroups()
|
||||||
|
}
|
||||||
|
])
|
||||||
|
|
||||||
|
$effect(() => {
|
||||||
|
console.log(games)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
function toggleGame(id: number) {
|
||||||
|
games[id].checked = !games[id].checked;
|
||||||
|
games = games;
|
||||||
|
}
|
||||||
|
|
||||||
|
let test = $state([
|
||||||
|
true,
|
||||||
|
false,
|
||||||
|
true
|
||||||
|
])
|
||||||
|
|
||||||
|
let filterWidth = 90
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="h-full grid grid-cols-5">
|
||||||
|
<div class="p-2 flex flex-col items-center border-r-2 border-accent">
|
||||||
|
<h2 class="py-2">Editing Mode</h2>
|
||||||
|
<Separator orientation="horizontal" class="w-[{filterWidth}%]" />
|
||||||
|
<h2 class="py-2">Filters</h2>
|
||||||
|
<Separator orientation="horizontal" class="w-[{filterWidth}%]" />
|
||||||
|
<Collapsible.Root class="w-[{filterWidth}%] space-y-2 py-2">
|
||||||
|
<Collapsible.Trigger asChild let:builder>
|
||||||
|
<Button builders={[builder]} variant="ghost" size="sm" class="w-full p-0 justify-start">
|
||||||
|
{#if builder["data-state"] == "open"}
|
||||||
|
<CaretDown />
|
||||||
|
{:else}
|
||||||
|
<CaretRight />
|
||||||
|
{/if}
|
||||||
|
<h4 class="rounded-md text-sm font-semibold text-left align-middle">
|
||||||
|
Games
|
||||||
|
</h4>
|
||||||
|
</Button>
|
||||||
|
</Collapsible.Trigger>
|
||||||
|
<Collapsible.Content class="space-y-2">
|
||||||
|
{#each games as game}
|
||||||
|
<div class="pl-4 flex items-center space-x-2">
|
||||||
|
<Checkbox id="{game.id.toString()}" checked={game.checked} on:click={() => game.checked = !game.checked} />
|
||||||
|
<Label
|
||||||
|
for="{game.id.toString()}"
|
||||||
|
class=""
|
||||||
|
>
|
||||||
|
{game.name}
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
</Collapsible.Content>
|
||||||
|
</Collapsible.Root>
|
||||||
|
<Separator orientation="horizontal" class="w-[{filterWidth}%]" />
|
||||||
|
<Collapsible.Root class="w-[{filterWidth}%] space-y-2 py-2">
|
||||||
|
<Collapsible.Trigger asChild let:builder>
|
||||||
|
<Button builders={[builder]} variant="ghost" size="sm" class="w-full p-0 justify-start">
|
||||||
|
{#if builder["data-state"] == "open"}
|
||||||
|
<CaretDown />
|
||||||
|
{:else}
|
||||||
|
<CaretRight />
|
||||||
|
{/if}
|
||||||
|
<h4 class="rounded-md text-sm font-semibold text-left align-middle">
|
||||||
|
Groups
|
||||||
|
</h4>
|
||||||
|
</Button>
|
||||||
|
</Collapsible.Trigger>
|
||||||
|
<Collapsible.Content class="space-y-2">
|
||||||
|
{#if games.filter(value => value.checked == true).length == 0}
|
||||||
|
<div class="pl-4 flex flex-col items-center space-x-2 text-muted-foreground">
|
||||||
|
<Label class="text-center" >No Games Selected</Label>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
{#each games as game}
|
||||||
|
{#if game.checked}
|
||||||
|
{#each game.groups as group}
|
||||||
|
<div class="pl-4 flex items-center space-x-2">
|
||||||
|
<Checkbox id="{game.id}-{group.id}" checked={group.checked} on:click={() => {games[game.id].groups[group.id].checked = !group.checked}} />
|
||||||
|
<Label
|
||||||
|
for="{game.id}-{group.id}"
|
||||||
|
class=""
|
||||||
|
>
|
||||||
|
{game.name} {group.name}
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
{/if}
|
||||||
|
{/each}
|
||||||
|
</Collapsible.Content>
|
||||||
|
</Collapsible.Root>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-2 border-r-2 border-accent">B</div>
|
||||||
|
<div class=""></div>
|
||||||
|
</div>
|
Reference in a new issue