fix: allow invite screen to properly load while signed out

src/components/common/ServerIcon.tsx

@@ -51,7 +51,9 @@ export default observer(
                     {name
                         .split(" ")
                         .map((x) => x[0])
-                        .filter((x) => typeof x !== "undefined")}
+                        .filter((x) => typeof x !== "undefined")
+                        .join("")
+                        .substring(0, 3)}
                 </ServerText>
             );
         }

src/lib/FakeClient.tsx

@@ -0,0 +1,13 @@
+import { useMemo } from "preact/hooks";
+
+import { useApplicationState } from "../mobx/State";
+
+import { AppContext } from "../context/revoltjs/RevoltClient";
+
+import { Children } from "../types/Preact";
+
+export default function FakeClient({ children }: { children: Children }) {
+    const config = useApplicationState().config;
+    const client = useMemo(() => config.createClient(), []);
+    return <AppContext.Provider value={client}>{children}</AppContext.Provider>;
+}

src/pages/app.tsx

@@ -3,6 +3,7 @@ import { Route, Switch } from "react-router-dom";
 import { lazy, Suspense } from "preact/compat";
 
 import ErrorBoundary from "../lib/ErrorBoundary";
+import FakeClient from "../lib/FakeClient";
 
 import Context from "../context";
 import { CheckAuth } from "../context/revoltjs/CheckAuth";
@@ -31,7 +32,9 @@ export function App() {
                             <Login />
                         </Route>
                         <Route path="/invite/:code">
-                            <Invite />
+                            <FakeClient>
+                                <Invite />
+                            </FakeClient>
                         </Route>
                         <Route path="/login">
                             <CheckAuth>

src/pages/invite/Invite.tsx

@@ -10,6 +10,8 @@ import { useContext, useEffect, useState } from "preact/hooks";
 import { defer } from "../../lib/defer";
 import { TextReact } from "../../lib/i18n";
 
+import { useApplicationState } from "../../mobx/State";
+
 import RequiresOnline from "../../context/revoltjs/RequiresOnline";
 import {
     AppContext,
@@ -27,6 +29,7 @@ import Preloader from "../../components/ui/Preloader";
 export default function Invite() {
     const history = useHistory();
     const client = useContext(AppContext);
+
     const status = useContext(StatusContext);
     const { code } = useParams<{ code: string }>();
     const [processing, setProcessing] = useState(false);
@@ -36,10 +39,7 @@ export default function Invite() {
     );
 
     useEffect(() => {
-        if (
-            typeof invite === "undefined" &&
-            (status === ClientStatus.ONLINE || status === ClientStatus.READY)
-        ) {
+        if (typeof invite === "undefined") {
             client
                 .fetchInvite(code)
                 .then((data) => setInvite(data))
@@ -91,7 +91,7 @@ export default function Invite() {
             className={styles.invite}
             style={{
                 backgroundImage: invite.server_banner
-                    ? `url('${client.generateFileURL(invite.server_banner)}')`
+                    ? `url('${client?.generateFileURL(invite.server_banner)}')`
                     : undefined,
             }}>
             <div className={styles.leave}>