Merge remote-tracking branch 'origin/master' into jan-bansearchbar

.github/ISSUE_TEMPLATE/bug.yaml

@@ -52,7 +52,7 @@ body:
     id: desktop
     attributes:
       label: Desktop
-      description: Is this bug specific to [the desktop client](https://gihtub.com/revoltchat/desktop)? (If not, leave this unchecked.)
+      description: Is this bug specific to [the desktop client](https://github.com/revoltchat/desktop)? (If not, leave this unchecked.)
       options:
         - label: Yes, this bug is specific to Revolt Desktop and is *not* an issue with Revolt Desktop itself.
           required: false

.gitignore

@@ -7,6 +7,9 @@ dist-ssr
 *.log
 /.idea
 
+.yarn/cache
+.yarn/install-state.gz
+
 public/assets
 public/assets_*
 !public/assets_default

.yarnrc.yml

@@ -0,0 +1,9 @@
+nodeLinker: node-modules
+
+plugins:
+    - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
+      spec: "@yarnpkg/plugin-interactive-tools"
+    - path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
+      spec: "@yarnpkg/plugin-typescript"
+
+yarnPath: .yarn/releases/yarn-3.2.0.cjs

README.md

@@ -38,6 +38,8 @@ yarn
 yarn dev
 ```
 
+You can now access the client at http://local.revolt.chat:3000.
+
 ## CLI Commands
 
 | Command             | Description                                  |

package.json

@@ -61,7 +61,6 @@
     "dependencies": {
         "@fontsource/bitter": "^4.5.0",
         "@insertish/vite-plugin-babel-macros": "^1.0.5",
-        "color-rgba": "^2.3.0",
         "fs-extra": "^10.0.0",
         "klaw": "^3.0.0",
         "react-beautiful-dnd": "^13.1.0",
@@ -81,7 +80,7 @@
         "@fontsource/noto-sans": "^4.4.5",
         "@fontsource/open-sans": "^4.5.2",
         "@fontsource/opendyslexic": "^4.5.2",
-	   "@fontsource/poppins": "^4.4.5",
+        "@fontsource/poppins": "^4.4.5",
         "@fontsource/raleway": "^4.4.5",
         "@fontsource/roboto": "^4.4.5",
         "@fontsource/roboto-mono": "^4.4.5",
@@ -91,16 +90,16 @@
         "@fontsource/ubuntu-mono": "^4.4.5",
         "@hcaptcha/react-hcaptcha": "^0.3.6",
         "@preact/preset-vite": "^2.0.0",
+        "@revoltchat/ui": "1.0.28",
         "@rollup/plugin-replace": "^2.4.2",
-        "@styled-icons/boxicons-logos": "^10.34.0",
-        "@styled-icons/boxicons-regular": "^10.34.0",
-        "@styled-icons/boxicons-solid": "^10.37.0",
+        "@styled-icons/boxicons-logos": "^10.38.0",
+        "@styled-icons/boxicons-regular": "^10.38.0",
+        "@styled-icons/boxicons-solid": "^10.38.0",
         "@styled-icons/simple-icons": "^10.33.0",
         "@tippyjs/react": "^4.2.5",
         "@traptitech/markdown-it-katex": "^3.4.3",
         "@traptitech/markdown-it-spoiler": "^1.1.6",
         "@trivago/prettier-plugin-sort-imports": "^2.0.2",
-        "@types/color-rgba": "^2.1.0",
         "@types/lodash.defaultsdeep": "^4.6.6",
         "@types/lodash.isequal": "^4.5.5",
         "@types/markdown-it": "^12.0.2",
@@ -118,6 +117,7 @@
         "@typescript-eslint/parser": "^4.27.0",
         "@vitejs/plugin-legacy": "^1.7.1",
         "classnames": "^2.3.1",
+        "color-rgba": "^2.4.0",
         "dayjs": "^1.10.6",
         "detect-browser": "^5.2.0",
         "eslint": "^7.28.0",
@@ -127,13 +127,14 @@
         "localforage": "^1.9.0",
         "lodash.defaultsdeep": "^4.6.1",
         "lodash.isequal": "^4.5.0",
+        "long": "^5.2.0",
         "markdown-it": "^12.0.6",
         "markdown-it-emoji": "^2.0.0",
         "markdown-it-sub": "^1.0.0",
         "markdown-it-sup": "^1.0.0",
         "mediasoup-client": "npm:@insertish/mediasoup-client@3.6.36-esnext",
         "mobx": "^6.3.2",
-        "mobx-react-lite": "^3.2.0",
+        "mobx-react-lite": "^3.3.0",
         "preact": "^10.5.14",
         "preact-context-menu": "0.4.0-patch.0",
         "preact-i18n": "^2.4.0-preactx",
@@ -147,8 +148,7 @@
         "react-scroll": "^1.8.2",
         "react-virtualized-auto-sizer": "^1.0.5",
         "react-virtuoso": "^1.10.4",
-        "revolt-api": "^0.5.3-alpha.12",
-        "revolt.js": "^5.2.8",
+        "revolt.js": "6.0.0-rc.21",
         "rimraf": "^3.0.2",
         "sass": "^1.35.1",
         "shade-blend-color": "^1.0.0",
@@ -160,10 +160,10 @@
         "vite-plugin-pwa": "^0.11.13",
         "workbox-precaching": "^6.1.5"
     },
-    "packageManager": "yarn@1.22.17",
     "name": "client",
     "main": "index.js",
     "repository": "https://github.com/revoltchat/revite.git",
     "author": "Paul <paulmakles@gmail.com>",
-    "license": "MIT"
-}
+    "license": "MIT",
+    "packageManager": "yarn@3.2.0"
+}

src/components/common/AgeGate.tsx

@@ -1,6 +1,6 @@
 import { observer } from "mobx-react-lite";
 import { useHistory } from "react-router-dom";
-import { Channel } from "revolt.js/dist/maps/Channels";
+import { Channel } from "revolt.js";
 import styled from "styled-components/macro";
 
 import { Text } from "preact-i18n";

src/components/common/AutoComplete.tsx

@@ -1,5 +1,4 @@
-import { Channel } from "revolt.js/dist/maps/Channels";
-import { User } from "revolt.js/dist/maps/Users";
+import { Channel, User } from "revolt.js";
 import styled, { css } from "styled-components/macro";
 
 import { StateUpdater, useState } from "preact/hooks";

src/components/common/ChannelIcon.tsx

@@ -1,14 +1,15 @@
 import { Hash, VolumeFull } from "@styled-icons/boxicons-regular";
 import { observer } from "mobx-react-lite";
-import { Channel } from "revolt.js/dist/maps/Channels";
+import { Channel } from "revolt.js";
 
 import { useContext } from "preact/hooks";
 
 import { AppContext } from "../../context/revoltjs/RevoltClient";
 
-import { ImageIconBase, IconBaseProps } from "./IconBase";
 import fallback from "./assets/group.png";
 
+import { ImageIconBase, IconBaseProps } from "./IconBase";
+
 interface Props extends IconBaseProps<Channel> {
     isServerChannel?: boolean;
 }
@@ -32,7 +33,7 @@ export default observer(
             ...imgProps
         } = props;
         const iconURL = client.generateFileURL(
-            target?.icon ?? attachment,
+            target?.icon ?? attachment ?? undefined,
             { max_side: 256 },
             animate,
         );

src/components/common/IconBase.tsx

@@ -1,12 +1,13 @@
-import { Attachment } from "revolt-api/types/Autumn";
+import { API } from "revolt.js";
+import { Nullable } from "revolt.js";
 import styled, { css } from "styled-components/macro";
 
 import { Ref } from "preact";
 
 export interface IconBaseProps<T> {
     target?: T;
     url?: string;
-    attachment?: Attachment;
+    attachment?: Nullable<API.File>;
 
     size: number;
     hover?: boolean;

src/components/common/ServerHeader.tsx

@@ -2,14 +2,11 @@ import { Check } from "@styled-icons/boxicons-regular";
 import { Cog } from "@styled-icons/boxicons-solid";
 import { observer } from "mobx-react-lite";
 import { Link } from "react-router-dom";
-import { ServerPermission } from "revolt.js/dist/api/permissions";
-import { Server } from "revolt.js/dist/maps/Servers";
+import { Server } from "revolt.js";
 import styled, { css } from "styled-components/macro";
 
 import { Text } from "preact-i18n";
 
-import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
-
 import IconButton from "../ui/IconButton";
 
 import Tooltip from "./Tooltip";
@@ -125,7 +122,7 @@ export default observer(({ server }: Props) => {
                     </Tooltip>
                 ) : undefined}
                 <div className="title">{server.name}</div>
-                {(server.permission & ServerPermission.ManageServer) > 0 && (
+                {server.havePermission("ManageServer") && (
                     <Link to={`/server/${server._id}/settings`}>
                         <IconButton>
                             <Cog size={20} />

src/components/common/ServerIcon.tsx

@@ -1,5 +1,5 @@
 import { observer } from "mobx-react-lite";
-import { Server } from "revolt.js/dist/maps/Servers";
+import { Server } from "revolt.js";
 import styled from "styled-components/macro";
 
 import { useContext } from "preact/hooks";
@@ -39,7 +39,7 @@ export default observer(
         const { target, attachment, size, animate, server_name, ...imgProps } =
             props;
         const iconURL = client.generateFileURL(
-            target?.icon ?? attachment,
+            target?.icon ?? attachment ?? undefined,
             { max_side: 256 },
             animate,
         );

src/components/common/messaging/Message.tsx

@@ -1,5 +1,5 @@
 import { observer } from "mobx-react-lite";
-import { Message as MessageObject } from "revolt.js/dist/maps/Messages";
+import { Message as MessageObject } from "revolt.js";
 
 import { useTriggerEvents } from "preact-context-menu";
 import { memo } from "preact/compat";

src/components/common/messaging/MessageBase.tsx

@@ -1,5 +1,5 @@
 import { observer } from "mobx-react-lite";
-import { Message } from "revolt.js/dist/maps/Messages";
+import { Message } from "revolt.js";
 import styled, { css, keyframes } from "styled-components/macro";
 import { decodeTime } from "ulid";
 

src/components/common/messaging/MessageBox.tsx

@@ -1,8 +1,16 @@
-import { Send, ShieldX, HappyBeaming, Box } from "@styled-icons/boxicons-solid";
+import { Send, ShieldX } from "@styled-icons/boxicons-solid";
 import Axios, { CancelTokenSource } from "axios";
+import Long from "long";
 import { observer } from "mobx-react-lite";
-import { ChannelPermission } from "revolt.js/dist/api/permissions";
-import { Channel } from "revolt.js/dist/maps/Channels";
+import {
+    Channel,
+    DEFAULT_PERMISSION_DIRECT_MESSAGE,
+    DEFAULT_PERMISSION_VIEW_ONLY,
+    Permission,
+    Server,
+    U32_MAX,
+    UserPermission,
+} from "revolt.js";
 import styled, { css } from "styled-components/macro";
 import { ulid } from "ulid";
 
@@ -125,6 +133,11 @@ const FileAction = styled.div`
         display: flex;
         align-items: center;
         justify-content: center;
+    }
+`;
+
+const ThisCodeWillBeReplacedAnywaysSoIMightAsWellJustDoItThisWay__Padding = styled.div`
+    width: 16px;
 `;
 
 // For sed replacement
@@ -150,7 +163,7 @@ export default observer(({ channel }: Props) => {
 
     const renderer = getRenderer(channel);
 
-    if (!(channel.permission & ChannelPermission.SendMessage)) {
+    if (!channel.havePermission("SendMessage")) {
         return (
             <Base>
                 <Blocked>
@@ -231,7 +244,7 @@ export default observer(({ channel }: Props) => {
             );
             renderer.messages.reverse();
 
-            if (msg) {
+            if (msg?.content) {
                 // eslint-disable-next-line prefer-const
                 let [_, toReplace, newText, flags] = content.split(/\//);
 
@@ -493,7 +506,7 @@ export default observer(({ channel }: Props) => {
                 setReplies={setReplies}
             />
             <Base>
-                {channel.permission & ChannelPermission.UploadFiles ? (
+                {channel.havePermission("UploadFiles") ? (
                     <FileAction>
                         <FileUploader
                             size={24}
@@ -530,7 +543,9 @@ export default observer(({ channel }: Props) => {
                             }}
                         />
                     </FileAction>
-                ) : undefined}
+                ) : (
+                    <ThisCodeWillBeReplacedAnywaysSoIMightAsWellJustDoItThisWay__Padding />
+                )}
                 <TextAreaAutoSize
                     autoFocus
                     hideBorder

src/components/common/messaging/SystemMessage.tsx

@@ -11,8 +11,7 @@ import {
     MessageSquareEdit,
 } from "@styled-icons/boxicons-solid";
 import { observer } from "mobx-react-lite";
-import { SystemMessage as SystemMessageI } from "revolt-api/types/Channels";
-import { Message } from "revolt.js/dist/maps/Messages";
+import { Message, API } from "revolt.js";
 import styled from "styled-components/macro";
 
 import { useTriggerEvents } from "preact-context-menu";
@@ -75,13 +74,11 @@ export const SystemMessage = observer(
     ({ attachContext, message, highlight, hideInfo }: Props) => {
         const data = message.asSystemMessage;
         const SystemMessageIcon =
-            iconDictionary[data.type as SystemMessageI["type"]] ?? InfoCircle;
+            iconDictionary[data.type as API.SystemMessage["type"]] ??
+            InfoCircle;
 
-        let children;
+        let children = null;
         switch (data.type) {
-            case "text":
-                children = <span>{data.content}</span>;
-                break;
             case "user_added":
             case "user_remove":
                 children = (

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

@@ -1,4 +1,4 @@
-import { Attachment as AttachmentI } from "revolt-api/types/Autumn";
+import { API } from "revolt.js";
 
 import styles from "./Attachment.module.scss";
 import classNames from "classnames";
@@ -14,7 +14,7 @@ import Spoiler from "./Spoiler";
 import TextFile from "./TextFile";
 
 interface Props {
-    attachment: AttachmentI;
+    attachment: API.File;
     hasContent?: boolean;
 }
 

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

@@ -4,7 +4,7 @@ import {
     Download,
 } from "@styled-icons/boxicons-regular";
 import { File, Video } from "@styled-icons/boxicons-solid";
-import { Attachment } from "revolt-api/types/Autumn";
+import { API } from "revolt.js";
 
 import styles from "./AttachmentActions.module.scss";
 import classNames from "classnames";
@@ -17,7 +17,7 @@ import { AppContext } from "../../../../context/revoltjs/RevoltClient";
 import IconButton from "../../../ui/IconButton";
 
 interface Props {
-    attachment: Attachment;
+    attachment: API.File;
 }
 
 export default function AttachmentActions({ attachment }: Props) {