Skip to content
Merged
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
6 changes: 5 additions & 1 deletion assets/src/Components/Main.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,8 @@ import ImportModal from './ImportModal';
import DemoSiteTemplatesImport from './CloudLibrary/DemoSiteTemplatesImport';
import Header from './Header';
import OnboardingContent from './OnboardingContent';
import Settings from "./Settings/Settings";
import Settings from './Settings/Settings';
import NewTCNotice from './NewTCNotice';

const Onboarding = ( {
getSites,
Expand All @@ -28,6 +29,9 @@ const Onboarding = ( {
<Header />
<div className="ob-body">
<div className="content-container">

{['library', 'settings'].includes(currentTab) && <NewTCNotice/>}

{ migration && <Migration data={ migration } /> }

{ 'starterSites' === currentTab &&
Expand Down
55 changes: 55 additions & 0 deletions assets/src/Components/NewTCNotice.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import {__} from '@wordpress/i18n';
import {Button} from '@wordpress/components';
import {close} from '@wordpress/icons';
import {useState} from '@wordpress/element';
import {ajaxAction} from '../utils/rest';

export default function () {
const [isVisible, setIsVisible] = useState(true);

const {
show,
ajaxURL,
nonce
} = window.tiobDash.newTCNotice;

const dismissNotice = () => {
ajaxAction(
ajaxURL,
'dismiss_new_tc_notice',
nonce
).then( (r) => {
console.log(r);
setIsVisible(false);
} ).catch(e => {
console.error(e);
} );
};

if (!show || ! isVisible) {
return null;
}

return (
<div className="tiob-new-tc-notice">
<div>
<p>
{__('We\'ve launched a dedicated Templates Cloud plugin that offers advanced permission controls and additional features. Try it out from your Themeisle account.', 'templates-patterns-collection')}
</p>

<p className="description">
{__('If you already have templates saved in the cloud, you can still use them in this plugin.', 'templates-patterns-collection')}
</p>
</div>

<Button
size="compact"
className="dismiss"
icon={close}
iconSize={20}
label={__('Dismiss', 'templates-patterns-collection')}
onClick={dismissNotice}
/>
</div>
);
}
27 changes: 27 additions & 0 deletions assets/src/scss/_new-tc-notice.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.tiob-new-tc-notice {
padding: 10px 20px;
background: #fff;
border: 1px solid #e5e5e5;
display: flex;
margin-top: 20px;
width: 100%;
gap: 20px;
box-sizing: border-box;
align-items: center;
border-left: 5px solid var(--wp-admin-theme-color, #3858e9);

p {
margin: 0 0 10px;
font-size: 14px;
}

.description {
font-size: 12px;
margin: 0;
}

.dismiss {
flex-shrink: 0;
margin-left: auto;
}
}
1 change: 1 addition & 0 deletions assets/src/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,5 +19,6 @@
@import "scss/license";
@import "scss/feedback";
@import "scss/settings";
@import "scss/new-tc-notice";

@import "scss/media-queries";
13 changes: 4 additions & 9 deletions beaver/src/components/header.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,11 @@ const Header = ( { closeModal, getOrder, getSearchQuery } ) => {
const { setFetching, updateCurrentTab } = useDispatch( 'tpc/beaver' );

const TABS = {
templates: window.tiTpc.library.tabs.templates,
library: window.tiTpc.library.tabs.library,
// Removed during PRF.
// templates: window.tiTpc.library.tabs.templates,
};

if ( parseInt( window.tiTpc.tier ) === 3 ) {
TABS.library = window.tiTpc.library.tabs.library;
}

const isFetching = useSelect( ( select ) =>
select( 'tpc/beaver' ).isFetching()
);
Expand Down Expand Up @@ -85,10 +83,7 @@ const Header = ( { closeModal, getOrder, getSearchQuery } ) => {
/>
) }

{ window.tiTpc.postTypes.includes(
window.tiTpc.postType
) &&
parseInt( window.tiTpc.tier ) === 3 && (
{ window.tiTpc.postTypes.includes(window.tiTpc.postType) && (
Copy link
Contributor

Choose a reason for hiding this comment

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

One small suggestion here: you can declare this as a constant outside the component with a name like isPostTypeCompatible to highlight the compatibility check.

<Button
label={ window.tiTpc.library.actions.save }
icon={ cloudUpload }
Expand Down
5 changes: 1 addition & 4 deletions beaver/src/data/store/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,7 @@ import { registerStore } from '@wordpress/data';
const DEFAULT_STATE = {
isFetching: true,
isPreview: false,
tab:
parseInt( window.tiTpc ? window.tiTpc.tier : 0 ) === 3
? 'library'
: 'templates',
tab: 'library',
templates: {
items: [],
currentPage: 0,
Expand Down
114 changes: 56 additions & 58 deletions beaver/src/export.js
Original file line number Diff line number Diff line change
@@ -1,63 +1,61 @@
/* global FLBuilder */

if ( parseInt( window.tiTpc.tier ) === 3 ) {
const contextMenu = document.getElementById( 'tmpl-fl-row-overlay' );

const tpcExport = ( e ) => {
const row = e.closest( '.fl-row' );
const node = row.dataset.node;

const message = `<div class="tpc-template-cloud-export-modal">
<h1>${ window.tiTpc.exporter.modalLabel }</h1>
<label for="tpc-${ node }">${ window.tiTpc.exporter.textLabel }</label>
<input id="tpc-${ node }" type="text" placeholder="${ window.tiTpc.exporter.textPlaceholder }" />
</div>`;

FLBuilder.confirm( {
message,
ok: () => {
const input = document.getElementById( `tpc-${ node }` );
const title = input.value || 'Template';
setTimeout( function () {
FLBuilder.showAjaxLoader();
FLBuilder.ajax(
{
action: 'ti_export_template',
node,
title,
},
( res ) => {
if ( undefined !== res.success && ! res.success ) {
FLBuilder.alert(
`<h1>${ window.tiTpc.exporter.exportFailed }</h1> ${ res.data }`
);
}

FLBuilder.hideAjaxLoader();
const contextMenu = document.getElementById( 'tmpl-fl-row-overlay' );

const tpcExport = ( e ) => {
const row = e.closest( '.fl-row' );
const node = row.dataset.node;

const message = `<div class="tpc-template-cloud-export-modal">
<h1>${ window.tiTpc.exporter.modalLabel }</h1>
<label for="tpc-${ node }">${ window.tiTpc.exporter.textLabel }</label>
<input id="tpc-${ node }" type="text" placeholder="${ window.tiTpc.exporter.textPlaceholder }" />
</div>`;

FLBuilder.confirm( {
message,
ok: () => {
const input = document.getElementById( `tpc-${ node }` );
const title = input.value || 'Template';
Copy link
Contributor

Choose a reason for hiding this comment

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

Can we also have this default value as a translatable string via window.tiTpc.exporter?

setTimeout( function () {
FLBuilder.showAjaxLoader();
FLBuilder.ajax(
{
action: 'ti_export_template',
node,
title,
},
( res ) => {
if ( undefined !== res.success && ! res.success ) {
FLBuilder.alert(
`<h1>${ window.tiTpc.exporter.exportFailed }</h1> ${ res.data }`
);
}
);
}, 1000 );
},
strings: {
ok: window.tiTpc.exporter.buttonLabel,
cancel: window.tiTpc.exporter.cancelLabel,
},
} );
};

window.tiTpc.tpcExport = tpcExport;

if ( contextMenu ) {
const text = contextMenu.textContent;
contextMenu.textContent = text.replace(
// eslint-disable-next-line prettier/prettier
'<li><a class="fl-block-row-reset" href="javascript:void(0);">Reset Row Width</a></li>',
// eslint-disable-next-line prettier/prettier
'<li><a class="fl-block-row-reset" href="javascript:void(0);">Reset Row Width</a></li><li><a class="fl-block-row-tpc-export" onclick="window.tiTpc.tpcExport(this)" href="javascript:void(0);">Save to Templates Cloud</a></li>'
);
}

FLBuilder.addHook( 'tiTpcExport', () => {
window.tiTpc.initModalExport();

FLBuilder.hideAjaxLoader();
}
);
}, 1000 );
},
strings: {
ok: window.tiTpc.exporter.buttonLabel,
cancel: window.tiTpc.exporter.cancelLabel,
},
} );
};

window.tiTpc.tpcExport = tpcExport;

if ( contextMenu ) {
const text = contextMenu.textContent;
contextMenu.textContent = text.replace(
// eslint-disable-next-line prettier/prettier
'<li><a class="fl-block-row-reset" href="javascript:void(0);">Reset Row Width</a></li>',
// eslint-disable-next-line prettier/prettier
'<li><a class="fl-block-row-reset" href="javascript:void(0);">Reset Row Width</a></li><li><a class="fl-block-row-tpc-export" onclick="window.tiTpc.tpcExport(this)" href="javascript:void(0);">Save to Templates Cloud</a></li>'
);
}

FLBuilder.addHook( 'tiTpcExport', () => {
window.tiTpc.initModalExport();
} );
9 changes: 3 additions & 6 deletions editor/src/components/header.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,11 @@ const Header = ( { closeModal, getOrder, getSearchQuery } ) => {
const { setFetching, updateCurrentTab } = useDispatch( 'tpc/block-editor' );

const TABS = {
templates: __( 'Page Templates', 'templates-patterns-collection' ),
// patterns: __( 'Patterns' ),
library : __( 'My Library', 'templates-patterns-collection' )
// Removed since PRF.
// templates: __( 'Page Templates', 'templates-patterns-collection' ),
};

if ( parseInt( tiTpc.tier ) === 3 ) {
TABS.library = __( 'My Library', 'templates-patterns-collection' );
}

const isFetching = useSelect( ( select ) =>
select( 'tpc/block-editor' ).isFetching()
);
Expand Down
2 changes: 1 addition & 1 deletion editor/src/data/block-editor/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { registerStore } from '@wordpress/data';
const DEFAULT_STATE = {
isFetching: true,
isPreview: false,
tab: parseInt( window.tiTpc.tier ) === 3 ? 'library' : 'templates',
tab: 'library',
templates: [],
patterns: [],
library: {
Expand Down
10 changes: 4 additions & 6 deletions editor/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,7 @@ if ( ! tiTpc.isSiteEditor ) {
} );
}

if ( parseInt( tiTpc.tier ) === 3 ) {
registerPlugin( 'ti-tpc', {
render: tiTpc.isSiteEditor ? SiteEditorExporter : Exporter,
icon,
} );
}
registerPlugin( 'ti-tpc', {
render: tiTpc.isSiteEditor ? SiteEditorExporter : Exporter,
icon,
} );
23 changes: 4 additions & 19 deletions elementor/src/components/header.js
Original file line number Diff line number Diff line change
Expand Up @@ -102,27 +102,13 @@ const Header = ( {
className={ classnames(
'ti-tpc-template-library-menu-item',
{
'is-active': 'templates' === currentTab,
'is-active': 'library' === currentTab,
}
) }
onClick={ () => updateCurrentTab( 'templates' ) }
onClick={ () => updateCurrentTab( 'library' ) }
>
{ window.tiTpc.library.tabs.templates }
{ window.tiTpc.library.tabs.library }
</Button>

{ parseInt( window.tiTpc.tier ) === 3 && (
<Button
className={ classnames(
'ti-tpc-template-library-menu-item',
{
'is-active': 'library' === currentTab,
}
) }
onClick={ () => updateCurrentTab( 'library' ) }
>
{ window.tiTpc.library.tabs.library }
</Button>
) }
</div>
) }

Expand Down Expand Up @@ -181,8 +167,7 @@ const Header = ( {

{ [ 'wp-post', 'wp-page' ].includes(
elementor.config.document.type
) &&
parseInt( window.tiTpc.tier ) === 3 && (
) && (
<Button
className="ti-tpc-templates-modal__header__item"
onClick={ () =>
Expand Down
2 changes: 1 addition & 1 deletion elementor/src/data/store/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { registerStore } from '@wordpress/data';
const DEFAULT_STATE = {
isFetching: true,
isPreview: false,
tab: parseInt( window.tiTpc.tier ) === 3 ? 'library' : 'templates',
tab: 'library',
templates: [],
library: {
items: [],
Expand Down
4 changes: 0 additions & 4 deletions elementor/src/data/templates-cloud/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,10 +65,6 @@ export const fetchTemplates = async ( additionalParams = {} ) => {
};

export const fetchLibrary = async ( additionalParams = {} ) => {
if ( parseInt( window.tiTpc.tier ) !== 3 ) {
return;
}

const { meta, ...filteredParams } = tiTpc.params;
const { isScroll, ...filteredAdditionalParams } = additionalParams;
const params = {
Expand Down
Loading
Loading