From 2ac4180bd6fbd5d9d9a5e6b358b3130880e5801f Mon Sep 17 00:00:00 2001
From: Radoslav Vitanov <radoslav.vitanov@gmail.com>
Date: Mon, 15 Aug 2016 18:21:14 +0300
Subject: [PATCH] Validate bookmark name before creation Fixes #3188

---
 js/components/addEditBookmark.js | 16 ++++++++++++++--
 less/addEditBookmark.less        |  4 ++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/js/components/addEditBookmark.js b/js/components/addEditBookmark.js
index 9cc7a68e472..c72765f402b 100644
--- a/js/components/addEditBookmark.js
+++ b/js/components/addEditBookmark.js
@@ -24,9 +24,15 @@ class AddEditBookmark extends ImmutableComponent {
     this.onSave = this.onSave.bind(this)
     this.onRemoveBookmark = this.onRemoveBookmark.bind(this)
   }
+
   get isBlankTab () {
     return ['about:blank', 'about:newtab'].includes(this.props.currentDetail.get('location'))
   }
+
+  get bookmarkNameValid () {
+    return (this.props.currentDetail.get('title') || this.props.currentDetail.get('customTitle'))
+  }
+
   get isFolder () {
     return siteUtil.isFolder(this.props.currentDetail)
   }
@@ -68,6 +74,7 @@ class AddEditBookmark extends ImmutableComponent {
     } else {
       currentDetail = currentDetail.set('customTitle', e.target.value)
     }
+
     windowActions.setBookmarkDetail(currentDetail, this.props.originalDetail, this.props.destinationDetail)
   }
   onLocationChange (e) {
@@ -79,6 +86,11 @@ class AddEditBookmark extends ImmutableComponent {
     windowActions.setBookmarkDetail(currentDetail, this.props.originalDetail, this.props.destinationDetail)
   }
   onSave () {
+    // First check if the title of the currentDetail is set
+    if (!this.bookmarkNameValid) {
+      return false
+    }
+
     const tag = this.isFolder ? siteTags.BOOKMARK_FOLDER : siteTags.BOOKMARK
     appActions.addSite(this.props.currentDetail, tag, this.props.originalDetail, this.props.destinationDetail)
     this.onClose()
@@ -91,7 +103,7 @@ class AddEditBookmark extends ImmutableComponent {
     if (this.props.currentDetail.get('customTitle') !== undefined) {
       return this.props.currentDetail.get('customTitle')
     }
-    return this.props.currentDetail.get('title')
+    return this.props.currentDetail.get('title') || ''
   }
   render () {
     return <Dialog onHide={this.onClose} isClickDismiss>
@@ -125,7 +137,7 @@ class AddEditBookmark extends ImmutableComponent {
               ? <a data-l10n-id='delete' className='removeBookmarkLink link' onClick={this.onRemoveBookmark} />
               : null
             }
-            <Button l10nId='save' className='primaryButton' onClick={this.onSave} />
+            <Button l10nId='save' className={this.bookmarkNameValid ? 'primaryButton' : 'primaryButton disabled'} onClick={this.onSave} />
           </div>
         </div>
       </div>
diff --git a/less/addEditBookmark.less b/less/addEditBookmark.less
index 0d67a23e081..72ca65e6f24 100644
--- a/less/addEditBookmark.less
+++ b/less/addEditBookmark.less
@@ -5,3 +5,7 @@
 .removeBookmarkLink {
   margin-right: auto;
 }
+
+.disabled {
+    background-color: #ccc !important;
+}
\ No newline at end of file