Merge pull request #289 from codesnippetspro/fix/share-with-subsites

fix: share with subsites

Author: imantsk

src/composer.lock

@@ -20,13 +20,27 @@
 	gap: 5px;
 	line-height: 1;
 
+  @at-root .row-actions & {
+    color: #8c8c8c;
+    padding-inline: 0px;
+    text-transform: capitalize;
+    font-weight: 500;
+  }
+
 	.dashicons {
 		font-size: 18px;
 		inline-size: 18px;
 		block-size: 18px;
 	}
 }
 
+.network-shared {
+	color: #2271b1; 
+	font-size: 22px;
+	width: 100%;
+	cursor: help;
+}
+
 .small-badge {
 	block-size: auto;
 	inline-size: auto;
@@ -73,6 +87,33 @@
 .inverted-badges .badge {
 	color: #fff;
 	background-color: #a7aaad;
+	border-color: #fff !important;
+
+  .dashicons {
+    color: #fff;
+  }
+}
+
+.nav-tab-inactive {
+	$colors: map.get(theme.$badges, 'pro');
+	$text-color: list.nth($colors, 2);
+	$background-color: list.nth($colors, 1);
+
+	.badge.pro-badge {
+		color: $text-color;
+		background-color: $background-color;
+	}
+
+	&:hover {
+		&.button, .dashicons-external {
+			color: #3c434a;
+		}
+
+		.badge.pro-badge {
+			color: $background-color;
+			background-color: $text-color;
+		}
+	}
 }
 
 .nav-tab-inactive {

src/css/common/_badges.scss

@@ -24,7 +24,7 @@
 	}
 }
 
-.active-snippet .column-name > a {
+.active-snippet .column-name > .snippet-name {
 	font-weight: 600;
 }
 

src/css/manage.scss

@@ -1,39 +1,41 @@
 import React from 'react'
 import { __ } from '@wordpress/i18n'
 import { useSnippetForm } from '../../../hooks/useSnippetForm'
+import { Tooltip } from '../../common/Tooltip'
 
 export const MultisiteSharingSettings: React.FC = () => {
 	const { snippet, setSnippet, isReadOnly } = useSnippetForm()
 
 	return (
-		<div>
+		<div className="inline-form-field activation-switch-container">
 			<h4>
-				<label htmlFor="snippet_sharing">
-					{__('Share with Subsites', 'code-snippets')}
-				</label>
+				{__('Share with Subsites', 'code-snippets')}
 			</h4>
 
-			<div className="tooltip-bottom">
-				<span className="dashicons dashicons-editor-help"></span>
-				<span className="tooltip-content">{
-					__('Instead of running on every site, allow this snippet to be activated on individual sites on the network.', 'code-snippets')
-				}</span>
-			</div>
+			<Tooltip inline start>
+				{__('Instead of running on every site, allow this snippet to be activated on individual sites on the network.', 'code-snippets')}
+			</Tooltip>
 
-			<input
-				id="snippet_sharing"
-				name="snippet_sharing"
-				type="checkbox"
-				className="switch"
-				checked={true === snippet.shared_network}
-				disabled={isReadOnly}
-				onChange={event =>
-					setSnippet(previous => ({
-						...previous,
-						active: false,
-						shared_network: event.target.checked
-					}))}
-			/>
+			<label>
+				{snippet.shared_network
+					? __('Enabled', 'code-snippets')
+					: __('Disabled', 'code-snippets')}
+
+				<input
+					id="snippet_sharing"
+					name="snippet_sharing"
+					type="checkbox"
+					className="switch"
+					checked={!!snippet.shared_network}
+					disabled={isReadOnly}
+					onChange={event =>
+						setSnippet(previous => ({
+							...previous,
+							active: false,
+							shared_network: event.target.checked
+						}))}
+				/>
+			</label>
 		</div>
 	)
 }

src/js/components/EditorSidebar/controls/MultisiteSharingSettings.tsx

@@ -35,6 +35,7 @@ const mapToSchema = ({
 	priority,
 	active,
 	network,
+	shared_network,
 	conditionId
 }: Partial<Snippet>): WritableSnippetSchema => ({
 	name,
@@ -45,6 +46,7 @@ const mapToSchema = ({
 	priority,
 	active,
 	network,
+	shared_network,
 	condition_id: conditionId
 })
 

src/js/utils/snippets/api.ts

@@ -63,6 +63,7 @@ public function run() {
 		add_action( 'init', array( $this, 'load_classes' ), 11 );
 
 		add_filter( 'mu_menu_items', array( $this, 'mu_menu_items' ) );
+		add_filter( 'manage_sites_action_links', array( $this, 'add_sites_row_action' ), 10, 2 );
 		add_filter( 'plugin_action_links_' . plugin_basename( PLUGIN_FILE ), array( $this, 'plugin_action_links' ), 10, 2 );
 		add_filter( 'plugin_row_meta', array( $this, 'plugin_row_meta' ), 10, 2 );
 		add_filter( 'debug_information', array( $this, 'debug_information' ) );
@@ -89,6 +90,29 @@ public function mu_menu_items( array $menu_items ): array {
 		return $menu_items;
 	}
 
+	/**
+	 * Add a "Snippets" row action to the Network Sites table.
+	 *
+	 * @param array<string, string> $actions Existing row actions.
+	 * @param int                   $site_id Current site ID.
+	 *
+	 * @return array<string, string>
+	 */
+	public function add_sites_row_action( array $actions, int $site_id ): array {
+		if ( ! is_multisite() || ! current_user_can( code_snippets()->get_network_cap_name() ) ) {
+			return $actions;
+		}
+
+		$menu_slug = code_snippets()->get_menu_slug();
+		$actions['code_snippets'] = sprintf(
+			'<a href="%s">%s</a>',
+			esc_url( get_admin_url( $site_id, 'admin.php?page=' . $menu_slug ) ),
+			esc_html__( 'Snippets', 'code-snippets' )
+		);
+
+		return $actions;
+	}
+
 	/**
 	 * Modify the action links for this plugin.
 	 *