Load member sidebar into MobX state.

This commit is contained in:
Paul 2021-07-29 21:01:03 +01:00
parent b06729d0b3
commit b0681dfc99
8 changed files with 57 additions and 31 deletions

View file

@ -96,7 +96,7 @@
"react-router-dom": "^5.2.0", "react-router-dom": "^5.2.0",
"react-scroll": "^1.8.2", "react-scroll": "^1.8.2",
"redux": "^4.1.0", "redux": "^4.1.0",
"revolt.js": "^4.3.3-alpha.19", "revolt.js": "4.4.0-alpha.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
"sass": "^1.35.1", "sass": "^1.35.1",
"shade-blend-color": "^1.0.0", "shade-blend-color": "^1.0.0",

View file

@ -181,7 +181,7 @@ export const ServerMemberSidebar = observer(
status === ClientStatus.ONLINE && status === ClientStatus.ONLINE &&
typeof members === "undefined" typeof members === "undefined"
) { ) {
client.members store
.fetchMembers(channel.server!) .fetchMembers(channel.server!)
.then((members) => setMembers(members)); .then((members) => setMembers(members));
} }

View file

@ -1,8 +1,8 @@
import { BrowserRouter as Router } from "react-router-dom"; import { BrowserRouter as Router } from "react-router-dom";
import MobXState from "../mobx/State";
import State from "../redux/State"; import State from "../redux/State";
import MobXState from "../mobx/State";
import { Children } from "../types/Preact"; import { Children } from "../types/Preact";
import Locale from "./Locale"; import Locale from "./Locale";
import Settings from "./Settings"; import Settings from "./Settings";
@ -15,19 +15,19 @@ export default function Context({ children }: { children: Children }) {
return ( return (
<Router> <Router>
<State> <State>
<MobXState> <Theme>
<Theme> <Settings>
<Settings> <Locale>
<Locale> <Intermediate>
<Intermediate> <Client>
<Client> <MobXState>
<Voice>{children}</Voice> <Voice>{children}</Voice>
</Client> </MobXState>
</Intermediate> </Client>
</Locale> </Intermediate>
</Settings> </Locale>
</Theme> </Settings>
</MobXState> </Theme>
</State> </State>
</Router> </Router>
); );

View file

@ -8,13 +8,13 @@ import { useContext, useEffect, useMemo, useState } from "preact/hooks";
import { SingletonMessageRenderer } from "../../lib/renderer/Singleton"; import { SingletonMessageRenderer } from "../../lib/renderer/Singleton";
import { useData } from "../../mobx/State";
import { dispatch } from "../../redux"; import { dispatch } from "../../redux";
import { connectState } from "../../redux/connector"; import { connectState } from "../../redux/connector";
import { AuthState } from "../../redux/reducers/auth"; import { AuthState } from "../../redux/reducers/auth";
import Preloader from "../../components/ui/Preloader"; import Preloader from "../../components/ui/Preloader";
import { useData } from "../../mobx/State";
import { Children } from "../../types/Preact"; import { Children } from "../../types/Preact";
import { useIntermediate } from "../intermediate/Intermediate"; import { useIntermediate } from "../intermediate/Intermediate";
import { registerEvents, setReconnectDisallowed } from "./events"; import { registerEvents, setReconnectDisallowed } from "./events";
@ -158,10 +158,9 @@ function Context({ auth, children }: Props) {
}; };
}, [client, auth.active]); }, [client, auth.active]);
const store = useData();
useEffect( useEffect(
() => registerEvents({ operations }, setStatus, client, store), () => registerEvents({ operations }, setStatus, client),
[client, store], [client],
); );
useEffect(() => { useEffect(() => {

View file

@ -3,10 +3,10 @@ import { ClientboundNotification } from "revolt.js/dist/websocket/notifications"
import { StateUpdater } from "preact/hooks"; import { StateUpdater } from "preact/hooks";
import { dispatch } from "../../redux";
import { DataStore } from "../../mobx"; import { DataStore } from "../../mobx";
import { useData } from "../../mobx/State"; import { useData } from "../../mobx/State";
import { dispatch } from "../../redux";
import { ClientOperations, ClientStatus } from "./RevoltClient"; import { ClientOperations, ClientStatus } from "./RevoltClient";
export var preventReconnect = false; export var preventReconnect = false;
@ -20,7 +20,6 @@ export function registerEvents(
{ operations }: { operations: ClientOperations }, { operations }: { operations: ClientOperations },
setStatus: StateUpdater<ClientStatus>, setStatus: StateUpdater<ClientStatus>,
client: Client, client: Client,
store: DataStore,
) { ) {
function attemptReconnect() { function attemptReconnect() {
if (preventReconnect) return; if (preventReconnect) return;
@ -48,7 +47,6 @@ export function registerEvents(
}, },
packet: (packet: ClientboundNotification) => { packet: (packet: ClientboundNotification) => {
store.packet(packet);
switch (packet.type) { switch (packet.type) {
case "ChannelStartTyping": { case "ChannelStartTyping": {
if (packet.user === client.user?._id) return; if (packet.user === client.user?._id) return;

View file

@ -1,5 +1,9 @@
import { ClientboundNotification } from "revolt.js/dist/websocket/notifications";
import { createContext } from "preact"; import { createContext } from "preact";
import { useContext } from "preact/hooks"; import { useContext, useEffect, useState } from "preact/hooks";
import { useClient } from "../context/revoltjs/RevoltClient";
import { DataStore } from "."; import { DataStore } from ".";
import { Children } from "../types/Preact"; import { Children } from "../types/Preact";
@ -13,9 +17,18 @@ export const DataContext = createContext<DataStore>(null!);
// ! later we can do seamless account switching, by hooking this into Redux // ! later we can do seamless account switching, by hooking this into Redux
// ! and monitoring changes to active account and hence swapping stores. // ! and monitoring changes to active account and hence swapping stores.
// although this may need more work since we need a Client per account too. // although this may need more work since we need a Client per account too.
const store = new DataStore();
export default function StateLoader(props: Props) { export default function StateLoader(props: Props) {
const client = useClient();
const [store] = useState(new DataStore(client));
useEffect(() => {
const packet = (packet: ClientboundNotification) =>
store.packet(packet);
client.addListener("packet", packet);
return () => client.removeListener("packet", packet);
}, [client]);
return ( return (
<DataContext.Provider value={store}> <DataContext.Provider value={store}>
{props.children} {props.children}

View file

@ -9,6 +9,7 @@ import {
action, action,
extendObservable, extendObservable,
} from "mobx"; } from "mobx";
import { Client } from "revolt.js";
import { import {
Attachment, Attachment,
Channels, Channels,
@ -307,13 +308,16 @@ export class Member {
} }
export class DataStore { export class DataStore {
client: Client;
@observable users = new Map<string, User>(); @observable users = new Map<string, User>();
@observable channels = new Map<string, Channel>(); @observable channels = new Map<string, Channel>();
@observable servers = new Map<string, Server>(); @observable servers = new Map<string, Server>();
@observable members = new Map<Servers.MemberCompositeKey, Member>(); @observable members = new Map<Servers.MemberCompositeKey, Member>();
constructor() { constructor(client: Client) {
makeAutoObservable(this); makeAutoObservable(this, undefined, { proxy: false });
this.client = client;
} }
@action @action
@ -389,4 +393,16 @@ export class DataStore {
} }
} }
} }
async fetchMembers(server: string) {
let res = await this.client.members.fetchMembers(server);
for (let user of res.users) {
if (!this.users.has(user._id)) {
this.users.set(user._id, new User(user));
}
}
return res.members;
}
} }

View file

@ -3573,10 +3573,10 @@ reusify@^1.0.4:
resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw== integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
revolt.js@^4.3.3-alpha.19: revolt.js@4.4.0-alpha.0:
version "4.3.3-alpha.19" version "4.4.0-alpha.0"
resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-4.3.3-alpha.19.tgz#02b0fe8c44b6b803f5314a2d40eda5d3481901d3" resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-4.4.0-alpha.0.tgz#6b8d7e5605c4e106800ebd7ddcda8215a8fb289b"
integrity sha512-cpJGqAnAzCV33zuFqiOlRopqhSMhSUZISB7vdsgvjS6Aof1UrWpJJO+POnVxo20FvLM0tMFZaHIxdYeW798U9w== integrity sha512-TPb7FCC1xpAO0hJ19tXAC5ZwsceJ/yzkFlV/lESteVk4bboVINhRrsElYtJvjSKci7Ft70t0e4bbm8YSYjAblA==
dependencies: dependencies:
"@insertish/mutable" "1.1.0" "@insertish/mutable" "1.1.0"
axios "^0.19.2" axios "^0.19.2"