Implement visual changes for marketplace plugin cards (matomo-org#21629)

Co-authored-by: Stefan Giehl <[email protected]>

config/environment/ui-test.php

@@ -16,8 +16,10 @@
     'tests.ui.url_normalizer_blacklist.api' => [],
     'tests.ui.url_normalizer_blacklist.controller' => [],
 
-    // disable check for plugin updates during UI tests
-    'dev.disable_plugin_update_checks' => true,
+    // disable check for plugin updates during UI tests, allow for override
+    'dev.disable_plugin_update_checks' => Piwik\DI::decorate(function ($previous, Container $c) {
+        return !$c->get('test.vars.forceEnablePluginUpdateChecks');
+    }),
 
     'twig.cache' => function (\Piwik\Container\Container $container) {
         $templatesPath = $container->get('path.tmp.templates');

plugins/CorePluginsAdmin/Controller.php

@@ -222,15 +222,14 @@ private function createPluginsOrThemesView($template, $themesOnly)
         $view->isMarketplaceEnabled = Marketplace::isMarketplaceEnabled();
         $view->isPluginsAdminEnabled = CorePluginsAdmin::isPluginsAdminEnabled();
 
-        $view->pluginsHavingUpdate    = [];
         $view->marketplacePluginNames = [];
+        $view->pluginsHavingUpdate    = [];
+        $view->pluginUpdateNonces     = [];
 
         if (Marketplace::isMarketplaceEnabled() && $this->marketplacePlugins) {
             try {
                 $view->marketplacePluginNames = $this->marketplacePlugins->getAvailablePluginNames($themesOnly);
-                $view->pluginsHavingUpdate    = $this->marketplacePlugins->getPluginsHavingUpdate();
-
-                $view->pluginUpdateNonces = [];
+                $view->pluginsHavingUpdate = $this->marketplacePlugins->getPluginsHavingUpdate();
                 foreach ($view->pluginsHavingUpdate as $name => $plugin) {
                     $view->pluginUpdateNonces[$name] = Nonce::getNonce($plugin['name']);
                 }

plugins/CorePluginsAdmin/templates/macros.twig

@@ -1,10 +1,10 @@
 
 {% macro pluginActivateDeactivateAction(name, isActivated, missingRequirements, deactivateNonce, activateNonce) -%}
     {%- if isActivated -%}
-        <a href='index.php?module=CorePluginsAdmin&action=deactivate&pluginName={{ name }}&nonce={{ deactivateNonce }}&redirectTo=referrer'>{{ 'CorePluginsAdmin_Deactivate'|translate }}</a>
+        <a tabindex="7" href='index.php?module=CorePluginsAdmin&action=deactivate&pluginName={{ name }}&nonce={{ deactivateNonce }}&redirectTo=referrer'>{{ 'CorePluginsAdmin_Deactivate'|translate }}</a>
     {%- elseif missingRequirements %}
         -
     {% else -%}
-        <a href='index.php?module=CorePluginsAdmin&action=activate&pluginName={{ name }}&nonce={{  activateNonce }}&redirectTo=referrer'>{{ 'CorePluginsAdmin_Activate'|translate }}</a>
+        <a tabindex="7" href='index.php?module=CorePluginsAdmin&action=activate&pluginName={{ name }}&nonce={{  activateNonce }}&redirectTo=referrer'>{{ 'CorePluginsAdmin_Activate'|translate }}</a>
     {%- endif -%}
 {%- endmacro %}

plugins/Marketplace/Marketplace.php

@@ -123,6 +123,8 @@ public function getClientSideTranslationKeys(&$translationKeys)
         $translationKeys[] = 'Marketplace_Marketplace';
         $translationKeys[] = 'Marketplace_RichMenuIntro';
         $translationKeys[] = 'Marketplace_ManageLicenseKeyIntro';
+        $translationKeys[] = 'Marketplace_Free';
+        $translationKeys[] = 'Marketplace_StartFreeTrial';
     }
 
     /**

plugins/Marketplace/Plugins.php

@@ -8,6 +8,7 @@
  */
 namespace Piwik\Plugins\Marketplace;
 
+use Piwik\Container\StaticContainer;
 use Piwik\Date;
 use Piwik\ProfessionalServices\Advertising;
 use Piwik\Plugin\Dependency as PluginDependency;
@@ -176,6 +177,11 @@ private function hasPluginUpdate($plugin)
      */
     public function getPluginsHavingUpdate(): array
     {
+        $skipPluginUpdateCheck = StaticContainer::get('dev.disable_plugin_update_checks');
+        if ($skipPluginUpdateCheck) {
+            return [];
+        }
+
         $this->pluginManager->loadAllPluginsAndGetTheirInfo();
         $loadedPlugins = $this->pluginManager->getLoadedPlugins();
 
@@ -247,7 +253,8 @@ private function enrichPluginInformation($plugin)
         $plugin['isActivated']  = $this->isPluginActivated($plugin['name']);
         $plugin['isInvalid']    = $this->pluginManager->isPluginThirdPartyAndBogus($plugin['name']);
         $plugin['canBeUpdated'] = $plugin['isInstalled'] && $this->hasPluginUpdate($plugin);
-        $plugin['lastUpdated'] = $this->toShortDate($plugin['lastUpdated']);
+        $plugin['lastUpdated']  = $this->toShortDate($plugin['lastUpdated']);
+        $plugin['canBePurchased'] = !$plugin['isDownloadable'] && !empty($plugin['shop']['url']);
 
         if ($plugin['isInstalled']) {
             $plugin = $this->enrichLicenseInformation($plugin);
@@ -285,6 +292,10 @@ private function enrichPluginInformation($plugin)
 
         $plugin = $this->addMissingRequirements($plugin);
 
+        $this->addPriceFrom($plugin);
+        $this->addPluginPreviewImage($plugin);
+        $this->prettifyNumberOfDownloads($plugin);
+
         return $plugin;
     }
 
@@ -320,11 +331,14 @@ private function toShortDate($date)
     }
 
     /**
+     * Determine if there are any missing requirements/dependencies for the plugin
+     *
      * @param $plugin
+     * @return array
      */
-    private function addMissingRequirements($plugin)
+    private function addMissingRequirements($plugin): array
     {
-        $plugin['missingRequirements'] = array();
+        $plugin['missingRequirements'] = [];
 
         if (empty($plugin['versions']) || !is_array($plugin['versions'])) {
             return $plugin;
@@ -343,4 +357,70 @@ private function addMissingRequirements($plugin)
 
         return $plugin;
     }
+
+    /**
+     * Find the cheapest shop variant, and if none is found specified, return the first variant.
+     *
+     * @param $plugin
+     * @return void
+     */
+    private function addPriceFrom(&$plugin): void
+    {
+        $variations = $plugin['shop']['variations'] ?? [];
+
+        if (!count($variations)) {
+            $plugin['priceFrom'] = null;
+            return;
+        }
+
+        $plugin['priceFrom'] = array_shift($variations); // use first as the default
+
+        foreach ($variations as $variation) {
+            if ($variation['cheapest'] ?? false) {
+                $plugin['priceFrom'] = $variation;
+                return;
+            }
+        }
+    }
+
+    /**
+     * If plugin is by Matomo, use a Matomo image, until plugins can provide their preview image via the marketplace.
+     * If plugin is not by Matomo, use generic preview image for now (until plugin categories are introduced).
+     *
+     * @param $plugin
+     * @return void
+     */
+    private function addPluginPreviewImage(&$plugin): void
+    {
+        $previewImage = 'generic-plugin';
+
+        if (in_array(strtolower($plugin['owner']), ['piwik', 'matomo-org'])) {
+            $previewImage = 'matomo-plugin';
+        }
+
+        $plugin['previewImage'] = 'plugins/Marketplace/images/previews/' . $previewImage . '.png';
+    }
+
+    /**
+     * Add prettified number of downloads to plugin info to shorten large numbers to 1k or 1m format.
+     *
+     * @param $plugin
+     * @return void
+     */
+    private function prettifyNumberOfDownloads(&$plugin): void
+    {
+        $num = $nice = $plugin['numDownloads'] ?? 0;
+
+        if (($num >= 1000) && ($num < 100000)) {
+            $nice = round($num / 1000, 1, PHP_ROUND_HALF_DOWN) . 'k';
+        }
+        elseif (($num >= 100000) && ($num < 1000000)) {
+            $nice = floor($num / 100000) . 'k';
+        }
+        elseif ($num >= 1000000) {
+            $nice = floor($num / 1000000) . 'm';
+        }
+
+        $plugin['numDownloadsPretty'] = $nice;
+    }
 }

plugins/Marketplace/lang/en.json

@@ -9,6 +9,7 @@
         "Authors": "Authors",
         "Browse": "Browse",
         "TryFreeTrialTitle": "Try 30 days for free, then",
+        "Free": "Free",
         "FreeTrialLabel" : "Free Trial",
         "SpecialOffer": "Special Offer",
         "TrialHints": "All premium features come with a %1$sfree 30-day trial%2$s. It is risk-free and there are no strings attached.",
@@ -92,6 +93,7 @@
         "SortByAlpha": "Alphabetically",
         "SortByLastUpdated": "Last updated",
         "SortByPopular": "Popular",
+        "StartFreeTrial": "Start free trial",
         "StepDownloadingPluginFromMarketplace": "Downloading plugin from Marketplace",
         "StepDownloadingThemeFromMarketplace": "Downloading theme from Marketplace",
         "StepUnzippingPlugin": "Unzipping plugin",