add error messages for not being able to fetch initial information

This commit is contained in:
hippoz 2022-02-03 02:58:08 +02:00
parent 641db09c7f
commit fe04b99c35
No known key found for this signature in database
GPG key ID: 7C52899193467641
4 changed files with 39 additions and 6 deletions

View file

@ -142,5 +142,5 @@ button:focus {
} }
.grayed-text { .grayed-text {
color: var(--color-red); color: var(--grayed-text-color);
} }

View file

@ -4,18 +4,18 @@ class APIClient {
this.token = token; this.token = token;
} }
async getRequest(path) { async getRequest(path, throwOnError=false) {
const res = await fetch(`${this.baseUrl}${path}`, { const res = await fetch(`${this.baseUrl}${path}`, {
headers: { headers: {
"Authorization": this.token "Authorization": this.token
} }
}); });
if (!res.ok) if (!res.ok && throwOnError)
throw new Error("APIClient.getRequest(): request failed with non-200 http code"); throw new Error("APIClient.getRequest(): request failed with non-200 http code");
return (await res.json()); return (await res.json());
} }
async postRequest(path, body) { async postRequest(path, body, throwOnError=true) {
const res = await fetch(`${this.baseUrl}${path}`, { const res = await fetch(`${this.baseUrl}${path}`, {
method: "POST", method: "POST",
headers: { headers: {
@ -24,7 +24,7 @@ class APIClient {
}, },
body: JSON.stringify(body) body: JSON.stringify(body)
}); });
if (!res.ok) if (!res.ok && throwOnError)
throw new Error("APIClient.postRequest(): request failed with non-200 http code"); throw new Error("APIClient.postRequest(): request failed with non-200 http code");
return (await res.json()); return (await res.json());
} }

View file

@ -2,6 +2,7 @@
import { apiClient } from "../api/common"; import { apiClient } from "../api/common";
import ChatView from "./ChatView.svelte"; import ChatView from "./ChatView.svelte";
import FuzzyView from "./FuzzyView.svelte"; import FuzzyView from "./FuzzyView.svelte";
import MessageDisplay from "./MessageDisplay.svelte";
let messageStore = {}; let messageStore = {};
let selectedGuild = null; let selectedGuild = null;
@ -10,13 +11,33 @@ import FuzzyView from "./FuzzyView.svelte";
let user = null; let user = null;
let view = { type: "CHAT" }; let view = { type: "CHAT" };
apiClient.getRequest("/users/@self") apiClient.getRequest("/users/@self", false)
.then((res) => { .then((res) => {
let userErrorMessage = "";
if (res.error) {
userErrorMessage = "Something went wrong while trying to fetch current user info.";
if (res.message === "ERROR_UNAUTHORIZED" || res.message === "ERROR_FORBIDDEN") {
userErrorMessage = "You're not logged in or your session is invalid.";
}
view = { type: "MESSAGE_DISPLAY", header: "Error", content: userErrorMessage };
return;
}
user = res.user; user = res.user;
}); });
apiClient.getRequest("/users/@self/guilds") apiClient.getRequest("/users/@self/guilds")
.then((res) => { .then((res) => {
let userErrorMessage = "";
if (res.error) {
userErrorMessage = "Something went wrong while trying to fetch guild info.";
if (res.message === "ERROR_UNAUTHORIZED" || res.message === "ERROR_FORBIDDEN") {
userErrorMessage = "You're not logged in or your session is invalid.";
}
view = { type: "MESSAGE_DISPLAY", header: "Error", content: userErrorMessage };
return;
}
guilds = res.guilds guilds = res.guilds
.map(e => { .map(e => {
// we only want text channels // we only want text channels
@ -145,5 +166,7 @@ import FuzzyView from "./FuzzyView.svelte";
<FuzzyView on:selected={fuzzySelectedGuild} elements={guilds} title="Select a guild" /> <FuzzyView on:selected={fuzzySelectedGuild} elements={guilds} title="Select a guild" />
{:else if view.type === "CHANNEL_FUZZY"} {:else if view.type === "CHANNEL_FUZZY"}
<FuzzyView on:selected={fuzzySelectedChannel} elements={selectedGuild ? selectedGuild.channels : []} title={`Select a channel in ${selectedGuild ? selectedGuild.name : "[unknown guild]"}`} /> <FuzzyView on:selected={fuzzySelectedChannel} elements={selectedGuild ? selectedGuild.channels : []} title={`Select a channel in ${selectedGuild ? selectedGuild.name : "[unknown guild]"}`} />
{:else if view.type === "MESSAGE_DISPLAY"}
<MessageDisplay header={ view.header } content={ view.content } ></MessageDisplay>
{/if} {/if}
</main> </main>

View file

@ -0,0 +1,10 @@
<script>
export let header;
export let content;
</script>
<div class="card full-card">
<span class="main-panel-header"><b>{ header }</b></span>
<br>
<p>{ content }</p>
</div>