Commit Graph

23 Commits

Author SHA1 Message Date
Moon c45335b936
CYS - Add LookAndFeel and ToneOfVoice pages (#39979)
* Add ProgressBar component to @woocommerce/components

* Add changelog

* Remove html.wp-toolbar in fullscreen mode

* Add base style

* Add Tell us a bit more about your business page

* Fix merge conflict issues

* Send BUSINESS_INFO_DESCRIPTION_COMPLETE event when continue button is clicked

* Remove duplicated style import

* Add changefile(s) from automation for the following project(s): @woocommerce/components, woocommerce

* Lint fix

* Add 'Look and Feel' and 'Tone of voice' pages';

* Use correct classname

* Minor changes

* Textearea color should be gray-900 after the user enter text
* guide font weight should be 500

* Fix layout shift when a choice is selected

* Fix choices width for tone of voice page

* Use context value for the default

* Revert button margin top

* Fix default selection

* Add X button

* Decrease the margin by 20px to accommodate the height of the close button

* Add close action

* Include @woocommerce/ai package

* Add AI service

* Use AI service

* Parse JSON from in function

* Fix assignLookAndTone event type

* Update plugins/woocommerce-admin/client/customize-store/design-with-ai/components/choice/choice.scss

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/customize-store/design-with-ai/services.ts

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Log when AI API endpoint request fails

* Add spinner when user clicks the continue button

* streamlined unnecessary isRequesting context and forwarded close event

* pnpm-lock changes from trunk

* lint fixes

* ai package test passWithNoTests

* changelog

* reset pnpm-lock to trunk

* Dev: update pnpm-lock.yaml and jest preset config (#40045)

* Update pnpm-lock.yaml

* Update jest-preset config to fix unexpected token error

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>
Co-authored-by: rjchow <me@rjchow.com>
2023-09-06 14:21:09 +08:00
RJ 0190f4adea
fix: applied lint autofixes (#39942)
* woocommerce-admin lint fixes

* @woocommerce/* lint fixes

* Add changefile(s) from automation for the following project(s): @woocommerce/date, @woocommerce/data, @woocommerce/components, @woocommerce/admin-layout, woocommerce

* lints

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-08-30 06:40:45 +08:00
Chris Runnells bd5fc03aae Add secondary container to fix layout shifts
Also added CSS so that the container is always aligned to the top of the wrapper
2023-08-24 14:01:55 -10:00
RJ cb2cf79342
dev: refactor core profiler loader (#39735)
* dev: refactor core profiler loader

* dev: added storybook example for loader

* lint

* Apply suggestions from code review

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* addressed review feedback

---------

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-08-22 19:58:33 +10:00
Moon 3c07a03943
Update/79113 incorrect subheading style and copy on wc core profiler (#39526)
* Use -webkit-font-smoothing: antialiased for core profiler subheadings

* Remove subheading letter-spacing
2023-08-03 11:26:52 -07:00
Moon 53593061cf
Use the same checkbox styles on the platform selector (#39469)
* Use the same checkbox style

* Add changelog

* Update plugins/woocommerce-admin/client/core-profiler/components/multiple-selector/multiple-selector.scss

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Fix CSS lint issues

---------

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-08-01 17:18:38 -07:00
Moon c810960bff
Align checkbox, logo, and title on the plugins page (core profiler) (#39394)
* Reset checkbox position

* Center align chekbox, logo, and the title

* Add changelog

* Remove use of classnames -- no longer needed

* Fix CSS lint issues
2023-07-31 09:06:50 -07:00
Moon 7bbffd3284
Update CSS styles for core profiler headers (#39059)
* Remove letter-spacing and use 500 for font-weight

* Add changelog

* Style updates for the header

* Set letter-spacing to normal
* Use 500 for font-weight
* Remove max-width

* Add changelog
2023-07-03 10:54:48 -07:00
Moon 87393e0ef1
Update CSS styles for core profiler headers (#39042)
* Remove letter-spacing and use 500 for font-weight

* Add changelog
2023-06-29 20:16:44 -07:00
Chi-Hsuan Huang 5fb8183682
Fix Core Profiler UI issues (#38872)
* Fix overlapping button position when the height is less than 667px (iphone SE)

* Fix misaligned check icon on mobile

* Prevent the menu from closing when clicking on a selected item

* Add changelog

* Fix lint

---------

Co-authored-by: moon <moon.kyong@automattic.com>
2023-06-22 20:54:14 -07:00
Moon 00e4e94c89
Change select option hover color on core profiler pages (#38724)
* Use theme color for the option hover

* Add Changelog

* Remvoe absolute position -- can't predict correct value for bottom

* Fix css lint error

* Fix button width

* Use gray-0 for dropdown item hover color

* Fix border style for Give your store a name field

* Fix hover color for the platform options

* Remove light color on hover

---------

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-06-19 11:03:55 +08:00
Ilyas Foo b490e56a40
Various UI fixes in Core profiler steps (#38759)
* Fix font heading font style and adjust main component max width to match design

* Remove redundant #FunWooFact

* Reset button font color to follow admin theme

* Fix Installed label vertical alignment

* Changelog

* Remove permanent borders from consent checkbox, lint fix

* Remove box shadow on checkboxes in plugins page

* Standardize checkbox styling across core profiler

* Fix heading font styling

* Lint

* More lint

* Update snapshot
2023-06-17 13:14:13 +08:00
Moon 630faadb81
Update/implement connect to jetpack (#38674)
* Add install-and-activate-plugins-async action to onboarding

* Add label and learn_more_link types

* Use label and learn_more_link

* Remove unused imports

* ts fixes

* Visual changes on the plugin page

* Change CTA font size from 13px to 14px
* Change spacing between the chebox and logo to 24px
* Change heading font-weight to 500

* Fix css lint error

* Add back learn more link that was removed from rebase

* Add required packages

* Load Jetpack Config

* Add getJetpackAuthUrl to data/onboarding

* Add Connection Rest Auth -- seems like this is required for Jetpack to communicate back to the connected site

* Add jetpack-authorization-url REST API

* Redirect to Jetpack Auth page after the installatino process if jetpack was selected

* Require can_install_plugins permission for jetpack auth url endpoint

* Update packages/js/data/src/onboarding/resolvers.ts

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Update plugins/woocommerce/src/Admin/API/OnboardingPlugins.php

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Remove automattic/jetpack-sync and its config

* Support redirect_url and from params

* Do not redirect to Jetpack auth if it is already connected

* Add installed_ext_success=1

* Use woocommerce-core-profiler for from value

* Revert unrelated lock file changes

* Minor refactor

* Extracted out isJetpackConnected cond to a guard

* Added meta data for isJetpackConnected to prevent unwanted spinner

* Add Changelog

* Lint fix

* Move Jetpack Connection config init to class-woocommerce

* Add changelog

* Remove unnecessary require

* Note jetpack-authorization-url endpoint is experimental

* Fix broken test

* Add component to sendToJetPackAuthPage state

* Fix lint error

---------

Co-authored-by: rjchow <me@rjchow.com>
Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-06-15 20:28:18 -07:00
Moon 604132391a
Visual changes for Intro, guided setup, and skipped guided setup pages (#38709)
* Change Skip this setup to Skip this step

* Visual changes on intro, user profile, and skip guided page

* Always check tracking agreement

* Change border to 2px

* Change Give yoru store a name font-size to 13

* Add Changelog

* Update test to reflect the text change

* Remove !important

* Update test snapshot

* Update test snapshot

* Remove test that is no longer necessary
2023-06-13 22:10:43 -07:00
Moon 620ff93e5a
Additional changes for the core profiler plugins page (#38616)
* Add install-and-activate-plugins-async action to onboarding

* Add label and learn_more_link types

* Use label and learn_more_link

* Fix type

* Add changelog

* Add changelog

* Add install_priority -- this will be used in the core profiler

* Sort selected plugins by install_priority for installation

* Remove unused imports

* dev: refactor installAndActivatePlugins to xstate

* ts fixes

* Sort plugins by install_priority

* Make sure WooCommerce Shipping is always visible

* Update free extension list content

* Updated WC payment description
* Updated logo images

* Visual changes on the plugin page

* Change CTA font size from 13px to 14px
* Change spacing between the chebox and logo to 24px
* Change heading font-weight to 500

* Fix css lint error

* Fix gray-900 variable name

* Hide learn more link on mobile view

* Add back learn more link that was removed from rebase

* Send pluginsAvailable to pluginInstallermachine

* Use is_activated to determine plugin availability and install status

* Update packages/js/data/src/onboarding/types.ts

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Update plugins/woocommerce/src/Internal/Admin/RemoteFreeExtensions/DefaultFreeExtensions.php

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

* Add back recordTracksPluginsLearnMoreLinkClicked

* Use install-and-activate-plugins-async when timer is up

* Record plugin and link with learn more linked clicked event

* Fix failign tests

* Add comment for install_priority

---------

Co-authored-by: rjchow <me@rjchow.com>
Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-06-13 15:03:03 -07:00
Chris Runnells 3ae3a0df8d Lint fixes 2023-06-02 15:08:33 -10:00
Chris Runnells 3082b21b1e Added ProfileSpinner component to display when Core Profiler assets are loading 2023-06-02 14:27:17 -10:00
RJ ab18828e84
add: core profiler business info page (#38412)
* add: core profiler business info page
2023-05-30 15:05:38 +08:00
Moon 6946ef384a
Core Profiler - Add extensions page (#38405)
* Initial design impl. without the full functionality

* Delete unused icons

* Add is_installed and plugins_page_skipped

* Add plugin-card component to render an installable plugin

* Implement plugins page

* Add loaders for plugins

* Add changelog

* Remove unused type

* Add changelog

* Remove unnecessary return statement

* Add obw/core-profiler

* Replace extensions with plugins

* Temp -- use window.location.href for Woo Home redirection

* Minor: code refactor

* Refactor isntallAndActivatedPlugins

* Skip plugins page when there is no available plugin

* Apply mobile styles

* Update plugins/woocommerce-admin/client/core-profiler/components/plugin-card/plugin-card.scss

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/components/plugin-card/plugin-card.scss

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/style.scss

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Bold errored plugin name

* Fix checkbox alignment

* Update changelog

* Fix object type for formatToParts function

* Fix lint issues

* Fix CSS lint issues

* Fallback to en-US when locale is not available

* Fix error with siteLocale

---------

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>
2023-05-29 07:45:30 -07:00
Chi-Hsuan Huang 4547922f3f
Add core profiler user profile page (#38328) 2023-05-22 11:21:16 +08:00
Moon 0bf6859383
Add Business Location page to the core profiler (#38019)
* Add core profiler - welcome to woo page

* Update checkbox styles

* Add tracks

* Update default tracking value

* Update copies

* using invoked promise instead of useState

- take advantage of xstate's built ins for side effects instead of  useEffect/hooks
- discovered that error result wasn't really handled in original useEffect
- use text labels instead of inline functions so that we can decouple the implementation from the machine model
- todo: can move the invoked function out elsewhere and also tests if needed (not necessary here because it's a simple call)

* add: core profiler scaffolding using xstate

* Add navigation and progress-bar components

* fix css lint error

* Update plugins/woocommerce-admin/client/core-profiler/components/navigation/woologo.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/components/progress-bar/progress-bar.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/components/navigation/navigation.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Remove var from __ function

* Use woocommerce prefix for classnames

* Fix css lint error

* Fix broken tests

* Add business location page

* Remove unwanted changes from rebase

* Remove unwanted changes from rebase

* Redirect to Woo Home on exit

* Add tracks

* Fix js lint error

* Add loader page

* Support meta value from nested states

* Use navigateTo

* Add tests for getCountryStateOptions

* Use Country type from navigation package

* Rename useStages to getLoaderStageMeta

* Add changelog

* Move progress from 20 to 80

* Fix xstate warning

* Fix broken pnpm lock

* Fix eslint errors

* Update plugins/woocommerce-admin/client/core-profiler/services/country.ts

Co-authored-by: RJ <27843274+rjchow@users.noreply.github.com>

* Update plugins/woocommerce-admin/client/core-profiler/index.tsx

Co-authored-by: RJ <27843274+rjchow@users.noreply.github.com>

* Save country to option

* Fix jslint error

* Update plugins/woocommerce-admin/client/core-profiler/services/country.ts

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/style.scss

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Fix eslint error

* Use decodeEntities directly

* Update comment for artificial 3 seconds wait

* Disable Go to my store button when country is empty

* Style for mobile devices

* Style updates for the country dropdown

* Fix js lint error

* Update country dropdown border color

* Style the loader

* Fix css lint

---------

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>
Co-authored-by: rjchow <me@rjchow.com>
Co-authored-by: RJ <27843274+rjchow@users.noreply.github.com>
2023-05-15 04:56:47 +08:00
Chi-Hsuan Huang ea58ae339a
Add core profiler "Welcome to Woo!" page (#37952)
* Add core profiler - welcome to woo page

* Add changelog

* Update checkbox styles

* Update copies

* Add test

* Add enable prop to window.wcTracks type

* Add tracks

* Add explat changelog

* Fix import

* Update default tracking value

* Update copies

* Fix test

* using invoked promise instead of useState

- take advantage of xstate's built ins for side effects instead of  useEffect/hooks
- discovered that error result wasn't really handled in original useEffect
- use text labels instead of inline functions so that we can decouple the implementation from the machine model
- todo: can move the invoked function out elsewhere and also tests if needed (not necessary here because it's a simple call)

* use actions.choose instead of branching inside action 

- https://stately.ai/docs/xstate/transitions-and-choices/guarded-actions#the-choose-action
- makes it so that the machine model is serializeable
- todo: in the distant future i wonder if it might be tidier to have tracks be its own actor that just receives the same events that this machine does, that way it's just standalone instead of mixing up tracks with the implementation

* use dispatch instead of useDispatch

- decouples the implementation of the handler from the react component
- makes the handler testable on its own if needed
- makes the state machine testable without relying on external dependencies

* decoupled remaining function calls

* Fix lint error

* Fix style lint

* address xstate console warnings

- .withConfig() is a function call that returns a new object every invocation so we need to wrap it in useMemo to keep it stable

* Add optInDataSharing is false test

* Fix lint

---------

Co-authored-by: rjchow <me@rjchow.com>
2023-05-03 15:54:28 +08:00
Moon 3c2bae196b
Add navigation and progress-bar components for the new core profiler (#37741)
* add: core profiler scaffolding using xstate

* Add navigation and progress-bar components

* fix css lint error

* Update plugins/woocommerce-admin/client/core-profiler/components/navigation/woologo.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/components/progress-bar/progress-bar.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Update plugins/woocommerce-admin/client/core-profiler/components/navigation/navigation.tsx

Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>

* Import HTMLAttributes

* Remove var from __ function

* Make progress bar color configurable

* Destruct props directly in the function and use const to define the comp

* Refactor fillerStyles

* Use woocommerce prefix for classnames

* Use inherit for display -- initial did not work properly

* Fix css lint error

* Remove unused WooLogo var

* Use named export

* Fix js style

* Add changelog

* Fix broken tests

---------

Co-authored-by: rjchow <me@rjchow.com>
Co-authored-by: Chi-Hsuan Huang <chihsuan.tw@gmail.com>
2023-04-26 17:27:53 -07:00