← All changes | src/Agent/workflows/theme/components/SelectSiteVibes.jsx +3 -8 3.1.3 → trunk View file →

		@@ -9,9 +9,9 @@
9	9	useState,
10	10	} from '@wordpress/element';
11	11	import { __, sprintf } from '@wordpress/i18n';
12	12
13		-export const SelectSiteVibes = ({ onConfirm, onCancel, onLoad }) => {
	13	+export const SelectSiteVibes = ({ onConfirm, onCancel }) => {
14	14	const { data, isLoading } = useSiteVibesVariations();
15	15	const { vibes, css: styles } = data || {};
16	16	const [selected, setSelected] = useState(null);
17	17	const css = selected ? styles[selected] : '';
		@@ -36,13 +36,8 @@
36	36	onConfirm({ data: { selectedVibe: selected }, shouldRefreshPage: true });
37	37	};
38	38
39	39	useEffect(() => {
40		- if (isLoading) return;
41		- onLoad();
42		- }, [isLoading, onLoad]);
43		-
44		- useEffect(() => {
45	40	if (isLoading || !noVibes) return;
46	41	const timer = setTimeout(() => onCancel(), 100);
47	42	// translators: "site style" refers to the structural aesthetic style for the site.
48	43	const content = __(
		@@ -69,12 +64,12 @@
69	64
70	65	if (noVibes) return null;
71	66
72	67	return (
73		- <div className="mb-4 ml-10 mr-2 flex flex-col rounded-lg border border-gray-300 bg-gray-50 rtl:ml-2 rtl:mr-10">
	68	+ <div className="mb-4 ms-2 me-2 flex flex-col rounded-lg border border-gray-300 bg-gray-50">
74	69	<div className="rounded-lg border-b border-gray-400 bg-white">
75	70	<div className="grid gap-3 p-4 grid-cols-2">
76		- {shuffled?.slice(0, 10).map(({ slug }, index) => (
	71	+ {shuffled?.slice(0, 12).map(({ slug }, index) => (
77	72	<Fragment key={slug}>
78	73	<style>
79	74	{styles[slug]
80	75	?.replaceAll(':root', '.ext-vibe-container')