Skip to content

Commit 8d3135a

Browse files
mekanixmekanix
committed
Store in props
1 parent 7e32442 commit 8d3135a

29 files changed

+156
-147
lines changed

‎package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@freenit-framework/core",
3-
"version": "0.0.39",
3+
"version": "0.0.42",
44
"private": false,
55
"author": "Goran Mekić <meka@tilda.center>",
66
"license": "BSD-2-Clause",

‎src/lib/Login.svelte‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
<script lang="ts">
22
import { goto } from '$app/navigation'
33
import { error } from '$lib/notification'
4-
import { store } from '$lib'
4+
import BaseStore from '$lib/base-store'
55
6-
let email = ''
7-
let password = ''
6+
let email = $state('')
7+
let password = $state('')
8+
let { store } = $props()
89
910
const submit = async () => {
1011
const response = await store.auth.login(email, password)
@@ -17,9 +18,9 @@
1718
</script>
1819

1920
<div class="root">
20-
<form on:submit|preventDefault={submit} class="form">
21+
<form onsubmit={submit} class="form">
2122
<label for="email">Email</label>
22-
<!-- svelte-ignore a11y-autofocus -->
23+
<!-- svelte-ignore a11y_autofocus -->
2324
<input autofocus required type="email" name="email" bind:value={email} />
2425

2526
<label for="password">Password</label>

‎src/lib/Register.svelte‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
<script lang="ts">
22
import { goto } from '$app/navigation'
33
import { error } from '$lib/notification'
4-
import { store } from '$lib'
54
6-
let email = ''
7-
let password = ''
8-
let repeatpassword = ''
5+
let email = $state('')
6+
let password = $state('')
7+
let repeatpassword = $state('')
8+
let { store } = $props()
99
10-
const submit = async () => {
10+
const submit = async (event: Event) => {
11+
event.preventDefault()
1112
const response = await store.auth.register(email, password)
1213
if (!response.ok) {
1314
error(response.statusText)
@@ -18,9 +19,9 @@
1819
</script>
1920

2021
<div class="root">
21-
<form on:submit|preventDefault={submit} class="form">
22+
<form onsubmit={submit} class="form">
2223
<label for="email">Email</label>
23-
<!-- svelte-ignore a11y-autofocus -->
24+
<!-- svelte-ignore a11y_autofocus -->
2425
<input autofocus required type="email" name="email" bind:value={email} />
2526

2627
<label for="password">Password</label>

‎src/lib/Role.svelte‎

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
<script lang="ts">
22
import { onMount } from 'svelte'
33
import { error } from '$lib/notification'
4-
import { store } from '$lib'
54
import Spinner from './Spinner.svelte'
65
7-
let loading = true
8-
export let pk = 0
6+
let loading = $state(true)
7+
let { pk = 0, store } = $props()
98
109
onMount(async () => {
1110
loading = true
12-
const [roleResponse, userResponse] = await Promise.all([store.role.detail.fetch(pk), store.user.list.fetch()])
11+
const [roleResponse, userResponse] = await Promise.all([store.role.fetch(pk), store.user.fetchAll()])
1312
if (!roleResponse.ok) {
1413
error(roleResponse.statusText)
1514
}
@@ -21,21 +20,24 @@
2120
2221
const member = (user: any) => {
2322
const users = store.role.detail.users || store.role.detail.uniqueMembers
24-
const myusers = users.filter((u: any) => {
25-
if (user.id) {
26-
return u.id === user.id
27-
}
28-
return u === user.dn
29-
})
30-
return myusers.length > 0
23+
if (users) {
24+
const myusers = users.filter((u: any) => {
25+
if (user.id) {
26+
return u.id === user.id
27+
}
28+
return u === user.dn
29+
})
30+
return myusers.length > 0
31+
}
32+
return false
3133
}
3234
3335
const toggleMembership = (user: any) => async (event: any) => {
3436
let response
3537
if (event.target.checked) {
36-
response = await store.role.detail.assign(store.role.detail.id || store.role.detail.dn, user.id || user.dn)
38+
response = await store.role.assign(store.role.detail.id || store.role.detail.dn, user.id || user.dn)
3739
} else {
38-
response = await store.role.detail.deassign(store.role.detail.id || store.role.detail.dn, user.id || user.dn)
40+
response = await store.role.deassign(store.role.detail.id || store.role.detail.dn, user.id || user.dn)
3941
}
4042
if (!response.ok) {
4143
error(response.statusText)
@@ -49,14 +51,14 @@
4951
}
5052
5153
const fetchPrevious = async () => {
52-
const response = await store.user.list.fetch(store.user.list.page - 1)
54+
const response = await store.user.fetchAll(store.user.list.page - 1)
5355
if (!response.ok) {
5456
error(response.statusText)
5557
}
5658
}
5759
5860
const fetchNext = async () => {
59-
const response = await store.user.list.fetch(store.user.list.page + 1)
61+
const response = await store.user.fetchAll(store.user.list.page + 1)
6062
if (!response.ok) {
6163
error(response.statusText)
6264
}
@@ -85,16 +87,16 @@
8587
<input disabled type="checkbox" checked={user.admin} />
8688
</div>
8789
<div class="data">
88-
<input type="checkbox" checked={member(user)} on:change={toggleMembership(user)} />
90+
<input type="checkbox" checked={member(user)} onchange={toggleMembership(user)} />
8991
</div>
9092
<div class="border"></div>
9193
{/each}
9294
</div>
9395
</div>
9496
<div class="actions">
95-
<button class="button" disabled={store.user.list.page === 1} on:click={fetchPrevious}>&lt;</button>
97+
<button class="button" disabled={store.user.list.page === 1} onclick={fetchPrevious}>&lt;</button>
9698
{store.user.list.page}
97-
<button class="button" disabled={store.user.list.page === store.user.list.pages} on:click={fetchNext}
99+
<button class="button" disabled={store.user.list.page === store.user.list.pages} onclick={fetchNext}
98100
>&gt;</button
99101
>
100102
</div>

‎src/lib/Roles.svelte‎

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,42 +2,43 @@
22
import { onMount } from 'svelte'
33
import Modal from '$lib/Modal.svelte'
44
import { error } from '$lib/notification'
5-
import { store } from '$lib'
65
import Spinner from './Spinner.svelte'
76
8-
let loading = true
9-
let showCreate = false
10-
let name = ''
7+
let loading = $state(true)
8+
let showCreate = $state(false)
9+
let name = $state('')
10+
let { store } = $props()
1111
1212
onMount(async () => {
1313
loading = true
14-
const response = await store.role.list.fetch()
14+
const response = await store.role.fetchAll()
1515
if (!response.ok) {
1616
error(response.statusText)
1717
}
1818
loading = false
1919
})
2020
2121
async function fetchPrevious() {
22-
const response = await store.role.list.fetch(store.role.list.page - 1)
22+
const response = await store.role.fetchAll(store.role.list.page - 1)
2323
if (!response.ok) {
2424
error(response.statusText)
2525
}
2626
}
2727
2828
async function fetchNext() {
29-
const response = await store.role.list.fetch(store.role.list.page + 1)
29+
const response = await store.role.fetchAll(store.role.list.page + 1)
3030
if (!response.ok) {
3131
error(response.statusText)
3232
}
3333
}
3434
35-
function toggleShowCreate() {
35+
function toggleShowCreate(event: Event) {
36+
event.preventDefault()
3637
showCreate = !showCreate
3738
}
3839
3940
async function create() {
40-
const response = await store.role.list.create({ name })
41+
const response = await store.role.create({ name })
4142
if (!response.ok) {
4243
error(response.statusText)
4344
}
@@ -53,7 +54,7 @@
5354
<div class="container">
5455
<div class="header">
5556
<h2>Roles</h2>
56-
<button class="button primary" on:click={toggleShowCreate}>Create</button>
57+
<button class="button primary" onclick={toggleShowCreate}>Create</button>
5758
</div>
5859
<div class="table">
5960
<div class="heading">ID</div>
@@ -70,21 +71,21 @@
7071
</div>
7172
</div>
7273
<div class="actions">
73-
<button class="button" disabled={store.role.list.page === 1} on:click={fetchPrevious}>&lt;</button>
74+
<button class="button" disabled={store.role.list.page === 1} onclick={fetchPrevious}>&lt;</button>
7475
{store.role.list.page}
75-
<button class="button" disabled={store.role.list.page >= store.role.list.pages} on:click={fetchNext}>&gt;</button>
76+
<button class="button" disabled={store.role.list.page >= store.role.list.pages} onclick={fetchNext}>&gt;</button>
7677
</div>
7778
</div>
7879
{/if}
7980

8081
<Modal open={showCreate}>
8182
<h2>Create</h2>
82-
<form on:submit|preventDefault={create}>
83-
<!-- svelte-ignore a11y-autofocus -->
83+
<form onsubmit={create}>
84+
<!-- svelte-ignore a11y_autofocus -->
8485
<input bind:value={name} autofocus />
8586
<div class="actions">
8687
<button class="button primary" type="submit">Create</button>
87-
<button class="button error" on:click={toggleShowCreate}>Close</button>
88+
<button class="button error" onclick={toggleShowCreate}>Close</button>
8889
</div>
8990
</form>
9091
</Modal>

‎src/lib/Theme.svelte‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
<script lang="ts">
22
import { onMount } from 'svelte'
3-
import { store } from '$lib'
43
import { error } from '$lib/notification'
54
import Spinner from './Spinner.svelte'
65
7-
export let name = ''
8-
let loading = true
6+
let { name = '', store } = $props()
7+
let loading = $state(true)
98
109
onMount(async () => {
1110
loading = true
12-
const response = await store.theme.detail.fetch(name)
11+
const response = await store.theme.fetch(name)
1312
if (!response.ok) {
1413
error(response.statusText)
1514
}

‎src/lib/Themes.svelte‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33
import Modal from '$lib/Modal.svelte'
44
import Spinner from './Spinner.svelte'
55
import { error } from '$lib/notification'
6-
import { store } from '$lib'
76
8-
let showCreate = false
9-
let name = ''
10-
let loading = true
7+
let showCreate = $state(false)
8+
let name = $state('')
9+
let loading = $state(true)
10+
let { store } = $props()
1111
1212
onMount(async () => {
1313
loading = true
@@ -36,7 +36,8 @@
3636
showCreate = !showCreate
3737
}
3838
39-
async function create() {
39+
async function create(event: Event) {
40+
event.preventDefault()
4041
const response = await store.theme.create({ name })
4142
if (!response.ok) {
4243
error(response.statusText)
@@ -53,7 +54,7 @@
5354
<div class="container">
5455
<div class="header">
5556
<h2>Themes</h2>
56-
<button class="button primary" on:click={toggleShowCreate}>Create</button>
57+
<button class="button primary" onclick={toggleShowCreate}>Create</button>
5758
</div>
5859
<div class="table">
5960
<div class="heading">ID</div>
@@ -70,21 +71,21 @@
7071
</div>
7172
</div>
7273
<div class="actions">
73-
<button class="button" disabled={store.role.list.page === 1} on:click={fetchPrevious}>&lt;</button>
74+
<button class="button" disabled={store.role.list.page === 1} onclick={fetchPrevious}>&lt;</button>
7475
{store.role.list.page}
75-
<button class="button" disabled={store.role.list.page >= store.role.list.pages} on:click={fetchNext}>&gt;</button>
76+
<button class="button" disabled={store.role.list.page >= store.role.list.pages} onclick={fetchNext}>&gt;</button>
7677
</div>
7778
</div>
7879
{/if}
7980

8081
<Modal open={showCreate}>
8182
<h2>Create</h2>
82-
<form on:submit|preventDefault={create}>
83-
<!-- svelte-ignore a11y-autofocus -->
83+
<form onsubmit={create}>
84+
<!-- svelte-ignore a11y_autofocus -->
8485
<input bind:value={name} autofocus />
8586
<div class="actions">
8687
<button class="button primary" type="submit">Create</button>
87-
<button class="button error" on:click={toggleShowCreate}>Close</button>
88+
<button class="button error" onclick={toggleShowCreate}>Close</button>
8889
</div>
8990
</form>
9091
</Modal>

‎src/lib/User.svelte‎

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
<script lang="ts">
22
import { onMount } from 'svelte'
33
import { error } from '$lib/notification'
4-
import { store } from '$lib'
54
import Spinner from './Spinner.svelte'
65
7-
export let pk = 0
8-
let loading = true
6+
let { pk = 0, store } = $props()
7+
let loading = $state(true)
98
109
onMount(async () => {
1110
loading = true
@@ -65,16 +64,16 @@
6564
<div class="data">{role.id || role.dn}</div>
6665
<div class="data">{role.name || role.cn}</div>
6766
<div class="data">
68-
<input type="checkbox" checked={member(role)} on:change={toggleMembership(role)} />
67+
<input type="checkbox" checked={member(role)} onchange={toggleMembership(role)} />
6968
</div>
7069
<div class="border"></div>
7170
{/each}
7271
</div>
7372
</div>
7473
<div class="actions">
75-
<button class="button" disabled={store.role.list.page === 1} on:click={fetchPrevious}>&lt;</button>
74+
<button class="button" disabled={store.role.list.page === 1} onclick={fetchPrevious}>&lt;</button>
7675
{store.role.list.page}
77-
<button class="button" disabled={store.role.list.page === store.role.list.pages} on:click={fetchNext}
76+
<button class="button" disabled={store.role.list.page === store.role.list.pages} onclick={fetchNext}
7877
>&gt;</button
7978
>
8079
</div>

0 commit comments

Comments
 (0)