feat: add favorites management (fixes #111) (#163)

* feat: add client-side favorite management

* feat: switch icon

* feat: load resources via WP API on favorites page

* feat: use cookies instead of localStorage to allow server-side retrieval

* feat: add AJAX backend to update resource favorite counts

* chore(deps): bump @platform-coop-toolkit/pinecone to 1.0.0-alpha.9

* feat: add filled favorite icon

* feat: allow removal of favorites from favorites page

* chore(docs): add TODO comment

* feat: use new format icons

* feat: check for cookies

* feat: implement many changes from Pinecone

* fix: add @wordpress/i18n

* feat: add remove all capability

* fix: remove extraneous Card initializations

* feat: add notifications to favorites page

* feat: add notices to single resource page

* fix: menu script

* fix: use new pagination markup

* fix: use new pagination markup

* fix: remove redundant roles to prevent duplicate announcements

* feat: make notifications sticky

* feat: temporary styling, prevent stacked notifications

* feat: clean up styles to match platform-coop-toolkit/pinecone#242

* fix: add alert role to notifications

app/Controllers/PageFavorites.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Controllers;
+
+use Sober\Controller\Controller;
+
+class PageFavorites extends Controller
+{
+    public function favorites()
+    {
+        return new \WP_Query([
+            'post_type' => 'lc_resource',
+            'post__in' => explode(',', $_COOKIE['favorites']),
+            'orderby' => 'title',
+            'posts_per_page' => -1,
+            'order' => 'asc',
+            'lang' => '',
+        ]);
+    }
+}

app/Controllers/Partials/Resource.php

@@ -102,6 +102,18 @@ public static function getPublisher($show_link = false)
         return false;
     }
 
+    public static function getAuthors()
+    {
+        global $post;
+        if ($post->post_type == 'lc_resource') {
+            $authors = get_post_meta($post->ID, 'lc_resource_authors', true);
+            if ($authors) {
+                return $authors;
+            }
+        }
+        return false;
+    }
+
     public static function getLanguage($format = 'slug')
     {
         global $post;
@@ -128,7 +140,7 @@ public static function getFormat()
         return false;
     }
 
-    public static function getFormatSlug()
+    public static function getFormatIcon()
     {
         global $post;
 
@@ -139,11 +151,12 @@ public static function getFormatSlug()
                 switch ($format->slug) {
                     case 'academic-paper':
                     case 'thesis':
-                        return 'academic-paper';
+                        return 'academic';
                         break;
-                    case 'article':
-                    case 'document':
                     case 'blog-post':
+                        return 'blog';
+                        break;
+                    case 'article':
                     case 'journal-article':
                     case 'magazine-article':
                     case 'newspaper-article':
@@ -162,10 +175,9 @@ public static function getFormatSlug()
                         return 'case-study';
                         break;
                     case 'curriculum':
-                        return 'educational-curriculum';
+                        return 'curriculum';
                         break;
                     case 'film':
-                    case 'interview':
                     case 'video':
                         return 'video';
                         break;
@@ -180,11 +192,14 @@ public static function getFormatSlug()
                         break;
                     case 'software':
                     case 'toolkit':
-                    case 'template':
                         return 'toolkit';
                         break;
+                    case 'template':
+                        return 'template';
+                        break;
+                    case 'document':
                     default:
-                        return 'article';
+                        return 'document';
                 }
             }
         }
@@ -276,4 +291,14 @@ public static function getOverflowTopics()
 
         return false;
     }
+
+    public static function isFavorited()
+    {
+        global $post;
+        $favorites = explode(',', $_COOKIE['favorites']);
+        if (in_array($post->ID, $favorites)) {
+            return true;
+        }
+        return false;
+    }
 }

app/ajax.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace App;
+
+/**
+ * AJAX hook which can be used to increment or decrement a resource's favorite count.
+ */
+function update_favorites()
+{
+    if (!check_ajax_referer('coop-library-framework-nonce', 'coop_library_nonce')) {
+        wp_send_json_error('Invalid security token.');
+        wp_die();
+    }
+
+    $ids = explode(',', $_POST['post_id']);
+
+    foreach ($ids as $id) {
+        $post_id   = absint($id);
+        $favorites = get_post_meta($post_id, 'lc_resource_favorites', true);
+        switch ($_POST['operation']) {
+            case 'increment':
+                $favorites++;
+                break;
+            case 'decrement':
+                $favorites--;
+                break;
+        }
+        update_post_meta($post_id, 'lc_resource_favorites', $favorites);
+    }
+    die(0);
+}

app/setup.php

@@ -11,19 +11,23 @@
  * Theme assets
  */
 add_action('wp_enqueue_scripts', function () {
-    wp_enqueue_script('sage/vendor.js', asset_path('scripts/vendor.js'), false, null, true);
-    wp_enqueue_script('sage/main.js', asset_path('scripts/main.js'), ['sage/vendor.js'], null, true);
+    wp_enqueue_script('coop-library/vendor.js', asset_path('scripts/vendor.js'), false, null, true);
+    wp_enqueue_script('coop-library/main.js', asset_path('scripts/main.js'), ['coop-library/vendor.js'], null, true);
     wp_add_inline_script(
-        'sage/vendor.js',
+        'coop-library/vendor.js',
         file_get_contents(dirname(__FILE__) . '/../dist/scripts/manifest.js'),
         'before'
     );
+    wp_localize_script('coop-library/main.js', 'CoopLibrary', [
+        'ajaxurl' => admin_url('admin-ajax.php'),
+        'coop_library_nonce' => wp_create_nonce('coop-library-framework-nonce')
+    ]);
 
     if (is_single() && comments_open() && get_option('thread_comments')) {
         wp_enqueue_script('comment-reply');
     }
 
-    wp_enqueue_style('sage/main.css', asset_path('styles/main.css'), false, null);
+    wp_enqueue_style('coop-library/main.css', asset_path('styles/main.css'), false, null);
 }, 100);
 
 /**
@@ -85,6 +89,12 @@
     load_theme_textdomain('coop-library', get_template_directory() . '/lang');
 }, 20);
 
+/**
+ * Ajax hooks
+ */
+add_action('wp_ajax_update_favorites', 'App\\update_favorites');
+add_action('wp_ajax_nopriv_update_favorites', 'App\\update_favorites');
+
 /**
  * Register sidebars
  */

package.json

@@ -24,7 +24,8 @@
     "node": ">= 10.0.0"
   },
   "dependencies": {
-    "@platform-coop-toolkit/pinecone": "^1.0.0-alpha.10"
+    "@platform-coop-toolkit/pinecone": "^1.0.0-alpha.10",
+    "cookies.js": "^2.1.15"
   },
   "devDependencies": {
     "@babel/plugin-syntax-dynamic-import": "^7.8",
@@ -33,6 +34,7 @@
     "@wordpress/babel-preset-default": "^4.10.0",
     "@wordpress/browserslist-config": "^2.6.0",
     "@wordpress/dependency-extraction-webpack-plugin": "^2.2.0",
+    "@wordpress/i18n": "^3.9.0",
     "babel-eslint": "^10.0.3",
     "browser-sync": "^2.26.7",
     "browser-sync-webpack-plugin": "^2.0.1",