From 3d0ba21f86342bc80c7177b01b42200c9ccfd229 Mon Sep 17 00:00:00 2001 From: Vraja Das Date: Wed, 18 Dec 2024 17:04:07 +0200 Subject: [PATCH 01/16] add integration card for site kit add card --- packages/js/images/site-kit-logo.svg | 1 + .../recommended-integrations.js | 2 + .../integrations-page/site-kit-integration.js | 83 +++++++++++++++++++ src/integrations/admin/integrations-page.php | 4 + 4 files changed, 90 insertions(+) create mode 100644 packages/js/images/site-kit-logo.svg create mode 100644 packages/js/src/integrations-page/site-kit-integration.js diff --git a/packages/js/images/site-kit-logo.svg b/packages/js/images/site-kit-logo.svg new file mode 100644 index 00000000000..40fb85d4d02 --- /dev/null +++ b/packages/js/images/site-kit-logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/js/src/integrations-page/recommended-integrations.js b/packages/js/src/integrations-page/recommended-integrations.js index 9f8a7a19d08..830ea2a05d9 100644 --- a/packages/js/src/integrations-page/recommended-integrations.js +++ b/packages/js/src/integrations-page/recommended-integrations.js @@ -5,6 +5,7 @@ import { ReactComponent as WincherLogo } from "../../images/wincher-logo.svg"; import { getInitialState, getIsMultisiteAvailable, getIsNetworkControlEnabled, updateIntegrationState } from "./helper"; import { ToggleableIntegration } from "./toggleable-integration"; +import { SiteKitIntegration } from "./site-kit-integration"; const integrations = [ { @@ -75,4 +76,5 @@ export const RecommendedIntegrations = [ /> ); } ), + , ]; diff --git a/packages/js/src/integrations-page/site-kit-integration.js b/packages/js/src/integrations-page/site-kit-integration.js new file mode 100644 index 00000000000..bcfbe44009e --- /dev/null +++ b/packages/js/src/integrations-page/site-kit-integration.js @@ -0,0 +1,83 @@ +import { __, sprintf } from "@wordpress/i18n"; +import { CheckIcon, XIcon } from "@heroicons/react/solid"; +import { Fragment, createInterpolateElement } from "@wordpress/element"; +import { SimpleIntegration } from "./simple-integration"; +import { ReactComponent as SiteKitLogo } from "../../images/site-kit-logo.svg"; +import { get } from "lodash"; + +const siteKitIntegration = { + name: "Site Kit by Google", + claim: createInterpolateElement( + sprintf( + /* translators: 1: bold open tag; 2: Site Kit by Google; 3: bold close tag. */ + __( "Get valuable insights with %1$s%2$s%3$s", "wordpress-seo" ), + "", + "Site Kit by Google", + "" + ), { + strong: , + } + ), + learnMoreLink: "https://yoa.st/integrations-google-site-kit", + logoLink: "https://yoa.st/integrations-google-site-kit", + slug: "google-site-kit", + description: sprintf( + /* translators: 1: Wincher */ + __( "View traffic and search rankings on your dashboard by connecting your Google account.", "wordpress-seo" ), + "Wincher" + ), + isPremium: false, + isNew: false, + isMultisiteAvailable: false, + logo: SiteKitLogo, +}; + +/** + * Represents an integration. + * + * @param {object} integration The integration. + * @param {boolean} isActive The integration state. + * + * @returns {WPElement} A card representing an integration. + */ +export const SiteKitIntegration = () => { + const isActive = get( window, "wpseoIntegrationsData.google_site_kit_plugin_active", "0" ) === "1"; + const isConnected = get( window, "wpseoIntegrationsData.google_site_kit_connected", "0" ) === "1"; + + return ( + + + { isActive && isConnected && + { __( "Integration active", "wordpress-seo" ) } + + } + + { ! isConnected && isActive && + + { + __( "Not connected", "wordpress-seo" ) + } + + + } + + { ! isActive && + + { + __( "Plugin not detected", "wordpress-seo" ) + } + + + } + + ); +}; diff --git a/src/integrations/admin/integrations-page.php b/src/integrations/admin/integrations-page.php index 4a950f68e46..e809248641e 100644 --- a/src/integrations/admin/integrations-page.php +++ b/src/integrations/admin/integrations-page.php @@ -122,6 +122,7 @@ public function enqueue_assets() { $acf_seo_file_github = 'yoast-acf-analysis/yoast-acf-analysis.php'; $algolia_file = 'wp-search-with-algolia/algolia.php'; $old_algolia_file = 'search-by-algolia-instant-relevant-results/algolia.php'; + $google_site_kit_file = 'google-site-kit/google-site-kit.php'; $addon_manager = new WPSEO_Addon_Manager(); $woocommerce_seo_installed = $addon_manager->is_installed( WPSEO_Addon_Manager::WOOCOMMERCE_SLUG ); @@ -140,6 +141,7 @@ public function enqueue_assets() { $ssp_active = \class_exists( PodcastEpisode::class ); $wp_recipe_maker_active = \class_exists( WP_Recipe_Maker::class ); $mastodon_active = $this->is_mastodon_active(); + $google_site_kit = \is_plugin_active( $google_site_kit_file ); $woocommerce_seo_activate_url = \wp_nonce_url( \self_admin_url( 'plugins.php?action=activate&plugin=' . $woocommerce_seo_file ), @@ -193,6 +195,8 @@ public function enqueue_assets() { 'mastodon_active' => $mastodon_active, 'is_multisite' => \is_multisite(), 'plugin_url' => \plugins_url( '', \WPSEO_FILE ), + 'google_site_kit_plugin_active' => $google_site_kit, + 'google_site_kit_connected' => \get_option( 'googlesitekit_has_connected_admins', false ), ] ); } From a1918eb2c59bd300f886594572b4989a0963bab0 Mon Sep 17 00:00:00 2001 From: Vraja Das Date: Wed, 18 Dec 2024 17:04:44 +0200 Subject: [PATCH 02/16] translate learn more and add slug to button id --- packages/js/src/integrations-page/algolia-integration.js | 2 +- packages/js/src/integrations-page/simple-integration.js | 4 ++-- packages/js/src/integrations-page/toggleable-integration.js | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/js/src/integrations-page/algolia-integration.js b/packages/js/src/integrations-page/algolia-integration.js index c5fd27983c2..0edf0d8e64e 100644 --- a/packages/js/src/integrations-page/algolia-integration.js +++ b/packages/js/src/integrations-page/algolia-integration.js @@ -96,7 +96,7 @@ export const AlgoliaIntegration = ( { className="yst-flex yst-items-center yst-mt-3 yst-no-underline yst-font-medium" target="_blank" > - Learn more + { __( "Learn more", "wordpress-seo" ) } { /* translators: Hidden accessibility text. */ diff --git a/packages/js/src/integrations-page/simple-integration.js b/packages/js/src/integrations-page/simple-integration.js index c62850ad159..de98d3fd907 100644 --- a/packages/js/src/integrations-page/simple-integration.js +++ b/packages/js/src/integrations-page/simple-integration.js @@ -59,7 +59,7 @@ export const SimpleIntegration = ( { integration, isActive, children } ) => { className="yst-flex yst-items-center yst-mt-3 yst-no-underline yst-font-medium" target="_blank" > - Learn more + { __( "Learn more", "wordpress-seo" ) } { /* translators: Hidden accessibility text. */ @@ -72,7 +72,7 @@ export const SimpleIntegration = ( { integration, isActive, children } ) => { { ! getIsFreeIntegrationOrPremiumAvailable( integration ) &&