plugin updates
This commit is contained in:
Tony Volpe
@@ -1,122 +0,0 @@
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import ElementorBanner from '../Common/ElementorBanner';
|
||||
import UISpinner from '../../shared/UIComponents/UISpinner';
|
||||
import ElementorMeetingWarning from './ElementorMeetingWarning';
|
||||
import useMeetings, {
|
||||
useSelectedMeetingCalendar,
|
||||
} from '../../shared/Meeting/hooks/useMeetings';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import Raven from 'raven-js';
|
||||
import {
|
||||
BackgroudAppContext,
|
||||
useBackgroundAppContext,
|
||||
} from '../../iframe/useBackgroundApp';
|
||||
import { refreshToken } from '../../constants/leadinConfig';
|
||||
import { getOrCreateBackgroundApp } from '../../utils/backgroundAppUtils';
|
||||
|
||||
interface IElementorMeetingSelectProps {
|
||||
url: string;
|
||||
setAttributes: Function;
|
||||
}
|
||||
|
||||
function ElementorMeetingSelect({
|
||||
url,
|
||||
setAttributes,
|
||||
}: IElementorMeetingSelectProps) {
|
||||
const {
|
||||
mappedMeetings: meetings,
|
||||
loading,
|
||||
error,
|
||||
reload,
|
||||
connectCalendar,
|
||||
} = useMeetings();
|
||||
const selectedMeetingCalendar = useSelectedMeetingCalendar(url);
|
||||
const [localUrl, setLocalUrl] = useState(url);
|
||||
|
||||
const handleConnectCalendar = () => {
|
||||
return connectCalendar()
|
||||
.then(() => {
|
||||
reload();
|
||||
})
|
||||
.catch(error => {
|
||||
Raven.captureMessage('Unable to connect calendar', {
|
||||
extra: { error },
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
{loading ? (
|
||||
<div>
|
||||
<UISpinner />
|
||||
</div>
|
||||
) : error ? (
|
||||
<ElementorBanner type="danger">
|
||||
{__(
|
||||
'Please refresh your meetings or try again in a few minutes',
|
||||
'leadin'
|
||||
)}
|
||||
</ElementorBanner>
|
||||
) : (
|
||||
<Fragment>
|
||||
{selectedMeetingCalendar && (
|
||||
<ElementorMeetingWarning
|
||||
status={selectedMeetingCalendar}
|
||||
onConnectCalendar={connectCalendar}
|
||||
/>
|
||||
)}
|
||||
{meetings.length > 1 && (
|
||||
<select
|
||||
value={localUrl}
|
||||
onChange={event => {
|
||||
const newUrl = event.target.value;
|
||||
setLocalUrl(newUrl);
|
||||
setAttributes({
|
||||
url: newUrl,
|
||||
});
|
||||
}}
|
||||
>
|
||||
<option value="" disabled={true} selected={true}>
|
||||
{__('Select a meeting', 'leadin')}
|
||||
</option>
|
||||
{meetings.map(item => (
|
||||
<option key={item.value} value={item.value}>
|
||||
{item.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
)}
|
||||
</Fragment>
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
function ElementorMeetingSelectWrapper(props: IElementorMeetingSelectProps) {
|
||||
const isBackgroundAppReady = useBackgroundAppContext();
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
{!isBackgroundAppReady ? (
|
||||
<div>
|
||||
<UISpinner />
|
||||
</div>
|
||||
) : (
|
||||
<ElementorMeetingSelect {...props} />
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ElementorMeetingsSelectContainer(
|
||||
props: IElementorMeetingSelectProps
|
||||
) {
|
||||
return (
|
||||
<BackgroudAppContext.Provider
|
||||
value={refreshToken && getOrCreateBackgroundApp(refreshToken)}
|
||||
>
|
||||
<ElementorMeetingSelectWrapper {...props} />
|
||||
</BackgroudAppContext.Provider>
|
||||
);
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import { CURRENT_USER_CALENDAR_MISSING } from '../../shared/Meeting/constants';
|
||||
import ElementorButton from '../Common/ElementorButton';
|
||||
import ElementorBanner from '../Common/ElementorBanner';
|
||||
import { styled } from '@linaria/react';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
const Container = styled.div`
|
||||
padding-bottom: 8px;
|
||||
`;
|
||||
|
||||
interface IMeetingWarningPros {
|
||||
onConnectCalendar: React.MouseEventHandler<HTMLButtonElement>;
|
||||
status: string;
|
||||
}
|
||||
|
||||
export default function MeetingWarning({
|
||||
onConnectCalendar,
|
||||
status,
|
||||
}: IMeetingWarningPros) {
|
||||
const isMeetingOwner = status === CURRENT_USER_CALENDAR_MISSING;
|
||||
const titleText = isMeetingOwner
|
||||
? __('Your calendar is not connected', 'leadin')
|
||||
: __('Calendar is not connected', 'leadin');
|
||||
const titleMessage = isMeetingOwner
|
||||
? __(
|
||||
'Please connect your calendar to activate your scheduling pages',
|
||||
'leadin'
|
||||
)
|
||||
: __(
|
||||
'Make sure that everybody in this meeting has connected their calendar from the Meetings page in HubSpot',
|
||||
'leadin'
|
||||
);
|
||||
return (
|
||||
<Fragment>
|
||||
<Container>
|
||||
<ElementorBanner type="warning">
|
||||
<b>{titleText}</b>
|
||||
<br />
|
||||
{titleMessage}
|
||||
</ElementorBanner>
|
||||
</Container>
|
||||
{isMeetingOwner && (
|
||||
<ElementorButton
|
||||
id="meetings-connect-calendar"
|
||||
onClick={onConnectCalendar}
|
||||
>
|
||||
{__('Connect calendar', 'leadin')}
|
||||
</ElementorButton>
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
@@ -1,31 +0,0 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import { connectionStatus } from '../../constants/leadinConfig';
|
||||
import ConnectPluginBanner from '../Common/ConnectPluginBanner';
|
||||
import ElementorMeetingSelect from './ElementorMeetingSelect';
|
||||
import { IMeetingAttributes } from './registerMeetingWidget';
|
||||
|
||||
const ConnectionStatus = {
|
||||
Connected: 'Connected',
|
||||
NotConnected: 'NotConnected',
|
||||
};
|
||||
|
||||
export default function MeetingControlController(
|
||||
attributes: IMeetingAttributes,
|
||||
setValue: Function
|
||||
) {
|
||||
return () => {
|
||||
const render = () => {
|
||||
if (connectionStatus === ConnectionStatus.Connected) {
|
||||
return (
|
||||
<ElementorMeetingSelect
|
||||
url={attributes.url}
|
||||
setAttributes={setValue}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return <ConnectPluginBanner />;
|
||||
}
|
||||
};
|
||||
return <Fragment>{render()}</Fragment>;
|
||||
};
|
||||
}
|
||||
@@ -1,34 +0,0 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import { connectionStatus } from '../../constants/leadinConfig';
|
||||
import ErrorHandler from '../../shared/Common/ErrorHandler';
|
||||
import MeetingsEdit from '../../shared/Meeting/MeetingEdit';
|
||||
import { IMeetingAttributes } from './registerMeetingWidget';
|
||||
|
||||
const ConnectionStatus = {
|
||||
Connected: 'Connected',
|
||||
NotConnected: 'NotConnected',
|
||||
};
|
||||
|
||||
export default function MeetingWidgetController(
|
||||
attributes: IMeetingAttributes,
|
||||
setValue: Function
|
||||
) {
|
||||
return () => {
|
||||
const render = () => {
|
||||
if (connectionStatus === ConnectionStatus.Connected) {
|
||||
return (
|
||||
<MeetingsEdit
|
||||
attributes={attributes}
|
||||
isSelected={true}
|
||||
setAttributes={setValue}
|
||||
preview={false}
|
||||
origin="elementor"
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return <ErrorHandler status={401} />;
|
||||
}
|
||||
};
|
||||
return <Fragment>{render()}</Fragment>;
|
||||
};
|
||||
}
|
||||
@@ -1,42 +0,0 @@
|
||||
import ReactDOM from 'react-dom';
|
||||
import MeetingControlController from './MeetingControlController';
|
||||
import MeetingWidgetController from './MeetingWidgetController';
|
||||
|
||||
export interface IMeetingAttributes {
|
||||
url: string;
|
||||
}
|
||||
|
||||
export default class registerMeetingsWidget {
|
||||
widgetContainer: Element;
|
||||
controlContainer: Element;
|
||||
setValue: Function;
|
||||
attributes: IMeetingAttributes;
|
||||
|
||||
constructor(controlContainer: any, widgetContainer: any, setValue: Function) {
|
||||
const attributes = widgetContainer.dataset.attributes
|
||||
? JSON.parse(widgetContainer.dataset.attributes)
|
||||
: {};
|
||||
|
||||
this.widgetContainer = widgetContainer;
|
||||
this.controlContainer = controlContainer;
|
||||
this.setValue = setValue;
|
||||
this.attributes = attributes;
|
||||
}
|
||||
|
||||
render() {
|
||||
ReactDOM.render(
|
||||
MeetingWidgetController(this.attributes, this.setValue)(),
|
||||
this.widgetContainer
|
||||
);
|
||||
|
||||
ReactDOM.render(
|
||||
MeetingControlController(this.attributes, this.setValue)(),
|
||||
this.controlContainer
|
||||
);
|
||||
}
|
||||
|
||||
done() {
|
||||
ReactDOM.unmountComponentAtNode(this.widgetContainer);
|
||||
ReactDOM.unmountComponentAtNode(this.controlContainer);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user