add new integration Free Mobile SMS

front/src/components/app.jsx

@@ -170,6 +170,9 @@ import MELCloudDiscoverPage from '../routes/integration/all/melcloud/discover-pa
 // NodeRed integration
 import NodeRedPage from '../routes/integration/all/node-red/setup-page';
 
+// Free Mobile integration
+import FreeMobilePage from '../routes/integration/all/free-mobile';
+
 const defaultState = getDefaultState();
 const store = createStore(defaultState);
 
@@ -279,6 +282,8 @@ const AppRouter = connect(
 
         <NodeRedPage path="/dashboard/integration/device/node-red" />
 
+        <FreeMobilePage path="dashboard/integration/device/free-mobile" />
+
         <XiaomiPage path="/dashboard/integration/device/xiaomi" />
         <EditXiaomiPage path="/dashboard/integration/device/xiaomi/edit/:deviceSelector" />
         <TasmotaPage path="/dashboard/integration/device/tasmota" />

front/src/config/i18n/de.json

@@ -489,6 +489,17 @@
       "configurationSuccess": "Konfiguration erfolgreich gesichert.",
       "buttonSave": "Sichern"
     },
+    "free-mobile": {
+      "title": "Free Mobile",
+      "description": "SMS von Gladys über Free Mobile senden.",
+      "documentation": "Free Mobile Dokumentation",
+      "introduction": "Dieses Plugin ermöglicht es Ihnen, SMS an Ihr Free-Handy über den Benachrichtigungsdienst von Free zu senden. Geben Sie Ihre Kundennummer und den Identifizierungsschlüssel unten ein, den Sie auf der <a href=\"https://mobile.free.fr\"> FreeMobile</a>-Website finden.",
+      "username": "Free Mobile Kundennummer",
+      "key": "Identifizierungsschlüssel für den Dienst",
+      "configurationError": "Wir konnten diese Konfiguration nicht speichern.",
+      "configurationSuccess": "Die Kontokonfiguration wurde erfolgreich gespeichert.",
+      "saveButton": "Sichern"
+    },
     "philipsHue": {
       "title": "Philips Hue",
       "description": "Steuere Philips-Hue-Lichter und -Steckdosen mit der offiziellen Bridge.",
@@ -1836,6 +1847,11 @@
         "textPlaceholder": "Nachrichtentext",
         "explanationText": "Um eine Variable einzufügen, geben Sie '{{' ein. Achten Sie darauf, dass Sie zuvor eine Variable in einer Aktion 'Letzten Zustand abrufen' definiert haben, die vor diesem Nachrichtenblock platziert wurde."
       },
+      "smsSend": {
+        "textLabel": "Nachricht",
+        "explanationText": "Um eine Variable in den Text einzufügen, gib \"{{\" ein. Um einen Variablenwert festzulegen, musst du zuerst das Feld \"Gerätewert abrufen\" verwenden.",
+        "messagePlaceholder": "Meine Message"
+      },
       "turnOnLights": {
         "label": "Wähle die Lichter aus, die eingeschaltet werden sollen"
       },
@@ -2019,6 +2035,9 @@
         "send": "Nachricht senden",
         "send-camera": "Kameraaufnahme senden"
       },
+      "sms": {
+        "send": "SMS senden"
+      },
       "delay": "Warten",
       "light": {
         "turn-on": "Licht einschalten",

front/src/config/i18n/en.json

@@ -489,6 +489,17 @@
       "configurationSuccess": "Successfully saved configuration.",
       "buttonSave": "Save"
     },
+    "free-mobile": {
+      "title": "Free Mobile",
+      "description": "Send SMS from Gladys using Free Mobile.",
+      "documentation": "Free Mobile Documentation",
+      "introduction": "This plugin allows you to send SMS to your Free cell phone via the notification service provided by Free. Enter your customer ID and the identification key below, which you can find on the <a href=\"https://mobile.free.fr\"> FreeMobile</a> website.",
+      "username": "Free Mobile Customer ID",
+      "key": "Identification key for the service",
+      "configurationError": "We could not save this configuration.",
+      "configurationSuccess": "Account configuration saved successfully.",
+      "saveButton": "Save"
+    },
     "philipsHue": {
       "title": "Philips Hue",
       "description": "Control Philips Hue Lights and plugs with the official hub",
@@ -1836,6 +1847,11 @@
         "textPlaceholder": "Message text",
         "explanationText": "To insert a variable, type '{{'. Be careful, you must have defined a variable beforehand in a 'Retrieve the last state' action placed before this message block."
       },
+      "smsSend": {
+        "textLabel": "Message",
+        "explanationText": "To inject a variable in the text, press '{{'. To set a variable value, you need to use the 'Get device value' box before this one.",
+        "messagePlaceholder": "My message"
+      },
       "turnOnLights": {
         "label": "Select the lights you want to turn on"
       },
@@ -2019,6 +2035,9 @@
         "send": "Send Message",
         "send-camera": "Send a camera image"
       },
+      "sms": {
+        "send": "Send SMS"
+      },
       "delay": "Wait",
       "light": {
         "turn-on": "Turn On the Lights",

front/src/config/i18n/fr.json

@@ -617,6 +617,17 @@
       "configurationSuccess": "Sauvegarde de la configuration du compte terminée.",
       "buttonSave": "Sauvegarder"
     },
+    "free-mobile": {
+      "title": "Free Mobile",
+      "description": "Envoyer des sms depuis Gladys grâce à Free Mobile.",
+      "documentation": "Documentation Free Mobile",
+      "introduction": "Ce plugin vous permet d’envoyer des sms à votre portable Free via le service de notification proposé par Free. Entrez votre identifiant client et la clé d'identification ci-dessous que vous retrouverez sur le site <a href=\"https://mobile.free.fr\"> FreeMobile</a>.",
+      "username": "Identifiant client Free Mobile",
+      "key": "Clé d'identification au service",
+      "configurationError": "Nous n'avons pas pu sauvegarder cette configuration.",
+      "configurationSuccess": "Sauvegarde de la configuration du compte terminée.",
+      "saveButton": "Sauvegarder"
+    },
     "philipsHue": {
       "title": "Philips Hue",
       "description": "Contrôler les lumières Philips Hue.",
@@ -1836,6 +1847,11 @@
         "textPlaceholder": "Texte du message",
         "explanationText": "Pour injecter une variable, tapez '{{'. Attention, vous devez avoir défini une variable auparavant dans une action 'Récupérer le dernier état' placé avant ce bloc message."
       },
+      "smsSend": {
+        "textLabel": "Message",
+        "explanationText": "Pour injecter une variable, tapez '{{'. Attention, vous devez avoir défini une variable auparavant dans une action 'Récupérer le dernier état' placé avant ce bloc message.",
+        "messagePlaceholder": "Mon message"
+      },
       "turnOnLights": {
         "label": "Sélectionnez les lumières que vous souhaitez allumer"
       },
@@ -2019,6 +2035,9 @@
         "send": "Envoyer un message",
         "send-camera": "Envoyer une image de caméra"
       },
+      "sms": {
+        "send": "Envoyer un sms"
+      },
       "delay": "Attendre",
       "light": {
         "turn-on": "Allumer les lumières",

front/src/config/integrations/communications.json

@@ -22,5 +22,10 @@
   {
     "key": "openai",
     "img": "/assets/integrations/cover/openai.jpg"
+  },
+  {
+    "key": "free-mobile",
+    "link": "free-mobile",
+    "img": "/assets/integrations/cover/free-mobile.jpg"
   }
 ]

front/src/routes/integration/all/free-mobile/FreeMobile.jsx

@@ -0,0 +1,112 @@
+import { Text, MarkupText, Localizer } from 'preact-i18n';
+import cx from 'classnames';
+import { RequestStatus } from '../../../../utils/consts';
+import DeviceConfigurationLink from '../../../../components/documentation/DeviceConfigurationLink';
+
+const FreeMobilePage = ({ children, ...props }) => (
+  <div class="page">
+    <div class="page-main">
+      <div class="my-3 my-md-5">
+        <div class="container">
+          <div class="row">
+            <div class="col-lg-3">
+              <h3 class="page-title mb-5">
+                <Text id="integration.free-mobile.title" />
+              </h3>
+              <div>
+                <div class="list-group list-group-transparent mb-0">
+                  <DeviceConfigurationLink
+                    user={props.user}
+                    configurationKey="integrations"
+                    documentKey="free-mobile"
+                    linkClass="list-group-item list-group-item-action d-flex align-items-center"
+                  >
+                    <span class="icon mr-3">
+                      <i class="fe fe-book-open" />
+                    </span>
+                    <Text id="integration.free-mobile.documentation" />
+                  </DeviceConfigurationLink>
+                </div>
+              </div>
+            </div>
+
+            <div class="col-lg-9">
+              <div class="card">
+                <div class="card-header">
+                  <h1 class="card-title">
+                    <Text id="integration.free-mobile.title" />
+                  </h1>
+                </div>
+                <div class="card-body">
+                  <div
+                    class={cx('dimmer', {
+                      active: props.loading
+                    })}
+                  >
+                    <div class="loader" />
+                    <div class="dimmer-content">
+                      <p>
+                        <MarkupText id="integration.free-mobile.introduction" />
+                      </p>
+                      {props.freeMobileSaveSettingsStatus === RequestStatus.Error && (
+                        <div class="alert alert-danger">
+                          <Text id="integration.free-mobile.configurationError" />
+                        </div>
+                      )}
+                      {props.freeMobileSaveSettingsStatus === RequestStatus.Success && (
+                        <div class="alert alert-info">
+                          <Text id="integration.free-mobile.configurationSuccess" />
+                        </div>
+                      )}
+                      <form onSubmit={props.saveFreeMobileSettings}>
+                        <div class="form-group">
+                          <div class="form-label">
+                            <Text id={`integration.free-mobile.username`} />
+                          </div>
+                          <Localizer>
+                            <input
+                              type="text"
+                              class="form-control"
+                              placeholder={<Text id="integration.free-mobile.username" />}
+                              onInput={props.updateFreeMobileUsername}
+                              value={props.freeMobileUsername}
+                            />
+                          </Localizer>
+                        </div>
+
+                        <div class="form-group">
+                          <div class="form-label">
+                            <Text id={`integration.free-mobile.key`} />
+                          </div>
+                          <Localizer>
+                            <input
+                              type="text"
+                              class="form-control"
+                              placeholder={<Text id="integration.free-mobile.key" />}
+                              onInput={props.updateFreeMobileAccessToken}
+                              value={props.freeMobileAccessToken}
+                            />
+                          </Localizer>
+                        </div>
+
+                        <div class="form-group">
+                          <span class="input-group-append">
+                            <button type="submit" class="btn btn-primary">
+                              <Text id={`integration.free-mobile.saveButton`} />
+                            </button>
+                          </span>
+                        </div>
+                      </form>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+);
+
+export default FreeMobilePage;

front/src/routes/integration/all/free-mobile/actions.js

@@ -0,0 +1,68 @@
+import { RequestStatus } from '../../../../utils/consts';
+
+const actions = store => ({
+  updateFreeMobileUsername(state, e) {
+    store.setState({
+      freeMobileUsername: e.target.value
+    });
+  },
+
+  updateFreeMobileAccessToken(state, e) {
+    store.setState({
+      freeMobileAccessToken: e.target.value
+    });
+  },
+
+  async getFreeMobileSettings(state) {
+    store.setState({
+      freeMobileGetSettingsStatus: RequestStatus.Getting
+    });
+    try {
+      const username = await state.httpClient.get('/api/v1/service/free-mobile/variable/FREE_MOBILE_USERNAME');
+      store.setState({
+        freeMobileUsername: username.value
+      });
+
+      const accessToken = await state.httpClient.get('/api/v1/service/free-mobile/variable/FREE_MOBILE_ACCESS_TOKEN');
+      store.setState({
+        freeMobileAccessToken: accessToken.value,
+        freeMobileGetSettingsStatus: RequestStatus.Success
+      });
+    } catch (e) {
+      store.setState({
+        freeMobileGetSettingsStatus: RequestStatus.Error
+      });
+    }
+  },
+
+  async saveFreeMobileSettings(state, e) {
+    e.preventDefault();
+    store.setState({
+      freeMobileSaveSettingsStatus: RequestStatus.Getting
+    });
+    try {
+      store.setState({
+        freeMobileUsername: state.freeMobileUsername.trim(),
+        freeMobileAccessToken: state.freeMobileAccessToken.trim()
+      });
+      await state.httpClient.post('/api/v1/service/free-mobile/variable/FREE_MOBILE_USERNAME', {
+        value: state.freeMobileUsername.trim()
+      });
+      await state.httpClient.post('/api/v1/service/free-mobile/variable/FREE_MOBILE_ACCESS_TOKEN', {
+        value: state.freeMobileAccessToken.trim()
+      });
+
+      // start service
+      await state.httpClient.post('/api/v1/service/free-mobile/start');
+      store.setState({
+        freeMobileSaveSettingsStatus: RequestStatus.Success
+      });
+    } catch (e) {
+      store.setState({
+        freeMobileSaveSettingsStatus: RequestStatus.Error
+      });
+    }
+  }
+});
+
+export default actions;

front/src/routes/integration/all/free-mobile/index.js

@@ -0,0 +1,23 @@
+import { Component } from 'preact';
+import { connect } from 'unistore/preact';
+import actions from './actions';
+import FreeMobilePage from './FreeMobile';
+import { RequestStatus } from '../../../../utils/consts';
+
+class FreeMobileIntegration extends Component {
+  componentWillMount() {
+    this.props.getFreeMobileSettings();
+  }
+
+  render(props, {}) {
+    const loading =
+      props.freeMobileGetSettingsStatus === RequestStatus.Getting ||
+      props.freeMobileSaveSettingsStatus === RequestStatus.Getting;
+    return <FreeMobilePage {...props} loading={loading} />;
+  }
+}
+
+export default connect(
+  'user,freeMobileUsername,freeMobileAccessToken,freeMobileGetSettingsStatus,freeMobileSaveSettingsStatus',
+  actions
+)(FreeMobileIntegration);