From 2d208dfb36ed12415555687683daf0fd43c4d1de Mon Sep 17 00:00:00 2001
From: Jarrod Lowe <41766555+jarrod-lowe@users.noreply.github.com>
Date: Wed, 25 Sep 2024 11:20:52 +1200
Subject: [PATCH] Sort player sheet tabs by creation order (#127)

---
 ui/src/game.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/ui/src/game.tsx b/ui/src/game.tsx
index 0c6f1c1c..c47986e0 100644
--- a/ui/src/game.tsx
+++ b/ui/src/game.tsx
@@ -75,7 +75,10 @@ const GameContent: React.FC<{ id: string, userEmail: string }> = ({ id, userEmai
     <div className="game-container">
       <TopBar title={game.gameName} userEmail={ userEmail } />
       <div className="tab-bar">
-        {game.playerSheets.map((sheet) => (
+        {game.playerSheets
+        .slice()  // Create a copy of the array to avoid mutating state
+        .sort((a, b) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime())  // Sort by createdAt
+        .map((sheet) => (
           <button
             key={sheet.userId}
             className={activeSheet === sheet.userId ? 'active' : ''}