Merge branch 'master' into fix-GladysAssistant#713-session-device

front/package.json

@@ -8,12 +8,7 @@
     "serve": "npm run build && preact serve",
     "dev": "preact watch -p 1444 --template src/template.html",
     "eslint": "eslint src --ext .json --ext .js --ext .jsx",
-    "compare-translations": "npm run compare-i18n && npm run compare-device-integrations && npm run compare-communication-integrations && npm run compare-weather-integrations && npm run compare-calendar-integrations",
-    "compare-i18n": "comparejson -e ./src/config/i18n/*.json",
-    "compare-device-integrations": "comparejson -e ./src/config/integrations/device.*.json",
-    "compare-communication-integrations": "comparejson -e ./src/config/integrations/communication.*.json",
-    "compare-weather-integrations": "comparejson -e ./src/config/integrations/weather.*.json",
-    "compare-calendar-integrations": "comparejson -e ./src/config/integrations/calendar.*.json",
+    "compare-translations": "comparejson -e ./src/config/i18n/*.json",
     "prettier-check": "prettier --check '**/*.js' '**/*.jsx' '**/*.json'",
     "prettier": "prettier --write '**/*.js' '**/*.jsx' '**/*.json'",
     "test": "jest --coverage"

front/src/actions/integration.js

@@ -1,22 +1,14 @@
 import get from 'get-value';
-import integrationsConfig from '../config/integrations';
-import { AVAILABLE_LANGUAGES_LIST, AVAILABLE_LANGUAGES } from '../../../server/utils/constants';
-
-const getLanguage = state => {
-  const foundLanguageInState = get(state, 'user.language');
-  const userLanguage =
-    AVAILABLE_LANGUAGES_LIST.indexOf(foundLanguageInState) !== -1 ? foundLanguageInState : AVAILABLE_LANGUAGES.EN;
-  return userLanguage;
-};
+import { integrations, integrationsByType, categories } from '../config/integrations';
 
 const actions = store => ({
-  getIntegrations(state) {
-    const userLanguage = getLanguage(state);
-    const currentIntegrationCategory = state.currentUrl.split('/').pop();
-    const integrations = integrationsConfig[userLanguage][currentIntegrationCategory] || [];
+  getIntegrations(state, category = null) {
+    const selectedIntegrations = integrationsByType[category] || integrations;
     store.setState({
-      integrations,
-      totalSize: integrationsConfig[userLanguage].totalSize
+      integrations: selectedIntegrations,
+      totalSize: selectedIntegrations.length,
+      integrationCategories: categories,
+      searchKeyword: ''
     });
   },
   async getIntegrationByName(state, name, podId = null) {
@@ -33,23 +25,26 @@ const actions = store => ({
     }
   },
   getIntegrationByCategory(state, category) {
-    const userLanguage = getLanguage(state);
-    const integrations = integrationsConfig[userLanguage][category] || [];
+    const selectedIntegrations = category ? integrationsByType[category] || [] : integrations;
     store.setState({
-      integrations
+      integrations: selectedIntegrations,
+      searchKeyword: ''
     });
   },
-  search(state, e) {
+  search(state, e, intl) {
     if (!e.target.value || e.target.value === '') {
-      return store.setState({
-        integrationsFiltered: null
+      this.getIntegrationByCategory(state.category);
+    } else {
+      const keyword = e.target.value.toLowerCase();
+      store.setState({
+        integrations: state.integrations.filter(integration => {
+          const name = get(intl.dictionary, `integration.${integration.key}.title`, { default: '' });
+          const description = get(intl.dictionary, `integration.${integration.key}.description`, { default: '' });
+          return name.toLowerCase().includes(keyword) || description.toLowerCase().includes(keyword);
+        }),
+        searchKeyword: keyword
       });
     }
-    store.setState({
-      integrationsFiltered: state.integrations.filter(integration =>
-        integration.name.toLowerCase().includes(e.target.value.toLowerCase())
-      )
-    });
   }
 });
 

front/src/actions/main.js

@@ -1,4 +1,5 @@
 import createActionsProfilePicture from './profilePicture';
+import createActionsIntegration from './integration';
 import { getDefaultState } from '../utils/getDefaultState';
 import { route } from 'preact-router';
 import get from 'get-value';
@@ -18,6 +19,7 @@ const OPEN_PAGES = [
 
 function createActions(store) {
   const actionsProfilePicture = createActionsProfilePicture(store);
+  const integrations = createActionsIntegration(store);
 
   const actions = {
     handleRoute(state, e) {
@@ -79,7 +81,7 @@ function createActions(store) {
     }
   };
 
-  return Object.assign(actions, actionsProfilePicture);
+  return Object.assign(actions, actionsProfilePicture, integrations);
 }
 
 export default createActions;

front/src/actions/message.js

@@ -5,16 +5,7 @@ import uuid from 'uuid';
 const TYPING_MIN_TIME = 400;
 const TYPING_MAX_TIME = 600;
 
-const sortMessages = messages =>
-  messages.sort((a, b) => {
-    if (a.created_at < b.created_at) {
-      return -1;
-    }
-    if (a.created_at > b.created_at) {
-      return 1;
-    }
-    return 0;
-  });
+const sortMessages = messages => messages.sort((a, b) => a.created_at - b.created_at);
 
 function createActions(store) {
   const actions = {
@@ -32,6 +23,8 @@ function createActions(store) {
       });
       try {
         let messages = await state.httpClient.get('/api/v1/message');
+        // Force date usage
+        messages.forEach(message => (message.created_at = new Date(message.created_at)));
         messages = sortMessages(messages);
         store.setState({
           messages,

front/src/components/app.jsx

@@ -83,7 +83,7 @@ const defaultState = getDefaultState();
 const store = createStore(defaultState);
 
 const AppRouter = connect(
-  'currentUrl,user,profilePicture,showDropDown,showCollapsedMenu',
+  'currentUrl,user,profilePicture,showDropDown,showCollapsedMenu,integrationCategories',
   actions
 )(props => (
   <div id="app">
@@ -142,13 +142,10 @@ const AppRouter = connect(
         <Dashboard path="/dashboard" />
         <Device path="/dashboard/device" />
         <IntegrationPage path="/dashboard/integration" />
-        <IntegrationPage path="/dashboard/integration/device" />
-        <IntegrationPage path="/dashboard/integration/communication" />
-        <IntegrationPage path="/dashboard/integration/calendar" />
-        <IntegrationPage path="/dashboard/integration/music" />
-        <IntegrationPage path="/dashboard/integration/health" />
-        <IntegrationPage path="/dashboard/integration/weather" />
-        <IntegrationPage path="/dashboard/integration/navigation" />
+        {props.integrationCategories.map(category => (
+          <IntegrationPage path={`/dashboard/integration/${category.type}`} category={category.type} />
+        ))}
+
         <TelegramPage path="/dashboard/integration/communication/telegram" />
         <CaldavPage path="/dashboard/integration/calendar/caldav" />
         <DarkSkyPage path="/dashboard/integration/weather/darksky" />
@@ -199,6 +196,7 @@ const AppRouter = connect(
 class MainApp extends Component {
   componentWillMount() {
     this.props.checkSession();
+    this.props.getIntegrations();
   }
 
   render({ user }, {}) {

front/src/components/header/index.jsx

@@ -108,7 +108,7 @@ const Header = ({ ...props }) => {
                 </li>
                 <li class="nav-item">
                   <Link
-                    href="/dashboard/integration/device"
+                    href="/dashboard/integration"
                     class={props.currentUrl.startsWith('/dashboard/integration') ? 'active nav-link' : 'nav-link'}
                   >
                     <i class="fe fe-grid" /> <Text id="header.integrations" />

front/src/config/demo.json

@@ -465,23 +465,23 @@
       "receiver_id": "0cd30aef-9c4e-4a23-88e3-3547971296e5",
       "text": "It's a clear day today. Temperature outside is 26°C.",
       "is_read": true,
-      "created_at": "2019-02-12T07:49:07.556Z"
+      "created_at": "2019-02-12T07:45:07.556Z"
     },
     {
       "id": "247b1dd0-6fab-47a8-a9c8-1405deae0ae8",
       "sender_id": "0cd30aef-9c4e-4a23-88e3-3547971296e5",
       "receiver_id": null,
       "text": "What's the weather like?",
       "is_read": true,
-      "created_at": "2019-02-12T07:49:07.556Z"
+      "created_at": "2019-02-12T07:44:07.556Z"
     },
     {
       "id": "247b1dd0-6fab-47a8-a9c8-1405deae0ae8",
       "sender_id": null,
       "receiver_id": "0cd30aef-9c4e-4a23-88e3-3547971296e5",
       "text": "It's 24°C in the kitchen.",
       "is_read": true,
-      "created_at": "2019-02-12T07:49:07.556Z"
+      "created_at": "2019-02-12T07:49:07.557Z"
     },
     {
       "id": "247b1dd0-6fab-47a8-a9c8-1405deae0ae8",

front/src/config/i18n/en.json

@@ -222,6 +222,7 @@
       "restartButton": "Restart",
       "stopButton": "Stop",
       "menu": {
+        "all": "All integrations",
         "device": "Devices",
         "communication": "Communication",
         "calendar": "Calendar",
@@ -233,6 +234,7 @@
     },
     "telegram": {
       "title": "Telegram",
+      "description": "Talk to Gladys through Telegram.",
       "introduction": "To connect Gladys to Telegram, you first need to create a Telegram bot using the Botfather. Send a <b>/newbot</b> message to the <a href=\"https://telegram.me/BotFather\">@BotFather</a> in Telegram. Then, enter the API key he gave you below.",
       "link": "<b>ACTION REQUIRED:</b> To talk to Gladys in Telegram, click on <a href=\"{{link}}\">this link</a>. Don't speak in Telegram directly to your bot before having click on this link, otherwise your bot won't be able to know that it's you who are sending a message.",
       "note": "This link is unique to your account, do not send it to other users.",
@@ -242,6 +244,7 @@
     },
     "philipsHue": {
       "title": "Philips Hue",
+      "description": "Control Philips Hue Lights.",
       "deviceTab": "Devices",
       "setupTab": "Setup Bridges",
       "setup": {
@@ -267,6 +270,7 @@
     },
     "rtspCamera": {
       "title": "Cameras",
+      "description": "HTTP/RTSP cameras in Gladys.",
       "search": "Search cameras",
       "new": "New",
       "nameLabel": "Camera Name",
@@ -289,6 +293,7 @@
     },
     "tasmota": {
       "title": "Tasmota",
+      "description": "Control your Tasmota devices.",
       "deviceTab": "Devices",
       "discoverTab": "MQTT discover",
       "discoverDeviceDescr": "Automatically scan MQTT devices",
@@ -324,6 +329,7 @@
     },
     "zwave": {
       "title": "Z-Wave",
+      "description": "Control your Z-Wave devices.",
       "deviceTab": "Devices",
       "networkTab": "Network",
       "settingsTab": "Settings",
@@ -392,7 +398,8 @@
       }
     },
     "darkSky": {
-      "title": "DarkSky API",
+      "title": "DarkSky",
+      "description": "Get the weather in Gladys.",
       "introduction": "This integration helps you integrate with DarkSky API to get the weather in Gladys.",
       "instructions": "You first need to create an account on DarkSky API website: <a href=\"https://darksky.net/dev\">https://darksky.net/dev</a>.",
       "apiKeyLabel": "Then, enter your API key here:",
@@ -402,6 +409,7 @@
     },
     "mqtt": {
       "title": "MQTT",
+      "description": "Connect to MQTT server.",
       "deviceTab": "Devices",
       "setupTab": "Setup",
       "status": {
@@ -467,6 +475,8 @@
       }
     },
     "xiaomi": {
+      "title": "Xiaomi Home",
+      "description": "Display Xiaomi home devices.",
       "device": {
         "title": "Xiaomi devices in Gladys",
         "noDevices": "No Xiaomi devices added yet.",
@@ -498,6 +508,7 @@
     },
     "caldav": {
       "title": "CalDAV",
+      "description": "Sync your CalDAV calendars.",
       "introduction": "To sync Gladys calendar using CalDAV, you first need an external compatible calendar. Then enter the configuration below.",
       "hostLabel": "CalDAV host",
       "hostInfo": "Choose your calendar host to be helped during configuration.",

front/src/config/i18n/fr.json

@@ -222,6 +222,7 @@
       "restartButton": "Redémarrer",
       "stopButton": "Arrêter",
       "menu": {
+        "all": "Toutes les integrations",
         "device": "Appareils",
         "communication": "Communication",
         "calendar": "Calendrier",
@@ -233,6 +234,7 @@
     },
     "caldav": {
       "title": "CalDAV",
+      "description": "Synchonisez vos calendriers CalDAV.",
       "introduction": "Pour synchroniser Gladys avec un calendrier CalDAV, vous devez avoir un calendrier compatible et entrer la configuration ci-dessous.",
       "hostLabel": "Hébergement CalDAV",
       "hostInfo": "Choisissez le type de calendrier que vous utilisez pour être aidé pendant la configuration.",
@@ -276,6 +278,7 @@
     },
     "telegram": {
       "title": "Telegram",
+      "description": "Parlez à Gladys grâce à Telegram.",
       "introduction": "Pour connecter Gladys à Telegram, vous devez d'abord créer un bot Telegram à l'aide du Botfather. Envoyez une commande <b>/newbot</b> au <a href=\"https://telegram.me/BotFather\"> @BotFather </a> dans Telegram. Ensuite, entrez la clé API qu'il vous a donné ci-dessous.",
       "link": "<b>ACTION REQUISE :</b> Pour parler à Gladys dans Telegram, cliquez sur <a href=\"{{link}}\"> ce lien </a>. Ne parlez pas à votre bot dans Telegram directement avant d'avoir cliqué sur ce lien, sinon votre bot ne pourra pas savoir que c'est vous qui envoyez un message.",
       "note": "Ce lien est unique à votre compte, ne l'envoyez pas à d'autres utilisateurs.",
@@ -285,6 +288,7 @@
     },
     "philipsHue": {
       "title": "Philips Hue",
+      "description": "Contrôler les lumières Philips Hue.",
       "deviceTab": "Appareils",
       "setupTab": "Configuration des Ponts",
       "setup": {
@@ -310,6 +314,7 @@
     },
     "rtspCamera": {
       "title": "Caméras",
+      "description": "Affichez vos caméras HTTP/RTSP.",
       "search": "Chercher une caméra",
       "new": "Nouveau",
       "nameLabel": "Nom de la caméra",
@@ -332,6 +337,7 @@
     },
     "tasmota": {
       "title": "Tasmota",
+      "description": "Contrôler vos appareils Tasmota.",
       "deviceTab": "Appareils",
       "discoverTab": "Découverte MQTT",
       "discoverDeviceDescr": "Scanner automatiquement les appareils MQTT",
@@ -367,6 +373,7 @@
     },
     "zwave": {
       "title": "Z-Wave",
+      "description": "Contrôlez vos appareils Z-Wave.",
       "deviceTab": "Appareils",
       "networkTab": "Réseau",
       "settingsTab": "Paramètres",
@@ -435,7 +442,8 @@
       }
     },
     "darkSky": {
-      "title": "API DarkSky",
+      "title": "DarkSky",
+      "description": "Récupérer la météo dans Gladys.",
       "introduction": "Cette intégration vous aide à intégrer l'API DarkSky pour obtenir la météo dans Gladys.",
       "instructions": "Vous devez d'abord créer un compte sur le site Web de l'API DarkSky : <a href=\"https://darksky.net/dev\">https://darksky.net/dev</a>.",
       "apiKeyLabel": "Saisissez ensuite votre clé API ici :",
@@ -445,6 +453,7 @@
     },
     "mqtt": {
       "title": "MQTT",
+      "description": "Connexion à un serveur MQTT.",
       "deviceTab": "Appareils",
       "setupTab": "Configuration",
       "status": {
@@ -510,6 +519,8 @@
       }
     },
     "xiaomi": {
+      "title": "Xiaomi Home",
+      "description": "Gérez les appareils Xiaomi.",
       "device": {
         "title": "Appareils Xiaomi dans Gladys",
         "noDevices": "Aucun appareil Xiaomi n'a encore été ajouté.",

front/src/config/integrations/calendar.en.json → front/src/config/integrations/calendars.json

@@ -1,8 +1,6 @@
 [
   {
     "key": "caldav",
-    "name": "CalDAV",
-    "description": "Sync your CalDAV calendars.",
     "img": "/assets/integrations/cover/caldav.jpg"
   }
 ]