feat(profile): added statistics to bot profile

.github/workflows/mirroring.yml

@@ -1,10 +1,6 @@
 name: Mirroring
 
-on:
+on: [push, delete]
-    push:
-        branches:
-            - "master"
-            - "production"
 
 jobs:
     to_gitlab:

.github/workflows/preview_cleanup.yml

@@ -0,0 +1,39 @@
+name: Clean Preview
+
+#! Safety:
+#! this workflow should not execute any untrusted input at all
+#! see the docs on `pull_request_target` for more
+on:
+    pull_request_target:
+        types: [unlabeled]
+
+jobs:
+    clean:
+        runs-on: ubuntu-latest
+        if: github.event.label.name == 'use-preview'
+        env:
+            BASE: refs/pull/${{ github.event.pull_request.number }}
+
+        steps:
+            - uses: actions/checkout@v2
+              with:
+                  ref: build-previews
+                  persist-credentials: false
+
+            - name: clean previews
+              run: rm -rf "$BASE"
+
+            - name: publish cleaned previews
+              uses: JamesIves/github-pages-deploy-action@4.1.5
+              with:
+                  folder: .
+                  branch: build-previews
+                  commit-message: "Cleaning up build result for #${{ github.event.pull_request.number }}"
+
+            - name: send comment
+              uses: marocchino/sticky-pull-request-comment@v2
+              with:
+                  header: Preview environment
+                  message: |
+                      ## Preview environment
+                      There is no longer a preview enviroment for this pull request due to the `use-preview` label being removed

.github/workflows/preview_pull_request.yml

@@ -0,0 +1,52 @@
+name: Preview Pull Request
+
+#! Safety:
+#! this workflow should not execute any untrusted input at all
+#! see the docs on `pull_request_target` for more
+on:
+    pull_request_target:
+        types: [synchronize, reopened, labeled]
+
+jobs:
+    preview:
+        runs-on: ubuntu-latest
+        # make sure the pull request is labeled with 'use-preview'
+        if: github.event.label.name == 'use-preview' || contains(github.event.pull_request.labels.*.name, 'use-preview')
+        env:
+            BASE: refs/pull/${{ github.event.pull_request.number }}/merge
+            REPO: ${{ github.event.repository.name }}
+
+        steps:
+            - uses: actions/checkout@v2
+
+            - uses: actions/checkout@v2
+              with:
+                  # Head commit of the pull request
+                  ref: ${{ github.event.pull_request.head.sha }}
+                  path: pull
+                  submodules: recursive
+
+            - name: build
+              uses: ./.github/actions/build
+              with:
+                  base: /${{ env.REPO }}/${{ env.BASE }}/
+                  folder: pull
+
+            - name: publish preview
+              uses: JamesIves/github-pages-deploy-action@4.1.5
+              with:
+                  folder: pull/dist
+                  branch: build-previews
+                  target-folder: ${{ env.BASE }}
+                  single-commit: true
+                  commit-message: "Publishing build result from #${{ github.event.pull_request.number }}"
+
+            - name: send comment
+              uses: marocchino/sticky-pull-request-comment@v2
+              with:
+                  header: Preview environment
+                  message: |
+                      ## Preview environment
+                      https://${{ github.repository_owner }}.github.io/${{ env.REPO }}/${{ env.BASE }}/
+
+                      This link will remain active until the `use-preview` label is removed.

.github/workflows/triage_pr.yml

@@ -1,72 +1,72 @@
 name: Add PR to Board
 
 on:
-    pull_request_target:
+  pull_request_target:
-        types: [opened, synchronize, ready_for_review, review_requested]
+    types: [opened]
 
 jobs:
-    track_pr:
+  track_pr:
-        runs-on: ubuntu-latest
+    runs-on: ubuntu-latest
-        steps:
+    steps:
-            - name: Get project data
+      - name: Get project data
-              env:
+        env:
-                  GITHUB_TOKEN: ${{ secrets.PAT }}
+          GITHUB_TOKEN: ${{ secrets.PAT }}
-              run: |
+        run: |
-                  gh api graphql -f query='
+          gh api graphql -f query='
-                    query {
+            query {
-                      organization(login: "revoltchat"){
+              organization(login: "revoltchat"){
-                        projectNext(number: 3) {
+                projectNext(number: 3) {
-                          id
+                  id
-                          fields(first:20) {
+                  fields(first:20) {
-                            nodes {
+                    nodes {
-                              id
+                      id
-                              name
+                      name
-                              settings
+                      settings
-                            }
+                    }
-                          }
+                  }
-                        }
+                }
-                      }
+              }
-                    }' > project_data.json
+            }' > project_data.json
 
-                  echo 'PROJECT_ID='$(jq '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
+          echo 'PROJECT_ID='$(jq '.data.organization.projectNext.id' project_data.json) >> $GITHUB_ENV
-                  echo 'STATUS_FIELD_ID='$(jq '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") | .id' project_data.json) >> $GITHUB_ENV
+          echo 'STATUS_FIELD_ID='$(jq '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") | .id' project_data.json) >> $GITHUB_ENV
-                  echo 'INCOMING_OPTION_ID='$(jq '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Incoming PRs") |.id' project_data.json) >> $GITHUB_ENV
+          echo 'INCOMING_OPTION_ID='$(jq '.data.organization.projectNext.fields.nodes[] | select(.name== "Status") |.settings | fromjson.options[] | select(.name=="Incoming PRs") |.id' project_data.json) >> $GITHUB_ENV
 
-            - name: Add PR to project
+      - name: Add PR to project
-              env:
+        env:
-                  GITHUB_TOKEN: ${{ secrets.PAT }}
+          GITHUB_TOKEN: ${{ secrets.PAT }}
-                  PR_ID: ${{ github.event.pull_request.node_id }}
+          PR_ID: ${{ github.event.pull_request.node_id }}
-              run: |
+        run: |
-                  item_id="$( gh api graphql -f query='
+          item_id="$( gh api graphql -f query='
-                    mutation($project:ID!, $pr:ID!) {
+            mutation($project:ID!, $pr:ID!) {
-                      addProjectNextItem(input: {projectId: $project, contentId: $pr}) {
+              addProjectNextItem(input: {projectId: $project, contentId: $pr}) {
-                        projectNextItem {
+                projectNextItem {
-                          id
+                  id
-                        }
+                }
-                      }
+              }
-                    }' -f project=$PROJECT_ID -f pr=$PR_ID --jq '.data.addProjectNextItem.projectNextItem.id')"
+            }' -f project=$PROJECT_ID -f pr=$PR_ID --jq '.data.addProjectNextItem.projectNextItem.id')"
+          
+          echo 'ITEM_ID='$item_id >> $GITHUB_ENV
 
-                  echo 'ITEM_ID='$item_id >> $GITHUB_ENV
+      - name: Set fields
-
+        env:
-            - name: Set fields
+          GITHUB_TOKEN: ${{ secrets.PAT }}
-              env:
+        run: |
-                  GITHUB_TOKEN: ${{ secrets.PAT }}
+          gh api graphql -f query='
-              run: |
+            mutation (
-                  gh api graphql -f query='
+              $project: ID!
-                    mutation (
+              $item: ID!
-                      $project: ID!
+              $status_field: ID!
-                      $item: ID!
+              $status_value: String!
-                      $status_field: ID!
+            ) {
-                      $status_value: String!
+              set_status: updateProjectNextItemField(input: {
-                    ) {
+                projectId: $project
-                      set_status: updateProjectNextItemField(input: {
+                itemId: $item
-                        projectId: $project
+                fieldId: $status_field
-                        itemId: $item
+                value: $status_value
-                        fieldId: $status_field
+              }) {
-                        value: $status_value
+                projectNextItem {
-                      }) {
+                  id
-                        projectNextItem {
+                  }
-                          id
+              }
-                          }
+            }' -f project=$PROJECT_ID -f item=$ITEM_ID -f status_field=$STATUS_FIELD_ID -f status_value=${{ env.INCOMING_OPTION_ID }} --silent
-                      }
-                    }' -f project=$PROJECT_ID -f item=$ITEM_ID -f status_field=$STATUS_FIELD_ID -f status_value=${{ env.INCOMING_OPTION_ID }} --silent

.prettierignore

@@ -1 +0,0 @@
-src/components/markdown/prism.ts

package.json

@@ -133,7 +133,6 @@
         "typescript": "^4.4.2",
         "ulid": "^2.3.0",
         "use-resize-observer": "^7.0.0",
-        "vite-plugin-compression": "^0.3.6",
         "vite-plugin-pwa": "^0.8.1",
         "workbox-precaching": "^6.1.5"
     },

src/components/common/messaging/attachments/Attachment.tsx

@@ -5,6 +5,7 @@ import classNames from "classnames";
 import { attachContextMenu } from "preact-context-menu";
 import { useContext, useState } from "preact/hooks";
 
+import { useIntermediate } from "../../../../context/intermediate/Intermediate";
 import { AppContext } from "../../../../context/revoltjs/RevoltClient";
 
 import AttachmentActions from "./AttachmentActions";
@@ -38,7 +39,7 @@ export default function Attachment({ attachment, hasContent }: Props) {
                     width={metadata.width}
                     height={metadata.height}
                     onContextMenu={attachContextMenu("Menu", {
-                        attachment,
+                        attachment: attachment,
                     })}
                     className={classNames({
                         [styles.margin]: hasContent,

src/components/common/messaging/attachments/MessageReply.tsx

@@ -98,12 +98,6 @@ export const ReplyBase = styled.div<{
         transition: transform ease-in-out 0.1s;
         filter: brightness(1);
 
-        > span > p {
-            display: flex;
-            align-items: center;
-            gap: 4px;
-        }
-
         &:hover {
             filter: brightness(2);
         }

src/components/markdown/Renderer.tsx

@@ -9,6 +9,8 @@ import MarkdownEmoji from "markdown-it-emoji/dist/markdown-it-emoji-bare";
 import MarkdownSub from "markdown-it-sub";
 // @ts-expect-error No typings.
 import MarkdownSup from "markdown-it-sup";
+import Prism from "prismjs";
+import "prismjs/themes/prism-tomorrow.css";
 import { RE_MENTIONS } from "revolt.js";
 
 import styles from "./Markdown.module.scss";
@@ -24,7 +26,6 @@ import { generateEmoji } from "../common/Emoji";
 
 import { emojiDictionary } from "../../assets/emojis";
 import { MarkdownProps } from "./Markdown";
-import Prism from "./prism";
 
 // TODO: global.d.ts file for defining globals
 declare global {

src/components/markdown/prism.ts

@@ -1,104 +0,0 @@
-// This file handles importing Prism code highlighting library.
-
-import Prism from "prismjs";
-
-// Default: markup, html, xml, svg, mathml, ssml, atom,
-//          rss, css, clike, javascript, js
-
-import "prismjs/components/prism-c.min.js";
-import "prismjs/components/prism-cpp.min.js";
-import "prismjs/components/prism-csharp";
-import "prismjs/components/prism-bash.min.js";
-import "prismjs/components/prism-json.min.js";
-import "prismjs/components/prism-json5.min.js";
-import "prismjs/components/prism-typescript";
-import "prismjs/components/prism-rust";
-import "prismjs/components/prism-markdown";
-import "prismjs/components/prism-brainfuck";
-import "prismjs/components/prism-diff";
-import "prismjs/components/prism-ruby";
-import "prismjs/components/prism-go";
-import "prismjs/components/prism-ini";
-import "prismjs/components/prism-toml";
-import "prismjs/components/prism-java";
-import "prismjs/components/prism-kotlin";
-import "prismjs/components/prism-less";
-import "prismjs/components/prism-scss";
-import "prismjs/components/prism-sass";
-import "prismjs/components/prism-lua";
-import "prismjs/components/prism-makefile";
-import "prismjs/components/prism-perl";
-import "prismjs/components/prism-objectivec";
-import "prismjs/components/prism-python";
-import "prismjs/components/prism-r";
-import "prismjs/components/prism-sql";
-import "prismjs/components/prism-graphql";
-import "prismjs/components/prism-shell-session";
-import "prismjs/components/prism-java";
-import "prismjs/components/prism-powershell";
-import "prismjs/components/prism-swift";
-import "prismjs/components/prism-yaml";
-import "prismjs/components/prism-visual-basic";
-import "prismjs/components/prism-asm6502";
-import "prismjs/components/prism-nasm";
-import "prismjs/components/prism-wasm";
-import "prismjs/components/prism-llvm";
-import "prismjs/components/prism-apacheconf";
-import "prismjs/components/prism-dns-zone-file";
-import "prismjs/components/prism-docker";
-import "prismjs/components/prism-nginx";
-import "prismjs/components/prism-coq";
-import "prismjs/components/prism-elixir";
-import "prismjs/components/prism-elm";
-import "prismjs/components/prism-erlang";
-import "prismjs/components/prism-fsharp";
-import "prismjs/components/prism-haskell";
-import "prismjs/components/prism-ocaml";
-import "prismjs/components/prism-reason";
-import "prismjs/components/prism-scala";
-import "prismjs/components/prism-sml";
-import "prismjs/components/prism-xquery";
-import "prismjs/components/prism-glsl";
-import "prismjs/components/prism-mel";
-import "prismjs/components/prism-processing";
-import "prismjs/components/prism-clojure";
-import "prismjs/components/prism-lisp";
-import "prismjs/components/prism-scheme";
-import "prismjs/components/prism-asciidoc";
-import "prismjs/components/prism-latex";
-import "prismjs/components/prism-http";
-import "prismjs/components/prism-protobuf";
-import "prismjs/components/prism-fortran";
-import "prismjs/components/prism-wolfram";
-import "prismjs/components/prism-matlab";
-import "prismjs/components/prism-mizar";
-import "prismjs/components/prism-stan";
-import "prismjs/components/prism-jsstacktrace";
-import "prismjs/components/prism-javastacktrace";
-import "prismjs/components/prism-actionscript";
-import "prismjs/components/prism-applescript";
-import "prismjs/components/prism-autohotkey";
-import "prismjs/components/prism-autoit";
-import "prismjs/components/prism-coffeescript";
-import "prismjs/components/prism-dart";
-import "prismjs/components/prism-gml";
-import "prismjs/components/prism-livescript";
-import "prismjs/components/prism-moonscript";
-import "prismjs/components/prism-qml";
-import "prismjs/components/prism-vim";
-import "prismjs/components/prism-nim";
-import "prismjs/components/prism-swift";
-import "prismjs/components/prism-haml";
-import "prismjs/components/prism-ada";
-import "prismjs/components/prism-arduino";
-import "prismjs/components/prism-basic";
-import "prismjs/components/prism-crystal";
-import "prismjs/components/prism-batch";
-import "prismjs/components/prism-excel-formula";
-import "prismjs/components/prism-ebnf";
-import "prismjs/components/prism-haxe";
-import "prismjs/components/prism-mongodb";
-
-import "prismjs/themes/prism-tomorrow.css";
-
-export default Prism;

src/components/ui/Button.tsx

@@ -21,7 +21,7 @@ export default styled.button<Props>`
     align-items: center;
     justify-content: center;
     padding: 2px 16px;
-    font-size: 0.8125rem;
+    font-size: 0.875rem;
     font-family: inherit;
     font-weight: 500;
     flex-shrink: 0;

src/components/ui/Modal.tsx

@@ -61,63 +61,29 @@ const ModalBase = styled.div`
     }
 `;
 
-const ModalContainer = styled.div<
+const ModalContainer = styled.div`
-    {
-        [key in "userProfile"]?: boolean;
-    }
->`
     overflow: hidden;
-    padding: 12px;
+    max-width: calc(100vw - 20px);
-    width: 100%;
-    max-width: 440px;
     border-radius: var(--border-radius);
 
     animation-name: ${zoomIn};
     animation-duration: 0.25s;
     animation-timing-function: cubic-bezier(0.3, 0.3, 0.18, 1.1);
-
-    ${(props) =>
-        !props.userProfile &&
-        css`
-            max-width: max-content;
-        `}
 `;
 
 const ModalContent = styled.div<
-    {
+    { [key in "attachment" | "noBackground" | "border" | "padding"]?: boolean }
-        [key in
-            | "attachment"
-            | "noBackground"
-            | "border"
-            | "padding"
-            | "userProfile"]?: boolean;
-    }
 >`
     text-overflow: ellipsis;
     border-radius: var(--border-radius);
 
-    .title {
-        font-size: 14px;
-        text-decoration: underline;
-    }
-
     h3 {
-        font-size: 14px;
-        text-transform: uppercase;
-
         margin-top: 0;
     }
 
     form {
         display: flex;
         flex-direction: column;
-        gap: 8px;
-
-        > div {
-            margin: 0;
-            color: var(--secondary-foreground);
-            font-size: 12px;
-        }
     }
 
     ${(props) =>
@@ -129,7 +95,7 @@ const ModalContent = styled.div<
     ${(props) =>
         props.padding &&
         css`
-            padding: 1rem;
+            padding: 1.5em;
         `}
 
     ${(props) =>
@@ -151,7 +117,7 @@ const ModalActions = styled.div`
     display: flex;
     flex-direction: row-reverse;
 
-    padding: 1rem;
+    padding: 1em 1.5em;
     background: var(--secondary-background);
     border-radius: 0 0 var(--border-radius) var(--border-radius);
 `;
@@ -165,7 +131,6 @@ interface Props {
     children?: Children;
     title?: Children;
 
-    userProfile?: boolean;
     disallowClosing?: boolean;
     noBackground?: boolean;
     dontModal?: boolean;
@@ -187,7 +152,6 @@ export default function Modal(props: Props) {
         <ModalContent
             attachment={!!props.actions}
             noBackground={props.noBackground}
-            userProfile={props.userProfile}
             border={props.border}
             padding={props.padding ?? !props.dontModal}>
             {props.title && <h3>{props.title}</h3>}
@@ -245,9 +209,7 @@ export default function Modal(props: Props) {
         <ModalBase
             className={animateClose ? "closing" : undefined}
             onClick={(!props.disallowClosing && props.onClose) || undefined}>
-            <ModalContainer
+            <ModalContainer onClick={(e) => (e.cancelBubble = true)}>
-                onClick={(e) => (e.cancelBubble = true)}
-                userProfile={false}>
                 {content}
                 {props.actions && (
                     <ModalActions>

src/components/ui/fluent/CategoryButton.tsx

@@ -1,8 +1,4 @@
-import {
+import { ChevronRight, LinkExternal } from "@styled-icons/boxicons-regular";
-    ChevronRight,
-    LinkExternal,
-    Pencil,
-} from "@styled-icons/boxicons-regular";
 import styled, { css } from "styled-components";
 
 import { Children } from "../../../types/Preact";
@@ -15,6 +11,7 @@ interface BaseProps {
 }
 
 const CategoryBase = styled.div<BaseProps>`
+    /*height: 54px;*/
     padding: 9.8px 12px;
     border-radius: var(--border-radius);
     margin-bottom: 10px;
@@ -24,7 +21,6 @@ const CategoryBase = styled.div<BaseProps>`
     display: flex;
     align-items: center;
     flex-direction: row;
-    overflow: hidden;
 
     > svg {
         flex-shrink: 0;
@@ -146,6 +142,7 @@ export default function CategoryButton({
             {icon}
             <div class="content">
                 <div className="title">{children}</div>
+
                 <div className="description">{description}</div>
             </div>
             <div class="action">

src/context/intermediate/popovers/UserProfile.module.scss

@@ -123,6 +123,29 @@
         }
     }
 
+    .botStats {
+        background: var(--secondary-background);
+        border-radius: var(--border-radius);
+        padding: 10px;
+
+        font-size: 12px;
+
+        .stat {
+            display: flex;
+            align-items: center;
+            gap: 5px;
+            opacity: 0.5;
+
+            &:nth-child(1) {
+                opacity: 1;
+
+                > svg {
+                    color: var(--accent);
+                }
+            }
+        }
+    }
+
     > div {
         > span {
             font-size: 15px;
@@ -152,6 +175,10 @@
     border-radius: var(--border-radius);
     background-color: var(--secondary-background);
 
+    .info {
+        flex-grow: 1;
+    }
+
     &:hover {
         background-color: var(--primary-background);
     }
@@ -167,5 +194,19 @@
         overflow: hidden;
         white-space: nowrap;
         text-overflow: ellipsis;
+        font-size: 14px;
+    }
+}
+
+.botContainer {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    margin-bottom: 18px;
+
+    .owner {
+        text-transform: uppercase;
+        font-size: 10px;
+        font-weight: 600;
     }
 }

src/context/intermediate/popovers/UserProfile.tsx

@@ -1,10 +1,17 @@
-import { ListUl } from "@styled-icons/boxicons-regular";
+import {
+    ListUl,
+    DotsVerticalRounded,
+    ChevronRight,
+} from "@styled-icons/boxicons-regular";
 import {
     Envelope,
     Edit,
     UserPlus,
     Group,
     InfoCircle,
+    BadgeCheck,
+    Cog,
+    TimeFive,
 } from "@styled-icons/boxicons-solid";
 import { observer } from "mobx-react-lite";
 import { Link, useHistory } from "react-router-dom";
@@ -157,7 +164,6 @@ export const UserProfile = observer(
                         backgroundImage:
                             backgroundURL &&
                             `linear-gradient( rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) ), url('${backgroundURL}')`,
-                        paddingBottom: "1px",
                     }}>
                     <div className={styles.profile}>
                         <UserIcon
@@ -234,6 +240,9 @@ export const UserProfile = observer(
                                     <UserPlus size={28} />
                                 </IconButton>
                             )}
+                        {/*<IconButton onClick={() => user.addFriend()}>
+                            <DotsVerticalRounded size={26} />
+                        </IconButton>*/}
                     </div>
                     <div className={styles.tabs}>
                         <div
@@ -288,31 +297,59 @@ export const UserProfile = observer(
                                 {user.bot ? (
                                     <>
                                         <div className={styles.category}>
-                                            bot owner
+                                            Bot information
                                         </div>
-                                        <div
+                                        <div className={styles.botContainer}>
-                                            onClick={() =>
+                                            <div className={styles.botStats}>
-                                                user.bot &&
+                                                <div className={styles.stat}>
-                                                openScreen({
+                                                    <BadgeCheck size="15" />
-                                                    id: "profile",
+                                                    <b>
-                                                    user_id: user.bot.owner,
+                                                        This bot has been
-                                                })
+                                                        officially verified by
-                                            }
+                                                        Revolt
-                                            className={styles.entry}
+                                                    </b>
-                                            key={user.bot.owner}>
+                                                </div>
-                                            <UserIcon
+                                                <div className={styles.stat}>
-                                                size={32}
+                                                    <Cog size="15" />
-                                                target={client.users.get(
+                                                    Used in <b>456 servers</b>
-                                                    user.bot.owner,
+                                                </div>
-                                                )}
+                                                <div className={styles.stat}>
-                                            />
+                                                    <TimeFive size="14" />
-                                            <span>
+                                                    Bot active since{" "}
-                                                <Username
+                                                    <b>Apr 15, 2019</b>
-                                                    user={client.users.get(
+                                                </div>
+                                            </div>
+                                            <div
+                                                onClick={() =>
+                                                    user.bot &&
+                                                    openScreen({
+                                                        id: "profile",
+                                                        user_id: user.bot.owner,
+                                                    })
+                                                }
+                                                className={styles.entry}
+                                                key={user.bot.owner}>
+                                                <UserIcon
+                                                    size={32}
+                                                    target={client.users.get(
                                                         user.bot.owner,
                                                     )}
                                                 />
-                                            </span>
+                                                <div className={styles.info}>
+                                                    <Username
+                                                        user={client.users.get(
+                                                            user.bot.owner,
+                                                        )}
+                                                    />
+                                                    <div
+                                                        className={
+                                                            styles.owner
+                                                        }>
+                                                        Bot owner
+                                                    </div>
+                                                </div>
+                                                <ChevronRight size="24" />
+                                            </div>
                                         </div>
                                     </>
                                 ) : undefined}

src/context/revoltjs/FileUploads.module.scss

@@ -72,7 +72,6 @@
 
         .small {
             display: flex;
-            align-items: center;
             font-size: 10px;
             flex-direction: column;
             color: var(--tertiary-foreground);

src/context/revoltjs/FileUploads.tsx

@@ -20,39 +20,33 @@ type BehaviourType =
     | { behaviour: "ask"; onChange: (file: File) => void }
     | { behaviour: "upload"; onUpload: (id: string) => Promise<void> }
     | {
-          behaviour: "multi";
+        behaviour: "multi";
-          onChange: (files: File[]) => void;
+        onChange: (files: File[]) => void;
-          append?: (files: File[]) => void;
+        append?: (files: File[]) => void;
-      };
+    }
 
 type StyleType =
     | {
-          style: "icon" | "banner";
+        style: "icon" | "banner";
-          width?: number;
+        width?: number;
-          height?: number;
+        height?: number;
-          previewURL?: string;
+        previewURL?: string;
-          defaultPreview?: string;
+        defaultPreview?: string;
-          desaturateDefault?: boolean;
+        desaturateDefault?: boolean
-      }
+    }
     | {
-          style: "attachment";
+        style: "attachment";
-          attached: boolean;
+        attached: boolean;
-          uploading: boolean;
+        uploading: boolean;
-          cancel: () => void;
+        cancel: () => void;
-          size?: number;
+        size?: number;
-      };
+    }
 
-type Props = BehaviourType &
+type Props = BehaviourType & StyleType & {
-    StyleType & {
+    fileType: "backgrounds" | "icons" | "avatars" | "attachments" | "banners";
-        fileType:
+    maxFileSize: number;
-            | "backgrounds"
+    remove: () => Promise<void>;
-            | "icons"
+}
-            | "avatars"
-            | "attachments"
-            | "banners";
-        maxFileSize: number;
-        remove: () => Promise<void>;
-    };
 
 export async function uploadFile(
     autumnURL: string,
@@ -232,19 +226,14 @@ export function FileUploader(props: Props) {
                 })}
                 data-uploading={uploading}>
                 <div
-                    className={classNames(
+                    className={classNames(styles.image, props.desaturateDefault && previewURL == null && styles.desaturate)}
-                        styles.image,
-                        props.desaturateDefault &&
-                            previewURL == null &&
-                            styles.desaturate,
-                    )}
                     style={{
                         backgroundImage:
                             style === "icon"
                                 ? `url('${previewURL ?? defaultPreview}')`
                                 : previewURL
-                                ? `linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url('${previewURL}')`
+                                    ? `linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url('${previewURL}')`
-                                : "none",
+                                    : "none",
                         width,
                         height,
                     }}

src/context/revoltjs/Notifications.tsx

@@ -63,24 +63,22 @@ function Notifier({ options, notifs }: Props) {
             playSound("message");
             if (!showNotification) return;
 
-            const effectiveName = msg.masquerade?.name ?? msg.author?.username;
-
             let title;
             switch (msg.channel?.channel_type) {
                 case "SavedMessages":
                     return;
                 case "DirectMessage":
-                    title = `@${effectiveName}`;
+                    title = `@${msg.author?.username}`;
                     break;
                 case "Group":
                     if (msg.author?._id === "00000000000000000000000000") {
                         title = msg.channel.name;
                     } else {
-                        title = `@${effectiveName} - ${msg.channel.name}`;
+                        title = `@${msg.author?.username} - ${msg.channel.name}`;
                     }
                     break;
                 case "TextChannel":
-                    title = `@${effectiveName} (#${msg.channel.name}, ${msg.channel.server?.name})`;
+                    title = `@${msg.author?.username} (#${msg.channel.name}, ${msg.channel.server?.name})`;
                     break;
                 default:
                     title = msg.channel?._id;
@@ -102,12 +100,7 @@ function Notifier({ options, notifs }: Props) {
             let body, icon;
             if (typeof msg.content === "string") {
                 body = client.markdownToText(msg.content);
-
+                icon = msg.author?.generateAvatarURL({ max_side: 256 });
-                if (msg.masquerade?.avatar) {
-                    icon = client.proxyFile(msg.masquerade.avatar);
-                } else {
-                    icon = msg.author?.generateAvatarURL({ max_side: 256 });
-                }
             } else {
                 const users = client.users;
                 switch (msg.content.type) {

src/pages/home/Home.module.scss

@@ -1,53 +1,28 @@
 .home {
-    height: 100%;
     user-select: none;
-    position: relative;
 
-    .homeScreen {
+    h3 {
-        display: flex;
+        margin: 1em 0;
-        flex-direction: column;
+        font-size: 48px;
-        justify-content: center;
+        text-align: center;
-        align-items: center;
-        height: 95%;
-        padding: 12px;
 
-        h3 {
+        img {
-            margin: 20px 0;
+            height: 36px;
-            font-size: 48px;
-            text-align: center;
-
-            img {
-                height: 36px;
-            }
         }
+    }
+
+    .actions {
+        gap: 8px;
+        width: 236px;
+
+        margin: auto;
+        display: flex;
+        width: fit-content;
+        align-items: stretch;
+        flex-direction: column;
 
         a {
-            font-size: 13px;
+            width: 100%;
-        }
-
-        .actions {
-            //grid-template-columns: repeat(2, 300px);
-            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
-            grid-column: span 2;
-            gap: 16px;
-            //margin: auto;
-            display: grid;
-            width: fit-content;
-            align-items: stretch;
-            flex-direction: column;
-            margin-bottom: 20px;
-
-            a {
-                width: 100%;
-
-                &:nth-child(4) {
-                    margin-bottom: 20px;
-                }
-
-                div {
-                    margin: 0;
-                }
-            }
         }
     }
 }

src/pages/home/Home.tsx

@@ -1,20 +1,10 @@
-import { Money } from "@styled-icons/boxicons-regular";
+import { Home as HomeIcon } from "@styled-icons/boxicons-solid";
-import {
-    Home as HomeIcon,
-    PlusCircle,
-    Compass,
-    Megaphone,
-    Group,
-    Cog,
-    RightArrowCircle,
-} from "@styled-icons/boxicons-solid";
 import { Link } from "react-router-dom";
 import styled, { css } from "styled-components";
 
 import styles from "./Home.module.scss";
-import "./snow.scss";
 import { Text } from "preact-i18n";
-import { useContext, useMemo, useState } from "preact/hooks";
+import { useContext, useState } from "preact/hooks";
 
 import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
 
@@ -42,19 +32,6 @@ const IconConainer = styled.div`
     `}
 `;
 
-const Overlay = styled.div`
-    display: grid;
-    height: 100%;
-
-    > * {
-        grid-area: 1 / 1;
-    }
-
-    .content {
-        z-index: 1;
-    }
-`;
-
 export default function Home() {
     const client = useContext(AppContext);
     const [showChannels, setChannels] = useState(
@@ -82,140 +59,68 @@ export default function Home() {
         }
     };
 
-    const snowflakes = useMemo(() => {
-        const flakes = [];
-
-        // Disable outside of December
-        if (new Date().getMonth() !== 11) return [];
-
-        for (let i = 0; i < 15; i++) {
-            flakes.push("❄️");
-            flakes.push("❄");
-        }
-
-        for (let i = 0; i < 2; i++) {
-            flakes.push("🎄");
-            flakes.push("☃️");
-            flakes.push("⛄");
-        }
-
-        return flakes;
-    }, []);
-
     return (
         <div className={styles.home}>
-            <Overlay>
+            <Header placement="primary">
-                <div class="snowfall">
+                <IconConainer onClick={toggleChannelSidebar}>
-                    {snowflakes.map((emoji, index) => (
+                    <HomeIcon size={24} />
-                        <div key={index} class="snowflake">
+                </IconConainer>
-                            {emoji}
+                <Text id="app.navigation.tabs.home" />
-                        </div>
+            </Header>
-                    ))}
+            <h3>
-                </div>
+                <Text id="app.special.modals.onboarding.welcome" />
-                <div className="content">
+                <br />
-                    <Header placement="primary">
+                <img src={wideSVG} />
-                        <IconConainer onClick={toggleChannelSidebar}>
+            </h3>
-                            <HomeIcon size={24} />
+            <div className={styles.actions}>
-                        </IconConainer>
+                <Link to="/invite/Testers">
-                        <Text id="app.navigation.tabs.home" />
+                    <CategoryButton
-                    </Header>
+                        action="chevron"
-                    <div className={styles.homeScreen}>
+                        icon={<Emoji emoji="😁" size={32} />}>
-                        <h3>
+                        {client.servers.get("01F7ZSBSFHQ8TA81725KQCSDDP") ? (
-                            <Text id="app.special.modals.onboarding.welcome" />
+                            <Text id="app.home.goto-testers" />
-                            <br />
+                        ) : (
-                            <img src={wideSVG} />
+                            <Text id="app.home.join-testers" />
-                        </h3>
+                        )}
-                        <div className={styles.actions}>
+                    </CategoryButton>
-                            <Link to="/settings">
+                </Link>
-                                <CategoryButton
+                <a
-                                    action="chevron"
+                    href="https://insrt.uk/donate"
-                                    icon={<PlusCircle size={32} />}
+                    target="_blank"
-                                    description={
+                    rel="noreferrer">
-                                        "Invite all of your friends, some cool bots, and throw a big party."
+                    <CategoryButton
-                                    }>
+                        action="external"
-                                    Create a group
+                        icon={<Emoji emoji="💷" size={32} />}>
-                                </CategoryButton>
+                        <Text id="app.home.donate" />
-                            </Link>
+                    </CategoryButton>
-                            <a
+                </a>
-                                href="https://revolt.social"
+                <Link to="/settings/feedback">
-                                target="_blank"
+                    <CategoryButton
-                                rel="noreferrer">
+                        action="chevron"
-                                <CategoryButton
+                        icon={<Emoji emoji="🎉" size={32} />}>
-                                    action="external"
+                        <Text id="app.home.feedback" />
-                                    icon={<Compass size={32} />}
+                    </CategoryButton>
-                                    description={
+                </Link>
-                                        "Find a community based on your hobbies or interests."
+                <a
-                                    }>
+                    href="https://revolt.social"
-                                    Join a community
+                    target="_blank"
-                                </CategoryButton>
+                    rel="noreferrer">
-                            </a>
+                    <CategoryButton
-
+                        action="external"
-                            {client.servers.get(
+                        icon={<Emoji emoji="🧭" size={32} />}>
-                                "01F7ZSBSFHQ8TA81725KQCSDDP",
+                        <Text id="app.home.social" />
-                            ) ? (
+                    </CategoryButton>
-                                <Link to="/server/01F7ZSBSFHQ8TA81725KQCSDDP">
+                </a>
-                                    <CategoryButton
+                <Tooltip content={<Text id="app.home.settings-tooltip" />}>
-                                        action="chevron"
+                    <Link to="/settings">
-                                        icon={<RightArrowCircle size={32} />}
+                        <CategoryButton
-                                        description={
+                            action="chevron"
-                                            "You can report issues and discuss improvements with us directly here."
+                            icon={<Emoji emoji="🔧" size={32} />}>
-                                        }>
+                            <Text id="app.home.settings" />
-                                        <Text id="app.home.goto-testers" />
+                        </CategoryButton>
-                                    </CategoryButton>
+                    </Link>
-                                </Link>
+                </Tooltip>
-                            ) : (
+            </div>
-                                <Link to="/invite/Testers">
-                                    <CategoryButton
-                                        action="chevron"
-                                        icon={<Group size={32} />}
-                                        description={
-                                            "You can report issues and discuss improvements with us directly here."
-                                        }>
-                                        <Text id="app.home.join-testers" />
-                                    </CategoryButton>
-                                </Link>
-                            )}
-
-                            <Link to="/settings/feedback">
-                                <CategoryButton
-                                    action="chevron"
-                                    icon={<Megaphone size={32} />}
-                                    description={
-                                        "Let us know how we can improve our app by giving us feedback."
-                                    }>
-                                    <Text id="app.home.feedback" />
-                                </CategoryButton>
-                            </Link>
-                            <a
-                                href="https://insrt.uk/donate"
-                                target="_blank"
-                                rel="noreferrer">
-                                <CategoryButton
-                                    action="external"
-                                    icon={<Money size={32} />}>
-                                    <Text id="app.home.donate" />
-                                </CategoryButton>
-                            </a>
-
-                            <Tooltip
-                                content={
-                                    <Text id="app.home.settings-tooltip" />
-                                }>
-                                <Link to="/settings">
-                                    <CategoryButton
-                                        action="chevron"
-                                        icon={<Cog size={32} />}>
-                                        <Text id="app.home.settings" />
-                                    </CategoryButton>
-                                </Link>
-                            </Tooltip>
-                        </div>
-                        <Link to="/settings/appearance">
-                            <a>Turn off homescreen effects</a>
-                        </Link>
-                    </div>
-                </div>
-            </Overlay>{" "}
         </div>
     );
 }

src/pages/home/snow.scss

@@ -1,91 +0,0 @@
-// Pure CSS Snowfall
-// Released by Artimon under MIT license
-//
-// Source: https://github.com/Artimon/pure-css-snowfall
-
-$count: 36;
-$screenOffset: 0px;
-$fallDuration: 12;
-$windNoise: 30;
-$windSpeed: 4;
-$sizeNoise: 40;
-$rotation: 360;
-$imageSize: 20px;
-$fontSize: 40px;
-
-.snowfall {
-    z-index: 0;
-    display: block;
-
-    font-size: $fontSize;
-
-    overflow: hidden;
-    pointer-events: none;
-
-    .snowflake {
-        position: relative;
-        top: 0;
-        left: 0;
-
-        display: flex;
-        justify-content: center;
-
-        width: $screenOffset;
-        height: $screenOffset;
-
-        span {
-            align-self: center;
-        }
-
-        img {
-            align-self: center;
-            width: $imageSize;
-        }
-    }
-
-    @while ($count > 0) {
-        $left: random(100);
-        $deltaLeft: random(2 * $windNoise * 10) / 10 - $windNoise + $windSpeed;
-        $scale: 1 + (random(2 * $sizeNoise * 10) / 10 - $sizeNoise) / 100;
-
-        .snowflake:nth-child(#{$count}) {
-            animation: animation-snowflake-#{$count} linear infinite;
-            animation-duration: $fallDuration +
-                random($fallDuration * 10) /
-                10 +
-                s;
-            animation-delay: random(2 * $fallDuration * 10) /
-                10 -
-                (2 * $fallDuration) +
-                s;
-        }
-
-        @keyframes animation-snowflake-#{$count} {
-            0% {
-                left: percentage($left / 100);
-                top: calc(0% - #{$screenOffset});
-                transform: scale($scale)
-                    rotate3d(
-                        random(100) / 100,
-                        random(100) / 100,
-                        random(100) / 100,
-                        0deg
-                    );
-            }
-            100% {
-                left: percentage(($left + $deltaLeft) / 100);
-                top: calc(100% + #{$screenOffset});
-                transform: scale($scale)
-                    rotate3d(
-                        random(100) / 100,
-                        random(100) / 100,
-                        random(100) / 100,
-                        (random($rotation) + $rotation) *
-                            ((random(2) - 1) * 2 - 1) + deg
-                    );
-            }
-        }
-
-        $count: $count - 1;
-    }
-}

src/pages/settings/Settings.module.scss

@@ -193,9 +193,7 @@
             padding: 80px 32px;
             width: 100%;
             flex-direction: column;
-
+            height: fit-content;
-            // This prevents members, invites and ban list from being able to properly display.
-            // height: fit-content;
         }
 
         details {
@@ -244,10 +242,6 @@
             margin-top: 0;
             font-size: 0.75rem;
             font-weight: 400;
-
-            > a:hover {
-                text-decoration: underline;
-            }
         }
 
         h6 {

src/pages/settings/Settings.tsx

@@ -34,7 +34,6 @@ import {
     OperationsContext,
 } from "../../context/revoltjs/RevoltClient";
 
-import UserIcon from "../../components/common/user/UserIcon";
 import LineDivider from "../../components/ui/LineDivider";
 
 import ButtonItem from "../../components/navigation/items/ButtonItem";
@@ -55,15 +54,7 @@ import { Sessions } from "./panes/Sessions";
 import { Sync } from "./panes/Sync";
 import { ThemeShop } from "./panes/ThemeShop";
 
-const IndexHeader = styled.div`
+const IndexHeader = styled.div``;
-    /*display: flex;*/
-    background: var(--secondary-background);
-    border-radius: var(--border-radius);
-    padding: 20px;
-    align-items: center;
-    gap: 10px;
-    display: none;
-`;
 
 export default function Settings() {
     const history = useHistory();
@@ -270,12 +261,7 @@ export default function Settings() {
                     </div>
                 </>
             }
-            indexHeader={
+            indexHeader={<IndexHeader>{/**/}</IndexHeader>}
-                <IndexHeader>
-                    <UserIcon size={64} />
-                    Username
-                </IndexHeader>
-            }
         />
     );
 }

src/pages/settings/panes/Account.tsx

@@ -1,4 +1,4 @@
-import { At, Key, Block, ListOl } from "@styled-icons/boxicons-regular";
+import { At, Key, Block } from "@styled-icons/boxicons-regular";
 import {
     Envelope,
     HelpCircle,
@@ -165,7 +165,6 @@ export const Account = observer(() => {
                     </CategoryButton>
                 ))}
             </div>
-            <hr />
             <h3>
                 <Text id="app.settings.pages.account.2fa.title" />
             </h3>
@@ -185,17 +184,9 @@ export const Account = observer(() => {
                 icon={<Lock size={24} color="var(--error)" />}
                 description={"Set up 2FA on your account."}
                 disabled
-                action={<Text id="general.unavailable" />}>
+                action="chevron">
                 Set up Two-factor authentication
             </CategoryButton>
-            {/*<CategoryButton
-                icon={<ListOl size={24} />}
-                description={"View and download your 2FA backup codes."}
-                disabled
-                action="chevron">
-                View my backup codes
-            </CategoryButton>*/}
-            <hr />
             <h3>
                 <Text id="app.settings.pages.account.manage.title" />
             </h3>

src/pages/settings/panes/Appearance.tsx

@@ -165,20 +165,6 @@ export function Component(props: Props) {
             </h3>
             <ColourSwatches value={theme.accent} onChange={setAccent} />
 
-            {/* TOFIX: Chane this checkbox to turn off the seasonal home page animations*/}
-            <Checkbox
-                checked={props.settings.theme?.ligatures === true}
-                onChange={() =>
-                    setTheme({
-                        ligatures: !props.settings.theme?.ligatures,
-                    })
-                }
-                description={
-                    "Displays effects in the home tab during holiday seasons."
-                }>
-                Seasonal theme
-            </Checkbox>
-
             {/*<h3>
                 <Text id="app.settings.pages.appearance.message_display" />
             </h3>

src/pages/settings/panes/Panes.module.scss

@@ -149,21 +149,11 @@
 
     .badgePicker {
         display: flex;
+        gap: 10px;
         margin-bottom: 20px;
 
-        //padding-bottom: 8px;
-        position: relative;
-
-        .container {
-            display: flex;
-            overflow-x: auto;
-            gap: 10px;
-        }
-
         .check {
             cursor: pointer;
-
-            flex-shrink: 0;
             height: 50px;
             width: 50px;
             background: var(--secondary-background);
@@ -183,41 +173,9 @@
         }
     }
 
-    // TOFIX: need to merge overlay 1 and 2 later
-
-    .overlay {
-        position: absolute;
-        flex-shrink: 0;
-        width: 8px;
-        background: red;
-        height: 100%;
-
-        background: linear-gradient(
-            to right,
-            var(--primary-background),
-            transparent
-        );
-    }
-
-    .overlay2 {
-        position: absolute;
-        right: 0;
-        flex-shrink: 0;
-        width: 8px;
-        background: red;
-        height: 100%;
-
-        background: linear-gradient(
-            to left,
-            var(--primary-background),
-            transparent
-        );
-    }
-
     .row {
         gap: 20px;
         display: flex;
-        margin-bottom: 30px;
 
         .pfp {
             display: flex;

src/pages/settings/panes/Profile.tsx

@@ -74,15 +74,10 @@ export const Profile = observer(() => {
             </div>
             {/*<h3>Badges</h3>
             <div className={styles.badgePicker}>
-                <div className={styles.overlay} />
+                <div className={styles.check}>a</div>
-                <div className={styles.container}>
+                <div className={styles.check}>b</div>
-                    <div className={styles.check}>a</div>
+                <div className={styles.check}>c</div>
-                    <div className={styles.check}>b</div>
-                    <div className={styles.check}>c</div>
-                </div>
-                <div className={styles.overlay2} />
             </div>*/}
-            <hr />
             <div className={styles.row}>
                 <div className={styles.pfp}>
                     <h3>

src/pages/settings/panes/Sessions.tsx

@@ -1,5 +1,5 @@
 import { Chrome, Android, Apple, Windows } from "@styled-icons/boxicons-logos";
-import { HelpCircle, Desktop, LogOut } from "@styled-icons/boxicons-regular";
+import { HelpCircle, Desktop } from "@styled-icons/boxicons-regular";
 import {
     Safari,
     Firefoxbrowser,
@@ -24,7 +24,6 @@ import { AppContext } from "../../../context/revoltjs/RevoltClient";
 import Button from "../../../components/ui/Button";
 import Preloader from "../../../components/ui/Preloader";
 import Tip from "../../../components/ui/Tip";
-import CategoryButton from "../../../components/ui/fluent/CategoryButton";
 
 dayjs.extend(relativeTime);
 
@@ -208,7 +207,7 @@ export function Sessions() {
                     </div>
                 );
             })}
-            {/*<Button
+            <Button
                 error
                 onClick={async () => {
                     // ! FIXME: add to rAuth
@@ -231,37 +230,7 @@ export function Sessions() {
                     setSessions(sessions.filter((x) => x._id === deviceId));
                 }}>
                 <Text id="app.settings.pages.sessions.logout" />
-            </Button>*/}
+            </Button>
-            <hr />
-            <CategoryButton
-                onClick={async () => {
-                    // ! FIXME: add to rAuth
-                    const del: string[] = [];
-                    render.forEach((session) => {
-                        if (deviceId !== session._id) {
-                            del.push(session._id);
-                        }
-                    });
-
-                    setDelete(del);
-
-                    for (const id of del) {
-                        await client.req(
-                            "DELETE",
-                            `/auth/session/${id}` as "/auth/session/id",
-                        );
-                    }
-
-                    setSessions(sessions.filter((x) => x._id === deviceId));
-                }}
-                icon={<LogOut size={24} color={"var(--error)"} />}
-                action={"chevron"}
-                description={
-                    "Logs you out of all sessions except this device."
-                }>
-                <Text id="app.settings.pages.sessions.logout" />
-            </CategoryButton>
-
             <Tip>
                 <span>
                     <Text id="app.settings.tips.sessions.a" />

src/pages/settings/panes/ThemeShop.tsx

@@ -296,7 +296,6 @@ export function ThemeShop() {
             <Tip warning hideSeparator>
                 The Theme Shop is currently under construction.
             </Tip>
-            <hr />
             {/* FIXME INTEGRATE WITH MOBX */}
             {/*<ActiveTheme>
                 <div class="active-indicator">

src/pages/settings/server/Panes.module.scss

@@ -49,7 +49,6 @@
         display: flex;
         align-items: center;
         flex-direction: row;
-        border-radius: var(--border-radius);
         background: var(--secondary-background);
 
         span,
@@ -77,9 +76,6 @@
         }
     }
 
-    .invite {
-    }
-
     .member {
         cursor: pointer;
 
@@ -99,18 +95,12 @@
 
     .virtual {
         flex-grow: 1;
-        > div > div > div {
-            display: flex;
-            flex-direction: column;
-            gap: 8px;
-            flex-grow: 1;
-        }
     }
 }
 
 .roles {
     gap: 12px;
-    height: auto;
+    height: 100%;
     display: flex;
 
     .list {

vite.config.ts

@@ -2,7 +2,6 @@ import replace from "@rollup/plugin-replace";
 import { readFileSync } from "fs";
 import { resolve } from "path";
 import { defineConfig } from "vite";
-import viteCompression from "vite-plugin-compression";
 import { VitePWA } from "vite-plugin-pwa";
 
 import preact from "@preact/preset-vite";
@@ -43,10 +42,6 @@ function getVersion() {
 
 export default defineConfig({
     plugins: [
-        viteCompression({
-            verbose: true,
-            algorithm: "brotliCompress",
-        }),
         preact(),
         VitePWA({
             srcDir: "src",

yarn.lock

@@ -1877,7 +1877,7 @@ chalk@^2.0.0:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
-chalk@^4.0.0, chalk@^4.1.2:
+chalk@^4.0.0:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
   integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
@@ -4317,15 +4317,6 @@ value-equal@^1.0.1:
   resolved "https://registry.yarnpkg.com/value-equal/-/value-equal-1.0.1.tgz#1e0b794c734c5c0cade179c437d356d931a34d6c"
   integrity sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==
 
-vite-plugin-compression@^0.3.6:
-  version "0.3.6"
-  resolved "https://registry.yarnpkg.com/vite-plugin-compression/-/vite-plugin-compression-0.3.6.tgz#85e3ce5047ae6747bc3952177177a852fac901be"
-  integrity sha512-aSskQCJsP3VQ8PsnY+vO7UfD5qoFMOEuzg0PG2E9Zqyx+ARmc3wr9KCgOFraZOFW1Y4UAa5BR0SMTjoxHRMJoQ==
-  dependencies:
-    chalk "^4.1.2"
-    debug "^4.3.2"
-    fs-extra "^10.0.0"
-
 vite-plugin-pwa@^0.8.1:
   version "0.8.2"
   resolved "https://registry.yarnpkg.com/vite-plugin-pwa/-/vite-plugin-pwa-0.8.2.tgz#2789a157e2f71faf834d968945efc22eee9ad64a"