Fix elements not observing permissions.

package.json

@@ -97,7 +97,7 @@
     "react-router-dom": "^5.2.0",
     "react-scroll": "^1.8.2",
     "redux": "^4.1.0",
-    "revolt.js": "5.0.0-alpha.12",
+    "revolt.js": "5.0.0-alpha.14",
     "rimraf": "^3.0.2",
     "sass": "^1.35.1",
     "shade-blend-color": "^1.0.0",

src/components/common/messaging/MessageBox.tsx

@@ -1,5 +1,6 @@
 import { Send, ShieldX } from "@styled-icons/boxicons-solid";
 import Axios, { CancelTokenSource } from "axios";
+import { observer } from "mobx-react-lite";
 import { ChannelPermission } from "revolt.js/dist/api/permissions";
 import { Channel } from "revolt.js/dist/maps/Channels";
 import styled from "styled-components";
@@ -108,7 +109,7 @@ const Action = styled.div`
 // ! FIXME: add to app config and load from app config
 export const CAN_UPLOAD_AT_ONCE = 4;
 
-export default function MessageBox({ channel }: Props) {
+export default observer(({ channel }: Props) => {
     const [draft, setDraft] = useState(getState().drafts[channel._id] ?? "");
 
     const [uploadState, setUploadState] = useState<UploadState>({
@@ -506,4 +507,4 @@ export default function MessageBox({ channel }: Props) {
             </Base>
         </>
     );
-}
+});

src/context/intermediate/popovers/UserProfile.tsx

@@ -1,5 +1,6 @@
 import { Money } from "@styled-icons/boxicons-regular";
 import { Envelope, Edit, UserPlus, Shield } from "@styled-icons/boxicons-solid";
+import { observer } from "mobx-react-lite";
 import { Link, useHistory } from "react-router-dom";
 import { Profile, RelationshipStatus } from "revolt-api/types/Users";
 import { UserPermission } from "revolt.js/dist/api/permissions";
@@ -41,7 +42,8 @@ enum Badges {
     EarlyAdopter = 256,
 }
 
-export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
+export const UserProfile = observer(
+    ({ user_id, onClose, dummy, dummyProfile }: Props) => {
         const { openScreen, writeClipboard } = useIntermediate();
 
         const [profile, setProfile] = useState<undefined | null | Profile>(
@@ -84,7 +86,10 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
 
         useEffect(() => {
             if (dummy) return;
-        if (status === ClientStatus.ONLINE && typeof mutual === "undefined") {
+            if (
+                status === ClientStatus.ONLINE &&
+                typeof mutual === "undefined"
+            ) {
                 setMutual(null);
                 user.fetchMutual().then(setMutual);
             }
@@ -92,7 +97,10 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
 
         useEffect(() => {
             if (dummy) return;
-        if (status === ClientStatus.ONLINE && typeof profile === "undefined") {
+            if (
+                status === ClientStatus.ONLINE &&
+                typeof profile === "undefined"
+            ) {
                 setProfile(null);
 
                 if (user.permission & UserPermission.ViewProfile) {
@@ -129,7 +137,9 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
                             <Localizer>
                                 <span
                                     className={styles.username}
-                                onClick={() => writeClipboard(user.username)}>
+                                    onClick={() =>
+                                        writeClipboard(user.username)
+                                    }>
                                     @{user.username}
                                 </span>
                             </Localizer>
@@ -245,17 +255,24 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
                                                 content={
                                                     <Text id="app.special.popovers.user_profile.badges.supporter" />
                                                 }>
-                                            <Money size={32} color="#efab44" />
+                                                <Money
+                                                    size={32}
+                                                    color="#efab44"
+                                                />
                                             </Tooltip>
                                         ) : (
                                             <></>
                                         )}
-                                    {badges & Badges.ResponsibleDisclosure ? (
+                                        {badges &
+                                        Badges.ResponsibleDisclosure ? (
                                             <Tooltip
                                                 content={
                                                     <Text id="app.special.popovers.user_profile.badges.responsible_disclosure" />
                                                 }>
-                                            <Shield size={32} color="gray" />
+                                                <Shield
+                                                    size={32}
+                                                    color="gray"
+                                                />
                                             </Tooltip>
                                         ) : (
                                             <></>
@@ -334,4 +351,5 @@ export function UserProfile({ user_id, onClose, dummy, dummyProfile }: Props) {
                 </div>
             </Modal>
         );
-}
+    },
+);

src/pages/settings/ChannelSettings.tsx

@@ -30,7 +30,7 @@ export default function ChannelSettings() {
         switch (channel?.channel_type) {
             case "TextChannel":
             case "VoiceChannel":
-                base_url = `/server/${channel.server}/channel/${cid}/settings`;
+                base_url = `/server/${channel.server_id}/channel/${cid}/settings`;
                 break;
             default:
                 base_url = `/channel/${cid}/settings`;

src/pages/settings/server/Members.tsx

@@ -27,8 +27,6 @@ export const Members = observer(({ server }: Props) => {
         { members: Member[]; users: User[] } | undefined
     >(undefined);
 
-    const client = useClient();
-
     useEffect(() => {
         server.fetchMembers().then(setData);
     }, []);
@@ -50,10 +48,12 @@ export const Members = observer(({ server }: Props) => {
             {data &&
                 data.members.length > 0 &&
                 data.members
-                    .map((member, index) => {
+                    .map((member) => {
                         return {
                             member,
-                            user: data.users[index],
+                            user: data.users.find(
+                                (x) => x._id === member._id.user,
+                            ),
                         };
                     })
                     .map(({ member, user }) => (

yarn.lock

@@ -3570,10 +3570,10 @@ revolt-api@0.5.1-alpha.10-patch.0:
   resolved "https://registry.yarnpkg.com/revolt-api/-/revolt-api-0.5.1-alpha.10-patch.0.tgz#97d31bec7dfa4573567097443acb059c4feaac20"
   integrity sha512-UyM890HkGlYNQOxpHuEpUsJHLt8Ujnjg9/zPEDGpbvS4iy0jmHX23Hh8tOCfb/ewxbNrtT3G1HpSWKOneW/vYg==
 
-revolt.js@5.0.0-alpha.12:
+revolt.js@5.0.0-alpha.14:
-  version "5.0.0-alpha.12"
+  version "5.0.0-alpha.14"
-  resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.0-alpha.12.tgz#06777f74f6a79161b18e02938a8d60d465395066"
+  resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-5.0.0-alpha.14.tgz#13b1d350a89467eb2ad6905a290ee1fada4150c1"
-  integrity sha512-QqgawsSjrFTKhMA5JBKii6MgOJ4VO2u1GBmjTiKzPR2krnoWHdPSbD7VvD2scMGMPXIaIxU3zA++tyN8mfzIFg==
+  integrity sha512-kZBIx9PX8Y8Esu51Y6OgeFwlpajtaRv/ap3YKlWEELlAcDAEDoSZj+iL4ilkxIxvh4RDJMlVlAforwSvXvy9DQ==
   dependencies:
     axios "^0.19.2"
     eventemitter3 "^4.0.7"