From 22ee07a5b3f6453237ee3f372d289abda1432b5c Mon Sep 17 00:00:00 2001
From: bloodwiing <bloodwiing+git@alchemix.dev>
Date: Mon, 11 Dec 2023 18:07:31 +0200
Subject: [PATCH] A bunch of Packet changes

---
 .idea/compiler.xml                            |   5 -
 Client/pom.xml                                |   6 +
 .../dev/wiing/gossip/client/Connection.java   | 109 ++++++-
 .../client/controllers/LoginController.java   |  31 +-
 .../controllers/MainChatController.java       | 114 ++++++++
 .../client/controllers/MainController.java    | 140 +++++++++
 .../item/MainTopicItemController.java         |  41 +++
 .../wiing/gossip/client/data/UserAvatar.java  | 102 +++++++
 .../wiing/gossip/client/data/UserIcon.java    |  72 -----
 .../dev/wiing/gossip/client/generic/Pair.java |  20 ++
 .../dev/wiing/gossip/client/utils/Utils.java  |  57 ++++
 Client/src/main/java/module-info.java         |   3 +
 .../icon_0.png => avatars/avatar-0.png}       | Bin
 .../icon_1.png => avatars/avatar-1.png}       | Bin
 .../icon_2.png => avatars/avatar-2.png}       | Bin
 .../icon_3.png => avatars/avatar-3.png}       | Bin
 .../icon_4.png => avatars/avatar-4.png}       | Bin
 .../icon_5.png => avatars/avatar-5.png}       | Bin
 .../icon_6.png => avatars/avatar-6.png}       | Bin
 .../icon_7.png => avatars/avatar-7.png}       | Bin
 .../icon_8.png => avatars/avatar-8.png}       | Bin
 .../icon_9.png => avatars/avatar-9.png}       | Bin
 .../dev/wiing/gossip/client/custom.css        |  11 +
 .../wiing/gossip/client/icons/door-enter.png  | Bin 0 -> 4912 bytes
 .../client/{edit.png => icons/icon-edit.png}  | Bin
 .../wiing/gossip/client/icons/icon-hash.png   | Bin 0 -> 4749 bytes
 .../wiing/gossip/client/icons/icon-send-2.png | Bin 0 -> 5026 bytes
 .../dev/wiing/gossip/client/styling.css       |  72 ++++-
 .../wiing/gossip/client/views/login-view.fxml |   7 +-
 .../gossip/client/views/main-chat-view.fxml   | 165 +++++++++++
 .../gossip/client/views/main-topic-item.fxml  |  32 ++
 .../wiing/gossip/client/views/main-view.fxml  | 273 ++++++++++++++++--
 .../dev/wiing/gossip/lib/PacketHandler.java   |  10 +
 .../dev/wiing/gossip/lib/PacketManager.java   |  22 +-
 .../dev/wiing/gossip/lib/data/StringType.java |   2 +-
 .../dev/wiing/gossip/lib/models/Message.java  |  17 ++
 .../dev/wiing/gossip/lib/models/Topic.java    |  96 ++++++
 .../dev/wiing/gossip/lib/models/User.java     |  22 +-
 .../gossip/lib/packets/CreateTopicPacket.java |  72 +++++
 .../gossip/lib/packets/FetchUserPacket.java   |  37 +++
 .../gossip/lib/packets/RegisterPacket.java    |  18 +-
 .../gossip/lib/packets/TopicAddedPacket.java  |  96 ++++++
 .../gossip/lib/packets/UserDataPacket.java    |  63 ++++
 .../dev/wiing/gossip/server/Database.java     |  63 +++-
 .../dev/wiing/gossip/server/UserSocket.java   |  60 +++-
 45 files changed, 1667 insertions(+), 171 deletions(-)
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/controllers/MainChatController.java
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/controllers/MainController.java
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/controllers/item/MainTopicItemController.java
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/data/UserAvatar.java
 delete mode 100644 Client/src/main/java/dev/wiing/gossip/client/data/UserIcon.java
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/generic/Pair.java
 create mode 100644 Client/src/main/java/dev/wiing/gossip/client/utils/Utils.java
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_0.png => avatars/avatar-0.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_1.png => avatars/avatar-1.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_2.png => avatars/avatar-2.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_3.png => avatars/avatar-3.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_4.png => avatars/avatar-4.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_5.png => avatars/avatar-5.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_6.png => avatars/avatar-6.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_7.png => avatars/avatar-7.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_8.png => avatars/avatar-8.png} (100%)
 rename Client/src/main/resources/dev/wiing/gossip/client/{icons/icon_9.png => avatars/avatar-9.png} (100%)
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/custom.css
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/icons/door-enter.png
 rename Client/src/main/resources/dev/wiing/gossip/client/{edit.png => icons/icon-edit.png} (100%)
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/icons/icon-hash.png
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/icons/icon-send-2.png
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/views/main-chat-view.fxml
 create mode 100644 Client/src/main/resources/dev/wiing/gossip/client/views/main-topic-item.fxml
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/models/Message.java
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/models/Topic.java
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/packets/CreateTopicPacket.java
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/packets/FetchUserPacket.java
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/packets/TopicAddedPacket.java
 create mode 100644 Lib/src/main/java/dev/wiing/gossip/lib/packets/UserDataPacket.java

diff --git a/.idea/compiler.xml b/.idea/compiler.xml
index ede0b46..abaf24f 100644
--- a/.idea/compiler.xml
+++ b/.idea/compiler.xml
@@ -11,10 +11,5 @@
         <module name="Lib" />
       </profile>
     </annotationProcessing>
-    <bytecodeTargetLevel>
-      <module name="Lib" target="17" />
-      <module name="Client" target="17" />
-      <module name="Server" target="17" />
-    </bytecodeTargetLevel>
   </component>
 </project>
\ No newline at end of file
diff --git a/Client/pom.xml b/Client/pom.xml
index 1a04367..8855526 100644
--- a/Client/pom.xml
+++ b/Client/pom.xml
@@ -45,6 +45,12 @@
             <version>${junit.version}</version>
             <scope>test</scope>
         </dependency>
+        <dependency>
+            <groupId>org.jetbrains</groupId>
+            <artifactId>annotations</artifactId>
+            <version>16.0.1</version>
+            <scope>compile</scope>
+        </dependency>
     </dependencies>
 
     <build>
diff --git a/Client/src/main/java/dev/wiing/gossip/client/Connection.java b/Client/src/main/java/dev/wiing/gossip/client/Connection.java
index c400349..efb88db 100644
--- a/Client/src/main/java/dev/wiing/gossip/client/Connection.java
+++ b/Client/src/main/java/dev/wiing/gossip/client/Connection.java
@@ -1,24 +1,37 @@
 package dev.wiing.gossip.client;
 
+import dev.wiing.gossip.lib.PacketHandler;
 import dev.wiing.gossip.lib.PacketManager;
 import dev.wiing.gossip.lib.models.SecretUser;
+import dev.wiing.gossip.lib.models.User;
+import dev.wiing.gossip.lib.packets.FetchUserPacket;
 import dev.wiing.gossip.lib.packets.Packet;
+import dev.wiing.gossip.lib.packets.UserDataPacket;
+import javafx.application.Platform;
 
 import java.io.IOException;
 import java.net.Socket;
+import java.net.SocketException;
+import java.util.*;
+import java.util.concurrent.ConcurrentHashMap;
 
 public class Connection {
 
     private static final Connection instance = new Connection();
 
-    private final PacketManager packetManager;
+    private final PacketManager packetManager = new PacketManager();
+
+    private final PacketHandler packetHandler = new PacketHandler();
+
+    private Thread handlerThread;
 
     private Socket socket;
 
     private SecretUser self;
 
+    private final List<Packet> queuedPackets = Collections.synchronizedList(new LinkedList<>());
+
     private Connection() {
-        packetManager = new PacketManager();
         packetManager.registerPackets();
     }
 
@@ -30,6 +43,35 @@ public class Connection {
         return packetManager;
     }
 
+    public PacketHandler getPacketHandler() {
+        return packetHandler;
+    }
+
+    public static class PacketHandlerRunnable implements Runnable {
+        private final Connection connection;
+
+        public PacketHandlerRunnable(Connection connection) {
+            this.connection = connection;
+        }
+
+        @Override
+        public void run() {
+            while (true) {
+                try {
+                    Packet packet = connection.nextPacket();
+                    connection.getPacketHandler().runPacket(packet);
+                } catch (SocketException e) {
+                    break;
+                }
+            }
+        }
+    }
+
+    public void beginHandlingPackets() {
+        handlerThread = new Thread(new PacketHandlerRunnable(this));
+        handlerThread.start();
+    }
+
     public Socket getSocket() {
         return socket;
     }
@@ -46,20 +88,81 @@ public class Connection {
         }
     }
 
-    public Packet nextPacket() {
+    public Packet nextPacket(boolean useQueue) throws SocketException {
+        if (!queuedPackets.isEmpty()) {
+            return queuedPackets.remove(0);
+        }
+
         try {
             return getPacketManager().readPacket(getSocket().getInputStream());
+        } catch (SocketException e) {
+            throw e;
         } catch (IOException e) {
             e.printStackTrace();
             return null;
         }
     }
 
+    public Packet nextPacket() throws SocketException {
+        return nextPacket(true);
+    }
+
+    public Packet nextPacket(short packetType) throws SocketException {
+        while (true) {
+            Packet packet = nextPacket(false);
+
+            if (packet.getType() != packetType) {
+                queuedPackets.add(packet);
+                continue;
+            }
+
+            return packet;
+        }
+    }
+
     public SecretUser getSelf() {
         return self;
     }
 
     public void setSelf(SecretUser self) {
         this.self = self;
+
+        userCache.put(self.getUserID(), new User(
+                self.getUsername(),
+                self.getAvatarID(),
+                self.getUserID()
+        ));
+    }
+
+    private final Map<Long, User> userCache = new ConcurrentHashMap<>();
+
+    public User getUser(long userID) {
+        User result;
+
+        if ((result = userCache.getOrDefault(userID, null)) != null) {
+            return result;
+        }
+
+        FetchUserPacket fetch = new FetchUserPacket();
+        fetch.setUserID(userID);
+        Connection.getInstance().sendPacket(fetch);
+
+        Packet resp;
+        try {
+            resp = Connection.getInstance().nextPacket(UserDataPacket.TYPE);
+        } catch (SocketException e) {
+            throw new RuntimeException(e);
+        }
+        if (resp.getType() == UserDataPacket.TYPE) {
+            UserDataPacket userData = (UserDataPacket)resp;
+            result = new User(
+                    userData.getUsername(),
+                    userData.getAvatarID(),
+                    userData.getUserID()
+            );
+            userCache.put(result.getUserID(), result);
+        }
+
+        return result;
     }
 }
diff --git a/Client/src/main/java/dev/wiing/gossip/client/controllers/LoginController.java b/Client/src/main/java/dev/wiing/gossip/client/controllers/LoginController.java
index 95105ab..119daad 100644
--- a/Client/src/main/java/dev/wiing/gossip/client/controllers/LoginController.java
+++ b/Client/src/main/java/dev/wiing/gossip/client/controllers/LoginController.java
@@ -2,7 +2,7 @@ package dev.wiing.gossip.client.controllers;
 
 
 import dev.wiing.gossip.client.Connection;
-import dev.wiing.gossip.client.data.UserIcon;
+import dev.wiing.gossip.client.data.UserAvatar;
 import dev.wiing.gossip.lib.models.SecretUser;
 import dev.wiing.gossip.lib.packets.CredentialsPacket;
 import dev.wiing.gossip.lib.packets.Packet;
@@ -12,12 +12,15 @@ import javafx.event.ActionEvent;
 import javafx.event.Event;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
+import javafx.scene.Scene;
 import javafx.scene.control.TextField;
 import javafx.scene.input.MouseEvent;
 import javafx.scene.layout.*;
 import javafx.scene.shape.Circle;
+import javafx.stage.Stage;
 import javafx.util.Duration;
 
+import java.net.SocketException;
 import java.net.URL;
 import java.util.ResourceBundle;
 
@@ -34,15 +37,7 @@ public class LoginController implements Initializable {
 
     @Override
     public void initialize(URL location, ResourceBundle resources) {
-        paneIcon.setBackground(new Background(
-                new BackgroundImage(
-                        UserIcon.MORNING.getImage(),
-                        BackgroundRepeat.NO_REPEAT,
-                        BackgroundRepeat.NO_REPEAT,
-                        BackgroundPosition.CENTER,
-                        new BackgroundSize(100.0, 100.0, true, true, false, true)
-                )
-        ));
+        UserAvatar.MORNING.applyToRegionBackground(paneIcon, false);
 
         Circle circle = new Circle(paneIcon.getMinWidth() * 0.5);
         paneIcon.setShape(circle);
@@ -57,17 +52,27 @@ public class LoginController implements Initializable {
     @FXML
     public void onLogin(ActionEvent event) {
         RegisterPacket packet = new RegisterPacket();
-        packet.setIconID((char)0);
+        packet.setAvatarID((byte)0);
         packet.setUsername(txtUsername.getText());
 
         Connection.getInstance().sendPacket(packet);
 
-        Packet result = Connection.getInstance().nextPacket();
+        Packet result = null;
+        try {
+            result = Connection.getInstance().nextPacket();
+        } catch (SocketException e) {
+            throw new RuntimeException(e);
+        }
+
         if (result != null && result.getType() == CredentialsPacket.TYPE) {
             CredentialsPacket creds = (CredentialsPacket)result;
 
-            SecretUser user = new SecretUser(packet.getUsername(), packet.getIconID(), creds.getUID(), creds.getSecret());
+            SecretUser user = new SecretUser(packet.getUsername(), packet.getAvatarID(), creds.getUID(), creds.getSecret());
             Connection.getInstance().setSelf(user);
+
+            var pair = MainController.createInstance();
+
+            ((Stage)Stage.getWindows().get(0)).setScene(new Scene(pair.first()));
         }
     }
 
diff --git a/Client/src/main/java/dev/wiing/gossip/client/controllers/MainChatController.java b/Client/src/main/java/dev/wiing/gossip/client/controllers/MainChatController.java
new file mode 100644
index 0000000..91c1c5e
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/controllers/MainChatController.java
@@ -0,0 +1,114 @@
+package dev.wiing.gossip.client.controllers;
+
+import dev.wiing.gossip.client.Connection;
+import dev.wiing.gossip.client.generic.Pair;
+import dev.wiing.gossip.client.utils.Utils;
+import dev.wiing.gossip.lib.models.Topic;
+import dev.wiing.gossip.lib.models.User;
+import javafx.event.ActionEvent;
+import javafx.fxml.FXML;
+import javafx.fxml.Initializable;
+import javafx.scene.Parent;
+import javafx.scene.control.Label;
+import javafx.scene.control.TextArea;
+import javafx.scene.input.MouseEvent;
+import javafx.scene.layout.VBox;
+
+import java.net.URL;
+import java.util.List;
+import java.util.ResourceBundle;
+
+public class MainChatController {
+
+    private Topic topic;
+
+    @FXML
+    private Label lblBabblersCount;
+
+    @FXML
+    private Label lblTopicName;
+
+    @FXML
+    private Label lblTyping;
+
+    @FXML
+    private Label lblVisitBabblerCount;
+
+    @FXML
+    private Label lblVisitHostName;
+
+    @FXML
+    private Label lblVisitTopicDescription;
+
+    @FXML
+    private Label lblVisitTopicName;
+
+    @FXML
+    private TextArea txtCompose;
+
+    @FXML
+    private VBox vboxChatPage;
+
+    @FXML
+    private VBox vboxMessages;
+
+    @FXML
+    private VBox vboxVisitPage;
+
+    public void setTopic(Topic topic) {
+        this.topic = topic;
+
+        boolean participating = topic.hasUser(Connection.getInstance().getSelf());
+        togglePages(participating);
+
+        setTopicName(topic.getName());
+        lblVisitTopicDescription.setText(topic.getDescription());
+        setBabblerCount(topic.getUsersReadOnly().size());
+        lblVisitHostName.setText(topic.getHost().getUsernameDisplay());
+
+        this.topic.addChangeListener(evt -> {
+            if (evt.getPropertyName().equals("userAdd") || evt.getPropertyName().equals("userRemove")) {
+                setBabblerCount(topic.getUsersReadOnly().size());
+            }
+        });
+    }
+
+    private void setTopicName(String name) {
+        lblTopicName.setText(name);
+        lblVisitTopicName.setText(name);
+    }
+
+    private void setBabblerCount(int count) {
+        String res = "No Babblers";
+        if (count == 1) {
+            res = "1 Babbler";
+        } else if (count > 1) {
+            res = Integer.toString(count) + " Babblers";
+        }
+
+        lblBabblersCount.setText(res);
+        lblVisitBabblerCount.setText(res + " active");
+    }
+
+    private void togglePages(boolean participating) {
+        vboxChatPage.setVisible(participating);
+        vboxVisitPage.setVisible(!participating);
+    }
+
+    @FXML
+    void onJoinTopic(ActionEvent event) {
+        topic.addUser(Connection.getInstance().getSelf());
+
+        togglePages(true);
+    }
+
+    @FXML
+    void onSend(MouseEvent event) {
+
+    }
+
+    public static Pair<Parent, MainChatController> createInstance() {
+        return Utils.createInstance("views/main-chat-view.fxml");
+    }
+
+}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/controllers/MainController.java b/Client/src/main/java/dev/wiing/gossip/client/controllers/MainController.java
new file mode 100644
index 0000000..42bab5b
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/controllers/MainController.java
@@ -0,0 +1,140 @@
+package dev.wiing.gossip.client.controllers;
+
+import dev.wiing.gossip.client.Connection;
+import dev.wiing.gossip.client.controllers.item.MainTopicItemController;
+import dev.wiing.gossip.client.data.UserAvatar;
+import dev.wiing.gossip.client.generic.Pair;
+import dev.wiing.gossip.client.utils.Utils;
+import dev.wiing.gossip.lib.models.Topic;
+import dev.wiing.gossip.lib.models.User;
+import dev.wiing.gossip.lib.packets.*;
+import javafx.application.Platform;
+import javafx.event.ActionEvent;
+import javafx.fxml.FXML;
+import javafx.fxml.Initializable;
+import javafx.scene.Parent;
+import javafx.scene.control.Label;
+import javafx.scene.layout.AnchorPane;
+import javafx.scene.layout.Pane;
+import javafx.scene.layout.VBox;
+
+import java.net.URL;
+import java.util.Map;
+import java.util.ResourceBundle;
+import java.util.concurrent.ConcurrentHashMap;
+
+public class MainController implements Initializable {
+
+    Topic activeTopic = null;
+    Parent activeTopicElement = null;
+    private final Map<Long, Parent> topicContentMap = new ConcurrentHashMap<>();
+
+    @FXML
+    private VBox vboxRoot;
+
+    @FXML
+    private VBox vboxTopics;
+
+    @FXML
+    private Label lblUsername;
+
+    @FXML
+    private Pane paneIcon;
+
+    @FXML
+    private AnchorPane paneContent;
+
+    @FXML
+    private Label lblJoinMessage;
+
+    @Override
+    public void initialize(URL url, ResourceBundle resourceBundle) {
+        User user = Connection.getInstance().getSelf();
+        lblUsername.setText(user.getUsernameDisplay());
+
+        UserAvatar.getAvatar(user.getAvatarID()).applyToRegionBackground(paneIcon, true);
+
+        Connection.getInstance().getPacketHandler().addListener(TopicAddedPacket.class, packet -> {
+            User host = Connection.getInstance().getUser(packet.getHostID());
+
+            Topic topic = new Topic(
+                    packet.getTopicID(),
+                    packet.getTopicName(),
+                    packet.getTopicDescription(),
+                    host,
+                    packet.getTopicColor()
+            );
+
+            var pair = MainTopicItemController.createInstance();
+            pair.second().setTopic(topic);
+
+            var contentPair = MainChatController.createInstance();
+            contentPair.second().setTopic(topic);
+
+            topicContentMap.put(topic.getId(), contentPair.first());
+
+            AnchorPane.setLeftAnchor(contentPair.first(), 0.0);
+            AnchorPane.setBottomAnchor(contentPair.first(), 0.0);
+            AnchorPane.setTopAnchor(contentPair.first(), 0.0);
+            AnchorPane.setRightAnchor(contentPair.first(), 0.0);
+            contentPair.first().setVisible(false);
+
+            Platform.runLater(() -> {
+                paneContent.getChildren().add(contentPair.first());
+
+                vboxTopics.getChildren().add(pair.first());
+            });
+
+            pair.second().setOnMouseClicked(event -> {
+                setActiveTopic(topic, pair.first());
+            });
+        });
+
+        Connection.getInstance().beginHandlingPackets();
+
+        vboxTopics.getChildren().clear();
+    }
+
+    public void setActiveTopic(Topic topic, Parent element) {
+        if (activeTopic != null) {
+            activeTopicElement.getStyleClass().remove("tag-min");
+            topicContentMap.get(activeTopic.getId()).setVisible(false);
+        } else {
+            lblJoinMessage.setVisible(false);
+        }
+
+        if (topic == null) {
+            activeTopic = null;
+            activeTopicElement = null;
+
+            lblJoinMessage.setVisible(true);
+
+            vboxRoot.setStyle("-accent: hsb(250, 10%, 50%);");
+            return;
+        }
+
+        vboxRoot.setStyle("-accent: hsb(" + topic.getColor() + ", 70%, 100%);");
+
+        element.getStyleClass().add("tag-min");
+
+        activeTopic = topic;
+        activeTopicElement = element;
+
+        topicContentMap.get(activeTopic.getId()).setVisible(true);
+    }
+
+    @FXML
+    void onCreateTopic(ActionEvent event) {
+        CreateTopicPacket packet = new CreateTopicPacket();
+        packet.setUserSecret(Connection.getInstance().getSelf().getUserSecret());
+        packet.setTopicName("Point Nemo");
+        packet.setTopicDescription("We are so gone XDD");
+
+        Connection.getInstance().sendPacket(packet);
+    }
+
+    public static Pair<Parent, MainController> createInstance() {
+        return Utils.createInstance("views/main-view.fxml");
+    }
+
+}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/controllers/item/MainTopicItemController.java b/Client/src/main/java/dev/wiing/gossip/client/controllers/item/MainTopicItemController.java
new file mode 100644
index 0000000..db76afd
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/controllers/item/MainTopicItemController.java
@@ -0,0 +1,41 @@
+package dev.wiing.gossip.client.controllers.item;
+
+import dev.wiing.gossip.client.generic.Pair;
+import dev.wiing.gossip.client.utils.Utils;
+import dev.wiing.gossip.lib.models.Topic;
+import javafx.event.ActionEvent;
+import javafx.event.EventHandler;
+import javafx.fxml.FXML;
+import javafx.scene.Parent;
+import javafx.scene.control.Label;
+import javafx.scene.input.MouseEvent;
+import javafx.scene.layout.HBox;
+
+public class MainTopicItemController {
+
+    private Topic topic;
+
+    @FXML
+    private HBox hboxParent;
+
+    @FXML
+    private Label lblTopicName;
+
+    public void setTopic(Topic topic) {
+        this.topic = topic;
+        this.lblTopicName.setText(topic.getName());
+    }
+
+    public Topic getTopic() {
+        return topic;
+    }
+
+    public static Pair<Parent, MainTopicItemController> createInstance() {
+        return Utils.createInstance("views/main-topic-item.fxml");
+    }
+
+    public void setOnMouseClicked(EventHandler<MouseEvent> eventHandler) {
+        hboxParent.setOnMouseClicked(eventHandler);
+    }
+
+}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/data/UserAvatar.java b/Client/src/main/java/dev/wiing/gossip/client/data/UserAvatar.java
new file mode 100644
index 0000000..6ff88e0
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/data/UserAvatar.java
@@ -0,0 +1,102 @@
+package dev.wiing.gossip.client.data;
+
+import dev.wiing.gossip.client.Program;
+import javafx.scene.image.Image;
+import javafx.scene.layout.*;
+import javafx.scene.shape.Circle;
+
+import java.io.IOException;
+import java.net.URL;
+import java.util.Arrays;
+
+public class UserAvatar {
+
+    public static final UserAvatar MORNING = new UserAvatar("Morning", "Eggs and Bacon", 0, "avatars/avatar-0.png");
+    public static final UserAvatar VINTAGE = new UserAvatar("Vintage", "Red Car", 1, "avatars/avatar-1.png");
+    public static final UserAvatar ROUTINE = new UserAvatar("Routine", "Coffee Cup", 2, "avatars/avatar-2.png");
+    public static final UserAvatar SILLY = new UserAvatar("Silly", "Ghost Toy", 3, "avatars/avatar-3.png");
+    public static final UserAvatar ADVENTURE = new UserAvatar("Adventure", "Slide with a Plant", 4, "avatars/avatar-4.png");
+    public static final UserAvatar REBELLION = new UserAvatar("Rebellion", "Potted Cactus", 5, "avatars/avatar-5.png");
+    public static final UserAvatar DIGITAL = new UserAvatar("Digital", "Game Controller", 6, "avatars/avatar-6.png");
+    public static final UserAvatar MYSTERY = new UserAvatar("Mystery", "Floating Sphere", 7, "avatars/avatar-7.png");
+    public static final UserAvatar VACATION = new UserAvatar("Vacation", "Cat under an Umbrella", 8, "avatars/avatar-8.png");
+    public static final UserAvatar SIMPLE = new UserAvatar("Simple", "Potted Succulent", 9, "avatars/avatar-9.png");
+
+    public static UserAvatar getAvatar(int avatarID) {
+        return Arrays.stream(getAvatars())
+                .skip(avatarID)
+                .findFirst()
+                .orElse(null);
+    }
+
+    public static UserAvatar[] getAvatars() {
+        return new UserAvatar[]{
+                MORNING,
+                VINTAGE,
+                ROUTINE,
+                SILLY,
+                ADVENTURE,
+                REBELLION,
+                DIGITAL,
+                MYSTERY,
+                VACATION,
+                SIMPLE
+        };
+    }
+
+    private final String name;
+    private final String description;
+    private final int id;
+    private final URL url;
+
+    private UserAvatar(String name, String description, int id, String path) {
+        this.name = name;
+        this.description = description;
+        this.id = id;
+        this.url = Program.class.getResource(path);
+    }
+
+    public String getName() {
+        return name;
+    }
+
+    public String getDescription() {
+        return description;
+    }
+
+    public int getId() {
+        return id;
+    }
+
+    public URL getUrl() {
+        return url;
+    }
+
+    public Image getImage() {
+        try {
+            return new Image(url.openStream());
+        } catch (IOException e) {
+            return null;
+        }
+    }
+
+    public void applyToRegionBackground(Region region, boolean applyShape) {
+        if (getImage() == null) return;
+
+        region.setBackground(new Background(
+                new BackgroundImage(
+                        getImage(),
+                        BackgroundRepeat.NO_REPEAT,
+                        BackgroundRepeat.NO_REPEAT,
+                        BackgroundPosition.CENTER,
+                        new BackgroundSize(100.0, 100.0, true, true, false, true)
+                )
+        ));
+        region.setStyle("");
+
+        if (applyShape) {
+            Circle circle = new Circle(region.getMinWidth() * 0.5);
+            region.setShape(circle);
+        }
+    }
+}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/data/UserIcon.java b/Client/src/main/java/dev/wiing/gossip/client/data/UserIcon.java
deleted file mode 100644
index fc7d2b8..0000000
--- a/Client/src/main/java/dev/wiing/gossip/client/data/UserIcon.java
+++ /dev/null
@@ -1,72 +0,0 @@
-package dev.wiing.gossip.client.data;
-
-import dev.wiing.gossip.client.Program;
-import javafx.scene.image.Image;
-
-import java.io.IOException;
-import java.net.URL;
-
-public class UserIcon {
-
-    public static final UserIcon MORNING = new UserIcon("Morning", "Eggs and Bacon", 0, "icons/icon_0.png");
-    public static final UserIcon VINTAGE = new UserIcon("Vintage", "Red Car", 1, "icons/icon_1.png");
-    public static final UserIcon ROUTINE = new UserIcon("Routine", "Coffee Cup", 2, "icons/icon_2.png");
-    public static final UserIcon SILLY = new UserIcon("Silly", "Ghost Toy", 3, "icons/icon_3.png");
-    public static final UserIcon ADVENTURE = new UserIcon("Adventure", "Slide with a Plant", 4, "icons/icon_4.png");
-    public static final UserIcon REBELLION = new UserIcon("Rebellion", "Potted Cactus", 5, "icons/icon_5.png");
-    public static final UserIcon DIGITAL = new UserIcon("Digital", "Game Controller", 6, "icons/icon_6.png");
-    public static final UserIcon MYSTERY = new UserIcon("Mystery", "Floating Sphere", 7, "icons/icon_7.png");
-    public static final UserIcon VACATION = new UserIcon("Vacation", "Cat under an Umbrella", 8, "icons/icon_8.png");
-    public static final UserIcon SIMPLE = new UserIcon("Simple", "Potted Succulent", 9, "icons/icon_9.png");
-
-    public static UserIcon[] getIcons() {
-        return new UserIcon[]{
-                MORNING,
-                VINTAGE,
-                ROUTINE,
-                SILLY,
-                ADVENTURE,
-                REBELLION,
-                DIGITAL,
-                MYSTERY,
-                VACATION,
-                SIMPLE
-        };
-    }
-
-    private final String name;
-    private final String description;
-    private final int id;
-    private final URL url;
-
-    private UserIcon(String name, String description, int id, String path) {
-        this.name = name;
-        this.description = description;
-        this.id = id;
-        this.url = Program.class.getResource(path);
-    }
-
-    public String getName() {
-        return name;
-    }
-
-    public String getDescription() {
-        return description;
-    }
-
-    public int getId() {
-        return id;
-    }
-
-    public URL getUrl() {
-        return url;
-    }
-
-    public Image getImage() {
-        try {
-            return new Image(url.openStream());
-        } catch (IOException e) {
-            return null;
-        }
-    }
-}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/generic/Pair.java b/Client/src/main/java/dev/wiing/gossip/client/generic/Pair.java
new file mode 100644
index 0000000..c06836d
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/generic/Pair.java
@@ -0,0 +1,20 @@
+package dev.wiing.gossip.client.generic;
+
+import org.jetbrains.annotations.NotNull;
+
+import java.util.Objects;
+
+public record Pair<U, V>(@NotNull U first, @NotNull V second) {
+
+    public static <X, Y> Pair<X, Y> cast(Pair<? extends X, ? extends Y> second) {
+        return new Pair<>(second.first, second.second);
+    }
+
+    @Override
+    public String toString() {
+        return "Pair[" +
+                "first=" + first + ", " +
+                "second=" + second + ']';
+    }
+
+}
diff --git a/Client/src/main/java/dev/wiing/gossip/client/utils/Utils.java b/Client/src/main/java/dev/wiing/gossip/client/utils/Utils.java
new file mode 100644
index 0000000..942269a
--- /dev/null
+++ b/Client/src/main/java/dev/wiing/gossip/client/utils/Utils.java
@@ -0,0 +1,57 @@
+package dev.wiing.gossip.client.utils;
+
+import dev.wiing.gossip.client.Program;
+import dev.wiing.gossip.client.generic.Pair;
+import javafx.fxml.FXMLLoader;
+import javafx.scene.Parent;
+import javafx.scene.Scene;
+import javafx.scene.control.Label;
+import javafx.scene.control.TextField;
+import javafx.stage.Stage;
+
+import java.io.IOException;
+import java.util.Arrays;
+
+public class Utils {
+
+    public static <T> Pair<Parent, T> createInstance(String res) {
+        FXMLLoader loader = new FXMLLoader(Program.class.getResource(res));
+
+        Parent parent;
+        try {
+            parent = loader.load();
+        } catch (IOException e) {
+            e.printStackTrace();
+            return null;
+        }
+
+        T controller = loader.getController();
+
+        return new Pair<>(parent, controller);
+    }
+
+    public static void openParentAsWindow(Parent parent, String title) {
+        Stage stage = new Stage();
+        stage.setTitle(title);
+        stage.setScene(new Scene(parent));
+        stage.show();
+    }
+
+    public static void updateLabelColorOnText(Label label, TextField... texts) {
+        for (TextField text : texts) {
+            text.setOnKeyTyped(keyEvent -> updateLabelColorOnTextCallback(label, texts));
+        }
+    }
+
+    private static void updateLabelColorOnTextCallback(Label label, TextField... texts) {
+        boolean hadItems = label.getStyleClass().contains("accent");
+
+        if (Arrays.stream(texts).allMatch(textField -> textField.getText().isEmpty())) {
+            label.getStyleClass().remove("accent");
+        }
+        else if (Arrays.stream(texts).allMatch(textField -> !textField.getText().isEmpty() && !hadItems)) {
+            label.getStyleClass().add("accent");
+        }
+    }
+
+}
diff --git a/Client/src/main/java/module-info.java b/Client/src/main/java/module-info.java
index 9736d4f..41d05ac 100644
--- a/Client/src/main/java/module-info.java
+++ b/Client/src/main/java/module-info.java
@@ -2,8 +2,11 @@ module dev.wiing.gossip.client {
     requires javafx.controls;
     requires javafx.fxml;
     requires dev.wiing.gossip.lib;
+    requires annotations;
+    requires java.desktop;
 
     exports dev.wiing.gossip.client;
     opens dev.wiing.gossip.client to javafx.fxml;
     opens dev.wiing.gossip.client.controllers to javafx.fxml;
+    opens dev.wiing.gossip.client.controllers.item to javafx.fxml;
 }
\ No newline at end of file
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_0.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-0.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_0.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-0.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_1.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-1.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_1.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-1.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_2.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-2.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_2.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-2.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_3.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-3.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_3.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-3.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_4.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-4.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_4.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-4.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_5.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-5.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_5.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-5.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_6.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-6.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_6.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-6.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_7.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-7.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_7.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-7.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_8.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-8.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_8.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-8.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon_9.png b/Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-9.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/icons/icon_9.png
rename to Client/src/main/resources/dev/wiing/gossip/client/avatars/avatar-9.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/custom.css b/Client/src/main/resources/dev/wiing/gossip/client/custom.css
new file mode 100644
index 0000000..68a6b85
--- /dev/null
+++ b/Client/src/main/resources/dev/wiing/gossip/client/custom.css
@@ -0,0 +1,11 @@
+.gradient {
+    -fx-background-color: radial-gradient(radius 130%, ladder(#eee, -accent, #111), #111);
+}
+
+.topic-button.clickable:hover {
+    -fx-background-color: #fff1;
+}
+
+.topic-button.clickable.tag-min:hover {
+    -fx-background-color: ladder(hsb(0, 0%, 50%), -color, #0000);
+}
\ No newline at end of file
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/door-enter.png b/Client/src/main/resources/dev/wiing/gossip/client/icons/door-enter.png
new file mode 100644
index 0000000000000000000000000000000000000000..f43fdcaec16b1031ad582590839e5ba86dc2699e
GIT binary patch
literal 4912
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
E035&JzW@LL

literal 0
HcmV?d00001

diff --git a/Client/src/main/resources/dev/wiing/gossip/client/edit.png b/Client/src/main/resources/dev/wiing/gossip/client/icons/icon-edit.png
similarity index 100%
rename from Client/src/main/resources/dev/wiing/gossip/client/edit.png
rename to Client/src/main/resources/dev/wiing/gossip/client/icons/icon-edit.png
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon-hash.png b/Client/src/main/resources/dev/wiing/gossip/client/icons/icon-hash.png
new file mode 100644
index 0000000000000000000000000000000000000000..bdc27ed253211c8fbb60d5526588043ae686c246
GIT binary patch
literal 4749
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
Bq1FHZ

literal 0
HcmV?d00001

diff --git a/Client/src/main/resources/dev/wiing/gossip/client/icons/icon-send-2.png b/Client/src/main/resources/dev/wiing/gossip/client/icons/icon-send-2.png
new file mode 100644
index 0000000000000000000000000000000000000000..46eda0d53c0eac0d594bb3958967dffafb6a77c8
GIT binary patch
literal 5026
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
Zr02HDO1&yx%>lOyQbolptEML}`!}kQ{%8OI

literal 0
HcmV?d00001

diff --git a/Client/src/main/resources/dev/wiing/gossip/client/styling.css b/Client/src/main/resources/dev/wiing/gossip/client/styling.css
index 1545f52..ab0a444 100644
--- a/Client/src/main/resources/dev/wiing/gossip/client/styling.css
+++ b/Client/src/main/resources/dev/wiing/gossip/client/styling.css
@@ -19,10 +19,10 @@
     -fx-background-radius: 16px;
 }
 
-.list.container .viewport,
+.list.container > .viewport,
 .section,
 .pane.list.container {
-    -fx-background-color: #19191d;
+    -fx-background-color: #88f1;
 }
 
 .list.container.dim .viewport {
@@ -34,12 +34,12 @@ SplitPane {
 }
 
 SplitPane .split-pane-divider {
-    -fx-background-color: #19191d;
+    -fx-background-color: #88f1;
     -fx-padding: 0.0 5.0 0.0 0.0;
 }
 
 .elevated {
-    -fx-background-color: #25252c;
+    -fx-background-color: #88f2;
 }
 
 .border-radius {
@@ -52,18 +52,29 @@ SplitPane .split-pane-divider {
 
 Label,
 RadioButton,
-TextField {
+TextField,
+TextArea {
     -fx-text-fill: #fff;
     -fx-fill: #fff;
 }
 
+TextArea,
+TextArea .scroll-pane {
+    -fx-background-color: transparent;
+}
+
+TextArea .scroll-pane .content {
+    -fx-background-color: red;
+}
+
 ChoiceBox,
-TextField {
-    -fx-background-color: #19191d;
+TextField,
+TextArea .scroll-pane .content {
+    -fx-background-color: #88f1;
 }
 
 ColorPicker {
-    -fx-background-color: #29292F;
+    -fx-background-color: #88f1;
     -fx-padding: 4px 14px;
 }
 
@@ -77,6 +88,12 @@ ColorPicker {
     -fx-fill: #556;
 }
 
+.transparent,
+.transparent.list.container .viewport,
+TextArea.transparent .scroll-pane .content {
+    -fx-background-color: transparent;
+}
+
 .accent {
     -fx-text-fill: -accent;
 }
@@ -85,15 +102,10 @@ Separator {
     -fx-opacity: 0.1;
 }
 
-Button {
-    -fx-background-color: -accent;
-    -fx-background-insets: 0;
-    -fx-text-fill: white;
-    -fx-padding: 4px 14px;
-}
-
-Button.gray {
+Button.secondary {
     -fx-background-color: #4a4a55;
+    -fx-border-width: 0px;
+    -fx-text-fill: white;
 }
 
 Button,
@@ -101,6 +113,17 @@ Button,
     -fx-cursor: hand;
 }
 
+Button:hover {
+    -fx-background-color: ladder(hsb(0, 0%, 40%), -color, #0000);
+    -fx-text-fill: ladder(hsb(0, 0%, 50%), -color, #fff);
+    -fx-border-color: ladder(hsb(0, 0%, 50%), -color, #fff);
+}
+
+Button.secondary:hover {
+    -fx-background-color: #6c6c80;
+    -fx-text-fill: white;
+}
+
 ChoiceBox {
     -fx-background-insets: 0;
 }
@@ -109,7 +132,9 @@ ChoiceBox {
     -fx-font-family: "AXIS Extra Bold";
 }
 
+Button,
 Label.tag {
+    -color: -accent;
     -fx-background-color: ladder(hsb(0, 0%, 70%), -color, #0000);
     -fx-background-radius: 8px;
     -fx-border-radius: 8px;
@@ -119,6 +144,21 @@ Label.tag {
     -fx-padding: 6px 14px;
 }
 
+.tag-min {
+    -color: -accent;
+    -fx-background-color: ladder(hsb(0, 0%, 60%), -color, #0000);
+    -fx-text-fill: -color;
+}
+
+Label.tag.small {
+    -fx-background-color: -color;
+    -fx-background-radius: 4px;
+    -fx-border-width: 0;
+    -fx-text-fill: white;
+    -fx-font-size: 10px;
+    -fx-padding: 2px 8px;
+}
+
 CheckBox .box {
     -fx-background-color: #25252c;
 }
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/views/login-view.fxml b/Client/src/main/resources/dev/wiing/gossip/client/views/login-view.fxml
index 8d2ee5c..8c4c8f6 100644
--- a/Client/src/main/resources/dev/wiing/gossip/client/views/login-view.fxml
+++ b/Client/src/main/resources/dev/wiing/gossip/client/views/login-view.fxml
@@ -12,10 +12,11 @@
 <?import javafx.scene.layout.HBox?>
 <?import javafx.scene.layout.VBox?>
 
-<VBox alignment="CENTER" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" spacing="16.0" xmlns="http://javafx.com/javafx/21" xmlns:fx="http://javafx.com/fxml/1" fx:controller="dev.wiing.gossip.client.controllers.LoginController">
+<VBox alignment="CENTER" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" spacing="16.0" styleClass="gradient" xmlns="http://javafx.com/javafx/20.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="dev.wiing.gossip.client.controllers.LoginController">
    <stylesheets>
       <URL value="@../styling.css" />
       <URL value="@../scroll.css" />
+      <URL value="@../custom.css" />
    </stylesheets>
    <children>
       <ImageView fitHeight="150.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
@@ -31,13 +32,13 @@
       </Label>
       <HBox alignment="CENTER" spacing="16.0" VBox.vgrow="ALWAYS">
          <children>
-            <AnchorPane fx:id="paneIcon" maxHeight="64.0" maxWidth="64.0" minHeight="64.0" minWidth="64.0" onMouseClicked="#onChangeIcon" onMouseEntered="#onIconMouseEnter" onMouseExited="#onIconMouseExit">
+            <AnchorPane fx:id="paneIcon" maxHeight="64.0" maxWidth="64.0" minHeight="64.0" minWidth="64.0" onMouseClicked="#onChangeIcon" onMouseEntered="#onIconMouseEnter" onMouseExited="#onIconMouseExit" style="-fx-background-color: white;">
                <children>
                   <HBox fx:id="hboxEditOverlay" alignment="CENTER" mouseTransparent="true" opacity="0.0" style="-fx-background-color: #0006;" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
                      <children>
                         <ImageView blendMode="HARD_LIGHT" fitHeight="32.0" fitWidth="32.0" pickOnBounds="true" preserveRatio="true">
                            <image>
-                              <Image url="@../edit.png" />
+                              <Image url="@../icons/icon-edit.png" />
                            </image>
                         </ImageView>
                      </children>
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/views/main-chat-view.fxml b/Client/src/main/resources/dev/wiing/gossip/client/views/main-chat-view.fxml
new file mode 100644
index 0000000..154e3ba
--- /dev/null
+++ b/Client/src/main/resources/dev/wiing/gossip/client/views/main-chat-view.fxml
@@ -0,0 +1,165 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import java.lang.String?>
+<?import java.net.URL?>
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.control.ScrollPane?>
+<?import javafx.scene.control.Separator?>
+<?import javafx.scene.control.TextArea?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.AnchorPane?>
+<?import javafx.scene.layout.HBox?>
+<?import javafx.scene.layout.Pane?>
+<?import javafx.scene.layout.VBox?>
+<?import javafx.scene.shape.Circle?>
+
+
+<AnchorPane xmlns="http://javafx.com/javafx/20.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="dev.wiing.gossip.client.controllers.MainChatController">
+   <children>
+      <VBox fx:id="vboxVisitPage" alignment="CENTER" layoutX="10.0" layoutY="10.0" spacing="8.0" visible="false" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+         <children>
+            <AnchorPane maxHeight="64.0" maxWidth="64.0" minHeight="64.0" minWidth="64.0">
+               <children>
+                  <Circle blendMode="OVERLAY" fill="WHITE" opacity="0.7" radius="32.0" stroke="BLACK" strokeType="INSIDE" strokeWidth="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.topAnchor="0.0" />
+                  <ImageView fitHeight="48.0" fitWidth="48.0" layoutX="8.0" layoutY="8.0" pickOnBounds="true" preserveRatio="true" AnchorPane.bottomAnchor="8.0" AnchorPane.leftAnchor="8.0" AnchorPane.rightAnchor="8.0" AnchorPane.topAnchor="8.0">
+                     <image>
+                        <Image url="@../icons/icon-hash.png" />
+                     </image>
+                  </ImageView>
+               </children>
+            </AnchorPane>
+            <Label fx:id="lblVisitTopicName" style="-fx-font-size: 20;" styleClass="axis" text="Topic name" />
+            <Label fx:id="lblVisitTopicDescription" text="Topic Description" />
+            <Label fx:id="lblVisitHostName" styleClass="accent" text="\@ Username" />
+            <Separator orientation="VERTICAL" prefHeight="20.0" visible="false" />
+            <Button mnemonicParsing="false" onAction="#onJoinTopic" text="Join">
+               <styleClass>
+                  <String fx:value="axis" />
+                  <String fx:value="secondary" />
+               </styleClass>
+            </Button>
+            <Label fx:id="lblVisitBabblerCount" styleClass="faint" text="2 babblers active" />
+         </children>
+      </VBox>
+      <VBox fx:id="vboxChatPage" spacing="16.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+         <children>
+            <HBox alignment="CENTER_LEFT" spacing="4.0">
+               <children>
+                  <ImageView fitHeight="24.0" fitWidth="24.0" pickOnBounds="true" preserveRatio="true">
+                     <image>
+                        <Image url="@../icons/icon-hash.png" />
+                     </image>
+                  </ImageView>
+                  <Label fx:id="lblTopicName" style="-fx-font-size: 16;" styleClass="axis" text="Label" />
+                  <Label fx:id="lblBabblersCount" alignment="CENTER_RIGHT" maxWidth="1.7976931348623157E308" style="-fx-font-size: 12;" styleClass="faint" text="2 babblers" HBox.hgrow="ALWAYS" />
+               </children>
+            </HBox>
+            <ScrollPane fitToHeight="true" fitToWidth="true" VBox.vgrow="ALWAYS">
+               <content>
+                  <VBox fx:id="vboxMessages" spacing="16.0">
+                     <children>
+                        <HBox spacing="8.0">
+                           <children>
+                              <Pane maxHeight="40.0" maxWidth="40.0" minHeight="40.0" minWidth="40.0" style="-fx-background-color: white;" />
+                              <VBox alignment="CENTER_LEFT" minHeight="40.0" spacing="4.0" HBox.hgrow="ALWAYS">
+                                 <children>
+                                    <HBox alignment="BOTTOM_LEFT" spacing="8.0">
+                                       <children>
+                                          <Label style="-fx-font-size: 14;" text="\@ Username">
+                                             <styleClass>
+                                                <String fx:value="axis" />
+                                                <String fx:value="accent" />
+                                             </styleClass>
+                                          </Label>
+                                          <Label text="You">
+                                             <styleClass>
+                                                <String fx:value="tag" />
+                                                <String fx:value="small" />
+                                                <String fx:value="axis" />
+                                             </styleClass>
+                                          </Label>
+                                          <Label alignment="CENTER_RIGHT" contentDisplay="RIGHT" maxWidth="1.7976931348623157E308" style="-fx-font-size: 10;" styleClass="faint" text="10 minutes ago" textAlignment="RIGHT" HBox.hgrow="ALWAYS" />
+                                       </children>
+                                    </HBox>
+                                    <VBox spacing="4.0">
+                                       <children>
+                                          <Label text="Message contents" />
+                                       </children>
+                                    </VBox>
+                                 </children>
+                              </VBox>
+                           </children>
+                        </HBox>
+                        <HBox alignment="CENTER_LEFT" layoutX="26.0" layoutY="26.0" spacing="8.0">
+                           <children>
+                              <ImageView fitHeight="20.0" fitWidth="20.0" opacity="0.5" pickOnBounds="true" preserveRatio="true">
+                                 <image>
+                                    <Image url="@../icons/door-enter.png" />
+                                 </image>
+                              </ImageView>
+                              <Label style="-fx-font-size: 14;" styleClass="axis" text="\@ Username" />
+                              <Label layoutX="46.0" layoutY="19.0" style="-fx-font-size: 12;" text="joined the Topic" />
+                              <Label alignment="CENTER_RIGHT" contentDisplay="RIGHT" maxWidth="1.7976931348623157E308" style="-fx-font-size: 10;" styleClass="faint" text="10 minutes ago" textAlignment="RIGHT" HBox.hgrow="ALWAYS">
+                                 <HBox.margin>
+                                    <Insets />
+                                 </HBox.margin>
+                              </Label>
+                           </children>
+                           <padding>
+                              <Insets bottom="8.0" left="16.0" right="16.0" top="8.0" />
+                           </padding>
+                           <styleClass>
+                              <String fx:value="elevated" />
+                              <String fx:value="border-radius-small" />
+                           </styleClass>
+                        </HBox>
+                     </children>
+                     <padding>
+                        <Insets bottom="16.0" left="16.0" right="16.0" top="16.0" />
+                     </padding>
+                  </VBox>
+               </content>
+               <styleClass>
+                  <String fx:value="container" />
+                  <String fx:value="list" />
+               </styleClass>
+            </ScrollPane>
+            <VBox spacing="8.0">
+               <children>
+                  <Label fx:id="lblTyping" style="-fx-font-size: 11;" styleClass="faint" text="Username, Username is typing ...">
+                     <padding>
+                        <Insets left="16.0" right="16.0" />
+                     </padding>
+                  </Label>
+                  <HBox alignment="CENTER_LEFT" spacing="8.0">
+                     <styleClass>
+                        <String fx:value="container" />
+                        <String fx:value="pane" />
+                        <String fx:value="list" />
+                     </styleClass>
+                     <children>
+                        <TextArea fx:id="txtCompose" maxHeight="1.7976931348623157E308" minHeight="1.0" prefHeight="24.0" prefRowCount="1" promptText="Compose..." styleClass="transparent" wrapText="true" HBox.hgrow="ALWAYS" />
+                        <ImageView fitHeight="20.0" fitWidth="20.0" onMouseClicked="#onSend" opacity="0.5" pickOnBounds="true" preserveRatio="true">
+                           <image>
+                              <Image url="@../icons/icon-send-2.png" />
+                           </image>
+                        </ImageView>
+                     </children>
+                     <padding>
+                        <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+                     </padding>
+                  </HBox>
+               </children>
+            </VBox>
+         </children>
+      </VBox>
+   </children>
+   <stylesheets>
+      <URL value="@../styling.css" />
+      <URL value="@../scroll.css" />
+      <URL value="@../custom.css" />
+   </stylesheets>
+</AnchorPane>
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/views/main-topic-item.fxml b/Client/src/main/resources/dev/wiing/gossip/client/views/main-topic-item.fxml
new file mode 100644
index 0000000..ebe4432
--- /dev/null
+++ b/Client/src/main/resources/dev/wiing/gossip/client/views/main-topic-item.fxml
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import java.lang.String?>
+<?import java.net.URL?>
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.HBox?>
+
+<HBox fx:id="hboxParent" opacity="0.8" spacing="4.0" xmlns="http://javafx.com/javafx/20.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="dev.wiing.gossip.client.controllers.item.MainTopicItemController">
+   <children>
+      <ImageView blendMode="OVERLAY" fitHeight="16.0" fitWidth="16.0" opacity="0.4" pickOnBounds="true" preserveRatio="true">
+         <image>
+            <Image url="@../icons/icon-hash.png" />
+         </image>
+      </ImageView>
+      <Label fx:id="lblTopicName" text="Label" />
+   </children>
+   <padding>
+      <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+   </padding>
+   <styleClass>
+      <String fx:value="border-radius-small" />
+      <String fx:value="clickable" />
+      <String fx:value="topic-button" />
+   </styleClass>
+   <stylesheets>
+      <URL value="@../styling.css" />
+      <URL value="@../custom.css" />
+   </stylesheets>
+</HBox>
diff --git a/Client/src/main/resources/dev/wiing/gossip/client/views/main-view.fxml b/Client/src/main/resources/dev/wiing/gossip/client/views/main-view.fxml
index b980339..0c43c30 100644
--- a/Client/src/main/resources/dev/wiing/gossip/client/views/main-view.fxml
+++ b/Client/src/main/resources/dev/wiing/gossip/client/views/main-view.fxml
@@ -3,26 +3,63 @@
 <?import java.lang.String?>
 <?import java.net.URL?>
 <?import javafx.geometry.Insets?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
 <?import javafx.scene.control.ScrollPane?>
+<?import javafx.scene.control.Separator?>
 <?import javafx.scene.control.SplitPane?>
+<?import javafx.scene.control.TextArea?>
 <?import javafx.scene.image.Image?>
 <?import javafx.scene.image.ImageView?>
 <?import javafx.scene.layout.AnchorPane?>
+<?import javafx.scene.layout.HBox?>
+<?import javafx.scene.layout.Pane?>
 <?import javafx.scene.layout.VBox?>
+<?import javafx.scene.shape.Circle?>
 
-
-<VBox alignment="TOP_RIGHT" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="594.0" prefWidth="948.0" xmlns="http://javafx.com/javafx/21" xmlns:fx="http://javafx.com/fxml/1">
+<VBox fx:id="vboxRoot" alignment="TOP_RIGHT" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="486.0" prefWidth="750.0" spacing="16.0" style="-accent: hsb(0, 0%, 50%);;" styleClass="gradient" xmlns="http://javafx.com/javafx/20.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="dev.wiing.gossip.client.controllers.MainController">
    <stylesheets>
       <URL value="@../styling.css" />
       <URL value="@../scroll.css" />
+      <URL value="@../custom.css" />
    </stylesheets>
    <children>
-      <ImageView fitHeight="30.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
-         <image>
-            <Image url="@../logo.png" />
-         </image>
-      </ImageView>
-      <SplitPane dividerPositions="0.29797979797979796" prefHeight="160.0" prefWidth="200.0" VBox.vgrow="ALWAYS">
+      <HBox>
+         <children>
+            <ImageView blendMode="OVERLAY" fitHeight="30.0" fitWidth="200.0" pickOnBounds="true" preserveRatio="true">
+               <image>
+                  <Image url="@../logo.png" />
+               </image>
+            </ImageView>
+            <Separator maxWidth="1.7976931348623157E308" visible="false" HBox.hgrow="ALWAYS" />
+            <HBox spacing="8.0">
+               <children>
+                  <VBox alignment="CENTER_RIGHT" minHeight="40.0" spacing="4.0" HBox.hgrow="ALWAYS">
+                     <children>
+                        <HBox alignment="BOTTOM_LEFT" spacing="8.0">
+                           <children>
+                              <Label fx:id="lblUsername" style="-fx-font-size: 14;" text="\@ Username">
+                                 <styleClass>
+                                    <String fx:value="axis" />
+                                    <String fx:value="accent" />
+                                 </styleClass>
+                              </Label>
+                           </children>
+                        </HBox>
+                        <Label style="-fx-font-size: 12;" text="Log out">
+                           <styleClass>
+                              <String fx:value="axis" />
+                              <String fx:value="faint" />
+                           </styleClass>
+                        </Label>
+                     </children>
+                  </VBox>
+                  <Pane fx:id="paneIcon" maxHeight="40.0" maxWidth="40.0" minHeight="40.0" minWidth="40.0" style="-fx-background-color: white;" />
+               </children>
+            </HBox>
+         </children>
+      </HBox>
+      <SplitPane dividerPositions="0.29797979797979796" prefHeight="160.0" prefWidth="200.0" styleClass="transparent" VBox.vgrow="ALWAYS">
         <items>
           <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
                <styleClass>
@@ -30,26 +67,210 @@
                   <String fx:value="pane" />
                </styleClass>
                <children>
-                  <ScrollPane prefHeight="200.0" prefWidth="200.0" vbarPolicy="NEVER" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
-                    <content>
-                      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="200.0" prefWidth="200.0">
-                           <children>
-                              <VBox prefHeight="200.0" prefWidth="100.0" />
-                           </children>
-                        </AnchorPane>
-                    </content>
-                     <padding>
-                        <Insets right="4.0" />
-                     </padding>
-                     <styleClass>
-                        <String fx:value="container" />
-                        <String fx:value="list" />
-                        <String fx:value="dim" />
-                     </styleClass>
-                  </ScrollPane>
+                  <VBox alignment="TOP_CENTER" spacing="16.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                     <children>
+                        <ScrollPane fitToHeight="true" fitToWidth="true" hbarPolicy="NEVER" VBox.vgrow="ALWAYS">
+                          <content>
+                              <VBox fx:id="vboxTopics" maxHeight="1.7976931348623157E308" spacing="8.0">
+                                 <children>
+                                    <HBox spacing="4.0">
+                                       <styleClass>
+                                          <String fx:value="tag-min" />
+                                          <String fx:value="border-radius-small" />
+                                       </styleClass>
+                                       <children>
+                                          <ImageView blendMode="OVERLAY" fitHeight="16.0" fitWidth="16.0" opacity="0.4" pickOnBounds="true" preserveRatio="true">
+                                             <image>
+                                                <Image url="@../icons/icon-hash.png" />
+                                             </image>
+                                          </ImageView>
+                                          <Label text="Label" />
+                                       </children>
+                                       <padding>
+                                          <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+                                       </padding>
+                                    </HBox>
+                                    <HBox layoutX="10.0" layoutY="10.0" opacity="0.8" spacing="4.0" styleClass="border-radius-small">
+                                       <children>
+                                          <ImageView blendMode="OVERLAY" fitHeight="16.0" fitWidth="16.0" opacity="0.4" pickOnBounds="true" preserveRatio="true">
+                                             <image>
+                                                <Image url="@../icons/icon-hash.png" />
+                                             </image>
+                                          </ImageView>
+                                          <Label text="Label" />
+                                       </children>
+                                       <padding>
+                                          <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+                                       </padding>
+                                    </HBox>
+                                    <HBox layoutX="10.0" layoutY="50.0" opacity="0.8" spacing="4.0" styleClass="border-radius-small">
+                                       <children>
+                                          <ImageView blendMode="OVERLAY" fitHeight="16.0" fitWidth="16.0" opacity="0.4" pickOnBounds="true" preserveRatio="true">
+                                             <image>
+                                                <Image url="@../icons/icon-hash.png" />
+                                             </image>
+                                          </ImageView>
+                                          <Label text="Label" />
+                                       </children>
+                                       <padding>
+                                          <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+                                       </padding>
+                                    </HBox>
+                                 </children>
+                              </VBox>
+                          </content>
+                           <padding>
+                              <Insets right="4.0" />
+                           </padding>
+                           <styleClass>
+                              <String fx:value="container" />
+                              <String fx:value="list" />
+                              <String fx:value="transparent" />
+                           </styleClass>
+                        </ScrollPane>
+                        <Button mnemonicParsing="false" onAction="#onCreateTopic" text="New TOPIC">
+                           <styleClass>
+                              <String fx:value="axis" />
+                              <String fx:value="tag" />
+                           </styleClass>
+                        </Button>
+                     </children>
+                  </VBox>
                </children>
+               <padding>
+                  <Insets right="16.0" />
+               </padding>
             </AnchorPane>
-          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0" />
+          <AnchorPane fx:id="paneContent" minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
+               <children>
+                  <Label fx:id="lblJoinMessage" alignment="CENTER" style="-fx-font-size: 20;" text="Start or Join a Topic!" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                     <styleClass>
+                        <String fx:value="axis" />
+                        <String fx:value="accent" />
+                     </styleClass>
+                  </Label>
+                  <AnchorPane layoutX="16.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                     <children>
+                        <VBox alignment="CENTER" spacing="8.0" visible="false" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                           <children>
+                              <AnchorPane maxHeight="64.0" maxWidth="64.0" minHeight="64.0" minWidth="64.0">
+                                 <children>
+                                    <Circle blendMode="OVERLAY" fill="WHITE" opacity="0.7" radius="32.0" stroke="BLACK" strokeType="INSIDE" strokeWidth="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.topAnchor="0.0" />
+                                    <ImageView fitHeight="48.0" fitWidth="48.0" layoutX="8.0" layoutY="8.0" pickOnBounds="true" preserveRatio="true" AnchorPane.bottomAnchor="8.0" AnchorPane.leftAnchor="8.0" AnchorPane.rightAnchor="8.0" AnchorPane.topAnchor="8.0">
+                                       <image>
+                                          <Image url="@../icons/icon-hash.png" />
+                                       </image>
+                                    </ImageView>
+                                 </children>
+                              </AnchorPane>
+                              <Label style="-fx-font-size: 20;" styleClass="axis" text="Topic name" />
+                              <Label text="Topic Description" />
+                              <Label styleClass="accent" text="\@ Username" />
+                              <Separator orientation="VERTICAL" prefHeight="20.0" visible="false" />
+                              <Button mnemonicParsing="false" text="Join">
+                                 <styleClass>
+                                    <String fx:value="axis" />
+                                    <String fx:value="secondary" />
+                                 </styleClass>
+                              </Button>
+                              <Label styleClass="faint" text="2 babblers active" />
+                           </children>
+                        </VBox>
+                        <VBox prefHeight="200.0" prefWidth="100.0" spacing="16.0" visible="false" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                           <children>
+                              <HBox alignment="CENTER_LEFT" spacing="4.0">
+                                 <children>
+                                    <ImageView fitHeight="24.0" fitWidth="24.0" pickOnBounds="true" preserveRatio="true">
+                                       <image>
+                                          <Image url="@../icons/icon-hash.png" />
+                                       </image>
+                                    </ImageView>
+                                    <Label style="-fx-font-size: 16;" styleClass="axis" text="Label" />
+                                    <Label alignment="CENTER_RIGHT" maxWidth="1.7976931348623157E308" style="-fx-font-size: 12;" styleClass="faint" text="2 babblers" HBox.hgrow="ALWAYS" />
+                                 </children>
+                              </HBox>
+                              <ScrollPane fitToHeight="true" fitToWidth="true" VBox.vgrow="ALWAYS">
+                                <content>
+                                    <VBox spacing="16.0">
+                                       <children>
+                                          <HBox spacing="8.0">
+                                             <children>
+                                                <Pane maxHeight="40.0" maxWidth="40.0" minHeight="40.0" minWidth="40.0" style="-fx-background-color: white;" />
+                                                <VBox alignment="CENTER_LEFT" minHeight="40.0" spacing="4.0" HBox.hgrow="ALWAYS">
+                                                   <children>
+                                                      <HBox alignment="BOTTOM_LEFT" spacing="8.0">
+                                                         <children>
+                                                            <Label style="-fx-font-size: 14;" text="\@ Username">
+                                                               <styleClass>
+                                                                  <String fx:value="axis" />
+                                                                  <String fx:value="accent" />
+                                                               </styleClass>
+                                                            </Label>
+                                                            <Label text="You">
+                                                               <styleClass>
+                                                                  <String fx:value="tag" />
+                                                                  <String fx:value="small" />
+                                                                  <String fx:value="axis" />
+                                                               </styleClass>
+                                                            </Label>
+                                                            <Label alignment="CENTER_RIGHT" contentDisplay="RIGHT" maxWidth="1.7976931348623157E308" style="-fx-font-size: 10;" styleClass="faint" text="10 minutes ago" textAlignment="RIGHT" HBox.hgrow="ALWAYS" />
+                                                         </children>
+                                                      </HBox>
+                                                      <VBox spacing="4.0">
+                                                         <children>
+                                                            <Label text="Message contents" />
+                                                         </children>
+                                                      </VBox>
+                                                   </children>
+                                                </VBox>
+                                             </children>
+                                          </HBox>
+                                       </children>
+                                       <padding>
+                                          <Insets bottom="16.0" left="16.0" right="16.0" top="16.0" />
+                                       </padding>
+                                    </VBox>
+                                </content>
+                                 <styleClass>
+                                    <String fx:value="container" />
+                                    <String fx:value="list" />
+                                 </styleClass>
+                              </ScrollPane>
+                              <VBox spacing="8.0">
+                                 <children>
+                                    <Label style="-fx-font-size: 11;" styleClass="faint" text="Username, Username is typing ...">
+                                       <padding>
+                                          <Insets left="16.0" right="16.0" />
+                                       </padding>
+                                    </Label>
+                                    <HBox alignment="CENTER_LEFT" spacing="8.0">
+                                       <styleClass>
+                                          <String fx:value="container" />
+                                          <String fx:value="pane" />
+                                          <String fx:value="list" />
+                                       </styleClass>
+                                       <children>
+                                          <TextArea maxHeight="1.7976931348623157E308" minHeight="1.0" prefHeight="24.0" prefRowCount="1" promptText="Compose..." styleClass="transparent" wrapText="true" HBox.hgrow="ALWAYS" />
+                                          <ImageView fitHeight="20.0" fitWidth="20.0" opacity="0.5" pickOnBounds="true" preserveRatio="true">
+                                             <image>
+                                                <Image url="@../icons/icon-send-2.png" />
+                                             </image>
+                                          </ImageView>
+                                       </children>
+                                       <padding>
+                                          <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
+                                       </padding>
+                                    </HBox>
+                                 </children>
+                              </VBox>
+                           </children>
+                        </VBox>
+                     </children>
+                  </AnchorPane>
+               </children>
+               <padding>
+                  <Insets left="16.0" />
+               </padding></AnchorPane>
         </items>
       </SplitPane>
    </children>
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/PacketHandler.java b/Lib/src/main/java/dev/wiing/gossip/lib/PacketHandler.java
index 9bea038..dea93e1 100644
--- a/Lib/src/main/java/dev/wiing/gossip/lib/PacketHandler.java
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/PacketHandler.java
@@ -1,6 +1,8 @@
 package dev.wiing.gossip.lib;
 
+import dev.wiing.gossip.lib.packets.CreateTopicPacket;
 import dev.wiing.gossip.lib.packets.Packet;
+import dev.wiing.gossip.lib.packets.TopicAddedPacket;
 
 import java.util.*;
 import java.util.concurrent.ConcurrentHashMap;
@@ -36,6 +38,14 @@ public class PacketHandler {
         }
     }
 
+    public void runPacket(Packet packet) {
+        switch (packet.getType()) {
+            case TopicAddedPacket.TYPE:
+                runPacket(TopicAddedPacket.class, (TopicAddedPacket)packet);
+                break;
+        }
+    }
+
     public <T extends Packet> Set<PacketListener<T>> getListeners(Class<T> packetClass) {
         if (!listeners.containsKey(packetClass))
             return null;
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/PacketManager.java b/Lib/src/main/java/dev/wiing/gossip/lib/PacketManager.java
index b6e2968..f6e58f1 100644
--- a/Lib/src/main/java/dev/wiing/gossip/lib/PacketManager.java
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/PacketManager.java
@@ -1,9 +1,6 @@
 package dev.wiing.gossip.lib;
 
-import dev.wiing.gossip.lib.packets.CredentialsPacket;
-import dev.wiing.gossip.lib.packets.RegisterPacket;
-import dev.wiing.gossip.lib.packets.Packet;
-import dev.wiing.gossip.lib.packets.TestPacket;
+import dev.wiing.gossip.lib.packets.*;
 
 import java.io.*;
 import java.nio.ByteBuffer;
@@ -20,6 +17,12 @@ public class PacketManager {
 
             add(new RegisterPacket());
             add(new CredentialsPacket());
+
+            add(new CreateTopicPacket());
+            add(new TopicAddedPacket());
+
+            add(new FetchUserPacket());
+            add(new UserDataPacket());
         }
     };
 
@@ -33,6 +36,9 @@ public class PacketManager {
         packetMap.clear();
 
         for (Packet packet : packetList) {
+            if (packetMap.containsKey(packet.getType())) {
+                throw new RuntimeException("Packet type already exists");
+            }
             packetMap.put(packet.getType(), packet);
         }
     }
@@ -40,6 +46,8 @@ public class PacketManager {
     public Packet readPacket(BufferedInputStream stream) throws IOException {
         ByteBuffer buffer = ByteBuffer.wrap(stream.readNBytes(6));
 
+        if (buffer.capacity() < 6) return null;
+
         short type = buffer.getShort();
         int size = buffer.getInt();
 
@@ -71,4 +79,10 @@ public class PacketManager {
         writePacket(outputStream, packet);
         outputStream.flush();
     }
+
+    public void replyPacket(Packet source, Packet reply) throws IOException {
+        BufferedOutputStream outputStream = new BufferedOutputStream(source.getSource().getOutputStream());
+        writePacket(outputStream, reply);
+        outputStream.flush();
+    }
 }
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/data/StringType.java b/Lib/src/main/java/dev/wiing/gossip/lib/data/StringType.java
index 0126264..d6b5178 100644
--- a/Lib/src/main/java/dev/wiing/gossip/lib/data/StringType.java
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/data/StringType.java
@@ -7,7 +7,7 @@ import java.nio.charset.StandardCharsets;
 
 public class StringType implements DataType<String> {
 
-    private String value;
+    private String value = "";
 
     @Override
     public String getValue() {
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/models/Message.java b/Lib/src/main/java/dev/wiing/gossip/lib/models/Message.java
new file mode 100644
index 0000000..a82ebad
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/models/Message.java
@@ -0,0 +1,17 @@
+package dev.wiing.gossip.lib.models;
+
+import java.time.LocalDateTime;
+
+public class Message {
+    private User author;
+    private String message;
+    private LocalDateTime postTime;
+
+    public Message(User author, String message, LocalDateTime postTime) {
+        this.author = author;
+        this.message = message;
+        this.postTime = postTime;
+    }
+
+
+}
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/models/Topic.java b/Lib/src/main/java/dev/wiing/gossip/lib/models/Topic.java
new file mode 100644
index 0000000..57547c7
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/models/Topic.java
@@ -0,0 +1,96 @@
+package dev.wiing.gossip.lib.models;
+
+import java.beans.PropertyChangeListener;
+import java.beans.PropertyChangeSupport;
+import java.util.Collections;
+import java.util.Map;
+import java.util.concurrent.ConcurrentHashMap;
+
+public class Topic {
+    private PropertyChangeSupport changeSupport;
+
+    private final long id;
+    private String name;
+    private String description;
+    private final User host;
+    private final Map<Long, User> users = new ConcurrentHashMap<>();
+    private short color;
+
+    public Topic(long id, String name, String description, User host, short color) {
+        this.id = id;
+        this.name = name;
+        this.description = description;
+        this.host = host;
+        this.color = color;
+
+        this.changeSupport = new PropertyChangeSupport(this);
+    }
+
+    public long getId() {
+        return id;
+    }
+
+    public String getName() {
+        return name;
+    }
+
+    public void setName(String name) {
+        String prev = this.name;
+        this.name = name;
+        this.changeSupport.firePropertyChange("name", prev, name);
+    }
+
+    public String getDescription() {
+        return description;
+    }
+
+    public void setDescription(String description) {
+        String prev = this.description;
+        this.description = description;
+        this.changeSupport.firePropertyChange("description", prev, description);
+    }
+
+    public User getHost() {
+        return host;
+    }
+
+    public short getColor() {
+        return color;
+    }
+
+    public void setColor(short color) {
+        short prev = this.color;
+        this.color = color;
+        this.changeSupport.firePropertyChange("color", prev, color);
+    }
+
+    public Map<Long, User> getUsersReadOnly() {
+        return Collections.unmodifiableMap(users);
+    }
+
+    public void addUser(User user) {
+        if (this.users.containsKey(user.getUserID())) return;
+
+        this.users.put(user.getUserID(), user);
+        this.changeSupport.firePropertyChange("userAdd", null, getUsersReadOnly());
+    }
+
+    public void removeUser(User user) {
+        if (!this.users.containsKey(user.getUserID())) return;
+
+        this.users.remove(user.getUserID());
+        this.changeSupport.firePropertyChange("userRemove", null, getUsersReadOnly());
+    }
+
+    public boolean hasUser(User user) {
+        return this.users.containsKey(user.getUserID());
+    }
+
+    public void addChangeListener(PropertyChangeListener listener) {
+        this.changeSupport.addPropertyChangeListener(listener);
+    }
+
+    public void removeChangeListener(PropertyChangeListener listener) {
+        this.changeSupport.removePropertyChangeListener(listener);
+    }
+}
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/models/User.java b/Lib/src/main/java/dev/wiing/gossip/lib/models/User.java
index 4940fca..78d73d7 100644
--- a/Lib/src/main/java/dev/wiing/gossip/lib/models/User.java
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/models/User.java
@@ -7,12 +7,12 @@ public class User {
     private final PropertyChangeSupport change;
 
     private String username;
-    private int iconID;
+    private int avatarID;
     private long userID;
 
-    public User(String username, int iconID, long userID) {
+    public User(String username, int avatarID, long userID) {
         this.username = username;
-        this.iconID = iconID;
+        this.avatarID = avatarID;
         this.userID = userID;
 
         this.change = new PropertyChangeSupport(this);
@@ -22,20 +22,24 @@ public class User {
         return username;
     }
 
+    public String getUsernameDisplay() {
+        return "@ " + getUsername();
+    }
+
     public void setUsername(String username) {
         String previous = this.username;
         this.username = username;
         change.firePropertyChange("username", previous, username);
     }
 
-    public int getIconID() {
-        return iconID;
+    public int getAvatarID() {
+        return avatarID;
     }
 
-    public void setIconID(int iconID) {
-        int previous = this.iconID;
-        this.iconID = iconID;
-        change.firePropertyChange("iconID", previous, iconID);
+    public void setAvatarID(int avatarID) {
+        int previous = this.avatarID;
+        this.avatarID = avatarID;
+        change.firePropertyChange("iconID", previous, avatarID);
     }
 
     public long getUserID() {
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/packets/CreateTopicPacket.java b/Lib/src/main/java/dev/wiing/gossip/lib/packets/CreateTopicPacket.java
new file mode 100644
index 0000000..64123c3
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/packets/CreateTopicPacket.java
@@ -0,0 +1,72 @@
+package dev.wiing.gossip.lib.packets;
+
+import dev.wiing.gossip.lib.data.StringType;
+
+import java.nio.ByteBuffer;
+
+public class CreateTopicPacket extends Packet {
+
+    public static final short TYPE = 0x11;
+    public static final int LENGTH = 0x022;
+
+    private byte[] userSecret = new byte[32];
+    private final StringType topicName = new StringType();
+    private final StringType topicDescription = new StringType();
+
+    public CreateTopicPacket() {
+        super(TYPE, LENGTH);
+    }
+
+    private void updateLength() {
+        setLength(
+                32 +    // User secret
+                topicName.getLength() +
+                topicDescription.getLength()
+        );
+    }
+
+    public byte[] getUserSecret() {
+        return userSecret;
+    }
+
+    public void setUserSecret(byte[] userSecret) {
+        this.userSecret = userSecret;
+    }
+
+    public String getTopicName() {
+        return topicName.getValue();
+    }
+
+    public String getTopicDescription() {
+        return topicDescription.getValue();
+    }
+
+    public void setTopicName(String topicName) {
+        this.topicName.setValue(topicName);
+        updateLength();
+    }
+
+    public void setTopicDescription(String topicDescription) {
+        this.topicDescription.setValue(topicDescription);
+        updateLength();
+    }
+
+    @Override
+    public Packet readBytes(ByteBuffer buffer, int size) {
+        CreateTopicPacket packet = new CreateTopicPacket();
+        packet.setLength(size);
+
+        buffer.get(packet.userSecret);
+        packet.topicName.setBytes(buffer);
+        packet.topicDescription.setBytes(buffer);
+
+        return packet;
+    }
+
+    @Override
+    public void writeBytes(ByteBuffer buffer) {
+        buffer.put(userSecret);
+        buffer.put(topicName.getBytes());
+        buffer.put(topicDescription.getBytes());
+    }
+}
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/packets/FetchUserPacket.java b/Lib/src/main/java/dev/wiing/gossip/lib/packets/FetchUserPacket.java
new file mode 100644
index 0000000..00fad56
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/packets/FetchUserPacket.java
@@ -0,0 +1,37 @@
+package dev.wiing.gossip.lib.packets;
+
+import java.nio.ByteBuffer;
+
+public class FetchUserPacket extends Packet {
+
+    public static final short TYPE = 0x21;
+    public static final int LENGTH = 0x008;
+
+    private long userID;
+
+    public FetchUserPacket() {
+        super(TYPE, LENGTH);
+    }
+
+    public long getUserID() {
+        return userID;
+    }
+
+    public void setUserID(long userID) {
+        this.userID = userID;
+    }
+
+    @Override
+    public Packet readBytes(ByteBuffer buffer, int size) {
+        FetchUserPacket packet = new FetchUserPacket();
+
+        packet.userID = buffer.getLong();
+
+        return packet;
+    }
+
+    @Override
+    public void writeBytes(ByteBuffer buffer) {
+        buffer.putLong(userID);
+    }
+}
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/packets/RegisterPacket.java b/Lib/src/main/java/dev/wiing/gossip/lib/packets/RegisterPacket.java
index 31a6d27..4bb0431 100644
--- a/Lib/src/main/java/dev/wiing/gossip/lib/packets/RegisterPacket.java
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/packets/RegisterPacket.java
@@ -7,10 +7,10 @@ import java.nio.ByteBuffer;
 public class RegisterPacket extends Packet {
 
     public static final short TYPE = 0x02;
-    public static final int SIZE = 0x0001;
+    public static final int SIZE = 0x0005;
 
     private final StringType username = new StringType();
-    private char iconID;
+    private byte avatarID;
 
     public RegisterPacket() {
         super(TYPE, SIZE);
@@ -22,6 +22,7 @@ public class RegisterPacket extends Packet {
         packet.setLength(size);
 
         packet.username.setBytes(buffer);
+        packet.avatarID = buffer.get();
 
         return packet;
     }
@@ -29,24 +30,23 @@ public class RegisterPacket extends Packet {
     @Override
     public void writeBytes(ByteBuffer buffer) {
         buffer.put(username.getBytes());
+        buffer.put(avatarID);
     }
 
     public String getUsername() {
         return username.getValue();
     }
 
-    public RegisterPacket setUsername(String username) {
+    public void setUsername(String username) {
         this.username.setValue(username);
         this.setLength(1 + this.username.getLength());
-        return this;
     }
 
-    public char getIconID() {
-        return iconID;
+    public byte getAvatarID() {
+        return avatarID;
     }
 
-    public RegisterPacket setIconID(char iconID) {
-        this.iconID = iconID;
-        return this;
+    public void setAvatarID(byte avatarID) {
+        this.avatarID = avatarID;
     }
 }
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/packets/TopicAddedPacket.java b/Lib/src/main/java/dev/wiing/gossip/lib/packets/TopicAddedPacket.java
new file mode 100644
index 0000000..81dd203
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/packets/TopicAddedPacket.java
@@ -0,0 +1,96 @@
+package dev.wiing.gossip.lib.packets;
+
+import dev.wiing.gossip.lib.data.StringType;
+
+import java.nio.ByteBuffer;
+
+public class TopicAddedPacket extends Packet {
+
+    public static final short TYPE = 0x12;
+    public static final int LENGTH = 0x014;
+
+    private long topicID;
+    private long hostID;
+    private final StringType topicName = new StringType();
+    private final StringType topicDescription = new StringType();
+    private short topicColor;
+
+    public TopicAddedPacket() {
+        super(TYPE, LENGTH);
+    }
+
+    private void updateLength() {
+        setLength(
+                8 +     // topicID
+                8 +     // hostID
+                topicName.getLength() +
+                topicDescription.getLength() +
+                2       // topicColor
+        );
+    }
+
+    public long getTopicID() {
+        return topicID;
+    }
+
+    public void setTopicID(long topicID) {
+        this.topicID = topicID;
+    }
+
+    public long getHostID() {
+        return hostID;
+    }
+
+    public void setHostID(long hostID) {
+        this.hostID = hostID;
+    }
+
+    public String getTopicName() {
+        return topicName.getValue();
+    }
+
+    public void setTopicName(String topicName) {
+        this.topicName.setValue(topicName);
+        updateLength();
+    }
+
+    public String getTopicDescription() {
+        return topicDescription.getValue();
+    }
+
+    public void setTopicDescription(String topicDescription) {
+        this.topicDescription.setValue(topicDescription);
+        updateLength();
+    }
+
+    public short getTopicColor() {
+        return topicColor;
+    }
+
+    public void setTopicColor(short topicColor) {
+        this.topicColor = topicColor;
+    }
+
+    @Override
+    public Packet readBytes(ByteBuffer buffer, int size) {
+        TopicAddedPacket packet = new TopicAddedPacket();
+        setLength(size);
+
+        packet.topicID = buffer.getLong();
+        packet.hostID = buffer.getLong();
+        packet.topicName.setBytes(buffer);
+        packet.topicDescription.setBytes(buffer);
+        packet.topicColor = buffer.getShort();
+
+        return packet;
+    }
+
+    @Override
+    public void writeBytes(ByteBuffer buffer) {
+        buffer.putLong(topicID);
+        buffer.putLong(hostID);
+        buffer.put(topicName.getBytes());
+        buffer.put(topicDescription.getBytes());
+        buffer.putShort(topicColor);
+    }
+}
diff --git a/Lib/src/main/java/dev/wiing/gossip/lib/packets/UserDataPacket.java b/Lib/src/main/java/dev/wiing/gossip/lib/packets/UserDataPacket.java
new file mode 100644
index 0000000..a77da12
--- /dev/null
+++ b/Lib/src/main/java/dev/wiing/gossip/lib/packets/UserDataPacket.java
@@ -0,0 +1,63 @@
+package dev.wiing.gossip.lib.packets;
+
+import dev.wiing.gossip.lib.data.StringType;
+
+import java.nio.ByteBuffer;
+
+public class UserDataPacket extends Packet {
+
+    public static final short TYPE = 0x22;
+    public static final int LENGTH = 0x00a;
+
+    private long userID;
+    private final StringType username = new StringType();
+    private byte avatarID;
+
+    public UserDataPacket() {
+        super(TYPE, LENGTH);
+    }
+
+    public long getUserID() {
+        return userID;
+    }
+
+    public void setUserID(long userID) {
+        this.userID = userID;
+    }
+
+    public String getUsername() {
+        return username.getValue();
+    }
+
+    public void setUsername(String username) {
+        this.username.setValue(username);
+        setLength(9 + this.username.getLength());
+    }
+
+    public byte getAvatarID() {
+        return avatarID;
+    }
+
+    public void setAvatarID(byte avatarID) {
+        this.avatarID = avatarID;
+    }
+
+    @Override
+    public Packet readBytes(ByteBuffer buffer, int size) {
+        UserDataPacket packet = new UserDataPacket();
+        packet.setLength(size);
+
+        packet.userID = buffer.getLong();
+        packet.username.setBytes(buffer);
+        packet.avatarID = buffer.get();
+
+        return packet;
+    }
+
+    @Override
+    public void writeBytes(ByteBuffer buffer) {
+        buffer.putLong(userID);
+        buffer.put(username.getBytes());
+        buffer.put(avatarID);
+    }
+}
diff --git a/Server/src/main/java/dev/wiing/gossip/server/Database.java b/Server/src/main/java/dev/wiing/gossip/server/Database.java
index d8bea91..f58c3a0 100644
--- a/Server/src/main/java/dev/wiing/gossip/server/Database.java
+++ b/Server/src/main/java/dev/wiing/gossip/server/Database.java
@@ -1,16 +1,23 @@
 package dev.wiing.gossip.server;
 
 import dev.wiing.gossip.lib.models.SecretUser;
+import dev.wiing.gossip.lib.models.Topic;
 import dev.wiing.gossip.lib.models.User;
 
+import java.net.Socket;
 import java.security.SecureRandom;
 import java.util.*;
 
 public class Database {
+    private int userIdCounter = 1;
     private final Map<Long, User> users = Collections.synchronizedMap(new HashMap<>());
-    private final Map<byte[], User> usersBySecret = Collections.synchronizedMap(new HashMap<>());
+    private final Map<String, User> usersBySecret = Collections.synchronizedMap(new HashMap<>());
+    private final Map<Long, Socket> userSockets = Collections.synchronizedMap(new HashMap<>());
     private final Set<String> usedUsernames = Collections.synchronizedSet(new HashSet<>());
 
+    private int topicIdCounter = 1;
+    private final Map<Long, Topic> topics = Collections.synchronizedMap(new HashMap<>());
+
     private Database() {
 
     }
@@ -21,18 +28,19 @@ public class Database {
         return instance;
     }
 
-    public SecretUser registerUser(String username, char iconID) {
+    public SecretUser registerUser(String username, byte iconID, Socket socket) {
         SecureRandom random = new SecureRandom();
 
         byte[] secret = new byte[32];
         random.nextBytes(secret);
 
-        long userID = random.nextLong();
+        long userID = userIdCounter++;
 
         User user = new User(username, iconID, userID);
 
         users.put(userID, user);
-        usersBySecret.put(secret, user);
+        userSockets.put(userID, socket);
+        usersBySecret.put(new String(secret), user);
         usedUsernames.add(username);
 
         System.out.println("Created user: " + username + " #" + Long.toUnsignedString(userID));
@@ -55,6 +63,23 @@ public class Database {
         return usersBySecret.getOrDefault(secret, null);
     }
 
+    public Collection<User> getUsers() {
+        return Collections.unmodifiableCollection(users.values());
+    }
+
+    public Socket getUserSocket(long uID) {
+        return userSockets.getOrDefault(uID, null);
+    }
+
+    public User getUserOfSocket(Socket socket) {
+        return userSockets.entrySet().stream()
+                .filter(entry -> entry.getValue().equals(socket))
+                .findFirst()
+                .map(Map.Entry::getKey)
+                .map(this::getUserByID)
+                .orElse(null);
+    }
+
     public void removeUser(User user) {
         users.remove(user.getUserID());
 
@@ -64,6 +89,36 @@ public class Database {
                 .findFirst()
                 .ifPresent(usersBySecret::remove);
 
+        userSockets.remove(user.getUserID());
+
         usedUsernames.remove(user.getUsername());
     }
+
+    public Topic createTopic(byte[] userSecret, String topicName, String topicDescription) {
+        if (!usersBySecret.containsKey(new String(userSecret))) return null;
+
+        User user = usersBySecret.get(new String(userSecret));
+
+        short colorHue = (short)Math.abs((new Random().nextInt(360)));
+
+        Topic topic = new Topic(
+                topicIdCounter++,
+                topicName,
+                topicDescription,
+                user,
+                colorHue
+        );
+
+        topics.put(topic.getId(), topic);
+
+        return topic;
+    }
+
+    public Topic getTopic(long topicID) {
+        return topics.getOrDefault(topicID, null);
+    }
+
+    public void removeTopic(long topicID) {
+        topics.remove(topicID);
+    }
 }
diff --git a/Server/src/main/java/dev/wiing/gossip/server/UserSocket.java b/Server/src/main/java/dev/wiing/gossip/server/UserSocket.java
index b1474c0..c221236 100644
--- a/Server/src/main/java/dev/wiing/gossip/server/UserSocket.java
+++ b/Server/src/main/java/dev/wiing/gossip/server/UserSocket.java
@@ -1,11 +1,9 @@
 package dev.wiing.gossip.server;
 
 import dev.wiing.gossip.lib.models.SecretUser;
+import dev.wiing.gossip.lib.models.Topic;
 import dev.wiing.gossip.lib.models.User;
-import dev.wiing.gossip.lib.packets.CredentialsPacket;
-import dev.wiing.gossip.lib.packets.RegisterPacket;
-import dev.wiing.gossip.lib.packets.Packet;
-import dev.wiing.gossip.lib.packets.TestPacket;
+import dev.wiing.gossip.lib.packets.*;
 
 import java.io.BufferedInputStream;
 import java.io.IOException;
@@ -31,6 +29,14 @@ public record UserSocket(Socket socket) implements Runnable {
                     case RegisterPacket.TYPE:
                         onRegisterUser((RegisterPacket) packet);
                         break;
+
+                    case CreateTopicPacket.TYPE:
+                        onCreateTopic((CreateTopicPacket) packet);
+                        break;
+
+                    case FetchUserPacket.TYPE:
+                        onFetchUser((FetchUserPacket) packet);
+                        break;
                 }
             } catch (SocketException e) {
                 break;
@@ -38,17 +44,59 @@ public record UserSocket(Socket socket) implements Runnable {
                 throw new RuntimeException(e);
             }
         }
+
+        // Connection lost
+        User user = Database.getInstance().getUserOfSocket(socket);
+        Database.getInstance().removeUser(user);
     }
 
     private void onRegisterUser(RegisterPacket packet) {
-        SecretUser user = Database.getInstance().registerUser(packet.getUsername(), packet.getIconID());
+        SecretUser user = Database.getInstance().registerUser(packet.getUsername(), packet.getAvatarID(), packet.getSource());
 
         CredentialsPacket creds = new CredentialsPacket();
         creds.setSecret(user.getUserSecret());
         creds.setUID(user.getUserID());
 
         try {
-            Globals.getPacketManager().writePacket(packet.getSource().getOutputStream(), creds);
+            Globals.getPacketManager().replyPacket(packet, creds);
+        } catch (IOException e) {
+            throw new RuntimeException(e);
+        }
+    }
+
+    private void onCreateTopic(CreateTopicPacket packet) {
+        Topic topic = Database.getInstance().createTopic(packet.getUserSecret(), packet.getTopicName(), packet.getTopicDescription());
+
+        if (topic == null) return;
+
+        TopicAddedPacket added = new TopicAddedPacket();
+        added.setTopicID(topic.getId());
+        added.setHostID(topic.getHost().getUserID());
+        added.setTopicName(topic.getName());
+        added.setTopicDescription(topic.getDescription());
+        added.setTopicColor(topic.getColor());
+
+        for (User user : Database.getInstance().getUsers()) {
+            Socket socket = Database.getInstance().getUserSocket(user.getUserID());
+
+            try {
+                Globals.getPacketManager().writePacket(socket.getOutputStream(), added);
+            } catch (IOException e) {
+                e.printStackTrace();
+            }
+        }
+    }
+
+    private void onFetchUser(FetchUserPacket packet) {
+        User user = Database.getInstance().getUserByID(packet.getUserID());
+
+        UserDataPacket resp = new UserDataPacket();
+        resp.setUserID(user.getUserID());
+        resp.setUsername(user.getUsername());
+        resp.setAvatarID((byte) user.getAvatarID());
+
+        try {
+            Globals.getPacketManager().replyPacket(packet, resp);
         } catch (IOException e) {
             throw new RuntimeException(e);
         }