Added a default username that persists across games (#300)

src/components/Chat/Chat.js

@@ -7,7 +7,7 @@ import {Link} from 'react-router-dom';
 import {MdClose} from 'react-icons/md';
 import Emoji from '../common/Emoji';
 import * as emojiLib from '../../lib/emoji';
-import nameGenerator from '../../lib/nameGenerator';
+import nameGenerator, {isFromNameGenerator} from '../../lib/nameGenerator';
 import ChatBar from './ChatBar';
 import EditableSpan from '../common/EditableSpan';
 import MobileKeyboard from '../Player/MobileKeyboard';
@@ -61,6 +61,14 @@ export default class Chat extends Component {
     this.props.onUpdateDisplayName(id, username);
     this.setState({username});
     localStorage.setItem(this.usernameKey, username);
+    // Check if localStorage has username_default, if not set it to the last
+    // updated name
+    if (
+      localStorage.getItem('username_default') != localStorage.getItem(this.usernameKey) &&
+      !isFromNameGenerator(username)
+    ) {
+      localStorage.setItem('username_default', username);
+    }
   };
 
   handleUpdateColor = (color) => {

src/lib/nameGenerator.js

@@ -41,6 +41,24 @@ const adjectives = rawAdjectiveList.split(',').map(sanitize).filter(adjFilter);
 const positiveAdjectives = positiveAdjectiveList.split('\n').map(sanitize).filter(adjFilter);
 const nouns = rawNounList.split('\n').map(sanitize).filter(nounFilter);
 
+export function isFromNameGenerator(name) {
+  if (typeof name !== 'string' || name.length > 20) {
+    return false;
+  }
+
+  const parts = name.split(' ');
+  if (parts.length !== 2) {
+    return false;
+  }
+
+  const [adjective, noun] = parts;
+
+  const adjectiveExists = adjectives.includes(adjective) || positiveAdjectives.includes(adjective);
+  const nounExists = nouns.includes(noun);
+
+  return adjectiveExists && nounExists;
+}
+
 export default function nameGenerator() {
   function f() {
     const adj = Math.random() < 0.9 ? sample(positiveAdjectives) : sample(adjectives);

src/pages/Game.js

@@ -37,7 +37,15 @@ export default class Game extends Component {
         mobile: isMobile(),
       });
     });
-    this.initialUsername = localStorage.getItem(this.usernameKey) || nameGenerator();
+    this.initialUsername =
+      localStorage.getItem(this.usernameKey) !== null
+        ? // If localStorage has a username for this game use that, if not
+          // check if there's a default username, if there is none, use the
+          // name generator
+          localStorage.getItem(this.usernameKey)
+        : localStorage.getItem('username_default') !== null
+        ? localStorage.getItem('username_default')
+        : nameGenerator();
   }
 
   get usernameKey() {
@@ -220,6 +228,7 @@ export default class Game extends Component {
     return `user_color`;
   }
 
+  //TODO (jackz): this is how color is persisted
   get userColor() {
     const color =
       this.game.users[this.props.id]?.color || localStorage.getItem(this.userColorKey) || rand_color();