add error messages for not being able to fetch initial information
This commit is contained in:
parent
641db09c7f
commit
fe04b99c35
4 changed files with 39 additions and 6 deletions
|
@ -142,5 +142,5 @@ button:focus {
|
||||||
}
|
}
|
||||||
|
|
||||||
.grayed-text {
|
.grayed-text {
|
||||||
color: var(--color-red);
|
color: var(--grayed-text-color);
|
||||||
}
|
}
|
||||||
|
|
|
@ -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());
|
||||||
}
|
}
|
||||||
|
|
|
@ -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>
|
||||||
|
|
10
frontend/src/components/MessageDisplay.svelte
Normal file
10
frontend/src/components/MessageDisplay.svelte
Normal 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>
|
Loading…
Reference in a new issue