Commit 2c31685d authored by Grant's avatar Grant
Browse files

make user box in the header show current user (& fix backend auth packet)

parent 9ea1e903

packages/client/src/components/Header.tsx

+2 −8
Original line number Diff line number Diff line 
import React from "react";

import { User } from "./Header/User";



export const Header = () => {

  return (
@@ -6,13 +6,7 @@ export const Header = () => { 
      <div></div>

      <div className="spacer"></div>

      <div className="box">

        <div className="user-card">

          <div className="user-card--overview">

            <div className="user-name"></div>

            <div className="user-instance"></div>

          </div>

          <img src="#" alt="User Avatar" className="user-avatar" />

        </div>

        <User />

      </div>

    </header>

  );

packages/client/src/components/Header/User.tsx

0 → 100644
+17 −0
Original line number Diff line number Diff line 
import { useAppContext } from "../../contexts/AppContext";



export const User = () => {

  const { user } = useAppContext();



  return user ? (

    <div className="user-card">

      <div className="user-card--overview">

        <div className="user-name">{user.user.username}</div>

        <div className="user-instance">{user.service.instance.hostname}</div>

      </div>

      <img src={user.user.profile} alt="User Avatar" className="user-avatar" />

    </div>

  ) : (

    <></>

  );

};

packages/server/src/index.ts

+3 −6
Original line number Diff line number Diff line
@@ -3,6 +3,7 @@ import expressSession from "express-session"; 
import http from "node:http";

import { Server } from "socket.io";

import {

  AuthSession,

  CPixelPacket,

  PacketAck,

  SCanvasPacket,
@@ -51,7 +52,7 @@ const io = new Server< 
    ) => void;

  },

  {

    user: (user: SUserPacket) => void;

    user: (user: AuthSession) => void;

    config: (config: any) => void;

    pixel: (data: SPixelPacket) => void;

    canvas: (pixels: string[]) => void;
@@ -103,11 +104,7 @@ io.on("connection", (socket) => { 
  console.log("connection", socket.request.session.user);



  if (socket.request.session.user)

    socket.emit("user", {

      type: "user",

      user: socket.request.session.user,

      _direction: "server->client",

    });

    socket.emit("user", socket.request.session.user);



  socket.emit("config", {

    pallete: {