From ef8f0fd72ddf5b0d1abf61cf1da68037a9a2da26 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Wed, 13 Dec 2023 11:46:36 -0600
Subject: [PATCH 1/3] feat: color previews

---
 package.json                              |  2 +-
 src/app/embeds/session/page.tsx           |  9 +--------
 src/app/tools/session/components/Menu.tsx | 23 +++++++++++++++++++----
 src/stores/session.ts                     |  2 ++
 4 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/package.json b/package.json
index c032147c0..e1aa3e0c7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "blitzkrieg",
-  "version": "1.15.7",
+  "version": "1.15.8",
   "description": "🎉 Tools for everything World of Tanks Blitz",
   "main": "src/server.ts",
   "type": "module",
diff --git a/src/app/embeds/session/page.tsx b/src/app/embeds/session/page.tsx
index 46f342098..2fe94cacc 100644
--- a/src/app/embeds/session/page.tsx
+++ b/src/app/embeds/session/page.tsx
@@ -209,14 +209,7 @@ export default function SessionPage() {
                 <Breakdown.Row
                   color={session.color}
                   minimized={!session.showCareer}
-                  title={`Since ${since.toLocaleString(undefined, {
-                    hour: 'numeric',
-                    minute: 'numeric',
-                    hour12: true,
-                    month: 'short',
-                    year: 'numeric',
-                    day: 'numeric',
-                  })}`}
+                  title={session.title}
                   stats={session.customColumns.map((customColumn) => {
                     const rowStat = totalRowStats[customColumn.display];
 
diff --git a/src/app/tools/session/components/Menu.tsx b/src/app/tools/session/components/Menu.tsx
index 9c3172bbb..f7f9ad1f2 100644
--- a/src/app/tools/session/components/Menu.tsx
+++ b/src/app/tools/session/components/Menu.tsx
@@ -1,9 +1,12 @@
-import { ContextMenu, DropdownMenu } from '@radix-ui/themes';
+import { ContextMenu, DropdownMenu, Flex } from '@radix-ui/themes';
+import { createColors } from 'bepaint';
+import { useState } from 'react';
 import {
   ACCENT_COLORS,
   AccentColor,
   GRAY_COLORS,
   GrayColor,
+  PALETTES,
 } from '../../../../constants/radixColors';
 import { useSession } from '../../../../stores/session';
 import { CustomColumn } from './CustomColumn';
@@ -15,6 +18,7 @@ interface ContextMenuProps {
 
 export function Menu({ Builder, reset }: ContextMenuProps) {
   const session = useSession();
+  const [showTitleEditor, setShowTitleEditor] = useState(false);
 
   return (
     <Builder.Content>
@@ -29,9 +33,20 @@ export function Menu({ Builder, reset }: ContextMenuProps) {
             }
           >
             {[...ACCENT_COLORS, ...GRAY_COLORS].map((color) => (
-              <Builder.RadioItem value={color}>{`${color
-                .charAt(0)
-                .toUpperCase()}${color.slice(1)}`}</Builder.RadioItem>
+              <Builder.RadioItem value={color} key={color}>
+                <Flex gap="2" align="center">
+                  <div
+                    style={{
+                      backgroundColor: createColors(PALETTES[color])
+                        .solidBackground,
+                      width: 16,
+                      height: 16,
+                      borderRadius: '100%',
+                    }}
+                  />
+                  {`${color.charAt(0).toUpperCase()}${color.slice(1)}`}
+                </Flex>
+              </Builder.RadioItem>
             ))}
           </Builder.RadioGroup>
         </Builder.SubContent>
diff --git a/src/stores/session.ts b/src/stores/session.ts
index 4612ba8d2..0e0223d88 100644
--- a/src/stores/session.ts
+++ b/src/stores/session.ts
@@ -22,6 +22,7 @@ type Session = (
       time: number;
     }
 ) & {
+  title: string;
   resetPrompt: boolean;
   embedPrompt: boolean;
   customColumns: {
@@ -68,6 +69,7 @@ export const useSession = create<Session>()(
   devtools(
     persist(
       (set) => ({
+        title: 'Untitled session',
         isTracking: false,
         resetPrompt: true,
         showTotal: true,

From c6779a714b152d97507855022686651bfdf9d04a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Wed, 13 Dec 2023 11:59:37 -0600
Subject: [PATCH 2/3] feat: custom titles

---
 src/app/tools/session/components/Menu.tsx | 164 ++++++++++++++--------
 1 file changed, 106 insertions(+), 58 deletions(-)

diff --git a/src/app/tools/session/components/Menu.tsx b/src/app/tools/session/components/Menu.tsx
index f7f9ad1f2..ed26bd10b 100644
--- a/src/app/tools/session/components/Menu.tsx
+++ b/src/app/tools/session/components/Menu.tsx
@@ -1,6 +1,14 @@
-import { ContextMenu, DropdownMenu, Flex } from '@radix-ui/themes';
+import {
+  Button,
+  ContextMenu,
+  Dialog,
+  DropdownMenu,
+  Flex,
+  Heading,
+  TextField,
+} from '@radix-ui/themes';
 import { createColors } from 'bepaint';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import {
   ACCENT_COLORS,
   AccentColor,
@@ -19,70 +27,110 @@ interface ContextMenuProps {
 export function Menu({ Builder, reset }: ContextMenuProps) {
   const session = useSession();
   const [showTitleEditor, setShowTitleEditor] = useState(false);
+  const titleInput = useRef<HTMLInputElement>(null);
 
   return (
-    <Builder.Content>
-      <Builder.Sub>
-        <Builder.SubTrigger>Accent color</Builder.SubTrigger>
+    <>
+      <Dialog.Root open={showTitleEditor} onOpenChange={setShowTitleEditor}>
+        <Dialog.Content>
+          <Flex direction="column" gap="4">
+            <Heading size="4">Edit title</Heading>
 
-        <Builder.SubContent>
-          <Builder.RadioGroup
-            value={session.color}
-            onValueChange={(value) =>
-              useSession.setState({ color: value as AccentColor | GrayColor })
-            }
-          >
-            {[...ACCENT_COLORS, ...GRAY_COLORS].map((color) => (
-              <Builder.RadioItem value={color} key={color}>
-                <Flex gap="2" align="center">
-                  <div
-                    style={{
-                      backgroundColor: createColors(PALETTES[color])
-                        .solidBackground,
-                      width: 16,
-                      height: 16,
-                      borderRadius: '100%',
-                    }}
-                  />
-                  {`${color.charAt(0).toUpperCase()}${color.slice(1)}`}
-                </Flex>
-              </Builder.RadioItem>
-            ))}
-          </Builder.RadioGroup>
-        </Builder.SubContent>
-      </Builder.Sub>
+            <Flex gap="2" style={{ width: '100%' }}>
+              <TextField.Root style={{ flex: 1 }}>
+                <TextField.Input
+                  ref={titleInput}
+                  defaultValue={session.title}
+                  placeholder="Enter title..."
+                  onKeyDown={(event) => {
+                    if (event.key === 'Enter' && titleInput.current) {
+                      setShowTitleEditor(false);
+                      useSession.setState({ title: titleInput.current!.value });
+                    }
+                  }}
+                />
+              </TextField.Root>
 
-      <Builder.Separator />
+              <Dialog.Close>
+                <Button
+                  onClick={() =>
+                    useSession.setState({ title: titleInput.current!.value })
+                  }
+                >
+                  Set
+                </Button>
+              </Dialog.Close>
+            </Flex>
+          </Flex>
+        </Dialog.Content>
+      </Dialog.Root>
 
-      <CustomColumn Builder={Builder} column={0} />
-      <CustomColumn Builder={Builder} column={1} />
-      <CustomColumn Builder={Builder} column={2} />
-      <CustomColumn Builder={Builder} column={3} />
+      <Builder.Content>
+        <Builder.Sub>
+          <Builder.SubTrigger>Accent color</Builder.SubTrigger>
 
-      <Builder.Separator />
+          <Builder.SubContent>
+            <Builder.RadioGroup
+              value={session.color}
+              onValueChange={(value) =>
+                useSession.setState({ color: value as AccentColor | GrayColor })
+              }
+            >
+              {[...ACCENT_COLORS, ...GRAY_COLORS].map((color) => (
+                <Builder.RadioItem value={color} key={color}>
+                  <Flex gap="2" align="center">
+                    <div
+                      style={{
+                        backgroundColor: createColors(PALETTES[color])
+                          .solidBackground,
+                        width: 16,
+                        height: 16,
+                        borderRadius: '100%',
+                      }}
+                    />
+                    {`${color.charAt(0).toUpperCase()}${color.slice(1)}`}
+                  </Flex>
+                </Builder.RadioItem>
+              ))}
+            </Builder.RadioGroup>
+          </Builder.SubContent>
+        </Builder.Sub>
 
-      <Builder.CheckboxItem
-        checked={session.showTotal}
-        onCheckedChange={(checked) =>
-          useSession.setState({ showTotal: checked })
-        }
-      >
-        Show total
-      </Builder.CheckboxItem>
-      <Builder.CheckboxItem
-        checked={session.showCareer}
-        onCheckedChange={(checked) =>
-          useSession.setState({ showCareer: checked })
-        }
-      >
-        Show career
-      </Builder.CheckboxItem>
+        <Builder.Separator />
 
-      <Builder.Separator />
+        <Builder.Item onClick={() => setShowTitleEditor(true)}>
+          Edit title...
+        </Builder.Item>
+        <CustomColumn Builder={Builder} column={0} />
+        <CustomColumn Builder={Builder} column={1} />
+        <CustomColumn Builder={Builder} column={2} />
+        <CustomColumn Builder={Builder} column={3} />
 
-      <Builder.Item color="red" onClick={reset}>
-        Reset
-      </Builder.Item>
-    </Builder.Content>
+        <Builder.Separator />
+
+        <Builder.CheckboxItem
+          checked={session.showTotal}
+          onCheckedChange={(checked) =>
+            useSession.setState({ showTotal: checked })
+          }
+        >
+          Show total
+        </Builder.CheckboxItem>
+        <Builder.CheckboxItem
+          checked={session.showCareer}
+          onCheckedChange={(checked) =>
+            useSession.setState({ showCareer: checked })
+          }
+        >
+          Show career
+        </Builder.CheckboxItem>
+
+        <Builder.Separator />
+
+        <Builder.Item color="red" onClick={reset}>
+          Reset
+        </Builder.Item>
+      </Builder.Content>
+    </>
   );
 }

From 98107291f5072a039268017f48c52edbde2e3e78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Wed, 13 Dec 2023 12:03:02 -0600
Subject: [PATCH 3/3] feat: changelogs

---
 docs/changelogs/1.15.8.md | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 docs/changelogs/1.15.8.md

diff --git a/docs/changelogs/1.15.8.md b/docs/changelogs/1.15.8.md
new file mode 100644
index 000000000..ef708c6eb
--- /dev/null
+++ b/docs/changelogs/1.15.8.md
@@ -0,0 +1,9 @@
+# Blitzkrieg 1.15.8
+
+A request fulfilled \:\)
+
+## Features
+
+- Added custom titles in session tracker
+  - Change the title through Options > Edit title...
+- Colors are shown when selecting a theme color for the session tracker