make start new session screen closer to the android one

_locales/en/messages.json

@@ -234,8 +234,14 @@
     "description": "Displayed when a user can't send a message because they have left the group"
   },
   "unreadMessage": {
-    "message": "1 Unread Message",
+    "message": "$count$ Unread Message",
-    "description": "Text for unread message separator, just one message"
+    "description": "Text for unread message separator, just one message",
+    "placeholders": {
+      "count": {
+        "content": "$1",
+        "example": "5"
+      }
+    }
   },
   "unreadMessages": {
     "message": "$count$ Unread Messages",
@@ -1825,7 +1831,7 @@
   "remove": {
     "message": "Remove"
   },
-  "invalidHexId": {
+  "invalidSessionId": {
     "message": "Invalid Session ID",
     "description": "Error string shown when user types an invalid pubkey hex string"
   },
@@ -1992,8 +1998,11 @@
   "enterSessionID": {
     "message": "Enter Session ID"
   },
+  "enterSessionIDOfRecipient": {
+    "message": "Enter Session ID of recipient"
+  },
   "usersCanShareTheir...": {
-    "message": "Users can share their Session ID from their account settings, or by sharing their QR code."
+    "message": "Users can share their Session ID by going into their account settings and tapping \"Share Session ID\", or by sharing their QR code."
   },
   "message": {
     "message": "Message"

js/views/last_seen_indicator_view.js

@@ -25,7 +25,7 @@
     render_attributes() {
       const unreadMessages =
         this.count === 1
-          ? i18n('unreadMessage')
+          ? i18n('unreadMessage', [this.count])
           : i18n('unreadMessages', [this.count]);
 
       return {

stylesheets/_session.scss

@@ -1353,7 +1353,7 @@ label {
   padding: 0px 5px 20px 5px;
 
   &.session-id-editable-textarea:placeholder-shown {
-    padding: 20px 5px 0px 5px;
+    padding: 10px 5px 0px 5px;
   }
 
   &.group-id-editable-textarea {

stylesheets/_session_left_pane.scss

@@ -352,6 +352,7 @@ $session-compose-margin: 20px;
 
 .user-search-dropdown {
   width: 100%;
+  min-height: 34px;
   flex-grow: 1;
   overflow-y: auto;
 }

ts/components/session/SessionClosableOverlay.tsx

@@ -134,14 +134,14 @@ export class SessionClosableOverlay extends React.Component<Props, State> {
         buttonText = window.i18n('next');
         descriptionLong = window.i18n('usersCanShareTheir...');
         subtitle = window.i18n('enterSessionID');
-        placeholder = window.i18n('enterSessionID');
+        placeholder = window.i18n('enterSessionIDOfRecipient');
         break;
       case 'contact':
         title = window.i18n('addContact');
         buttonText = window.i18n('next');
         descriptionLong = window.i18n('usersCanShareTheir...');
         subtitle = window.i18n('enterSessionID');
-        placeholder = window.i18n('enterSessionID');
+        placeholder = window.i18n('enterSessionIDOfRecipient');
         break;
       case 'open-group':
         title = window.i18n('joinOpenGroup');
@@ -235,9 +235,9 @@ export class SessionClosableOverlay extends React.Component<Props, State> {
         {descriptionLong && (
           <div className="session-description-long">{descriptionLong}</div>
         )}
-        {isMessageView && <h4>{window.i18n('or')}</h4>}
+        {isMessageView && false && <h4>{window.i18n('or')}</h4>}
-
+        {/* FIXME enable back those two items when they are working */}
-        {isMessageView && (
+        {isMessageView && false && (
           <UserSearchDropdown
             searchTerm={searchTerm || ''}
             updateSearch={updateSearch}

ts/types/PhoneNumber.ts

@@ -37,7 +37,7 @@ function validate(number: string) {
   // Check if it's hex
   const isHex = number.replace(/[\s]*/g, '').match(/^[0-9a-fA-F]+$/);
   if (!isHex) {
-    return 'invalidHexId';
+    return 'invalidSessionId';
   }
 
   // Check if the pubkey length is 33 and leading with 05 or of length 32