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 1/2] [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 (

From d6e0517ddb0cb0607c1deccc92a84a76ae1345c1 Mon Sep 17 00:00:00 2001
From: Janis Meister <janis.meister87@gmail.com>
Date: Fri, 30 Jun 2023 13:19:55 +0200
Subject: [PATCH 2/2] [refactor] update readme paramter table

---
 README.md | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 646bed0..50217b9 100644
--- a/README.md
+++ b/README.md
@@ -43,14 +43,15 @@ Start by adding a `?` to the end of the URL and then add the parameters.
 To add multiple parameters, you have to seperate them with a `&`.
 
 Like this: `file://C:/Users/.../index.html?parameter1=value1&parameter2=value2`  
-Real example: `file://C:/Users/.../index.html?remoteAppPort=5899`
+Real example: `file://C:/Users/.../index.html?remoteAppPort=5899&hideNonTalking=true&clientLimit=5`
 
 This is a list of all available parameters (all parameters are optional):
 
-| Parameter        | Description                            | Type    | Default |
-| ---------------- | -------------------------------------- | ------- | ------- |
-| `remoteAppPort`  | The port of the Teamspeak 5 remote app | number  | `5899`  |
-| `hideNonTalking` | Hide all non-talking clients           | boolean | `false` |
+| Parameter        | Description                              | Type    | Default         |
+| ---------------- | ---------------------------------------- | ------- | --------------- |
+| `remoteAppPort`  | The port of the Teamspeak 5 remote app   | number  | `5899`          |
+| `hideNonTalking` | Hide all non-talking clients             | boolean | `false`         |
+| `clientLimit`    | Count of how many client should be shown | number  | `0` (unlimited) |
 
 ## Setup (Developer)