Commit 3063a51b authored by Grant's avatar Grant
Browse files

draft: matrix login state

parent 1b752216

packages/chat/lib/components/MatrixChat.tsx

deleted100644 → 0
+0 −35
Original line number Diff line number Diff line 
import * as sdk from "matrix-js-sdk";

import { memo, useEffect, useMemo } from "react";

import { MXClient } from "../lib/MXClient";



export const MatrixChat = memo(() => {

  // @ts-expect-error ignore

  const client = useMemo(() => new MXClient(), []);



  useEffect(() => {

    client.destroy();

  }, []);



  return (

    <div>

      hello from a library! cool abc{" "}

      <button

        onClick={() => {

          window.location.href = client.getLoginUrl(window.location.href);

        }}

      >

        login redirect

      </button>{" "}

      <button

        onClick={() => {

          client

            .login()

            .then(() => console.log("logged in"))

            .catch(console.error);

        }}

      >

        attempt login

      </button>

    </div>

  );

});

packages/chat/lib/components/Tab/Home.tsx

+1 −1
Original line number Diff line number Diff line
@@ -3,7 +3,7 @@ import { Tab } from "../Tab"; 
import { useSubscriptions } from "@/hooks/useSubscriptions";

import { useRoom } from "@/hooks/useRoom";

import type { MXRoomID } from "@/main";

import { useReducer, type JSX } from "react";

import { type JSX } from "react";

import type { MatrixEvent } from "matrix-js-sdk";

import { MXClient } from "@/lib/MXClient";

packages/chat/lib/components/Tab/LoggedOut.tsx

0 → 100644
+13 −0
Original line number Diff line number Diff line 
import { useYap } from "@/context/utils";

import { Tab } from "../Tab";



export const LoggedOut = () => {

  const yap = useYap();



  return (

    <Tab name="Chat" isNagging={false}>

      <p>you are logged out</p>

      <button onClick={() => yap.doLogin()}>attempt login</button>

    </Tab>

  );

};

packages/chat/lib/components/Yapper.tsx

+16 −5
Original line number Diff line number Diff line
@@ -3,19 +3,30 @@ import { HomeTab } from "./Tab/Home"; 
import { RoomTab } from "./Tab/Room";

import { getOpenRooms, useYap } from "@/context/utils";

import { useEffect } from "react";

import { LoggedOut } from "./Tab/LoggedOut";



export const Yapper = () => {

  const { state, dispatch } = useYap<"Internal">();

  const { state } = useYap<"Internal">();



  return (

    <div

      id="chat-overlay"

      className="absolute bottom-0 right-0 flex gap-1 px-1"

    >

      {state.user ? (

        <>

          {getOpenRooms(state).map((room) => (

        <RoomTab key={room.roomId} roomId={room.roomId} isNagging={room.nag} />

            <RoomTab

              key={room.roomId}

              roomId={room.roomId}

              isNagging={room.nag}

            />

          ))}

          <HomeTab />

        </>

      ) : (

        <LoggedOut />

      )}

    </div>

  );

};

packages/chat/lib/context/YapContext.tsx

+18 −1
Original line number Diff line number Diff line 
import type { MXRoomID, MXUserID } from "@/lib/const";

import { MXClient } from "@/lib/MXClient";

import type React from "react";

import { useCallback, useMemo, useReducer } from "react";

import { useCallback, useEffect, useMemo, useReducer } from "react";

import type { Actions, State } from "./types";

import { context } from "./utils";



export const YapContext = ({ children }: React.PropsWithChildren) => {

  const client = useMemo<MXClient>(() => MXClient.get(), []);



  useEffect(() => {

    client.on("me", (user) => {

      dispatch(["user", user.userId]);

    });

    return () => client.destroy();

  }, [client]);



  const [state, dispatch] = useReducer<State, [Actions]>(

    (state, action) => {

      switch (action[0]) {

        case "ready":

          return state;

        case "user":

          return {

            ...state,

            user: action[1],

          };

        case "openChat":

          return {

            ...state,
@@ -86,6 +98,10 @@ export const YapContext = ({ children }: React.PropsWithChildren) => { 
    }

  }, [client]);



  const doLogout = useCallback(async () => {

    await client.logout();

  }, [client]);



  // todo:

  // - migrate to new, public, context

  // - ready state to trigger url parsing for login
@@ -99,6 +115,7 @@ export const YapContext = ({ children }: React.PropsWithChildren) => { 
        client,

        dispatch,

        doLogin,

        doLogout,

        openChat,

        setSystem,

        ready,