diff --git a/src/stores/target.ts b/src/stores/target.ts new file mode 100644 index 0000000..567caba --- /dev/null +++ b/src/stores/target.ts @@ -0,0 +1,6 @@ +import {writable} from "svelte/store"; +import type {CSPair} from "../types/cspair"; +import type {Redirect, Route} from "../types/target"; + +export const routesTable = writable<{[key: string]: CSPair}>({}); +export const redirectsTable = writable<{[key: string]: CSPair}>({}); diff --git a/src/views/RedirectsView.svelte b/src/views/RedirectsView.svelte index 9f0911d..a69ad7f 100644 --- a/src/views/RedirectsView.svelte +++ b/src/views/RedirectsView.svelte @@ -5,13 +5,13 @@ import type {CSPair} from "../types/cspair"; import {type Redirect, redirectEqual} from "../types/target"; import {domainOption} from "../stores/domain-option"; + import {redirectsTable} from "../stores/target"; const apiViolet = import.meta.env.VITE_API_VIOLET; - let tableData: {[key: string]: CSPair} = {}; let tableKeys: string[] = []; - $: tableKeys = Object.entries(tableData) + $: tableKeys = Object.entries($redirectsTable) .filter(x => x[1].client != null || x[1].server != null) .map(x => x[0]) .filter(x => domainFilter(x, $domainOption)) @@ -26,9 +26,9 @@ return p.endsWith(domain); } - let promiseForTable: Promise = reloadTable(true); + let promiseForTable: Promise = reloadTable(); - function reloadTable(firstLoad: boolean = false): Promise { + function reloadTable(): Promise { return new Promise((res, rej) => { fetch(apiViolet + "/redirect", {headers: {Authorization: getBearer()}}) .then(x => { @@ -38,8 +38,8 @@ .then(x => { let rows = x as Redirect[]; rows.forEach(x => { - tableData[x.src] = { - client: firstLoad || !tableData[x.src] ? JSON.parse(JSON.stringify(x)) : tableData[x.src]?.client, + $redirectsTable[x.src] = { + client: !$redirectsTable[x.src] ? JSON.parse(JSON.stringify(x)) : $redirectsTable[x.src]?.client, server: x, p: Promise.resolve(), }; @@ -57,7 +57,7 @@ function saveChanges() { let tableProm = tableKeys - .map(x => tableData[x]) + .map(x => $redirectsTable[x]) .filter(x => x.client != null || x.server != null) .filter(x => !redirectEqual(x.client, x.server)) .map((x: CSPair): Savable => { @@ -109,7 +109,7 @@ { const x = e.detail; - tableData[x.src] = {client: x, server: tableData[x.src]?.server, p: Promise.resolve()}; + $redirectsTable[x.src] = {client: x, server: $redirectsTable[x.src]?.server, p: Promise.resolve()}; tableKeys.push(x.src); tableKeys = tableKeys; }} @@ -117,10 +117,10 @@ {#each tableKeys as src (src)} - {#await tableData[src].p} + {#await $redirectsTable[src].p} Loading... {:then _} - + {:catch err} Error loading row for {src}: {err} {/await} diff --git a/src/views/RoutesView.svelte b/src/views/RoutesView.svelte index e3b2858..bf17b65 100644 --- a/src/views/RoutesView.svelte +++ b/src/views/RoutesView.svelte @@ -5,13 +5,13 @@ import type {CSPair} from "../types/cspair"; import {type Route, routeEqual} from "../types/target"; import {domainOption} from "../stores/domain-option"; + import {routesTable} from "../stores/target"; const apiViolet = import.meta.env.VITE_API_VIOLET; - let tableData: {[key: string]: CSPair} = {}; let tableKeys: string[] = []; - $: tableKeys = Object.entries(tableData) + $: tableKeys = Object.entries($routesTable) .filter(x => x[1].client != null || x[1].server != null) .map(x => x[0]) .filter(x => domainFilter(x, $domainOption)) @@ -26,9 +26,9 @@ return p.endsWith(domain); } - let promiseForTable: Promise = reloadTable(true); + let promiseForTable: Promise = reloadTable(); - function reloadTable(firstLoad: boolean = false): Promise { + function reloadTable(): Promise { return new Promise((res, rej) => { fetch(apiViolet + "/route", {headers: {Authorization: getBearer()}}) .then(x => { @@ -37,12 +37,17 @@ }) .then(x => { let rows = x as Route[]; + let srcs = new Set(Object.keys($routesTable)); rows.forEach(x => { - tableData[x.src] = { - client: firstLoad || !tableData[x.src] ? JSON.parse(JSON.stringify(x)) : tableData[x.src]?.client, + $routesTable[x.src] = { + client: !$routesTable[x.src] ? JSON.parse(JSON.stringify(x)) : $routesTable[x.src]?.client, server: x, p: Promise.resolve(), }; + srcs.delete(x.src); + }); + srcs.forEach(x => { + $routesTable[x].server = null; }); res(); }) @@ -57,7 +62,7 @@ function saveChanges() { let tableProm = tableKeys - .map(x => tableData[x]) + .map(x => $routesTable[x]) .filter(x => x.client != null || x.server != null) .filter(x => !routeEqual(x.client, x.server)) .map((x: CSPair): Savable => { @@ -108,7 +113,7 @@ { const x = e.detail; - tableData[x.src] = {client: x, server: tableData[x.src]?.server, p: Promise.resolve()}; + $routesTable[x.src] = {client: x, server: $routesTable[x.src]?.server, p: Promise.resolve()}; tableKeys.push(x.src); tableKeys = tableKeys; }} @@ -116,10 +121,10 @@ {#each tableKeys as src (src)} - {#await tableData[src].p} + {#await $routesTable[src].p} Loading... {:then _} - + {:catch err} Error loading row for {src}: {err} {/await}