From 6b48c55266aac0a21eedf53cfd5c83ec32ce2246 Mon Sep 17 00:00:00 2001
From: Franck Royer <franck@status.im>
Date: Fri, 4 Jun 2021 15:15:07 +1000
Subject: [PATCH] Persist nick

---
 CHANGELOG.md                  | 1 +
 examples/web-chat/src/App.tsx | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 828206308d..3e7dcc8bcc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Examples (web chat): Use `WakuMessage.timestamp` as unique key for list items.
 - Doc: Link to new [topic guidelines](https://rfc.vac.dev/spec/23/) in README.
 - Doc: Link to [Waku v2 Toy Chat specs](https://rfc.vac.dev/spec/22/) in README.
+- Examples (web chat): Persist nick.
 
 ## [0.5.0] - 2021-05-21
 
diff --git a/examples/web-chat/src/App.tsx b/examples/web-chat/src/App.tsx
index 1a7d9b30f3..b4a3a71d6b 100644
--- a/examples/web-chat/src/App.tsx
+++ b/examples/web-chat/src/App.tsx
@@ -77,7 +77,14 @@ export default function App() {
   let [newMessages, setNewMessages] = useState<Message[]>([]);
   let [archivedMessages, setArchivedMessages] = useState<Message[]>([]);
   let [stateWaku, setWaku] = useState<Waku | undefined>(undefined);
-  let [nick, setNick] = useState<string>(generate());
+  let [nick, setNick] = useState<string>(() => {
+    const persistedNick = window.localStorage.getItem('nick');
+    return persistedNick !== null ? persistedNick : generate();
+  });
+
+  useEffect(() => {
+    localStorage.setItem('nick', nick);
+  }, [nick]);
 
   // Waku: Start, process messages, send messages
   useEffect(() => {