Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 15 additions & 2 deletions assets/js/components/TourTooltips.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,13 +124,26 @@ export default function TourTooltips( {
setValue( runKey, true );
}

const tour = useSelect( ( select ) =>
select( CORE_USER ).getCurrentTour()
);
Comment on lines +127 to +129
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This doesn't appear to be used since all references to the tour in this component only need its ID.


const { receiveCurrentTour } = useDispatch( CORE_USER );

function endTour() {
global.document.body.classList.remove(
'googlesitekit-showing-feature-tour',
`googlesitekit-showing-feature-tour--${ tourID }`
);
// Dismiss tour to avoid unwanted repeat viewing.
dismissTour( tourID );

if ( tour.isRepeatable ) {
setValue( runKey, false ); // Not strictly necessary to allow the tour to be restarted, but it seems sensible to keep the state aligned to avoid unexpected behavior.
setValue( stepKey, null ); // This is needed, otherwise the tour will be considered to be finished when it is restarted.
receiveCurrentTour( null );
} else {
// Dismiss tour to avoid unwanted repeat viewing.
dismissTour( tourID );
}
}

function trackAllTourEvents( {
Expand Down
12 changes: 11 additions & 1 deletion assets/js/components/help/HelpMenu.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import { __ } from '@wordpress/i18n';
/**
* Internal dependencies
*/
import { useSelect } from 'googlesitekit-data';
import { useDispatch, useSelect } from 'googlesitekit-data';
import { Button, Menu } from 'googlesitekit-components';
import HelpIcon from '@/svg/icons/help.svg';
import { useKeyCodesInside } from '@/js/hooks/useKeyCodesInside';
Expand All @@ -42,6 +42,8 @@ import { CORE_MODULES } from '@/js/googlesitekit/modules/datastore/constants';
import useViewContext from '@/js/hooks/useViewContext';
import { CORE_SITE } from '@/js/googlesitekit/datastore/site/constants';
import { MODULE_SLUG_ADSENSE } from '@/js/modules/adsense/constants';
import { CORE_USER } from '@/js/googlesitekit/datastore/user/constants';
import dashboardTour from '@/js/feature-tours/dashboard';

export default function HelpMenu( { children } ) {
const [ menuOpen, setMenuOpen ] = useState( false );
Expand Down Expand Up @@ -75,6 +77,8 @@ export default function HelpMenu( { children } ) {
);
} );

const { triggerOnDemandTour } = useDispatch( CORE_USER );

return (
<div
ref={ menuWrapperRef }
Expand All @@ -98,6 +102,12 @@ export default function HelpMenu( { children } ) {
onSelected={ handleMenuSelected }
>
{ children }
<HelpMenuLink
onClick={ () => triggerOnDemandTour( dashboardTour ) }
gaEventLabel="start_tour"
>
{ __( 'Start tour', 'google-site-kit' ) }
</HelpMenuLink>
<HelpMenuLink
gaEventLabel="fix_common_issues"
href={ fixCommonIssuesURL }
Expand Down
13 changes: 8 additions & 5 deletions assets/js/components/help/HelpMenuLink.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,26 +33,28 @@ import Link from '@/js/components/Link';
import { trackEvent } from '@/js/util';
import useViewContext from '@/js/hooks/useViewContext';

function HelpMenuLink( { children, href, gaEventLabel } ) {
function HelpMenuLink( { children, href, gaEventLabel, onClick } ) {
const viewContext = useViewContext();

const onClick = useCallback( async () => {
const handleClick = useCallback( async () => {
if ( gaEventLabel ) {
await trackEvent(
`${ viewContext }_headerbar_helpmenu`,
'click_outgoing_link',
gaEventLabel
);
}
}, [ gaEventLabel, viewContext ] );

onClick?.();
}, [ gaEventLabel, viewContext, onClick ] );

return (
<li className="googlesitekit-help-menu-link mdc-list-item" role="none">
<Link
className="mdc-list-item__text"
href={ href }
role="menuitem"
onClick={ onClick }
onClick={ handleClick }
external
hideExternalIndicator
>
Expand All @@ -64,8 +66,9 @@ function HelpMenuLink( { children, href, gaEventLabel } ) {

HelpMenuLink.propTypes = {
children: PropTypes.node.isRequired,
href: PropTypes.string.isRequired,
href: PropTypes.string,
gaEventLabel: PropTypes.string,
onClick: PropTypes.func,
};

export default HelpMenuLink;
57 changes: 57 additions & 0 deletions assets/js/feature-tours/dashboard.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
/**
* Site Kit by Google, Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

/**
* WordPress dependencies
*/
import { __ } from '@wordpress/i18n';

/*
* Internal dependencies
*/
import { VIEW_CONTEXT_MAIN_DASHBOARD } from '@/js/googlesitekit/constants';

const dashboardTour = {
slug: 'dashboard',
isRepeatable: true,
contexts: [ VIEW_CONTEXT_MAIN_DASHBOARD ],
gaEventCategory: ( viewContext ) => `${ viewContext }_dashboard`,
steps: [
{
target: '.googlesitekit-widget--searchFunnelGA4',
title: __(
'Track Search traffic trends, identify baselines',
'google-site-kit'
),
content: __(
"Know what's normal for your site. This is how you spot trends and measure real growth.",
'google-site-kit'
),
placement: 'top',
},
{
target: '.googlesitekit-sharing-settings__button',
title: __( 'Collaboration made easy', 'google-site-kit' ),
content: __(
'Share the dashboard with other stakeholders and manage their permissions with dashboard sharing feature.',
'google-site-kit'
),
placement: 'bottom',
},
],
};

export default dashboardTour;
Loading