Skip to content

Commit

Permalink
merge develop CalderaWP#3204
Browse files Browse the repository at this point in the history
  • Loading branch information
Josh Pollock committed May 22, 2019
1 parent a1bae7f commit fd346d4
Show file tree
Hide file tree
Showing 19 changed files with 978 additions and 37 deletions.
77 changes: 45 additions & 32 deletions clients/admin/MainDashboard/DashboardPanels/ProDashboard.js
View file
Original file line number Diff line number Diff line change
@@ -1,36 +1,49 @@
import {TabPanel} from "@wordpress/components";
import {ProWhatIs} from "../../../components/ProSettings";

const onSelect = () => {};
export default function ProDashboard(){
return(
<TabPanel className="my-tab-panel"
activeClass="active-tab"
onSelect={ onSelect }
tabs={ [
{
name: 'pro',
title: 'Caldera Forms Pro',
className: 'pro-pro',
},
{
name: 'email',
title: 'Email Marketing Add-ons',
className: 'pro-email',
},
{
name: 'payment',
title: 'Payment Gateways',
className: 'pro-payment',
},
{
name: 'allAddOns',
title: 'All Add-ons ',
className: 'all-add-ons',
},
] }>
{
( tab ) => <p>{ tab.title }</p>
}
</TabPanel>
const onSelect = () => {
};
import {Addons} from "../components/AddOns/Addons";
import {Fragment} from "react";

export default function ProDashboard() {
return (
<Fragment>
<ProWhatIs />

<TabPanel className="cf-pro-dashboard-panels"
activeClass="active-tab"
onSelect={onSelect}
tabs={[
{
name: 'pro',
title: 'Caldera Forms Pro',
className: 'pro-pro',
},
{
name: 'email',
title: 'Email Marketing & CRMs',
className: 'pro-email',
},
{
name: 'payment',
title: 'Payment Gateways',
className: 'pro-payment',
},
{
name: 'tools',
title: 'Tools',
className: 'tools',
},
]}>
{
(tab) => (
<Addons
show={tab.name}
/>
)
}
</TabPanel>
</Fragment>
);
}
2 changes: 1 addition & 1 deletion clients/admin/MainDashboard/DashboardPanels/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export default class DashboardPanels extends Component {
</PanelRow>
</PanelBody>
<PanelBody
title="Go Pro"
title="Go Pro!"
icon="thumbs-up"
initialOpen={true}
>
Expand Down
189 changes: 189 additions & 0 deletions clients/admin/MainDashboard/components/Addons/Addons.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,189 @@
import {Component} from '@wordpress/element';
import axios from "axios";
import {cacheAdapterEnhancer} from "axios-extensions";
import {ProEnterApp} from "../../../../components/ProSettings";
import {ProFreeTrial} from "../../../../components/ProSettings";
import url from "../../../../components/functions/url";
export class Addons extends Component {


constructor(props) {
super(props);
this.state = {
paymentAddonsLoaded: false,
emailAddonsLoaded: false,
paymentAddons: {},
emailAddons: {},
toolsAddonsLoaded: false,
toolsAddons: {}
};
}

componentDidMount() {
const stripTrailingSlash = (str) => {
return str.endsWith('/') ?
str.slice(0, -1) :
str;
};

const cacheOptions = { enabledByDefault: true };
const {
paymentAddonsLoaded,
emailAddonsLoaded,
toolsAddonsLoaded,
toolsAddons
} = this.state;
const {apiRoot} = this.props;
if (!paymentAddonsLoaded) {
axios({
method: 'get',
url: `${stripTrailingSlash(apiRoot)}/calderawp_api/v2/products/cf-addons?category=payment`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, cacheOptions )
}).then((response) => {
this.setState({
paymentAddons: response.data,
paymentAddonsLoaded: true
})

});
}

if (!emailAddonsLoaded) {
axios({
method: 'get',
url: `${stripTrailingSlash(apiRoot)}/calderawp_api/v2/products/cf-addons?category=email`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, cacheOptions )
}).then((response) => {
this.setState({
emailAddons: response.data,
emailAddonsLoaded: true
})

});
}if (!toolsAddonsLoaded) {
axios({
method: 'get',
url: `${stripTrailingSlash(apiRoot)}/calderawp_api/v2/products/cf-addons?category=tools`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, cacheOptions )
}).then((response) => {
const good = [5070,43154,56332,2465,1940,55330,1950,1934,37221,82236,1223];
const toolsAddons = [];
Object.values(response.data).forEach(addon => {
if( good.includes(addon.id)){
toolsAddons.push(addon);
}
});
this.setState({
toolsAddons,
toolsAddonsLoaded: true
})

});
}


}


render() {
const {proConnected} = this.props;
const {
paymentAddonsLoaded,
emailAddonsLoaded,
paymentAddons,
emailAddons,
toolsAddonsLoaded,
toolsAddons
} = this.state;

function Loading() {
return <div>Loading</div>
}

function AddonPanel({addon,category}) {
const {image_src,tagline,link,name} = addon;
return (

<div className="addon-panel">
<img src={image_src}
style={{
width: '100%',
'vertical-align': 'top'
}}

/>
<h2>{name}</h2>
<div
style={{
margin: '0px',
'padding': '6px 7px'
}}
>
{tagline}
</div>

<div class="panel-footer">

<a class="button" href={url({source: 'cf-admin-app',categories:category}, link)} target="_blank" rel="nofollow" style={{
width: '100%'
}}>
Learn More
</a>
</div>
</div>

)
}

function AddonsPanel({addons,category}) {
return (

<div id="cf-addons">
{
addons.map(addon => {
return (<AddonPanel addon={addon} category={category}/>)
})
}
</div>
);

}

const {show} = this.props;
switch (show) {
case 'email':
if (emailAddonsLoaded) {
return <AddonsPanel addons={Object.values(emailAddons)} category={'email'}/>
} else {
return <Loading/>
}
case 'payment':
if (paymentAddonsLoaded) {
return <AddonsPanel addons={Object.values(paymentAddons)} category={'paymen'}/>
} else {
return <Loading/>
}
case 'tools':
if (toolsAddonsLoaded) {
return <AddonsPanel addons={Object.values(toolsAddons)} category={'tools'}/>
} else {
return <Loading/>
}

case 'pro':
default:
if( proConnected ){
return <ProEnterApp/>
}
return <ProFreeTrial />

}
}

}

Addons.defaultProps = {
apiRoot: 'https://calderaforms.com/wp-json',
show: 'email',
proConnected: false
};
3 changes: 0 additions & 3 deletions clients/admin/MainDashboard/components/Translate/Translate.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ export default class Translate extends Component {
url: `${stripTrailingSlash(weglotApiRoot)}/wp/v2/posts/1021`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, true)
}).then((response) => {
console.log(response);
this.setState({
post1: response.data,
post1Loaded: true
Expand All @@ -58,7 +57,6 @@ export default class Translate extends Component {
url: `${stripTrailingSlash(apiRoot)}/wp/v2/posts/133132`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, true)
}).then((response) => {
console.log(response);
this.setState({
post2: response.data,
post2Loaded: true
Expand All @@ -74,7 +72,6 @@ export default class Translate extends Component {
url: `${stripTrailingSlash(weglotApiRoot)}/wp/v2/posts/1297`,
adapter: cacheAdapterEnhancer(axios.defaults.adapter, true)
}).then((response) => {
console.log(response);
this.setState({
post3: response.data,
post3Loaded: true
Expand Down
28 changes: 28 additions & 0 deletions clients/components/ProSettings/ProEnterApp/ProEnterApp.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import React from 'react';
import classNames from 'classnames'

/**
* Create the global form settings UI
* @param {Object} props
* @return {*}
* @constructor
*/
export const ProEnterApp = (props) => {
return(
<div
className={classNames(props.className,ProEnterApp.classNames.wrapper)}
>
ProEnterApp
</div>
)
};



/**
* Class names used in the GlobalForms settings component
* @type {{wrapper: string}}
*/
ProEnterApp.classNames = {
wrapper: 'caldera-forms-global-form-settings'
};
27 changes: 27 additions & 0 deletions clients/components/ProSettings/ProEnterApp/ProEnterApp.test.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import renderer from 'react-test-renderer';
import React from 'react';
import { shallow } from 'enzyme/build';
import Enzyme from 'enzyme/build';
import Adapter from 'enzyme-adapter-react-16/build';
import {ProEnterApp} from "./ProEnterApp";

Enzyme.configure({ adapter: new Adapter() });

describe( 'ProEnterApp component', () => {
it( 'Matches snapshot with minimal props', () => {
expect(
renderer.create(
<ProEnterApp/>
).toJSON()
).toMatchSnapshot()
});

it( 'Is wrapped in the right class', () => {
expect(
shallow(
<ProEnterApp/>
).find( '.' + ProEnterApp.classNames.wrapper )
.length
).toEqual(1)
});
});
9 changes: 9 additions & 0 deletions clients/components/ProSettings/ProEnterApp/__snapshots__/ProEnterApp.test.js.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`ProEnterApp component Matches snapshot with minimal props 1`] = `
<div
className="caldera-forms-global-form-settings"
>
ProEnterApp
</div>
`;
Loading

0 comments on commit fd346d4

Please sign in to comment.