Format and automatically fix linted code.

src/components/navigation/BottomNavigation.tsx

@@ -1,5 +1,5 @@
-import { Message, Group, Inbox } from "@styled-icons/boxicons-solid";
 import { Search } from "@styled-icons/boxicons-regular";
+import { Message, Group, Inbox } from "@styled-icons/boxicons-solid";
 import { useHistory, useLocation } from "react-router";
 import styled, { css } from "styled-components";
 
@@ -113,7 +113,6 @@ export function BottomNavigation({ lastOpened }: Props) {
                 </Button>
             </Navbar>
         </Base>
-        
     );
 }
 

src/components/navigation/left/HomeSidebar.tsx

@@ -149,7 +149,7 @@ function HomeSidebar(props: Props) {
                     if (x.channel_type === "DirectMessage") {
                         if (!x.active) return null;
 
-                        let recipient = client.channels.getRecipient(x._id);
+                        const recipient = client.channels.getRecipient(x._id);
                         user = users.find((x) => x?._id === recipient);
 
                         if (!user) {

src/components/navigation/left/ServerListSidebar.tsx

@@ -21,16 +21,16 @@ import {
     useServers,
 } from "../../../context/revoltjs/hooks";
 
+import logoSVG from "../../../assets/logo.svg";
 import ServerIcon from "../../common/ServerIcon";
 import Tooltip from "../../common/Tooltip";
+import UserHover from "../../common/user/UserHover";
 import UserIcon from "../../common/user/UserIcon";
 import IconButton from "../../ui/IconButton";
 import LineDivider from "../../ui/LineDivider";
 import { mapChannelWithUnread } from "./common";
 
-import logoSVG from '../../../assets/logo.svg';
 import { Children } from "../../../types/Preact";
-import UserHover from "../../common/user/UserHover";
 
 function Icon({
     children,
@@ -129,7 +129,7 @@ const ServerEntry = styled.div<{ active: boolean; home?: boolean }>`
             !props.active &&
             css`
                 display: none;
-            ` }
+            `}
 
         svg {
             width: 57px;
@@ -152,13 +152,17 @@ const ServerEntry = styled.div<{ active: boolean; home?: boolean }>`
 function Swoosh() {
     return (
         <span>
-            <svg xmlns="http://www.w3.org/2000/svg" width="57" height="117" fill="var(--sidebar-active)">
-                <path d="M27.746 86.465c14 0 28 11.407 28 28s.256-56 .256-56-42.256 28-28.256 28z"/>
-                <path d="M56 58.465c0 15.464-12.536 28-28 28s-28-12.536-28-28 12.536-28 28-28 28 12.536 28 28z"/>
-                <path d="M28.002 30.465c14 0 28-11.407 28-28s0 56 0 56-42-28-28-28z"/>
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="57"
+                height="117"
+                fill="var(--sidebar-active)">
+                <path d="M27.746 86.465c14 0 28 11.407 28 28s.256-56 .256-56-42.256 28-28.256 28z" />
+                <path d="M56 58.465c0 15.464-12.536 28-28 28s-28-12.536-28-28 12.536-28 28-28 28 12.536 28 28z" />
+                <path d="M28.002 30.465c14 0 28-11.407 28-28s0 56 0 56-42-28-28-28z" />
             </svg>
         </span>
-    )
+    );
 }
 
 interface Props {
@@ -178,8 +182,8 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
 
     const servers = activeServers.map((server) => {
         let alertCount = 0;
-        for (let id of server.channels) {
-            let channel = channels.find((x) => x._id === id);
+        for (const id of server.channels) {
+            const channel = channels.find((x) => x._id === id);
             if (channel?.alertCount) {
                 alertCount += channel.alertCount;
             }
@@ -206,7 +210,7 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
 
     let homeUnread: "mention" | "unread" | undefined;
     let alertCount = 0;
-    for (let x of channels) {
+    for (const x of channels) {
         if (
             ((x.channel_type === "DirectMessage" && x.active) ||
                 x.channel_type === "Group") &&
@@ -229,10 +233,14 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
                     to={lastOpened.home ? `/channel/${lastOpened.home}` : "/"}>
                     <ServerEntry home active={homeActive}>
                         <Swoosh />
-                        { isTouchscreenDevice ?
+                        {isTouchscreenDevice ? (
                             <Icon size={42} unread={homeUnread}>
-                                <img style={{ width: 32, height: 32 }} src={logoSVG} />
-                            </Icon> :
+                                <img
+                                    style={{ width: 32, height: 32 }}
+                                    src={logoSVG}
+                                />
+                            </Icon>
+                        ) : (
                             <div
                                 onContextMenu={attachContextMenu("Status")}
                                 onClick={() =>
@@ -240,11 +248,15 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
                                 }>
                                 <UserHover user={self}>
                                     <Icon size={42} unread={homeUnread}>
-                                        <UserIcon target={self} size={32} status />
+                                        <UserIcon
+                                            target={self}
+                                            size={32}
+                                            status
+                                        />
                                     </Icon>
                                 </UserHover>
                             </div>
-                        }
+                        )}
                     </ServerEntry>
                 </ConditionalLink>
                 <LineDivider />
@@ -255,10 +267,9 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
                     return (
                         <ConditionalLink
                             active={active}
-                            to={
-                                `/server/${entry!._id}` +
-                                (id ? `/channel/${id}` : "")
-                            }>
+                            to={`/server/${entry!._id}${
+                                id ? `/channel/${id}` : ""
+                            }`}>
                             <ServerEntry
                                 active={active}
                                 onContextMenu={attachContextMenu("Menu", {

src/components/navigation/left/ServerSidebar.tsx

@@ -81,8 +81,8 @@ function ServerSidebar(props: Props) {
         });
     }, [channel_id]);
 
-    let uncategorised = new Set(server.channels);
-    let elements = [];
+    const uncategorised = new Set(server.channels);
+    const elements = [];
 
     function addChannel(id: string) {
         const entry = channels.find((x) => x._id === id);
@@ -106,9 +106,9 @@ function ServerSidebar(props: Props) {
     }
 
     if (server.categories) {
-        for (let category of server.categories) {
-            let channels = [];
-            for (let id of category.channels) {
+        for (const category of server.categories) {
+            const channels = [];
+            for (const id of category.channels) {
                 uncategorised.delete(id);
                 channels.push(addChannel(id));
             }
@@ -124,7 +124,7 @@ function ServerSidebar(props: Props) {
         }
     }
 
-    for (let id of Array.from(uncategorised).reverse()) {
+    for (const id of Array.from(uncategorised).reverse()) {
         elements.unshift(addChannel(id));
     }
 

src/components/navigation/right/ChannelDebugInfo.tsx

@@ -6,7 +6,7 @@ interface Props {
 
 export function ChannelDebugInfo({ id }: Props) {
     if (process.env.NODE_ENV !== "development") return null;
-    let view = useRenderState(id);
+    const view = useRenderState(id);
     if (!view) return null;
 
     return (

src/components/navigation/right/MemberSidebar.tsx

@@ -1,12 +1,14 @@
 import { useParams } from "react-router";
+import { Link } from "react-router-dom";
 import { User } from "revolt.js";
 import { Channels, Message, Servers, Users } from "revolt.js/dist/api/objects";
 import { ClientboundNotification } from "revolt.js/dist/websocket/notifications";
 
-import { Link } from "react-router-dom";
 import { Text } from "preact-i18n";
 import { useContext, useEffect, useState } from "preact/hooks";
 
+import { getState } from "../../../redux";
+
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
 import {
     AppContext,
@@ -22,14 +24,13 @@ import {
 
 import CollapsibleSection from "../../common/CollapsibleSection";
 import Category from "../../ui/Category";
+import InputBox from "../../ui/InputBox";
 import Preloader from "../../ui/Preloader";
 import placeholderSVG from "../items/placeholder.svg";
 
 import { GenericSidebarBase, GenericSidebarList } from "../SidebarBase";
 import { UserButton } from "../items/ButtonItem";
 import { ChannelDebugInfo } from "./ChannelDebugInfo";
-import InputBox from "../../ui/InputBox";
-import { getState } from "../../../redux";
 
 interface Props {
     ctx: HookContext;
@@ -56,7 +57,7 @@ export function GroupMemberSidebar({
 }: Props & { channel: Channels.GroupChannel }) {
     const { openScreen } = useIntermediate();
     const users = useUsers(undefined, ctx);
-    let members = channel.recipients
+    const members = channel.recipients
         .map((x) => users.find((y) => y?._id === x))
         .filter((x) => typeof x !== "undefined") as User[];
 
@@ -77,18 +78,18 @@ export function GroupMemberSidebar({
 
     members.sort((a, b) => {
         // ! FIXME: should probably rewrite all this code
-        let l =
+        const l =
             +(
                 (a.online && a.status?.presence !== Users.Presence.Invisible) ??
                 false
             ) | 0;
-        let r =
+        const r =
             +(
                 (b.online && b.status?.presence !== Users.Presence.Invisible) ??
                 false
             ) | 0;
 
-        let n = r - l;
+        const n = r - l;
         if (n !== 0) {
             return n;
         }
@@ -219,18 +220,18 @@ export function ServerMemberSidebar({
     // copy paste from above
     users.sort((a, b) => {
         // ! FIXME: should probably rewrite all this code
-        let l =
+        const l =
             +(
                 (a.online && a.status?.presence !== Users.Presence.Invisible) ??
                 false
             ) | 0;
-        let r =
+        const r =
             +(
                 (b.online && b.status?.presence !== Users.Presence.Invisible) ??
                 false
             ) | 0;
 
-        let n = r - l;
+        const n = r - l;
         if (n !== 0) {
             return n;
         }
@@ -246,16 +247,15 @@ export function ServerMemberSidebar({
                 <div>{!members && <Preloader type="ring" />}</div>
                 {members && (
                     <CollapsibleSection
-                        //sticky //will re-add later, need to fix css 
+                        //sticky //will re-add later, need to fix css
                         id="members"
                         defaultValue
-                        summary={<span>
-                                        <Text id="app.main.categories.members" />{" "}
-                                        — {users.length}
-                                    </span>
-                                }
-
-                        >
+                        summary={
+                            <span>
+                                <Text id="app.main.categories.members" /> —{" "}
+                                {users.length}
+                            </span>
+                        }>
                         {users.length === 0 && <img src={placeholderSVG} />}
                         {users.map(
                             (user) =>
@@ -281,14 +281,18 @@ export function ServerMemberSidebar({
 }
 
 function Search({ channel }: { channel: string }) {
-    if (!getState().experiments.enabled?.includes('search')) return null;
+    if (!getState().experiments.enabled?.includes("search")) return null;
 
     const client = useContext(AppContext);
-    const [query,setV] = useState('');
-    const [results,setResults] = useState<Message[]>([]);
+    const [query, setV] = useState("");
+    const [results, setResults] = useState<Message[]>([]);
 
     async function search() {
-        let data = await client.channels.searchWithUsers(channel, { query, sort: 'Relevance' }, true);
+        const data = await client.channels.searchWithUsers(
+            channel,
+            { query, sort: "Relevance" },
+            true,
+        );
         setResults(data.messages);
     }
 
@@ -298,27 +302,47 @@ function Search({ channel }: { channel: string }) {
             id="search"
             defaultValue={false}
             summary={"Search (BETA)"}>
-            <InputBox style={{ width: '100%' }}
-                onKeyDown={e => e.key === 'Enter' && search()}
-                value={query} onChange={e => setV(e.currentTarget.value)} />
-            <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', marginTop: '8px' }}>
-            {
-                results.map(message => {
-                    let href = '';
-                    let channel = client.channels.get(message.channel);
-                    if (channel?.channel_type === 'TextChannel') {
+            <InputBox
+                style={{ width: "100%" }}
+                onKeyDown={(e) => e.key === "Enter" && search()}
+                value={query}
+                onChange={(e) => setV(e.currentTarget.value)}
+            />
+            <div
+                style={{
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: "4px",
+                    marginTop: "8px",
+                }}>
+                {results.map((message) => {
+                    let href = "";
+                    const channel = client.channels.get(message.channel);
+                    if (channel?.channel_type === "TextChannel") {
                         href += `/server/${channel.server}`;
                     }
 
                     href += `/channel/${message.channel}/${message._id}`;
 
-                    return <Link to={href}><div style={{ margin: '2px', padding: '6px', background: 'var(--primary-background)' }}>
-                        <b>@{ client.users.get(message.author)?.username }</b><br/>
-                        { message.content }
-                    </div></Link>
-                })
-            }
+                    return (
+                        <Link to={href}>
+                            <div
+                                style={{
+                                    margin: "2px",
+                                    padding: "6px",
+                                    background: "var(--primary-background)",
+                                }}>
+                                <b>
+                                    @
+                                    {client.users.get(message.author)?.username}
+                                </b>
+                                <br />
+                                {message.content}
+                            </div>
+                        </Link>
+                    );
+                })}
             </div>
         </CollapsibleSection>
-    )
+    );
 }