Add error pane

This commit is contained in:
jude 2023-08-27 17:41:23 +01:00
parent adf29dca5d
commit b6b5e6d2b2
6 changed files with 119 additions and 40 deletions

View File

@ -150,7 +150,8 @@ pub async fn initialize(
.mount( .mount(
"/dashboard", "/dashboard",
routes![ routes![
routes::dashboard::dashboard, routes::dashboard::dashboard_1,
routes::dashboard::dashboard_2,
routes::dashboard::dashboard_home, routes::dashboard::dashboard_home,
routes::dashboard::user::get_user_info, routes::dashboard::user::get_user_info,
routes::dashboard::user::update_user_info, routes::dashboard::user::update_user_info,

View File

@ -676,7 +676,17 @@ pub async fn dashboard_home(cookies: &CookieJar<'_>) -> Result<Template, Redirec
} }
#[get("/<_>")] #[get("/<_>")]
pub async fn dashboard(cookies: &CookieJar<'_>) -> Result<Template, Redirect> { pub async fn dashboard_1(cookies: &CookieJar<'_>) -> Result<Template, Redirect> {
if cookies.get_private("userid").is_some() {
let map: HashMap<&str, String> = HashMap::new();
Ok(Template::render("dashboard", &map))
} else {
Err(Redirect::to("/login/discord"))
}
}
#[get("/<_>/<_>")]
pub async fn dashboard_2(cookies: &CookieJar<'_>) -> Result<Template, Redirect> {
if cookies.get_private("userid").is_some() { if cookies.get_private("userid").is_some() {
let map: HashMap<&str, String> = HashMap::new(); let map: HashMap<&str, String> = HashMap::new();
Ok(Template::render("dashboard", &map)) Ok(Template::render("dashboard", &map))

View File

@ -291,10 +291,19 @@ div.dashboard-sidebar:not(.mobile-sidebar) {
flex-direction: column; flex-direction: column;
} }
ul.guildList {
flex-grow: 1;
flex-shrink: 1;
overflow: scroll;
}
div.dashboard-sidebar:not(.mobile-sidebar) .aside-footer { div.dashboard-sidebar:not(.mobile-sidebar) .aside-footer {
position: fixed; flex-shrink: 0;
bottom: 0; flex-grow: 0;
width: 226px; }
div.dashboard-sidebar svg {
flex-shrink: 0;
} }
div.mobile-sidebar { div.mobile-sidebar {
@ -716,6 +725,18 @@ a.switch-pane {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.guild-submenu {
display: none;
}
.guild-submenu li {
font-size: 0.8rem;
}
a.switch-pane.is-active ~ .guild-submenu {
display: block;
}
.feedback { .feedback {
background-color: #5865F2; background-color: #5865F2;
} }

View File

@ -34,13 +34,11 @@ let globalPatreon = false;
let guildPatreon = false; let guildPatreon = false;
function guildId() { function guildId() {
return document.querySelector(".guildList a.is-active").dataset["guild"]; return document.querySelector("li > a.is-active").parentElement.dataset["guild"];
} }
function loadErrors() { function guildName() {
return fetch(`/dashboard/api/guild/${guildId()}/errors`).then((response) => return guildNames[guildId()];
response.json()
);
} }
function colorToInt(r, g, b) { function colorToInt(r, g, b) {
@ -456,21 +454,19 @@ document.addEventListener("guildSwitched", async (e) => {
.querySelectorAll(".patreon-only") .querySelectorAll(".patreon-only")
.forEach((el) => el.classList.add("is-locked")); .forEach((el) => el.classList.add("is-locked"));
let $anchor = document.querySelector( let $li = document.querySelector(`li[data-guild="${e.detail.guild_id}"]`);
`.switch-pane[data-guild="${e.detail.guild_id}"]`
);
let hasError = false; if ($li === null) {
if ($anchor === null) {
switch_pane("user-error"); switch_pane("user-error");
hasError = true;
return; return;
} }
switch_pane($anchor.dataset["pane"]); switch_pane(e.detail.pane);
reset_guild_pane(); reset_guild_pane();
$anchor.classList.add("is-active"); $li.querySelector("li > a").classList.add("is-active");
$li.querySelectorAll(`*[data-pane="${e.detail.pane}"]`).forEach((el) => {
el.classList.add("is-active");
});
if (globalPatreon || (await fetch_patreon(e.detail.guild_id))) { if (globalPatreon || (await fetch_patreon(e.detail.guild_id))) {
document document
@ -478,18 +474,26 @@ document.addEventListener("guildSwitched", async (e) => {
.forEach((el) => el.classList.remove("is-locked")); .forEach((el) => el.classList.remove("is-locked"));
} }
hasError = await fetch_channels(e.detail.guild_id); const event = new CustomEvent("paneLoad", {
detail: {
guild_id: e.detail.guild_id,
pane: e.detail.pane,
},
});
document.dispatchEvent(event);
});
document.addEventListener("paneLoad", async (ev) => {
const hasError = await fetch_channels(ev.detail.guild_id);
if (!hasError) { if (!hasError) {
fetch_roles(e.detail.guild_id); fetch_roles(ev.detail.guild_id);
fetch_templates(e.detail.guild_id); fetch_templates(ev.detail.guild_id);
fetch_reminders(e.detail.guild_id); fetch_reminders(ev.detail.guild_id);
loadErrors().then((res) => {
console.log(res);
});
document.querySelectorAll("p.pageTitle").forEach((el) => { document.querySelectorAll("p.pageTitle").forEach((el) => {
el.textContent = `${e.detail.guild_name} Reminders`; el.textContent = `${guildName()} Reminders`;
}); });
document.querySelectorAll("select.channel-selector").forEach((el) => { document.querySelectorAll("select.channel-selector").forEach((el) => {
el.addEventListener("change", (e) => { el.addEventListener("change", (e) => {
update_select(e.target); update_select(e.target);
@ -694,21 +698,37 @@ document.addEventListener("DOMContentLoaded", async () => {
"%guildname%", "%guildname%",
guild.name guild.name
); );
$anchor.dataset["guild"] = guild.id;
$anchor.dataset["name"] = guild.name; $anchor.dataset["name"] = guild.name;
$anchor.href = `/dashboard/${guild.id}?name=${guild.name}`; $anchor.href = `/dashboard/${guild.id}/reminders`;
$anchor.addEventListener("click", async (e) => { const $li = $anchor.parentElement;
e.preventDefault(); $li.dataset["guild"] = guild.id;
window.history.pushState({}, "", `/dashboard/${guild.id}`);
const event = new CustomEvent("guildSwitched", { $li.querySelectorAll("a").forEach((el) => {
detail: { el.addEventListener("click", (e) => {
guild_name: guild.name, const pane = el.dataset["pane"];
guild_id: guild.id, const slug = el.dataset["slug"];
},
if (pane !== undefined && slug !== undefined) {
e.preventDefault();
switch_pane(pane);
window.history.pushState(
{},
"",
`/dashboard/${guild.id}/${slug}`
);
const event = new CustomEvent("guildSwitched", {
detail: {
guild_id: guild.id,
pane,
},
});
document.dispatchEvent(event);
}
}); });
document.dispatchEvent(event);
}); });
element.append($clone); element.append($clone);
@ -724,6 +744,7 @@ document.addEventListener("DOMContentLoaded", async () => {
detail: { detail: {
guild_name: name, guild_name: name,
guild_id: id, guild_id: id,
pane: "guild",
}, },
}); });

View File

@ -0,0 +1,16 @@
function loadErrors() {
return fetch(`/dashboard/api/guild/${guildId()}/errors`).then((response) =>
response.json()
);
}
document.addEventListener("paneLoad", (ev) => {
if (ev.detail.pane !== "reminder-errors") {
return;
}
// Load errors
loadErrors().then((res) => {});
$loader.classList.add("is-hidden");
});

View File

@ -375,9 +375,19 @@
<template id="guildListEntry"> <template id="guildListEntry">
<li> <li>
<a class="switch-pane" data-pane="guild"> <a class="switch-pane" data-pane="guild" data-slug="reminders">
<span class="icon"><i class="fas fa-map-pin"></i></span> <span class="guild-name">%guildname%</span> <span class="icon"><i class="fas fa-map-pin"></i></span> <span class="guild-name">%guildname%</span>
</a> </a>
<ul class="guild-submenu">
<li>
<a class="switch-pane" data-pane="guild" data-slug="reminders">
<span class="icon"><i class="fas fa-calendar-alt"></i></span> Reminders
</a>
<a class="switch-pane" data-pane="reminder-errors" data-slug="errors">
<span class="icon"><i class="fas fa-exclamation-triangle"></i></span> Errors
</a>
</li>
</ul>
</li> </li>
</template> </template>