Allow renaming wishlists

src/api/wishlists.php

@@ -65,6 +65,17 @@ switch ($_SERVER['REQUEST_METHOD']) {
         }
         break;
 
+    case 'PUT':
+        parse_str(file_get_contents("php://input"), $_PUT);
+
+        $database
+        ->query('UPDATE `wishlists`
+                    SET `name` = "' . $_PUT['wishlist_title'] . '"
+                  WHERE `id`   = ' . $_PUT['wishlist_id'] . '
+        ;');
+
+        break;
+
     case 'DELETE':
         parse_str(file_get_contents("php://input"), $_DELETE);
 

src/assets/js/default.js

@@ -136,6 +136,12 @@ function handleFetchResponse(response) {
     }
 }
 
+function handleFetchCatch(error) {
+    console.log(error);
+
+    return error;
+}
+
 function showError(error) {
     error = error.replace('<br />', '');
 

src/assets/js/wish.js

@@ -101,9 +101,7 @@ $(function () {
                         formWish.removeClass('loading');
                     }
                 })
-                .catch(function(error) {
-                    console.log(error);
-                });
+                .catch(handleFetchCatch);
             }
         })
         .modal('show');

src/assets/js/wishlists.js

@@ -49,6 +49,7 @@ $(function () {
 
             $('.button.wishlist-wish-add').removeClass('disabled');
             $('.button.wishlist-share').removeClass('disabled');
+            $('.wishlist-rename').removeClass('disabled');
             $('.wishlist-delete').removeClass('disabled');
 
             /** Update URL */
@@ -66,7 +67,8 @@ $(function () {
         } else {
             $('.button.wishlist-wish-add').addClass('disabled');
             $('.button.wishlist-share').addClass('disabled');
-            $('.wishlist-delete button').addClass('disabled');
+            $('.wishlist-rename').addClass('disabled');
+            $('.wishlist-delete').addClass('disabled');
         }
 
         /**
@@ -150,9 +152,7 @@ $(function () {
         .then(function(response) {
             card.replaceWith(response.html);
         })
-        .catch(function(error) {
-            console.log(error);
-        })
+        .catch(handleFetchCatch)
         .finally(function() {
             card.attr('data-cache', 'true');
             card.removeClass('loading');
@@ -163,10 +163,58 @@ $(function () {
         });
     }
 
+    /**
+     * Rename Wishlist
+     */
+    $(document).on('click', '.options .wishlist-rename', function() {
+        var modalRename   = $('.modal.wishlist-rename');
+        var formRename    = modalRename.find('.form.wishlist-rename');
+        var inputID       = modalRename.find('[name="wishlist_id"]');
+        var inputTitle    = modalRename.find('[name="wishlist_title"]');
+
+        var wishlistID    = $('.ui.dropdown.wishlists').dropdown('get value');
+        var wishlistTitle = $('.ui.dropdown.wishlists').dropdown('get text');
+
+        inputID.val(wishlistID);
+
+        inputTitle.val(wishlistTitle);
+        inputTitle.attr('placeholder', wishlistTitle);
+
+        modalRename
+        .modal({
+            onApprove: function(buttonApprove) {
+                buttonApprove.addClass('loading disabled');
+
+                var formData = new URLSearchParams(new FormData(formRename[0]));
+
+                fetch('/src/api/wishlists.php', {
+                    method: 'PUT',
+                    body:   formData
+                })
+                .then(handleFetchError)
+                .then(handleFetchResponse)
+                .then(function(response) {
+                    wishlistsRefresh();
+
+                    modalRename.modal('hide');
+
+                    $('body').toast({ message: 'Wishlist successfully renamed.' });
+                })
+                .catch(handleFetchCatch)
+                .finally(function() {
+                    buttonApprove.removeClass('loading disabled');
+                });
+
+                return false;
+            }
+        })
+        .modal('show');
+    });
+
     /**
      * Delete Wishlist
      */
-    $(document).on('click', '.wishlist-delete', function () {
+    $(document).on('click', '.options .wishlist-delete', function () {
         var wishlistValue = $('.ui.dropdown.wishlists').dropdown('get value');
 
         if (wishlistValue) {
@@ -316,9 +364,7 @@ $(function () {
 
                     buttonAdd.removeClass('loading');
                 })
-                .catch(function(error) {
-                    console.log(error);
-                });
+                .catch(handleFetchCatch);
 
                 return false;
             }

src/pages/wishlists.php

@@ -52,7 +52,7 @@ $page->navigation();
                         <span class="text">Options</span>
                         <div class="menu">
 
-                            <div class="item disabled">
+                            <div class="item wishlist-rename disabled">
                                 <i class="pen icon"></i>
                                 Rename
                             </div>
@@ -134,6 +134,33 @@ $page->navigation();
     </div>
 </div>
 
+<!-- Wishlist: Rename -->
+<div class="ui tiny modal wishlist-rename">
+    <div class="header">
+        Rename wishlist
+    </div>
+    <div class="content">
+        <p>How would you like to name this wishlist?</p>
+
+        <form class="ui form wishlist-rename">
+            <input type="hidden" name="wishlist_id" />
+
+            <div class="field">
+                <label>Title</label>
+                <input type="text" name="wishlist_title" maxlength="128" />
+            </div>
+        </form>
+    </div>
+    <div class="actions">
+        <div class="ui approve primary button">
+            Rename
+        </div>
+        <div class="ui deny button">
+            Cancel
+        </div>
+    </div>
+</div>
+
 <!-- Wishlist: Add a wish -->
 <div class="ui modal wishlist-wish-add">
     <div class="header">