From 89d37dc029120cdacf2b68eeddf247049e379164 Mon Sep 17 00:00:00 2001
From: "Tom (plebeius.eth)" <tom@plebbit.com>
Date: Sun, 13 Oct 2024 17:52:52 +0200
Subject: [PATCH] feat(account settings): alert user account is stored locally
 and specify location

---
 .../account-settings/account-settings.module.css            | 6 ++++++
 .../settings-modal/account-settings/account-settings.tsx    | 4 ++++
 2 files changed, 10 insertions(+)

diff --git a/src/components/settings-modal/account-settings/account-settings.module.css b/src/components/settings-modal/account-settings/account-settings.module.css
index 1fd66e37..47604f42 100644
--- a/src/components/settings-modal/account-settings/account-settings.module.css
+++ b/src/components/settings-modal/account-settings/account-settings.module.css
@@ -47,6 +47,12 @@
   margin-left: 5px;
 }
 
+.warning {
+  font-size: 0.8em;
+  color: red;
+  padding: 5px 0;
+}
+
 .settingTip {
   display: block;
   font-size: 0.85em;
diff --git a/src/components/settings-modal/account-settings/account-settings.tsx b/src/components/settings-modal/account-settings/account-settings.tsx
index 12a4af17..d4cd1334 100644
--- a/src/components/settings-modal/account-settings/account-settings.tsx
+++ b/src/components/settings-modal/account-settings/account-settings.tsx
@@ -4,6 +4,7 @@ import { createAccount, deleteAccount, exportAccount, importAccount, setAccount,
 import stringify from 'json-stringify-pretty-compact';
 import styles from './account-settings.module.css';
 import useAnonModeStore from '../../../stores/use-anon-mode-store';
+import { isAndroid } from '../../../lib/utils/platform';
 
 const AnonMode = () => {
   const { t } = useTranslation();
@@ -178,6 +179,9 @@ const AccountSettings = () => {
         <button className={styles.createAccount} onClick={_createAccount}>
           +
         </button>
+        <div className={styles.warning}>
+          stored locally ({window.isElectron ? 'this desktop app' : isAndroid ? 'this mobile app' : window.location.hostname}), not synced across devices
+        </div>
       </div>
       <div></div>
       <textarea value={text} onChange={(e) => setText(e.target.value)} autoCorrect='off' autoComplete='off' spellCheck='false' />