Skip to content

Commit

Permalink
Merge pull request #7996 from google/icon-followup-revert
Browse files Browse the repository at this point in the history
  • Loading branch information
aaemnnosttv authored Dec 15, 2023
2 parents e4315b0 + 03fd24e commit 8af3f7e
Show file tree
Hide file tree
Showing 52 changed files with 251 additions and 96 deletions.
2 changes: 1 addition & 1 deletion assets/js/components/KeyMetrics/ChangeMetricsLink.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,8 +66,8 @@ export default function ChangeMetricsLink() {
linkButton
className="googlesitekit-km-change-metrics-cta"
onClick={ openMetricsSelectionPanel }
leadingIcon={ <PencilIcon width={ 22 } height={ 22 } /> }
>
<PencilIcon width={ 22 } height={ 22 } />
{ __( 'Change Metrics', 'google-site-kit' ) }
</Link>
<SetupCompletedSurveyTrigger />
Expand Down
47 changes: 33 additions & 14 deletions assets/js/components/Link.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,8 @@ const Link = forwardRef( ( props, ref ) => {
standalone = false,
linkButton = false,
to,
leadingIcon,
trailingIcon,
...otherProps
} = props;

Expand Down Expand Up @@ -151,6 +153,27 @@ const Link = forwardRef( ( props, ref ) => {
const LinkComponent = getLinkComponent();
const ariaLabel = getAriaLabel();

// Set the prefix/suffix icons, based on the type of link this is and
// the props supplied.
let leadingIconToUse = leadingIcon;
let trailingIconToUse = trailingIcon;

if ( back ) {
leadingIconToUse = <BackIcon width={ 14 } height={ 14 } />;
}

if ( external && ! hideExternalIndicator ) {
trailingIconToUse = <ExternalIcon width={ 14 } height={ 14 } />;
}

if ( arrow && ! inverse ) {
trailingIconToUse = <ArrowIcon width={ 14 } height={ 14 } />;
}

if ( arrow && inverse ) {
trailingIconToUse = <ArrowInverseIcon width={ 14 } height={ 14 } />;
}

return (
<LinkComponent
aria-label={ ariaLabel }
Expand All @@ -177,23 +200,17 @@ const Link = forwardRef( ( props, ref ) => {
to={ to }
{ ...otherProps }
>
{ back && (
{ !! leadingIconToUse && (
<IconWrapper marginRight={ 5 }>
<BackIcon width={ 14 } height={ 14 } />
{ leadingIconToUse }
</IconWrapper>
) }
<span>{ children }</span>
{ external && ! hideExternalIndicator && (
<span className="googlesitekit-cta-link__contents">
{ children }
</span>
{ !! trailingIconToUse && (
<IconWrapper marginLeft={ 5 }>
<ExternalIcon width={ 14 } height={ 14 } />
</IconWrapper>
) }
{ arrow && (
<IconWrapper marginLeft={ 5 }>
{ ! inverse && <ArrowIcon width={ 14 } height={ 14 } /> }
{ inverse && (
<ArrowInverseIcon width={ 14 } height={ 14 } />
) }
{ trailingIconToUse }
</IconWrapper>
) }
</LinkComponent>
Expand All @@ -212,11 +229,13 @@ Link.propTypes = {
hideExternalIndicator: PropTypes.bool,
href: PropTypes.string,
inverse: PropTypes.bool,
leadingIcon: PropTypes.node,
linkButton: PropTypes.bool,
onClick: PropTypes.func,
small: PropTypes.bool,
standalone: PropTypes.bool,
linkButton: PropTypes.bool,
to: PropTypes.string,
trailingIcon: PropTypes.node,
};

export default Link;
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,9 @@ exports[`ErrorNotifications renders the GTE message when the only unsatisfied sc
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down
24 changes: 14 additions & 10 deletions assets/js/components/settings/SettingsActiveModule/Footer.js
Original file line number Diff line number Diff line change
Expand Up @@ -245,13 +245,15 @@ export default function Footer( props ) {
__( 'Edit %s settings', 'google-site-kit' ),
name
) }
trailingIcon={
<PencilIcon
className="googlesitekit-settings-module__edit-button-icon"
width={ 10 }
height={ 10 }
/>
}
>
{ __( 'Edit', 'google-site-kit' ) }
<PencilIcon
className="googlesitekit-settings-module__edit-button-icon"
width="10"
height="10"
/>
</Link>
);
}
Expand All @@ -262,17 +264,19 @@ export default function Footer( props ) {
className="googlesitekit-settings-module__remove-button"
onClick={ handleDialog }
danger
trailingIcon={
<TrashIcon
className="googlesitekit-settings-module__remove-button-icon"
width={ 13 }
height={ 13 }
/>
}
>
{ sprintf(
/* translators: %s: module name */
__( 'Disconnect %s from Site Kit', 'google-site-kit' ),
name
) }
<TrashIcon
className="googlesitekit-settings-module__remove-button-icon"
width="13"
height="13"
/>
</Link>
);
} else if ( ! isEditing && moduleHomepage ) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,9 @@ exports[`SetupUsingProxyWithSignIn should not render the Activate Analytics noti
class="googlesitekit-cta-link googlesitekit-header__logo-link"
href=""
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
<div
aria-hidden="true"
class="googlesitekit-logo"
Expand Down Expand Up @@ -77,7 +79,9 @@ exports[`SetupUsingProxyWithSignIn should not render the Activate Analytics noti
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Fix common issues
</span>
</a>
Expand All @@ -96,7 +100,9 @@ exports[`SetupUsingProxyWithSignIn should not render the Activate Analytics noti
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Read help docs
</span>
</a>
Expand All @@ -115,7 +121,9 @@ exports[`SetupUsingProxyWithSignIn should not render the Activate Analytics noti
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Get support
</span>
</a>
Expand Down Expand Up @@ -286,7 +294,9 @@ exports[`SetupUsingProxyWithSignIn should not render the Activate Analytics noti
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Google Privacy Policy.
</span>
<span
Expand Down Expand Up @@ -346,7 +356,9 @@ exports[`SetupUsingProxyWithSignIn should render the setup page, including the A
class="googlesitekit-cta-link googlesitekit-header__logo-link"
href=""
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
<div
aria-hidden="true"
class="googlesitekit-logo"
Expand Down Expand Up @@ -404,7 +416,9 @@ exports[`SetupUsingProxyWithSignIn should render the setup page, including the A
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Fix common issues
</span>
</a>
Expand All @@ -423,7 +437,9 @@ exports[`SetupUsingProxyWithSignIn should render the setup page, including the A
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Read help docs
</span>
</a>
Expand All @@ -442,7 +458,9 @@ exports[`SetupUsingProxyWithSignIn should render the setup page, including the A
tabindex="-1"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Get support
</span>
</a>
Expand Down Expand Up @@ -667,7 +685,9 @@ exports[`SetupUsingProxyWithSignIn should render the setup page, including the A
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Google Privacy Policy.
</span>
<span
Expand Down
5 changes: 3 additions & 2 deletions assets/js/components/user-input/UserInputPreviewGroup.js
Original file line number Diff line number Diff line change
Expand Up @@ -193,10 +193,11 @@ export default function UserInputPreviewGroup( {
( !! currentlyEditingSlug && ! isEditing )
}
linkButton
trailingIcon={
<ChevronDownIcon width={ 20 } height={ 20 } />
}
>
{ __( 'Edit', 'google-site-kit' ) }

<ChevronDownIcon width={ 20 } height={ 20 } />
</Link>
</LoadingWrapper>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,9 @@ exports[`WPDashboardReportError should only render one error per module when the
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Get help
</span>
</a>
Expand Down Expand Up @@ -76,7 +78,9 @@ exports[`WPDashboardReportError should only render one error per module when the
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Get help
</span>
</a>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,9 @@ exports[`ConnectAdSenseCTATileWidget should render the Connect AdSense CTA tile
<button
class="googlesitekit-cta-link googlesitekit-cta-link--secondary"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Connect AdSense
</span>
</button>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,9 @@ exports[`EnhancedMeasurementSwitch should render correctly in the already enable
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down Expand Up @@ -81,7 +83,9 @@ exports[`EnhancedMeasurementSwitch should render correctly in the default state
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down Expand Up @@ -144,7 +148,9 @@ exports[`EnhancedMeasurementSwitch should render correctly in the disabled state
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down Expand Up @@ -198,7 +204,9 @@ exports[`EnhancedMeasurementSwitch should render correctly in the loading state
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,9 @@ exports[`SetupBanner should render correctly when the user does have the edit sc
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down Expand Up @@ -72,7 +74,9 @@ exports[`SetupBanner should render correctly when the user does have the edit sc
<button
class="googlesitekit-cta-link"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Maybe later
</span>
</button>
Expand Down Expand Up @@ -137,7 +141,9 @@ exports[`SetupBanner should render correctly when the user does not have the edi
rel="noopener noreferrer"
target="_blank"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Learn more
</span>
<span
Expand Down Expand Up @@ -165,7 +171,9 @@ exports[`SetupBanner should render correctly when the user does not have the edi
<button
class="googlesitekit-cta-link"
>
<span>
<span
class="googlesitekit-cta-link__contents"
>
Maybe later
</span>
</button>
Expand Down
Loading

0 comments on commit 8af3f7e

Please sign in to comment.