feat: handle system alerts and poll rate changes

This commit is contained in:
Paul Makles
2022-06-18 17:03:04 +01:00
parent 03e177f865
commit f185dec461
4 changed files with 87 additions and 20 deletions

View File

@@ -2,14 +2,11 @@ import { Docked, OverlappingPanels, ShowIf } from "react-overlapping-panels";
import { Switch, Route, useLocation, Link } from "react-router-dom";
import styled, { css } from "styled-components/macro";
import { useState } from "preact/hooks";
import { useEffect, useState } from "preact/hooks";
import ContextMenus from "../lib/ContextMenus";
import { isTouchscreenDevice } from "../lib/isTouchscreenDevice";
import { useApplicationState } from "../mobx/State";
import { SIDEBAR_CHANNELS } from "../mobx/stores/Layout";
import Popovers from "../context/intermediate/Popovers";
import Notifications from "../context/revoltjs/Notifications";
import StateMonitor from "../context/revoltjs/StateMonitor";
@@ -18,6 +15,7 @@ import { Titlebar } from "../components/native/Titlebar";
import BottomNavigation from "../components/navigation/BottomNavigation";
import LeftSidebar from "../components/navigation/LeftSidebar";
import RightSidebar from "../components/navigation/RightSidebar";
import { useSystemAlert } from "../updateWorker";
import Open from "./Open";
import Channel from "./channels/Channel";
import Developer from "./developer/Developer";
@@ -112,22 +110,35 @@ export default function App() {
path.startsWith("/invite") ||
path.includes("/settings");
const alert = useSystemAlert();
const [statusBar, setStatusBar] = useState(false);
useEffect(() => setStatusBar(true), [alert]);
return (
<>
{statusBar && (
{alert && statusBar && (
<StatusBar>
<div className="title">Partial outage: CDN</div>
<div className="title">{alert.text}</div>
<div className="actions">
<Link to="/invite/Testers">
<a>
<div className="button">Updates</div>
{alert.actions?.map((action) =>
action.type === "internal" ? (
<Link to={action.href}>
<div className="button">{action.text}</div>
</Link>
) : action.type === "external" ? (
<a
href={action.href}
target="_blank"
rel="noreferrer">
<div className="button">{action.text}</div>{" "}
</a>
) : null,
)}
{alert.dismissable !== false && (
<a onClick={() => setStatusBar(false)}>
<div className="button">Dismiss</div>
</a>
</Link>
<a onClick={() => setStatusBar(false)}>
<div className="button">Dismiss</div>
</a>
)}
</div>
</StatusBar>
)}