Skip to content

Commit 543d544

Browse files
Merge pull request #911 from stellarwp/feature/KAD-4362/performance-optimizer-meta-move
moving the meta settings in the main kadence meta area.
2 parents 765fd71 + 7f82882 commit 543d544

7 files changed

Lines changed: 182 additions & 130 deletions

File tree

includes/resources/Optimizer/Status/Meta.php

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,13 @@
1111
* Post Meta to control excluding posts from being optimized set
1212
* via a Gutenberg plugin.
1313
*
14-
* @see Optimizer/assets/js/meta/index.js
14+
* @see kadence-control-plugin.js
1515
*/
1616
final class Meta {
1717

1818
use Permalink_Trait;
1919

2020
public const KEY = '_kb_optimizer_status';
21-
public const META_SCRIPT_HANDLE = 'kadence-optimizer-meta';
2221

2322
private Asset $asset;
2423
private Status $status;
@@ -96,15 +95,4 @@ public function maybe_clear_optimizer_data( int $post_id, string $meta_key, $val
9695

9796
$this->store->delete( $path );
9897
}
99-
100-
/**
101-
* Enqueue Meta Optimizer script when editing a post in Gutenberg.
102-
*
103-
* @action enqueue_block_editor_assets
104-
*
105-
* @return void
106-
*/
107-
public function enqueue_meta_script(): void {
108-
$this->asset->enqueue_script( self::META_SCRIPT_HANDLE, 'dist/kadence-optimizer-meta' );
109-
}
11098
}

includes/resources/Optimizer/Status/Provider.php

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,6 @@ public function register(): void {
1515
$this->container->callback( Meta::class, 'register_meta' )
1616
);
1717

18-
add_action(
19-
'enqueue_block_editor_assets',
20-
$this->container->callback( Meta::class, 'enqueue_meta_script' ),
21-
15,
22-
0
23-
);
24-
2518
add_action(
2619
'updated_post_meta',
2720
function ( $meta_id, $post_id, $meta_key, $value ) {

includes/resources/Optimizer/assets/js/meta/index.js

Lines changed: 0 additions & 6 deletions
This file was deleted.

includes/resources/Optimizer/assets/js/meta/meta.js

Lines changed: 0 additions & 77 deletions
This file was deleted.

src/plugins/kadence-control-plugin.js

Lines changed: 181 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
11
import { map } from 'lodash';
22

3-
import { PluginSidebar, PluginSidebarMoreMenuItem } from '@wordpress/editor';
3+
import { PluginSidebar, PluginSidebarMoreMenuItem, store as editorStore } from '@wordpress/editor';
44
import { __ } from '@wordpress/i18n';
5-
import { Fragment, useState } from '@wordpress/element';
6-
import { PanelBody, Button } from '@wordpress/components';
5+
import { Fragment, useState, useEffect, useRef } from '@wordpress/element';
6+
import { PanelBody, Button, ToggleControl } from '@wordpress/components';
77
import { applyFilters } from '@wordpress/hooks';
8+
import { useSelect, useDispatch } from '@wordpress/data';
9+
import { external } from '@wordpress/icons';
10+
import { store as coreStore } from '@wordpress/core-data';
11+
import { store as preferencesStore } from '@wordpress/preferences';
12+
import { store as noticesStore } from '@wordpress/notices';
13+
import { addQueryArgs } from '@wordpress/url';
814
/**
915
* Import Icons
1016
*/
@@ -26,6 +32,166 @@ import ExportDefaults from './block-defaults/export-defaults';
2632
import ImportDefaults from './block-defaults/import-defaults';
2733
import ResetDefaults from './block-defaults/reset-defaults';
2834
import DefaultEditorBlock from './default-editor-block';
35+
36+
// Optimizer constants - matching the PHP version
37+
const META_KEY = '_kb_optimizer_status';
38+
const STATUS_EXCLUDED = -1;
39+
const STATUS_UNOPTIMIZED = 0;
40+
const STATUS_OPTIMIZED = 1;
41+
42+
/**
43+
* Custom hook to get the performance optimizer enabled setting
44+
* @returns {boolean} Whether the optimizer is enabled
45+
*/
46+
function useOptimizerEnabled() {
47+
const globalSettings = kadence_blocks_params.globalSettings ? JSON.parse(kadence_blocks_params.globalSettings) : {};
48+
return globalSettings?.performance_optimizer_enabled === true;
49+
}
50+
51+
/**
52+
* Performance Optimizer toggle component that uses the shared hook
53+
* This ensures we use the same state source for both the toggle and conditional panel
54+
*/
55+
function PerformanceOptimizerToggle() {
56+
const isOptimizerEnabled = useOptimizerEnabled();
57+
const [isSaving, setIsSaving] = useState(false);
58+
const { createSuccessNotice } = useDispatch(noticesStore);
59+
60+
const saveConfig = (value) => {
61+
setIsSaving(true);
62+
const config = kadence_blocks_params.globalSettings ? JSON.parse(kadence_blocks_params.globalSettings) : {};
63+
config.performance_optimizer_enabled = value;
64+
const settingModel = new wp.api.models.Settings({ kadence_blocks_settings: JSON.stringify(config) });
65+
66+
settingModel.save().then((response) => {
67+
createSuccessNotice(__('Settings saved', 'kadence-blocks'), {
68+
type: 'snackbar',
69+
});
70+
71+
setIsSaving(false);
72+
kadence_blocks_params.globalSettings = JSON.stringify(config);
73+
// Reload the page to load/unload the external optimizer JavaScript.
74+
window.location.reload();
75+
});
76+
};
77+
78+
return (
79+
<ToggleControl
80+
label={__('Globally Enable The Performance Optimizer', 'kadence-blocks')}
81+
isBusy={isSaving}
82+
checked={isOptimizerEnabled}
83+
onChange={(value) => {
84+
saveConfig(value);
85+
}}
86+
/>
87+
);
88+
}
89+
90+
/**
91+
* Component for excluding the current post from optimization
92+
*/
93+
function OptimizerExcludeToggle() {
94+
const meta = useSelect((select) => select('core/editor').getEditedPostAttribute('meta'));
95+
const savedMeta = useSelect((select) => select('core/editor').getCurrentPostAttribute('meta'));
96+
const { editPost } = useDispatch('core/editor');
97+
const originalMetaValue = useRef(null);
98+
99+
// Capture the original meta value when it first becomes available, before any edits.
100+
useEffect(() => {
101+
if (savedMeta !== undefined && originalMetaValue.current === null) {
102+
// Capture the value from the saved post, not the edited version
103+
if (savedMeta && savedMeta[META_KEY] !== undefined) {
104+
originalMetaValue.current = savedMeta[META_KEY];
105+
} else {
106+
// If no saved value exists, default to unoptimized
107+
originalMetaValue.current = STATUS_UNOPTIMIZED;
108+
}
109+
}
110+
}, [savedMeta]);
111+
112+
if (meta === undefined) {
113+
return null;
114+
}
115+
116+
return (
117+
<ToggleControl
118+
label={__('Exclude this post from optimization', 'kadence-blocks')}
119+
checked={meta[META_KEY] === STATUS_EXCLUDED}
120+
onChange={(value) => {
121+
if (value) {
122+
// When checking, set to excluded
123+
editPost({ meta: { [META_KEY]: STATUS_EXCLUDED } });
124+
} else {
125+
// When unchecking, restore to original value (or unoptimized if original was excluded)
126+
const restoreValue =
127+
originalMetaValue.current !== null && originalMetaValue.current !== STATUS_EXCLUDED
128+
? originalMetaValue.current
129+
: STATUS_UNOPTIMIZED;
130+
editPost({ meta: { [META_KEY]: restoreValue } });
131+
}
132+
}}
133+
/>
134+
);
135+
}
136+
137+
/**
138+
* Component for viewing the optimized version of a post
139+
*/
140+
function OptimizedViewLink() {
141+
const { hasLoaded, permalink, isPublished, label, meta, showIconLabels } = useSelect((select) => {
142+
const editor = select(editorStore);
143+
const { get } = select(preferencesStore);
144+
145+
// Get post type for label.
146+
const postTypeSlug = editor.getCurrentPostType();
147+
const postType = select(coreStore).getPostType(postTypeSlug);
148+
const postTypeLabel = postType?.labels?.singular_name || 'Post';
149+
const dynamicLabel = __('View Optimized', 'kadence-blocks') + ' ' + postTypeLabel;
150+
151+
return {
152+
permalink: editor.getPermalink(),
153+
isPublished: editor.isCurrentPostPublished(),
154+
label: dynamicLabel,
155+
hasLoaded: !!postType,
156+
meta: editor.getEditedPostAttribute('meta'),
157+
showIconLabels: get('core', 'showIconLabels'),
158+
};
159+
}, []);
160+
161+
if (!isPublished || !permalink || !hasLoaded) {
162+
return null;
163+
}
164+
165+
if (meta !== undefined && meta[META_KEY] !== STATUS_OPTIMIZED) {
166+
return null;
167+
}
168+
169+
const optimizerData = window.kbOptimizer || {};
170+
const nonce = optimizerData.token;
171+
172+
const url = addQueryArgs(permalink, {
173+
perf_token: nonce,
174+
kb_optimizer_preview: 1,
175+
});
176+
177+
return (
178+
<div style={{ marginTop: '12px' }}>
179+
<Button
180+
style={{ paddingLeft: 0 }}
181+
icon={external}
182+
iconPosition={'right'}
183+
label={label}
184+
href={url}
185+
target="_blank"
186+
showTooltip={!showIconLabels}
187+
size="compact"
188+
>
189+
{label}
190+
</Button>
191+
</div>
192+
);
193+
}
194+
29195
/**
30196
* Build the row edit
31197
*/
@@ -40,6 +206,10 @@ function KadenceConfig() {
40206
const [controlIcon, setControlIcon] = useState(
41207
applyFilters('kadence.block_sidebar_control_icon', BlockIcons.kadenceNewIcon)
42208
);
209+
210+
// Get the performance optimizer enabled setting using the shared hook
211+
const isOptimizerEnabled = useOptimizerEnabled();
212+
43213
return (
44214
<Fragment>
45215
<PluginSidebarMoreMenuItem target="kadence-controls" icon={controlIcon}>
@@ -754,14 +924,14 @@ function KadenceConfig() {
754924
/>
755925
</PanelBody>
756926
<PanelBody title={__('Performance Optimizer', 'kadence-blocks')} initialOpen={false}>
757-
<KadenceSetting
758-
slug={'performance_optimizer_enabled'}
759-
label={__('Globally Enable The Performance Optimizer', 'kadence-blocks')}
760-
type={'toggle'}
761-
theDefault={false}
762-
// Reload the page to load/unload the external optimizer JavaScript.
763-
successCallback={() => window.location.reload()}
764-
/>
927+
<PerformanceOptimizerToggle />
928+
929+
{isOptimizerEnabled && (
930+
<>
931+
<OptimizerExcludeToggle />
932+
<OptimizedViewLink />
933+
</>
934+
)}
765935
</PanelBody>
766936
<PanelBody title={__('Custom CSS Indicator', 'kadence-blocks')} initialOpen={false}>
767937
<KadenceSetting

tests/wpunit/Resources/Optimizer/Status/MetaTest.php

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -60,10 +60,6 @@ public function testItHasMetaKeyConstant(): void {
6060
$this->assertEquals( '_kb_optimizer_status', Meta::KEY );
6161
}
6262

63-
public function testItHasScriptHandle(): void {
64-
$this->assertSame( 'kadence-optimizer-meta', Meta::META_SCRIPT_HANDLE );
65-
}
66-
6763
public function testItRegistersPostMeta(): void {
6864
$this->meta->register_meta();
6965

@@ -226,15 +222,4 @@ public function testMaybeClearOptimizerDataDeletesStoreDataForExcludedPost(): vo
226222
$this->assertFalse( $this->store->has( $path ) );
227223
$this->assertNull( $this->store->get( $path ) );
228224
}
229-
230-
public function testEnqueueMetaScriptEnqueuesScript(): void {
231-
// Ensure we're in the block editor context.
232-
set_current_screen( 'post' );
233-
234-
// Call the method.
235-
$this->meta->enqueue_meta_script();
236-
237-
// Verify script is enqueued.
238-
$this->assertTrue( wp_script_is( Meta::META_SCRIPT_HANDLE, 'enqueued' ) || wp_script_is( Meta::META_SCRIPT_HANDLE, 'registered' ) );
239-
}
240225
}

webpack.config.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,6 @@ module.exports = {
6060
'extension-admin-notices': './src/extension/admin-notices/index.js',
6161
'admin-kadence-home': './src/home.js',
6262
'header-visual-builder': './src/header-visual-builder.js',
63-
'kadence-optimizer-meta': './includes/resources/Optimizer/assets/js/meta/index.js',
6463
'kadence-optimizer': './includes/resources/Optimizer/assets/js/optimizer/index.js',
6564
'lazy-loader': './includes/resources/Optimizer/Lazy_Load/assets/js/lazy-loader/index.js',
6665
'post-saved-event': './src/extension/post-saved-event/index.js',

0 commit comments

Comments
 (0)