Skip to content

Commit baf3a2b

Browse files
wpalaniwpalani
committed
Add site type option to intake step
1 parent cc1b8f5 commit baf3a2b

File tree

10 files changed

+165
-46
lines changed

10 files changed

+165
-46
lines changed

‎includes/RestApi/SiteGenController.php

Lines changed: 12 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -79,15 +79,6 @@ public function register_routes() {
7979
'permission_callback' => array( Permissions::class, 'rest_is_authorized_admin' ),
8080
)
8181
);
82-
\register_rest_route(
83-
$this->namespace,
84-
$this->rest_base . '/customize-data',
85-
array(
86-
'methods' => \WP_REST_Server::READABLE,
87-
'callback' => array( $this, 'get_customize_sidebar_data' ),
88-
'permission_callback' => array( Permissions::class, 'rest_is_authorized_admin' ),
89-
)
90-
);
9182

9283
\register_rest_route(
9384
$this->namespace,
@@ -212,12 +203,14 @@ public function generate_sitegen_meta( \WP_REST_Request $request ) {
212203

213204
$site_info = $request->get_param( 'site_info' );
214205
$identifier = $request->get_param( 'identifier' );
206+
$site_type = $request->get_param( 'site_type' );
215207
$locale = $request->get_param( 'locale' );
216208
$skip_cache = $request->get_param( 'skip_cache' );
217209

218210
return SiteGenService::instantiate_site_meta(
219211
$site_info,
220212
$identifier,
213+
$site_type,
221214
$locale,
222215
$skip_cache
223216
);
@@ -236,21 +229,23 @@ public function get_homepages( \WP_REST_Request $request ) {
236229
}
237230

238231
$site_description = $request->get_param( 'site_description' );
239-
$locale = $request->get_param( 'locale' );
240232
$site_info = array( 'site_description' => $site_description );
233+
$site_type = $request->get_param( 'site_type' );
234+
$locale = $request->get_param( 'locale' );
241235

242-
$target_audience = SiteGenService::instantiate_site_meta( $site_info, 'target_audience', $locale );
236+
$target_audience = SiteGenService::instantiate_site_meta( $site_info, 'target_audience', $site_type, $locale );
243237
if ( is_wp_error( $target_audience ) ) {
244238
return $target_audience;
245239
}
246240

247-
$content_style = SiteGenService::instantiate_site_meta( $site_info, 'content_tones', $locale );
241+
$content_style = SiteGenService::instantiate_site_meta( $site_info, 'content_tones', $site_type, $locale );
248242
if ( is_wp_error( $content_style ) ) {
249243
return $content_style;
250244
}
251245

252246
$homepages = SiteGenService::generate_homepages(
253247
$site_description,
248+
$site_type,
254249
$content_style,
255250
$target_audience,
256251
$locale,
@@ -315,25 +310,26 @@ public function regenerate_homepage( \WP_REST_Request $request ) {
315310
public function publish_sitemap_pages( \WP_REST_Request $request ) {
316311
$site_description = $request->get_param( 'site_description' );
317312
$site_info = array( 'site_description' => $site_description );
313+
$site_type = $request->get_param( 'site_type' );
318314
$locale = $request->get_param( 'locale' );
319315
$skip_cache = $request->get_param( 'skip_cache' );
320316

321-
$target_audience = SiteGenService::instantiate_site_meta( $site_info, 'target_audience', $locale, $skip_cache );
317+
$target_audience = SiteGenService::instantiate_site_meta( $site_info, 'target_audience', $site_type, $locale, $skip_cache );
322318
if ( is_wp_error( $target_audience ) ) {
323319
return $target_audience;
324320
}
325321

326-
$content_style = SiteGenService::instantiate_site_meta( $site_info, 'content_tones', $locale, $skip_cache );
322+
$content_style = SiteGenService::instantiate_site_meta( $site_info, 'content_tones', $site_type, $locale, $skip_cache );
327323
if ( is_wp_error( $content_style ) ) {
328324
return $content_style;
329325
}
330326

331-
$sitemap = SiteGenService::instantiate_site_meta( $site_info, 'sitemap', $locale, $skip_cache );
327+
$sitemap = SiteGenService::instantiate_site_meta( $site_info, 'sitemap', $site_type, $locale, $skip_cache );
332328
if ( is_wp_error( $sitemap ) ) {
333329
return $sitemap;
334330
}
335331

336-
SiteGenService::publish_sitemap_pages( $site_description, $content_style, $target_audience, $sitemap, $locale );
332+
SiteGenService::publish_sitemap_pages( $site_description, $site_type, $content_style, $target_audience, $sitemap, $locale );
337333

338334
return new \WP_REST_Response( array(), 201 );
339335
}
@@ -346,13 +342,4 @@ public function publish_sitemap_pages( \WP_REST_Request $request ) {
346342
public function get_site_details_meta() {
347343
return SiteGenData::get_site_details_questionnaire();
348344
}
349-
350-
/**
351-
* Get Sitegen Customize sidebar data.
352-
*
353-
* @return array|WP_Error
354-
*/
355-
public function get_customize_sidebar_data() {
356-
return SiteGenService::get_customize_sidebar_data();
357-
}
358345
}

‎includes/Services/SiteGenService.php

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -87,11 +87,12 @@ public function publish_homepage( string $selected_sitegen_homepage ): int | \WP
8787
public function get_sitemap_page_title( string $slug ): string|false {
8888
$prompt = $this->get_prompt();
8989
$locale = $this->get_locale();
90-
if ( ! $prompt || ! $locale ) {
90+
$site_type = $this->get_site_type();
91+
if ( ! $prompt || ! $locale || ! $site_type ) {
9192
return false;
9293
}
9394

94-
$sitemap = LegacySiteGenService::instantiate_site_meta( $prompt, 'sitemap', $locale );
95+
$sitemap = LegacySiteGenService::instantiate_site_meta( $prompt, 'sitemap', $site_type, $locale );
9596
if ( ! is_wp_error( $sitemap ) ) {
9697
foreach ( $sitemap as $page ) {
9798
if ( $slug === $page['slug'] ) {
@@ -143,6 +144,15 @@ public function get_prompt(): string|false {
143144
return ! empty( $this->input_data['prompt'] ) ? $this->input_data['prompt'] : false;
144145
}
145146

147+
/**
148+
* Get the site type entered during Onboarding.
149+
*
150+
* @return string
151+
*/
152+
public function get_site_type(): string {
153+
return ! empty( $this->input_data['siteType'] ) ? $this->input_data['siteType'] : 'business';
154+
}
155+
146156
/**
147157
* Get the locale entered during Onboarding.
148158
*

‎src/app/steps/Canvas/HeaderActions.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { dispatch, useSelect } from '@wordpress/data';
22
import { Button } from '@newfold/ui-component-library';
33
import { AdjustmentsVerticalIcon, CloudArrowUpIcon, RectangleStackIcon as RectangleStackIconOutline } from '@heroicons/react/24/outline';
4-
import { RectangleStackIcon as RectangleStackIconSolid } from '@heroicons/react/24/solid'
4+
import { RectangleStackIcon as RectangleStackIconSolid } from '@heroicons/react/24/solid';
55
import { InteractionBlockingOverlay } from '@/components';
66
import { nfdOnboardingStore } from '@/data/store';
77
import { usePublishSite } from '@/utils/hooks';
@@ -103,6 +103,6 @@ const HeaderActions = () => {
103103
</Button>
104104
</div>
105105
);
106-
}
106+
};
107107

108108
export default HeaderActions;

‎src/app/steps/Intake/IntakeStep.js

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,25 @@
11
import { Navigate, Step } from '@/components';
22
import { Container } from '@newfold/ui-component-library';
3-
import { SiteTitleInput, PromptInput, LanguageSelector, calculatePromptStrength } from '.';
4-
import { select, dispatch, useSelect } from '@wordpress/data';
3+
import { SiteTitleInput, PromptInput, LanguageSelector, calculatePromptStrength, SiteTypeSelector } from '.';
4+
import { select, dispatch } from '@wordpress/data';
55
import { nfdOnboardingStore } from '@/data/store';
66
import { OnboardingEvent, trackOnboardingEvent } from '@/utils/analytics/hiive';
77
import { ACTION_INTAKE_PROMPT_SET } from '@/utils/analytics/hiive/constants';
88

99
const IntakeStep = () => {
1010
// Initiale state values.
11-
const { siteTitle, selectedLocale, prompt } = select( nfdOnboardingStore ).getInputSlice();
11+
const { siteType, siteTitle, selectedLocale, prompt } = select( nfdOnboardingStore ).getInputSlice();
12+
const retryMode = select( nfdOnboardingStore ).getRetryMode();
1213

1314
// Step states.
15+
const [ siteTypeValue, setSiteTypeValue ] = useState( siteType );
1416
const [ siteTitleValue, setSiteTitleValue ] = useState( siteTitle );
1517
const [ selectedLocaleValue, setSelectedLocaleValue ] = useState( selectedLocale );
1618
const [ promptValue, setPromptValue ] = useState( prompt );
1719

18-
const { retryMode } = useSelect( ( select ) => {
19-
return {
20-
retryMode: select( nfdOnboardingStore ).getRetryMode(),
21-
};
22-
} );
23-
2420
const handleNext = () => {
2521
dispatch( nfdOnboardingStore ).setInputSlice( {
22+
siteType: siteTypeValue,
2623
siteTitle: siteTitleValue.trim(),
2724
selectedLocale: selectedLocaleValue,
2825
prompt: promptValue.trim(),
@@ -64,6 +61,7 @@ const IntakeStep = () => {
6461
/>
6562
<Container.Block separator={ false }>
6663
<div className="nfd-flex nfd-flex-col nfd-gap-6">
64+
<SiteTypeSelector value={ siteTypeValue } onChange={ setSiteTypeValue } />
6765
<div className="nfd-flex nfd-gap-4 nfd-w-full mobile:nfd-flex-col">
6866
<SiteTitleInput value={ siteTitleValue } onChange={ setSiteTitleValue } />
6967
<LanguageSelector value={ selectedLocaleValue } onChange={ setSelectedLocaleValue } />
@@ -76,7 +74,7 @@ const IntakeStep = () => {
7674
<Navigate
7775
toRoute="/logo"
7876
direction="forward"
79-
disabled={ ! promptValue }
77+
disabled={ ! promptValue || ! siteTypeValue }
8078
callback={ handleNext }
8179
>
8280
{ __( 'Next', 'wp-module-onboarding' ) }

‎src/app/steps/Intake/SiteTypeSelector.js

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
import { FeaturesSelect, Label, Title } from '@newfold/ui-component-library';
2+
import { UserIcon as UserIconOutline, BuildingOfficeIcon as BuildingOfficeIconOutline, ShoppingBagIcon as ShoppingBagIconOutline } from '@heroicons/react/24/outline';
3+
import { UserIcon as UserIconSolid, BuildingOfficeIcon as BuildingOfficeIconSolid, ShoppingBagIcon as ShoppingBagIconSolid } from '@heroicons/react/24/solid';
4+
5+
const SiteTypeSelector = ( { value: selectedSiteType, onChange } ) => {
6+
const siteTypeOptions = [
7+
{
8+
id: 'nfd-onboarding-site-type-option__blog',
9+
name: 'nfd-onboarding-site-type-option-group',
10+
value: 'personal',
11+
label: __( 'Personal', 'wp-module-onboarding' ),
12+
description: __( 'Share your story, thoughts, and ideas.', 'wp-module-onboarding' ),
13+
Icon: UserIconOutline,
14+
IconSelected: UserIconSolid,
15+
},
16+
{
17+
id: 'nfd-onboarding-site-type-option__business-service',
18+
name: 'nfd-onboarding-site-type-option-group',
19+
value: 'business',
20+
label: __( 'Business & Service', 'wp-module-onboarding' ),
21+
description: __( 'Showcase your work and services.', 'wp-module-onboarding' ),
22+
Icon: BuildingOfficeIconOutline,
23+
IconSelected: BuildingOfficeIconSolid,
24+
},
25+
{
26+
id: 'nfd-onboarding-site-type-option__ecommerce',
27+
name: 'nfd-onboarding-site-type-option-group',
28+
value: 'ecommerce',
29+
label: __( 'Online Store', 'wp-module-onboarding' ),
30+
description: __( 'Sell your products and services online.', 'wp-module-onboarding' ),
31+
Icon: ShoppingBagIconOutline,
32+
IconSelected: ShoppingBagIconSolid,
33+
},
34+
];
35+
36+
const handleChange = ( event ) => {
37+
const newValue = event.target.value;
38+
// Validate the value is one of the options.
39+
const allowedValues = siteTypeOptions.map( ( option ) => option.value );
40+
if ( allowedValues.includes( newValue ) && newValue !== selectedSiteType ) {
41+
onChange( newValue );
42+
}
43+
};
44+
45+
/**
46+
* Styles for parts that are not exposed by the FeaturesSelect component.
47+
*/
48+
const getCustomStyles = () => {
49+
return (
50+
<style>
51+
{ `
52+
.nfd-onboarding-site-type-options .nfd-features-select__feature .nfd-label {
53+
box-shadow: 0px 4px 9.6px 10px #85BCF209 !important;
54+
}
55+
56+
.nfd-onboarding-site-type-options .nfd-features-select__feature-content {
57+
padding: 1rem !important;
58+
border-color: #DEE3E9 !important;
59+
width: 100% !important;
60+
}
61+
62+
.nfd-onboarding-site-type-options .nfd-features-select__feature .nfd-features-select__feature-input:checked + .nfd-label .nfd-features-select__feature-content {
63+
background-color: #EAF4FB !important;
64+
}
65+
` }
66+
</style>
67+
);
68+
};
69+
70+
const SiteTypeOption = ( { option } ) => {
71+
const Icon = option.Icon;
72+
const IconSelected = option.IconSelected;
73+
74+
return (
75+
<FeaturesSelect.Feature
76+
key={ option.id }
77+
id={ option.id }
78+
name={ option.name }
79+
value={ option.value }
80+
checked={ selectedSiteType === option.value }
81+
screenReaderLabel={ option.label }
82+
onChange={ handleChange }
83+
className="nfd-w-[30%] nfd-flex-grow [&>label]:nfd-h-full [&>label]:nfd-flex mobile:nfd-w-full"
84+
>
85+
<div className="nfd-flex nfd-flex-col nfd-self-stretch nfd-gap-1 nfd-text-left">
86+
{ selectedSiteType === option.value ? <IconSelected className="nfd-h-6 nfd-w-6 nfd-text-primary nfd-mb-1" /> : <Icon className="nfd-h-6 nfd-w-6 nfd-text-primary nfd-mb-1" /> }
87+
<Title as="h4" className="nfd-text-sm nfd-font-semibold">{ option.label }</Title>
88+
<p className="nfd-text-sm">{ option.description }</p>
89+
</div>
90+
</FeaturesSelect.Feature>
91+
);
92+
};
93+
94+
return (
95+
<div className="nfd-onboarding-site-type-options nfd-pb-7 nfd-border-b">
96+
{ getCustomStyles() }
97+
<Label
98+
label={ __( 'Site Type', 'wp-module-onboarding' ) }
99+
required={ true }
100+
requiredIndicator={ true }
101+
className="nfd-mb-2 nfd-block"
102+
/>
103+
<FeaturesSelect
104+
behavior="radio"
105+
className="nfd-flex mobile:nfd-flex-col"
106+
>
107+
{ siteTypeOptions.map( ( option ) => <SiteTypeOption key={ option.id } option={ option } /> ) }
108+
</FeaturesSelect>
109+
</div>
110+
);
111+
};
112+
113+
export default SiteTypeSelector;

‎src/app/steps/Intake/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@ export { default as SiteTitleInput } from './SiteTitleInput';
33
export { default as PromptInput } from './PromptInput';
44
export { default as LanguageSelector } from './LanguageSelector';
55
export { default as calculatePromptStrength } from './calculatePromptStrength';
6+
export { default as SiteTypeSelector } from './SiteTypeSelector';

‎src/app/utils/api/onboarding.js

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -115,13 +115,15 @@ export const setGlobalStylesColorPalette = async ( colorPalette ) => {
115115
*
116116
* @param {string} identifier
117117
* @param {string} prompt
118+
* @param {string} siteType
118119
* @param {string} locale
119120
* @param {boolean} skipCache
120121
* @return {Promise<Object>} response
121122
*/
122123
export async function getSiteMetaForIdentifier(
123124
identifier,
124125
prompt,
126+
siteType,
125127
locale,
126128
skipCache = true
127129
) {
@@ -132,6 +134,7 @@ export async function getSiteMetaForIdentifier(
132134
data: {
133135
site_info: prompt,
134136
identifier,
137+
site_type: siteType,
135138
locale,
136139
skip_cache: skipCache,
137140
},
@@ -145,16 +148,18 @@ export async function getSiteMetaForIdentifier(
145148
* Get the homepages.
146149
*
147150
* @param {string} prompt
151+
* @param {string} siteType
148152
* @param {string} locale
149153
* @return {Promise<Object>} response
150154
*/
151-
export async function getHomepages( prompt, locale ) {
155+
export async function getHomepages( prompt, siteType, locale ) {
152156
const response = await resolve(
153157
apiFetch( {
154158
url: onboardingRestURL( 'sitegen/homepages' ),
155159
method: 'POST',
156160
data: {
157161
site_description: prompt,
162+
site_type: siteType,
158163
locale,
159164
},
160165
} )
@@ -167,16 +172,18 @@ export async function getHomepages( prompt, locale ) {
167172
* Get the rest of the site pages (not the homepages).
168173
*
169174
* @param {string} prompt
175+
* @param {string} siteType
170176
* @param {string} locale
171177
* @return {Promise<Object>} response
172178
*/
173-
export async function getSitePages( prompt, locale ) {
179+
export async function getSitePages( prompt, siteType, locale ) {
174180
return await resolve(
175181
apiFetch( {
176182
url: onboardingRestURL( 'sitegen/pages/sitemap' ),
177183
method: 'POST',
178184
data: {
179185
site_description: prompt,
186+
site_type: siteType,
180187
locale,
181188
},
182189
} ).then()

‎src/app/utils/sitegen/generateHomePages.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,9 @@ import { ACTION_ERROR_STATE_TRIGGERED } from '@/utils/analytics/hiive/constants'
1111
const generateHomePages = async () => {
1212
const prompt = select( nfdOnboardingStore ).getPrompt();
1313
const locale = select( nfdOnboardingStore ).getSelectedLocale();
14+
const siteType = select( nfdOnboardingStore ).getSiteType();
1415

15-
const response = await getHomepages( prompt, locale );
16+
const response = await getHomepages( prompt, siteType, locale );
1617
if ( response.error ) {
1718
trackOnboardingEvent(
1819
new OnboardingEvent(

0 commit comments

Comments
 (0)