From f919b395483591fe5360f6cb40b38632ef0b90f3 Mon Sep 17 00:00:00 2001
From: Janis Meister <janis.meister87@gmail.com>
Date: Fri, 30 Jun 2023 13:18:37 +0200
Subject: [PATCH] [feature] add client limit

---
 src/App.tsx    | 1 +
 src/Viewer.tsx | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/App.tsx b/src/App.tsx
index 5e00210..29e4343 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -57,6 +57,7 @@ export default function App() {
     <div className="App">
       <Viewer
         hideNonTalking={searchParams.get("hideNonTalking") === "true"}
+        clientLimit={searchParams.get("clientLimit") ? parseInt(searchParams.get("clientLimit") ?? "0") : 0}
         clients={
           clients.map((client) => {
             if (client.channel?.id === currentChannel?.id && client.channel.connection.id === activeConnectionId) {
diff --git a/src/Viewer.tsx b/src/Viewer.tsx
index 1acac00..11b9b50 100644
--- a/src/Viewer.tsx
+++ b/src/Viewer.tsx
@@ -6,16 +6,23 @@ export default function Viewer({
   channel,
   showChannelName = false,
   hideNonTalking = false,
+  clientLimit = 0,
 }: {
   clients: IClient[] | undefined;
   channel: IChannel | undefined;
   showChannelName?: boolean;
   hideNonTalking?: boolean;
+  clientLimit?: number;
 }) {
   return (
     <div className="viewer">
       {showChannelName ? <h3>{channel?.properties.name}</h3> : null}
-      {clients?.map((client) => {
+      {clients?.map((client, i) => {
+        //* Client limit
+        if (clientLimit != 0 && i >= clientLimit) {
+          return null;
+        }
+
         if (client) {
           //* Non-talking client
           if (