Skip to content

Commit

Permalink
Lint Fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
@arunshenoy99
arunshenoy99 committed Dec 7, 2023
1 parent 2ff0e7d commit e0bf252
Show file tree
Hide file tree
Showing 6 changed files with 165 additions and 117 deletions.
62 changes: 51 additions & 11 deletions src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/Sidebar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,22 +17,20 @@ import {
} from '../../../../../constants';
import TabPanelHover from '../../../TabPanelHover';

import { isEmpty } from 'lodash';
// eslint-disable-next-line import/no-extraneous-dependencies
import { cloneDeep, isEmpty } from 'lodash';
import { getHomepages } from '../../../../data/sitegen/homepages/homepages';
import { getColorPalettes } from '../../../../data/sitegen/sitemeta/siteMeta';
import { getGlobalStyles } from '../../../../utils/api/themes';
import { LivePreview } from '../../../LivePreview';

import { cloneDeep } from 'lodash';

const SitegenEditorPatternsSidebar = () => {
const [ homepages, setHomepages ] = useState();
const [ activeHomepage, setActiveHomepage ] = useState();
const [ globalStyles, setGlobalStyles ] = useState( [] );
const [ activeTab, setActiveTab ] = useState();
const { currentStep, currentData } = useSelect( ( select ) => {
const { currentData } = useSelect( ( select ) => {
return {
currentStep: select( nfdOnboardingStore ).getCurrentStep(),
currentData:
select( nfdOnboardingStore ).getCurrentOnboardingData(),
};
Expand Down Expand Up @@ -95,8 +93,8 @@ const SitegenEditorPatternsSidebar = () => {
} else {
homepagesObject = currentData.sitegen.homepages.data;
}
const globalStyles = await getGlobalStyles();
setGlobalStyles( globalStyles.body );
const globalStylesResponse = await getGlobalStyles();
setGlobalStyles( globalStylesResponse.body );
setHomepages( homepagesObject );
setActiveHomepage( currentData.sitegen.homepages.active );
};
Expand All @@ -110,7 +108,7 @@ const SitegenEditorPatternsSidebar = () => {
name: 'All Versions',
title: (
<div className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab">
<p>All Versions</p>
<p>{ __( 'All Versions', 'wp-module-onboarding' ) }</p>
</div>
),
content:
Expand All @@ -126,6 +124,10 @@ const SitegenEditorPatternsSidebar = () => {
<div
className={ `nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container` }
onClick={ () => handlePreview( data.slug ) }
role="button"
tabIndex={ 0 }
onKeyDown={ () => handlePreview( data.slug ) }
key={ data.slug }
>
<LivePreview
styling={
Expand All @@ -144,9 +146,14 @@ const SitegenEditorPatternsSidebar = () => {
data.favorite &&
'nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container__context__icon__fill'
}` }
role="button"
tabIndex={ 0 }
onClick={ () =>
handleFavorite( data.slug )
}
onKeyDown={ () =>
handleFavorite( data.slug )
}
></div>
<p className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container__context__title">
{ data.title }
Expand Down Expand Up @@ -178,7 +185,12 @@ const SitegenEditorPatternsSidebar = () => {
name: 'All Versions',
title: (
<div className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab">
<p>All Versions</p>
<p>
{ __(
'All Versions',
'wp-module-onboarding'
) }
</p>
</div>
),
content:
Expand All @@ -198,6 +210,14 @@ const SitegenEditorPatternsSidebar = () => {
return (
<div
className={ `nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container` }
key={ data.slug }
role="button"
tabIndex={ 0 }
onKeyDown={ () =>
handlePreview(
data.slug
)
}
onClick={ () =>
handlePreview(
data.slug
Expand Down Expand Up @@ -230,6 +250,15 @@ const SitegenEditorPatternsSidebar = () => {
data.favorite &&
'nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container__context__icon__fill'
}` }
role="button"
tabIndex={
0
}
onKeyDown={ () =>
handleFavorite(
data.slug
)
}
onClick={ () =>
handleFavorite(
data.slug
Expand All @@ -253,7 +282,10 @@ const SitegenEditorPatternsSidebar = () => {
<div className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__favorites-tab">
<div className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__favorites-tab__icon"></div>
<p className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__favorites-tab__text">
Favorites
{ __(
'Favorites',
'wp-module-onboarding'
) }
</p>
<Button
className="nfd-onboarding-sidebar--sitegen-editor-patterns__header__icon"
Expand All @@ -271,7 +303,7 @@ const SitegenEditorPatternsSidebar = () => {
const data =
homepages[ homepage ];
if ( ! data.favorite ) {
return;
return false;
}
const newPreviewSettings =
cloneDeep(
Expand All @@ -281,7 +313,15 @@ const SitegenEditorPatternsSidebar = () => {
data.color.palette;
return (
<div
key={ data.slug }
className={ `nfd-onboarding-sidebar--sitegen-editor-patterns__header__tab-panel__versions-tab__preview-container` }
role="button"
tabIndex={ 0 }
onKeyDown={ () =>
handlePreview(
data.slug
)
}
onClick={ () =>
handlePreview(
data.slug
Expand Down
198 changes: 101 additions & 97 deletions src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/stylesheet.scss
View file
Original file line number Diff line number Diff line change
@@ -1,99 +1,103 @@
.nfd-onboarding-sidebar {
&--sitegen-editor-patterns {
.components-panel__header {
padding: 0px;
}
padding: 0 !important;
border: none;
overflow-y: auto;
width: 100%;
height: 100%;

background-color: #fff;

&__header {

&__icon {
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 20px;
}

&__tab-panel {
font-size: 13px;
width: 300px;
&__favorites-tab {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;

&__icon {
background-image: var(--sitegen-favorite-filled);
width: 20px;
height: 21px;

margin-right: 8px;
}
}

&__versions-tab {
font-size: 13px;
&__preview-container {
height: 175px;
margin: 24px;

.live-preview {

&__container {

&-custom {
width: 100%;
overflow: hidden;
height: 140px;
border-radius: 8px;
cursor: pointer;
border: 1px solid #cccccc;

&__highlighted {
width: 100%;
overflow: hidden;
height: 140px;
border-radius: 8px;
cursor: pointer;
border: 3px solid #0060F0;
}
}
}
}

&__context {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
color: #000;

&__icon {
background-image: var(--sitegen-favorite);
height: 21px;
width: 20px;
margin-right: 12px;
cursor: pointer;

&__fill {
background-image: var(--sitegen-favorite-filled);
}
}
}
}
}

}
}
}

&--sitegen-editor-patterns {

.components-panel__header {
padding: 0;
}
padding: 0 !important;
border: none;
overflow-y: auto;
width: 100%;
height: 100%;

background-color: #fff;

&__header {

&__icon {
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 20px;
}

&__tab-panel {
font-size: 13px;
width: 300px;

&__favorites-tab {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;

&__icon {
background-image: var(--sitegen-favorite-filled);
width: 20px;
height: 21px;

margin-right: 8px;
}
}

&__versions-tab {
font-size: 13px;

&__preview-container {
height: 175px;
margin: 24px;

.live-preview {

&__container {

&-custom {
width: 100%;
overflow: hidden;
height: 140px;
border-radius: 8px;
cursor: pointer;
border: 1px solid #ccc;

&__highlighted {
width: 100%;
overflow: hidden;
height: 140px;
border-radius: 8px;
cursor: pointer;
border: 3px solid #0060f0;
}
}
}
}

&__context {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
color: #000;

&__icon {
background-image: var(--sitegen-favorite);
height: 21px;
width: 20px;
margin-right: 12px;
cursor: pointer;

&__fill {
background-image: var(--sitegen-favorite-filled);
}
}
}
}
}

}
}
}
}

3 changes: 2 additions & 1 deletion src/OnboardingSPA/components/TabPanelHover/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
/**
* External dependencies
*/
import classnames from 'classnames';

// eslint-disable-next-line import/no-extraneous-dependencies
import { partial, find } from 'lodash';

/**
Expand Down
10 changes: 8 additions & 2 deletions src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,12 +123,18 @@ const StepSiteGenEditorHeader = () => {
'wp-module-onboarding'
) }
</p>
<p className="nfd-onboarding-header--sitegen__editor__center__dropdown__content__view-all">
<div
className="nfd-onboarding-header--sitegen__editor__center__dropdown__content__view-all"
onClick={ handleViewAll }
role="button"
tabIndex={ 0 }
onKeyDown={ handleViewAll }
>
{ __(
'View All',
'wp-module-onboarding'
) }
</p>
</div>
</div>
) }
/>
Expand Down
5 changes: 1 addition & 4 deletions src/OnboardingSPA/steps/SiteGen/Editor/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,7 @@ import { useEffect, useState } from '@wordpress/element';

import { useDispatch, useSelect } from '@wordpress/data';
import { store as nfdOnboardingStore } from '../../../store';
import {
HEADER_SITEGEN,
SIDEBAR_SITEGEN_EDITOR_PATTERNS,
} from '../../../../constants';
import { HEADER_SITEGEN } from '../../../../constants';

import { LivePreview } from '../../../components/LivePreview';
import { getGlobalStyles } from '../../../utils/api/themes';
Expand Down
Loading

0 comments on commit e0bf252

Please sign in to comment.