From 422c70c9d485f2353402f15c90530096cdca91ff Mon Sep 17 00:00:00 2001
From: Ash Keel <ash@nebula.cafe>
Date: Sat, 20 Apr 2024 15:00:07 +0200
Subject: [PATCH] add text copy for chat account

---
 frontend/src/locale/en/translation.json             |  3 ++-
 frontend/src/locale/it/translation.json             |  4 +++-
 .../ui/pages/TwitchSettings/TwitchChatSettings.tsx  | 13 ++++++-------
 3 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/frontend/src/locale/en/translation.json b/frontend/src/locale/en/translation.json
index f1dd5dc..94b5f5c 100644
--- a/frontend/src/locale/en/translation.json
+++ b/frontend/src/locale/en/translation.json
@@ -76,7 +76,8 @@
         "cooldown-tip": "Global chat cooldown for commands (in seconds)",
         "default-user": "Using stream account, use the button below to authenticate with a different account.",
         "chat-account": "Chat account",
-        "clear-button": "Revert to default account"
+        "clear-button": "Revert to default account",
+        "account-copy": "You can use a different account for repling to chat commands and writing alerts instead of your channel one. To do so, click the button below and authenticate and authorize using your secondary account."
       },
       "events": {
         "loading-data": "Querying user data from Twitch APIs…",
diff --git a/frontend/src/locale/it/translation.json b/frontend/src/locale/it/translation.json
index dfb8b63..945291c 100644
--- a/frontend/src/locale/it/translation.json
+++ b/frontend/src/locale/it/translation.json
@@ -341,7 +341,9 @@
         "cooldown-tip": "Tempo minimo di attesa tra comandi (in secondi)",
         "chat-account": "Account chat",
         "header": "Impostazioni chat",
-        "default-user": "Utilizzando l'account principale, usa il pulsante qui sotto per autenticarti con un account diverso per le funzionalità di chat."
+        "default-user": "Utilizzando l'account principale, usa il pulsante qui sotto per autenticarti con un account diverso per le funzionalità di chat.",
+        "clear-button": "Torna ad usare l'account principale",
+        "account-copy": "Puoi utilizzare un account diverso per rispondendere ai comandi della chat e invia notifiche al posto di quello del tuo canale. \nPer fare ciò, fai clic sul pulsante in basso e autentica e autorizza l'utilizzo del tuo account secondario."
       },
       "events": {
         "auth-button": "Autenticati via Twitch",
diff --git a/frontend/src/ui/pages/TwitchSettings/TwitchChatSettings.tsx b/frontend/src/ui/pages/TwitchSettings/TwitchChatSettings.tsx
index 853b81f..923318f 100644
--- a/frontend/src/ui/pages/TwitchSettings/TwitchChatSettings.tsx
+++ b/frontend/src/ui/pages/TwitchSettings/TwitchChatSettings.tsx
@@ -40,14 +40,10 @@ export default function TwitchChatSettings() {
       <SectionHeader spacing={'none'}>
         {t('pages.twitch-settings.chat.chat-account')}
       </SectionHeader>
-      <TwitchUserBlock
-        authKey={'twitch/chat/chatter-account'}
-        noUserMessage={t('pages.twitch-settings.chat.default-user')}
-      />
-      <FlexRow align="left" spacing="1">
+      <TextBlock>{t('pages.twitch-settings.chat.account-copy')}</TextBlock>
+      <FlexRow align="left" spacing="1" css={{ marginBottom: '1rem' }}>
         <Button
           variation="primary"
-          css={{ marginTop: '1rem' }}
           onClick={() => {
             void startAuthFlow('chat');
           }}
@@ -57,7 +53,6 @@ export default function TwitchChatSettings() {
         {authKeyValue && (
           <Button
             variation="danger"
-            css={{ marginTop: '1rem' }}
             onClick={() => {
               kv.deleteKey(authKey);
             }}
@@ -66,6 +61,10 @@ export default function TwitchChatSettings() {
           </Button>
         )}
       </FlexRow>
+      <TwitchUserBlock
+        authKey={'twitch/chat/chatter-account'}
+        noUserMessage={t('pages.twitch-settings.chat.default-user')}
+      />
 
       <SectionHeader>{t('pages.twitch-settings.chat.header')}</SectionHeader>
       <Field size="fullWidth">