Work towards removing useUsers.

src/components/common/user/UserHover.tsx

@@ -1,7 +1,7 @@
-import { InfoCircle } from "@styled-icons/boxicons-regular";
-import { User } from "revolt.js";
 import styled from "styled-components";
 
+import { User } from "../../../mobx";
+
 import { Children } from "../../../types/Preact";
 import Tooltip from "../Tooltip";
 import { Username } from "./UserShort";

src/components/common/user/UserIcon.tsx

@@ -1,5 +1,5 @@
 import { MicrophoneOff } from "@styled-icons/boxicons-regular";
-import { User } from "revolt.js";
+import { observer } from "mobx-react-lite";
 import { Users } from "revolt.js/dist/api/objects";
 import styled, { css } from "styled-components";
 
@@ -8,6 +8,7 @@ import { useContext } from "preact/hooks";
 import { ThemeContext } from "../../../context/Theme";
 import { AppContext } from "../../../context/revoltjs/RevoltClient";
 
+import { User } from "../../../mobx";
 import IconBase, { IconBaseProps } from "../IconBase";
 import fallback from "../assets/user.png";
 
@@ -50,55 +51,63 @@ const VoiceIndicator = styled.div<{ status: VoiceStatus }>`
         `}
 `;
 
-export default function UserIcon(
-    props: Props & Omit<JSX.SVGAttributes<SVGSVGElement>, keyof Props>,
-) {
-    const client = useContext(AppContext);
+export default observer(
+    (props: Props & Omit<JSX.SVGAttributes<SVGSVGElement>, keyof Props>) => {
+        const client = useContext(AppContext);
 
-    const {
-        target,
-        attachment,
-        size,
-        voice,
-        status,
-        animate,
-        mask,
-        children,
-        as,
-        ...svgProps
-    } = props;
-    const iconURL =
-        client.generateFileURL(
-            target?.avatar ?? attachment,
-            { max_side: 256 },
+        const {
+            target,
+            attachment,
+            size,
+            voice,
+            status,
             animate,
-        ) ?? (target ? client.users.getDefaultAvatarURL(target._id) : fallback);
+            mask,
+            children,
+            as,
+            ...svgProps
+        } = props;
+        const iconURL =
+            client.generateFileURL(
+                target?.avatar ?? attachment,
+                { max_side: 256 },
+                animate,
+            ) ??
+            (target ? client.users.getDefaultAvatarURL(target._id) : fallback);
 
-    return (
-        <IconBase
-            {...svgProps}
-            width={size}
-            height={size}
-            aria-hidden="true"
-            viewBox="0 0 32 32">
-            <foreignObject
-                x="0"
-                y="0"
-                width="32"
-                height="32"
-                mask={mask ?? (status ? "url(#user)" : undefined)}>
-                {<img src={iconURL} draggable={false} loading="lazy" />}
-            </foreignObject>
-            {props.status && (
-                <circle cx="27" cy="27" r="5" fill={useStatusColour(target)} />
-            )}
-            {props.voice && (
-                <foreignObject x="22" y="22" width="10" height="10">
-                    <VoiceIndicator status={props.voice}>
-                        {props.voice === "muted" && <MicrophoneOff size={6} />}
-                    </VoiceIndicator>
+        return (
+            <IconBase
+                {...svgProps}
+                width={size}
+                height={size}
+                aria-hidden="true"
+                viewBox="0 0 32 32">
+                <foreignObject
+                    x="0"
+                    y="0"
+                    width="32"
+                    height="32"
+                    mask={mask ?? (status ? "url(#user)" : undefined)}>
+                    {<img src={iconURL} draggable={false} loading="lazy" />}
                 </foreignObject>
-            )}
-        </IconBase>
-    );
-}
+                {props.status && (
+                    <circle
+                        cx="27"
+                        cy="27"
+                        r="5"
+                        fill={useStatusColour(target)}
+                    />
+                )}
+                {props.voice && (
+                    <foreignObject x="22" y="22" width="10" height="10">
+                        <VoiceIndicator status={props.voice}>
+                            {props.voice === "muted" && (
+                                <MicrophoneOff size={6} />
+                            )}
+                        </VoiceIndicator>
+                    </foreignObject>
+                )}
+            </IconBase>
+        );
+    },
+);

src/components/common/user/UserShort.tsx

@@ -1,8 +1,10 @@
+import { observer } from "mobx-react-lite";
 import { useParams } from "react-router-dom";
-import { User } from "revolt.js";
 
 import { Text } from "preact-i18n";
 
+import { User } from "../../../mobx";
+
 import {
     useForceUpdate,
     useMember,
@@ -11,44 +13,46 @@ import {
 
 import UserIcon from "./UserIcon";
 
-export function Username({
-    user,
-    ...otherProps
-}: { user?: User } & JSX.HTMLAttributes<HTMLElement>) {
-    let username = user?.username;
-    let color;
+export const Username = observer(
+    ({
+        user,
+        ...otherProps
+    }: { user?: User } & JSX.HTMLAttributes<HTMLElement>) => {
+        let username = user?.username;
+        let color;
 
-    // ! FIXME: this must be really bad for perf.
-    if (user) {
-        let { server } = useParams<{ server?: string }>();
-        if (server) {
-            let ctx = useForceUpdate();
-            let member = useMember(`${server}${user._id}`, ctx);
-            if (member) {
-                if (member.nickname) {
-                    username = member.nickname;
-                }
+        // ! FIXME: this must be really bad for perf.
+        if (user) {
+            let { server } = useParams<{ server?: string }>();
+            if (server) {
+                let ctx = useForceUpdate();
+                let member = useMember(`${server}${user._id}`, ctx);
+                if (member) {
+                    if (member.nickname) {
+                        username = member.nickname;
+                    }
 
-                if (member.roles && member.roles.length > 0) {
-                    let s = useServer(server, ctx);
-                    for (let role of member.roles) {
-                        let c = s?.roles?.[role].colour;
-                        if (c) {
-                            color = c;
-                            continue;
+                    if (member.roles && member.roles.length > 0) {
+                        let s = useServer(server, ctx);
+                        for (let role of member.roles) {
+                            let c = s?.roles?.[role].colour;
+                            if (c) {
+                                color = c;
+                                continue;
+                            }
                         }
                     }
                 }
             }
         }
-    }
 
-    return (
-        <span {...otherProps} style={{ color }}>
-            {username ?? <Text id="app.main.channel.unknown_user" />}
-        </span>
-    );
-}
+        return (
+            <span {...otherProps} style={{ color }}>
+                {username ?? <Text id="app.main.channel.unknown_user" />}
+            </span>
+        );
+    },
+);
 
 export default function UserShort({
     user,

src/components/common/user/UserStatus.tsx

@@ -1,8 +1,9 @@
-import { User } from "revolt.js";
+import { observer } from "mobx-react-lite";
 import { Users } from "revolt.js/dist/api/objects";
 
 import { Text } from "preact-i18n";
 
+import { User } from "../../../mobx";
 import Tooltip from "../Tooltip";
 
 interface Props {
@@ -10,7 +11,7 @@ interface Props {
     tooltip?: boolean;
 }
 
-export default function UserStatus({ user, tooltip }: Props) {
+export default observer(({ user, tooltip }: Props) => {
     if (user?.online) {
         if (user.status?.text) {
             if (tooltip) {
@@ -40,4 +41,4 @@ export default function UserStatus({ user, tooltip }: Props) {
     }
 
     return <Text id="app.status.offline" />;
-}
+});

src/components/navigation/items/ButtonItem.tsx

@@ -1,4 +1,5 @@
 import { X, Crown } from "@styled-icons/boxicons-regular";
+import { observer } from "mobx-react-lite";
 import { Channels, Users } from "revolt.js/dist/api/objects";
 
 import styles from "./Item.module.scss";
@@ -9,6 +10,8 @@ import { Localizer, Text } from "preact-i18n";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 import { stopPropagation } from "../../../lib/stopPropagation";
 
+import { User } from "../../../mobx";
+
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
 
 import ChannelIcon from "../../common/ChannelIcon";
@@ -30,12 +33,12 @@ type CommonProps = Omit<
 };
 
 type UserProps = CommonProps & {
-    user: Users.User;
+    user: User;
     context?: Channels.Channel;
     channel?: Channels.DirectMessageChannel;
 };
 
-export function UserButton(props: UserProps) {
+export const UserButton = observer((props: UserProps) => {
     const { active, alert, alertCount, user, context, channel, ...divProps } =
         props;
     const { openScreen } = useIntermediate();
@@ -109,11 +112,11 @@ export function UserButton(props: UserProps) {
             </div>
         </div>
     );
-}
+});
 
 type ChannelProps = CommonProps & {
     channel: Channels.Channel & { unread?: string };
-    user?: Users.User;
+    user?: User;
     compact?: boolean;
 };
 

src/components/navigation/left/HomeSidebar.tsx

@@ -4,6 +4,7 @@ import {
     Wrench,
     Notepad,
 } from "@styled-icons/boxicons-solid";
+import { observer } from "mobx-react-lite";
 import { Link, Redirect, useLocation, useParams } from "react-router-dom";
 import { Channels } from "revolt.js/dist/api/objects";
 import { Users as UsersNS } from "revolt.js/dist/api/objects";
@@ -15,6 +16,7 @@ import ConditionalLink from "../../../lib/ConditionalLink";
 import PaintCounter from "../../../lib/PaintCounter";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
+import { useData } from "../../../mobx/State";
 import { dispatch } from "../../../redux";
 import { connectState } from "../../../redux/connector";
 import { Unreads } from "../../../redux/reducers/unreads";
@@ -39,7 +41,7 @@ type Props = {
     unreads: Unreads;
 };
 
-function HomeSidebar(props: Props) {
+const HomeSidebar = observer((props: Props) => {
     const { pathname } = useLocation();
     const client = useContext(AppContext);
     const { channel } = useParams<{ channel: string }>();
@@ -66,7 +68,7 @@ function HomeSidebar(props: Props) {
         .filter((x) => x.channel_type !== "SavedMessages")
         .map((x) => mapChannelWithUnread(x, props.unreads));
 
-    const users = useUsers(undefined, ctx);
+    const store = useData();
     channelsArr.sort((b, a) => a.timestamp.localeCompare(b.timestamp));
 
     return (
@@ -89,7 +91,7 @@ function HomeSidebar(props: Props) {
                             <ButtonItem
                                 active={pathname === "/friends"}
                                 alert={
-                                    typeof users.find(
+                                    typeof [...store.users.values()].find(
                                         (user) =>
                                             user?.relationship ===
                                             UsersNS.Relationship.Incoming,
@@ -143,7 +145,7 @@ function HomeSidebar(props: Props) {
                         if (!x.active) return null;
 
                         const recipient = client.channels.getRecipient(x._id);
-                        user = users.find((x) => x?._id === recipient);
+                        user = store.users.get(recipient);
 
                         if (!user) {
                             console.warn(
@@ -171,7 +173,7 @@ function HomeSidebar(props: Props) {
             </GenericSidebarList>
         </GenericSidebarBase>
     );
-}
+});
 
 export default connectState(
     HomeSidebar,

src/components/navigation/left/ServerListSidebar.tsx

@@ -1,4 +1,5 @@
 import { Plus } from "@styled-icons/boxicons-regular";
+import { observer } from "mobx-react-lite";
 import { useLocation, useParams } from "react-router-dom";
 import { Channel, Servers, Users } from "revolt.js/dist/api/objects";
 import styled, { css } from "styled-components";
@@ -9,17 +10,17 @@ import ConditionalLink from "../../../lib/ConditionalLink";
 import PaintCounter from "../../../lib/PaintCounter";
 import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
 
+import { useData } from "../../../mobx/State";
 import { connectState } from "../../../redux/connector";
 import { LastOpened } from "../../../redux/reducers/last_opened";
 import { Unreads } from "../../../redux/reducers/unreads";
 
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
+import { useClient } from "../../../context/revoltjs/RevoltClient";
 import {
     useChannels,
     useForceUpdate,
-    useSelf,
     useServers,
-    useUsers,
 } from "../../../context/revoltjs/hooks";
 
 import logoSVG from "../../../assets/logo.svg";
@@ -178,14 +179,16 @@ interface Props {
     lastOpened: LastOpened;
 }
 
-export function ServerListSidebar({ unreads, lastOpened }: Props) {
+export const ServerListSidebar = observer(({ unreads, lastOpened }: Props) => {
+    const store = useData();
+    const client = useClient();
+    const self = store.users.get(client.user!._id);
+
     const ctx = useForceUpdate();
-    const self = useSelf(ctx);
     const activeServers = useServers(undefined, ctx) as Servers.Server[];
     const channels = (useChannels(undefined, ctx) as Channel[]).map((x) =>
         mapChannelWithUnread(x, unreads),
     );
-    const users = useUsers(undefined, ctx);
 
     const unreadChannels = channels.filter((x) => x.unread).map((x) => x._id);
 
@@ -230,7 +233,11 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
         }
     }
 
-    if (users.find((x) => x?.relationship === Users.Relationship.Incoming)) {
+    if (
+        [...store.users.values()].find(
+            (x) => x.relationship === Users.Relationship.Incoming,
+        )
+    ) {
         alertCount++;
     }
 
@@ -298,7 +305,7 @@ export function ServerListSidebar({ unreads, lastOpened }: Props) {
             </ServerList>
         </ServersBase>
     );
-}
+});
 
 export default connectState(ServerListSidebar, (state) => {
     return {

src/components/navigation/right/MemberSidebar.tsx

@@ -1,3 +1,4 @@
+import { observer } from "mobx-react-lite";
 import { useParams } from "react-router";
 import { Link } from "react-router-dom";
 import { User } from "revolt.js";
@@ -7,6 +8,7 @@ import { ClientboundNotification } from "revolt.js/dist/websocket/notifications"
 import { Text } from "preact-i18n";
 import { useContext, useEffect, useState } from "preact/hooks";
 
+import { useData } from "../../../mobx/State";
 import { getState } from "../../../redux";
 
 import { useIntermediate } from "../../../context/intermediate/Intermediate";
@@ -52,17 +54,16 @@ export default function MemberSidebar(props: { channel?: Channels.Channel }) {
     }
 }
 
-export function GroupMemberSidebar({
-    channel,
-    ctx,
-}: Props & { channel: Channels.GroupChannel }) {
-    const { openScreen } = useIntermediate();
-    const users = useUsers(undefined, ctx);
-    const members = channel.recipients
-        .map((x) => users.find((y) => y?._id === x))
-        .filter((x) => typeof x !== "undefined") as User[];
+export const GroupMemberSidebar = observer(
+    ({ channel }: Props & { channel: Channels.GroupChannel }) => {
+        const { openScreen } = useIntermediate();
 
-    /*const voice = useContext(VoiceContext);
+        const store = useData();
+        const members = channel.recipients
+            ?.map((member) => store.users.get(member)!)
+            .filter((x) => typeof x !== "undefined");
+
+        /*const voice = useContext(VoiceContext);
     const voiceActive = voice.roomId === channel._id;
 
     let voiceParticipants: User[] = [];
@@ -77,34 +78,36 @@ export function GroupMemberSidebar({
         voiceParticipants.sort((a, b) => a.username.localeCompare(b.username));
     }*/
 
-    members.sort((a, b) => {
-        // ! FIXME: should probably rewrite all this code
-        const l =
-            +(
-                (a.online && a.status?.presence !== Users.Presence.Invisible) ??
-                false
-            ) | 0;
-        const r =
-            +(
-                (b.online && b.status?.presence !== Users.Presence.Invisible) ??
-                false
-            ) | 0;
+        members.sort((a, b) => {
+            // ! FIXME: should probably rewrite all this code
+            const l =
+                +(
+                    (a.online &&
+                        a.status?.presence !== Users.Presence.Invisible) ??
+                    false
+                ) | 0;
+            const r =
+                +(
+                    (b.online &&
+                        b.status?.presence !== Users.Presence.Invisible) ??
+                    false
+                ) | 0;
 
-        const n = r - l;
-        if (n !== 0) {
-            return n;
-        }
+            const n = r - l;
+            if (n !== 0) {
+                return n;
+            }
 
-        return a.username.localeCompare(b.username);
-    });
+            return a.username.localeCompare(b.username);
+        });
 
-    return (
-        <GenericSidebarBase>
-            <GenericSidebarList>
-                <ChannelDebugInfo id={channel._id} />
-                <Search channel={channel._id} />
+        return (
+            <GenericSidebarBase>
+                <GenericSidebarList>
+                    <ChannelDebugInfo id={channel._id} />
+                    <Search channel={channel._id} />
 
-                {/*voiceActive && voiceParticipants.length !== 0 && (
+                    {/*voiceActive && voiceParticipants.length !== 0 && (
                     <Fragment>
                         <Category
                             type="members"
@@ -129,140 +132,25 @@ export function GroupMemberSidebar({
                         )}
                     </Fragment>
                 )*/}
-                <CollapsibleSection
-                    sticky
-                    id="members"
-                    defaultValue
-                    summary={
-                        <Category
-                            variant="uniform"
-                            text={
-                                <span>
-                                    <Text id="app.main.categories.members" /> —{" "}
-                                    {channel.recipients.length}
-                                </span>
-                            }
-                        />
-                    }>
-                    {members.length === 0 && (
-                        <img src={placeholderSVG} loading="eager" />
-                    )}
-                    {members.map(
-                        (user) =>
-                            user && (
-                                <UserButton
-                                    key={user._id}
-                                    user={user}
-                                    context={channel}
-                                    onClick={() =>
-                                        openScreen({
-                                            id: "profile",
-                                            user_id: user._id,
-                                        })
-                                    }
-                                />
-                            ),
-                    )}
-                </CollapsibleSection>
-            </GenericSidebarList>
-        </GenericSidebarBase>
-    );
-}
-
-export function ServerMemberSidebar({
-    channel,
-    ctx,
-}: Props & { channel: Channels.TextChannel }) {
-    const [members, setMembers] = useState<Servers.Member[] | undefined>(
-        undefined,
-    );
-    const users = useUsers(members?.map((x) => x._id.user) ?? []).filter(
-        (x) => typeof x !== "undefined",
-        ctx,
-    ) as Users.User[];
-    const { openScreen } = useIntermediate();
-    const status = useContext(StatusContext);
-    const client = useContext(AppContext);
-
-    useEffect(() => {
-        if (status === ClientStatus.ONLINE && typeof members === "undefined") {
-            client.members
-                .fetchMembers(channel.server)
-                .then((members) => setMembers(members));
-        }
-    }, [status]);
-
-    // ! FIXME: temporary code
-    useEffect(() => {
-        function onPacket(packet: ClientboundNotification) {
-            if (!members) return;
-            if (packet.type === "ServerMemberJoin") {
-                if (packet.id !== channel.server) return;
-                setMembers([
-                    ...members,
-                    { _id: { server: packet.id, user: packet.user } },
-                ]);
-            } else if (packet.type === "ServerMemberLeave") {
-                if (packet.id !== channel.server) return;
-                setMembers(
-                    members.filter(
-                        (x) =>
-                            !(
-                                x._id.user === packet.user &&
-                                x._id.server === packet.id
-                            ),
-                    ),
-                );
-            }
-        }
-
-        client.addListener("packet", onPacket);
-        return () => client.removeListener("packet", onPacket);
-    }, [members]);
-
-    // copy paste from above
-    users.sort((a, b) => {
-        // ! FIXME: should probably rewrite all this code
-        const l =
-            +(
-                (a.online && a.status?.presence !== Users.Presence.Invisible) ??
-                false
-            ) | 0;
-        const r =
-            +(
-                (b.online && b.status?.presence !== Users.Presence.Invisible) ??
-                false
-            ) | 0;
-
-        const n = r - l;
-        if (n !== 0) {
-            return n;
-        }
-
-        return a.username.localeCompare(b.username);
-    });
-
-    return (
-        <GenericSidebarBase>
-            <GenericSidebarList>
-                <ChannelDebugInfo id={channel._id} />
-                <Search channel={channel._id} />
-                <div>{!members && <Preloader type="ring" />}</div>
-                {members && (
                     <CollapsibleSection
-                        //sticky //will re-add later, need to fix css
+                        sticky
                         id="members"
                         defaultValue
                         summary={
-                            <span>
-                                <Text id="app.main.categories.members" /> —{" "}
-                                {users.length}
-                            </span>
+                            <Category
+                                variant="uniform"
+                                text={
+                                    <span>
+                                        <Text id="app.main.categories.members" />{" "}
+                                        — {channel.recipients.length}
+                                    </span>
+                                }
+                            />
                         }>
-                        {users.length === 0 && (
+                        {members.length === 0 && (
                             <img src={placeholderSVG} loading="eager" />
                         )}
-                        {users.map(
+                        {members.map(
                             (user) =>
                                 user && (
                                     <UserButton
@@ -279,11 +167,133 @@ export function ServerMemberSidebar({
                                 ),
                         )}
                     </CollapsibleSection>
-                )}
-            </GenericSidebarList>
-        </GenericSidebarBase>
-    );
-}
+                </GenericSidebarList>
+            </GenericSidebarBase>
+        );
+    },
+);
+
+export const ServerMemberSidebar = observer(
+    ({ channel }: Props & { channel: Channels.TextChannel }) => {
+        const [members, setMembers] = useState<Servers.Member[] | undefined>(
+            undefined,
+        );
+
+        const store = useData();
+        const users = members
+            ?.map((member) => store.users.get(member._id.user)!)
+            .filter((x) => typeof x !== "undefined");
+
+        const { openScreen } = useIntermediate();
+        const status = useContext(StatusContext);
+        const client = useContext(AppContext);
+
+        useEffect(() => {
+            if (
+                status === ClientStatus.ONLINE &&
+                typeof members === "undefined"
+            ) {
+                client.members
+                    .fetchMembers(channel.server)
+                    .then((members) => setMembers(members));
+            }
+        }, [status]);
+
+        // ! FIXME: temporary code
+        useEffect(() => {
+            function onPacket(packet: ClientboundNotification) {
+                if (!members) return;
+                if (packet.type === "ServerMemberJoin") {
+                    if (packet.id !== channel.server) return;
+                    setMembers([
+                        ...members,
+                        { _id: { server: packet.id, user: packet.user } },
+                    ]);
+                } else if (packet.type === "ServerMemberLeave") {
+                    if (packet.id !== channel.server) return;
+                    setMembers(
+                        members.filter(
+                            (x) =>
+                                !(
+                                    x._id.user === packet.user &&
+                                    x._id.server === packet.id
+                                ),
+                        ),
+                    );
+                }
+            }
+
+            client.addListener("packet", onPacket);
+            return () => client.removeListener("packet", onPacket);
+        }, [members]);
+
+        // copy paste from above
+        users?.sort((a, b) => {
+            // ! FIXME: should probably rewrite all this code
+            const l =
+                +(
+                    (a.online &&
+                        a.status?.presence !== Users.Presence.Invisible) ??
+                    false
+                ) | 0;
+            const r =
+                +(
+                    (b.online &&
+                        b.status?.presence !== Users.Presence.Invisible) ??
+                    false
+                ) | 0;
+
+            const n = r - l;
+            if (n !== 0) {
+                return n;
+            }
+
+            return a.username.localeCompare(b.username);
+        });
+
+        return (
+            <GenericSidebarBase>
+                <GenericSidebarList>
+                    <ChannelDebugInfo id={channel._id} />
+                    <Search channel={channel._id} />
+                    <div>{!members && <Preloader type="ring" />}</div>
+                    {members && (
+                        <CollapsibleSection
+                            //sticky //will re-add later, need to fix css
+                            id="members"
+                            defaultValue
+                            summary={
+                                <span>
+                                    <Text id="app.main.categories.members" /> —{" "}
+                                    {users?.length ?? 0}
+                                </span>
+                            }>
+                            {(users?.length ?? 0) === 0 && (
+                                <img src={placeholderSVG} loading="eager" />
+                            )}
+                            {users?.map(
+                                (user) =>
+                                    user && (
+                                        <UserButton
+                                            key={user._id}
+                                            user={user}
+                                            context={channel}
+                                            onClick={() =>
+                                                openScreen({
+                                                    id: "profile",
+                                                    user_id: user._id,
+                                                })
+                                            }
+                                        />
+                                    ),
+                            )}
+                        </CollapsibleSection>
+                    )}
+                </GenericSidebarList>
+            </GenericSidebarBase>
+        );
+    },
+);
 
 function Search({ channel }: { channel: string }) {
     if (!getState().experiments.enabled?.includes("search")) return null;