Commit 23a74a24 authored by Grant's avatar Grant
Browse files

[wip] initial work

parent bbfcd3de

packages/client/src/components/App.tsx

+1 −1
Original line number Diff line number Diff line
@@ -140,7 +140,7 @@ const AppInner = () => { 
      <CanvasWrapper />

      <ToolbarWrapper />



      {/* <DynamicallyLoadChat /> */}

      <DynamicallyLoadChat />



      <DebugModal />

      <SettingsSidebar />

packages/client/src/components/Chat/Chat.tsx

+14 −4
Original line number Diff line number Diff line 
import { useEffect, useRef, useState } from "react";

import { faComments } from "@fortawesome/free-solid-svg-icons";

import { useAppContext } from "../../contexts/AppContext";

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



const Chat = () => {

  const ref = useRef<HTMLDivElement | null>(null);

  const { chatSidebar, setChatSidebar } = useAppContext();



  return (

    <div ref={ref} style={{ position: "fixed", top: 0, left: 0, zIndex: 999 }}>

      chat

    </div>

    <SidebarBase

      shown={chatSidebar}

      setSidebarShown={setChatSidebar}

      icon={faComments}

      title="Chat"

      description=""

      side="Right"

    >

      <div>hi</div>

    </SidebarBase>

  );

};

packages/client/src/components/Chat/OpenChatButton.tsx

+5 −8
Original line number Diff line number Diff line
@@ -5,7 +5,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; 
import { faComments } from "@fortawesome/free-solid-svg-icons";



const OpenChatButton = () => {

  const { config } = useAppContext();

  const { config, setChatSidebar } = useAppContext();

  const { notificationCount, doLogin } = useChatContext();



  return (
@@ -15,15 +15,12 @@ const OpenChatButton = () => { 
      color="danger"

      size="sm"

    >

      {

        config?.chat?.element_host && 

        <Button 

          onPress={doLogin}

          variant="faded"

        >

      {config?.chat?.element_host && (

        <Button onPress={() => setChatSidebar((v) => !v)} variant="faded">

          <FontAwesomeIcon icon={faComments} />

          <p>Chat</p>

        </Button>}

        </Button>

      )}

    </Badge>

  );

};

packages/client/src/components/Settings/ChatSettings.tsx

+10 −6
Original line number Diff line number Diff line
@@ -18,14 +18,18 @@ export const ChatSettings = () => { 
          />

          <h2 className="text-xl">Chat</h2>

        </div>

        <p className="text-default-600 text-xs">Chatting with other canvas users</p>

        <p className="text-default-600 text-xs">

          Chatting with other canvas users

        </p>

      </header>

      <section>

        <React.Suspense>{loadChat && 

        <React.Suspense>

          {loadChat && (

            <div className="mt-4">

              <InnerChatSettings />

            </div>

        }</React.Suspense>

          )}

        </React.Suspense>

      </section>

    </div>

  );

packages/client/src/contexts/AppContext.tsx

+7 −2
Original line number Diff line number Diff line
@@ -24,6 +24,8 @@ interface IAppContext { 


  loadChat: boolean;

  setLoadChat: (v: boolean) => void;

  chatSidebar: boolean;

  setChatSidebar: React.Dispatch<React.SetStateAction<boolean>>;



  infoSidebar: boolean;

  setInfoSidebar: (v: boolean) => void;
@@ -39,7 +41,7 @@ interface IAppContext { 
  heatmapOverlay: IMapOverlay;

  setHeatmapOverlay: React.Dispatch<React.SetStateAction<IMapOverlay>>;

  pixelPulses: boolean;

  setPixelPulses: (state: boolean) => void

  setPixelPulses: (state: boolean) => void;



  profile?: string; // sub

  setProfile: (v?: string) => void;
@@ -101,6 +103,7 @@ export const AppContext = ({ children }: PropsWithChildren) => { 


  // --- settings ---

  const [loadChat, _setLoadChat] = useState(false);

  const [chatSidebar, setChatSidebar] = useState(false);



  const [pixels, setPixels] = useState({ available: 0 });

  const [undo, setUndo] = useState<{ available: true; expireAt: number }>();
@@ -125,7 +128,7 @@ export const AppContext = ({ children }: PropsWithChildren) => { 
    opacity: 1,

    loading: false,

  });

  const [pixelPulses, setPixelPulses] = useState<boolean>(false)

  const [pixelPulses, setPixelPulses] = useState<boolean>(false);



  const [profile, setProfile] = useState<string>();
@@ -222,6 +225,8 @@ export const AppContext = ({ children }: PropsWithChildren) => { 
        undo,

        loadChat,

        setLoadChat,

        chatSidebar,

        setChatSidebar,

        connected,

        hasAdmin,

        pixelWhois,