-
-
-
-
-
-
-
-
-
-
);
}
}
-export default connect(
- 'user,session,eweLinkUsername,eweLinkPassword,connectEweLinkStatus,eweLinkConnected,eweLinkConnectionError',
- actions
-)(EweLinkSetupPage);
+export default connect('user,session,httpClient')(EweLinkSetupPage);
diff --git a/front/src/routes/integration/all/ewelink/setup-page/login/ErrorPage.jsx b/front/src/routes/integration/all/ewelink/setup-page/login/ErrorPage.jsx
new file mode 100644
index 0000000000..97698bc65a
--- /dev/null
+++ b/front/src/routes/integration/all/ewelink/setup-page/login/ErrorPage.jsx
@@ -0,0 +1,10 @@
+const ErrorPage = ({ children }) => (
+
-
- );
-};
+ );
+ }
+}
export default SetupTab;
diff --git a/front/src/routes/integration/all/ewelink/setup-page/constants.js b/front/src/routes/integration/all/ewelink/setup-page/constants.js
new file mode 100644
index 0000000000..2a7afd0984
--- /dev/null
+++ b/front/src/routes/integration/all/ewelink/setup-page/constants.js
@@ -0,0 +1,4 @@
+const REGIONS = ['eu', 'us', 'as', 'cn'];
+const DEFAULT_REGION = REGIONS[0];
+
+export { REGIONS, DEFAULT_REGION };
diff --git a/front/src/routes/integration/all/ewelink/setup-page/index.js b/front/src/routes/integration/all/ewelink/setup-page/index.js
index 483106a333..23ddf18ba3 100644
--- a/front/src/routes/integration/all/ewelink/setup-page/index.js
+++ b/front/src/routes/integration/all/ewelink/setup-page/index.js
@@ -1,39 +1,170 @@
import { Component } from 'preact';
import { connect } from 'unistore/preact';
-import actions from '../actions';
+
import EweLinkPage from '../EweLinkPage';
import SetupTab from './SetupTab';
+import { DEFAULT_REGION } from './constants';
+
import { WEBSOCKET_MESSAGE_TYPES } from '../../../../../../../server/utils/constants';
+import { RequestStatus } from '../../../../../utils/consts';
class EweLinkSetupPage extends Component {
- componentWillMount() {
- this.props.getIntegrationByName('ewelink');
- this.props.loadProps();
- this.props.session.dispatcher.addListener(
- WEBSOCKET_MESSAGE_TYPES.EWELINK.CONNECTED,
- this.props.displayConnectedMessage
- );
- this.props.session.dispatcher.addListener(WEBSOCKET_MESSAGE_TYPES.EWELINK.ERROR, this.props.displayEweLinkError);
+ loadEwelinkStatus = async () => {
+ this.setState({
+ loadEwelinkStatus: RequestStatus.Getting
+ });
+ try {
+ const { configured, connected } = await this.props.httpClient.get('/api/v1/service/ewelink/status');
+ const ewelinkStatus = { configured, connected };
+ this.setState({
+ ewelinkStatus,
+ loadEwelinkStatus: RequestStatus.Success
+ });
+ } catch (e) {
+ console.error('eWeLink error loading status', e);
+ this.setState({
+ loadEwelinkStatus: RequestStatus.Error
+ });
+ }
+ };
+
+ loadEwelinkConfig = async () => {
+ this.setState({
+ loadEwelinkConfig: RequestStatus.Getting
+ });
+ try {
+ const {
+ application_id: applicationId,
+ application_secret: applicationSecret,
+ application_region: applicationRegion = DEFAULT_REGION
+ } = await this.props.httpClient.get('/api/v1/service/ewelink/config');
+ this.setState({
+ ewelinkConfig: { applicationId, applicationSecret, applicationRegion },
+ loadEwelinkConfig: RequestStatus.Success
+ });
+ } catch (e) {
+ console.error('eWeLink error loading config', e);
+ this.setState({
+ loadEwelinkConfig: RequestStatus.Error
+ });
+ }
+ };
+
+ saveEwelinkConfig = async config => {
+ this.setState({
+ saveEwelinkConfig: RequestStatus.Getting
+ });
+ try {
+ const { applicationId, applicationSecret, applicationRegion } = config;
+ const savedConfig = await this.props.httpClient.post('/api/v1/service/ewelink/config', {
+ application_id: applicationId,
+ application_secret: applicationSecret,
+ application_region: applicationRegion
+ });
+ const ewelinkConfig = {
+ applicationId: savedConfig.application_id,
+ applicationSecret: savedConfig.application_secret,
+ applicationRegion: savedConfig.application_secret
+ };
+ this.setState({
+ ewelinkConfig,
+ saveEwelinkConfig: RequestStatus.Success
+ });
+ } catch (e) {
+ console.error('eWeLink error saving config', e);
+ this.setState({
+ saveEwelinkConfig: RequestStatus.Error
+ });
+ }
+ };
+
+ connectUser = async () => {
+ this.setState({ loadConnectUser: RequestStatus.Getting });
+
+ const { origin, pathname } = window.location;
+ try {
+ const { loginUrl } = await this.props.httpClient.get('/api/v1/service/ewelink/loginUrl', {
+ redirect_url: `${origin}${pathname}/login`
+ });
+ const loginPopup = window.open(loginUrl, 'ewelinkLogin');
+ this.setState({ loadConnectUser: RequestStatus.Success, loginPopup });
+ } catch (e) {
+ console.error(e);
+ this.setState({ loadConnectUser: RequestStatus.Error });
+ }
+ };
+
+ disconnectUser = async () => {
+ this.setState({ loadDisconnectUser: RequestStatus.Getting });
+
+ try {
+ await this.props.httpClient.delete('/api/v1/service/ewelink/token');
+ this.setState({ loadDisconnectUser: RequestStatus.Success });
+ } catch (e) {
+ console.error(e);
+ this.setState({ loadDisconnectUser: RequestStatus.Error });
+ }
+ };
+
+ updateStatus = payload => {
+ const { configured, connected } = payload;
+ const ewelinkStatus = { configured, connected };
+
+ const { loginPopup, ewelinkStatus: currentStatus = {} } = this.state;
+ if (!currentStatus.connected && connected && loginPopup && !loginPopup.closed) {
+ loginPopup.close();
+ }
+
+ this.setState({ ewelinkStatus });
+ };
+
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ loadEwelinkStatus: RequestStatus.Getting
+ };
+ }
+
+ componentDidMount() {
+ this.props.session.dispatcher.addListener(WEBSOCKET_MESSAGE_TYPES.EWELINK.STATUS, this.updateStatus);
+ this.loadEwelinkStatus();
+ this.loadEwelinkConfig();
}
componentWillUnmount() {
- this.props.session.dispatcher.removeListener(
- WEBSOCKET_MESSAGE_TYPES.EWELINK.CONNECTED,
- this.props.displayConnectedMessage
- );
- this.props.session.dispatcher.removeListener(WEBSOCKET_MESSAGE_TYPES.EWELINK.ERROR, this.props.displayEweLinkError);
+ this.props.session.dispatcher.removeListener(WEBSOCKET_MESSAGE_TYPES.EWELINK.STATUS, this.updateStatus);
}
- render(props, {}) {
+ render(
+ {},
+ {
+ loadEwelinkStatus,
+ ewelinkStatus,
+ loadEwelinkConfig,
+ ewelinkConfig,
+ saveEwelinkConfig,
+ loadDisconnectUser,
+ loadConnectUser
+ }
+ ) {
return (
-
-
-
-
-
+
-
+
+
+
+
+
+
+
+
+
+
+ {loadEwelinkStatus === RequestStatus.Error && (
+
+
+
+
+);
+
+export default ErrorPage;
diff --git a/front/src/routes/integration/all/ewelink/setup-page/login/ExchangeTokenPage.jsx b/front/src/routes/integration/all/ewelink/setup-page/login/ExchangeTokenPage.jsx
new file mode 100644
index 0000000000..20ebf4aa91
--- /dev/null
+++ b/front/src/routes/integration/all/ewelink/setup-page/login/ExchangeTokenPage.jsx
@@ -0,0 +1,75 @@
+import { Component } from 'preact';
+import cx from 'classnames';
+
+import { RequestStatus } from '../../../../../../utils/consts';
+import { Text } from 'preact-i18n';
+import ErrorPage from './ErrorPage';
+
+class ExchangeTokenPage extends Component {
+ exchangeToken = async () => {
+ this.setState({
+ exchangeTokenStatus: RequestStatus.Getting,
+ exchangeTokenError: null
+ });
+
+ try {
+ const { code, region, redirectUrl, state } = this.props;
+
+ await this.props.httpClient.post('/api/v1/service/ewelink/token', {
+ code,
+ region,
+ redirect_url: redirectUrl,
+ state
+ });
+ this.setState({
+ exchangeTokenStatus: RequestStatus.Success
+ });
+ } catch (e) {
+ console.error(e);
+ console.error(e.response);
+ this.setState({
+ exchangeTokenStatus: RequestStatus.Error,
+ exchangeTokenError: e
+ });
+ }
+ };
+
+ componentDidMount() {
+ this.exchangeToken();
+ }
+
+ render({}, { exchangeTokenStatus = RequestStatus.Getting, exchangeTokenError }) {
+ const { response = {} } = exchangeTokenError || {};
+ const { data = {} } = response;
+ const { message } = data;
+
+ return (
+
+
+
+ {children}
+
+
+
+ );
+ }
+}
+
+export default ExchangeTokenPage;
diff --git a/front/src/routes/integration/all/ewelink/setup-page/login/index.js b/front/src/routes/integration/all/ewelink/setup-page/login/index.js
new file mode 100644
index 0000000000..98d9379c82
--- /dev/null
+++ b/front/src/routes/integration/all/ewelink/setup-page/login/index.js
@@ -0,0 +1,109 @@
+import { Component } from 'preact';
+import { connect } from 'unistore/preact';
+import { Localizer, Text } from 'preact-i18n';
+
+import { RequestStatus } from '../../../../../../utils/consts';
+import ErrorPage from './ErrorPage';
+import ExchangeTokenPage from './ExchangeTokenPage';
+
+class EweLinkSetupLoginPage extends Component {
+ exchangeToken = async config => {
+ this.setState({
+ saveEwelinkConfig: RequestStatus.Getting
+ });
+ try {
+ const { applicationId, applicationSecret, applicationRegion } = config;
+ const savedConfig = await this.props.httpClient.post('/api/v1/service/ewelink/token', {
+ application_id: applicationId,
+ application_secret: applicationSecret,
+ application_region: applicationRegion
+ });
+ const ewelinkConfig = {
+ applicationId: savedConfig.application_id,
+ applicationSecret: savedConfig.application_secret,
+ applicationRegion: savedConfig.application_secret
+ };
+ this.setState({
+ ewelinkConfig,
+ saveEwelinkConfig: RequestStatus.Success
+ });
+ } catch (e) {
+ console.error('eWeLink error saving config', e);
+ this.setState({
+ saveEwelinkConfig: RequestStatus.Error
+ });
+ }
+ };
+
+ constructor(props) {
+ super(props);
+
+ const { search: queryString, origin, pathname } = window.location;
+ const queryParams = new URLSearchParams(queryString);
+
+ // Map query params to JSON Object
+ const params = {};
+ for (const [key, value] of queryParams.entries()) {
+ params[key] = value;
+ }
+
+ this.state = {
+ params,
+ redirectUrl: `${origin}${pathname}`
+ };
+ }
+
+ render({ httpClient }, { params, redirectUrl }) {
+ const { code, region, state } = params;
+ const success = code && region && state;
+
+ return (
+
+ {exchangeTokenStatus === RequestStatus.Error && (
+
+
+ )}
+ {exchangeTokenStatus === RequestStatus.Success && (
+
+
+
+ {message ? message : exchangeTokenError} +
+ + {message ? message : exchangeTokenError} +
+
+ )}
+
+
+ );
+ }
+}
+
+export default connect('user,session,httpClient')(EweLinkSetupLoginPage);
diff --git a/server/utils/constants.js b/server/utils/constants.js
index 4f4d4a8d70..e7b8f71294 100644
--- a/server/utils/constants.js
+++ b/server/utils/constants.js
@@ -917,7 +917,7 @@ const WEBSOCKET_MESSAGE_TYPES = {
DISCOVER: 'bluetooth.discover',
},
EWELINK: {
- CONNECTED: 'ewelink.connected',
+ STATUS: 'ewelink.status',
NEW_DEVICE: 'ewelink.new-device',
ERROR: 'ewelink.error',
},
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )}
+
+
+
+
+
+ {success && (
+
+
+ 
}
+ />
+
+
+ }
+ />
+