Services now support aliases!!!! (#1774)

Users can now search for the services not only based on the name, but also the alias (partial match,
case-insensitive), when adding new services.

fixes #1614, #1615, #1291

5 files changed, 16 insertions, 1 deletions

diff --git a/src/components/settings/recipes/RecipeItem.js b/src/components/settings/recipes/RecipeItem.js
index 12e3775f6..55f415bd5 100644
--- a/src/components/settings/recipes/RecipeItem.js
+++ b/src/components/settings/recipes/RecipeItem.js
@@ -28,6 +28,11 @@ export default @observer class RecipeItem extends Component {
           alt=""
         />
         <span className="recipe-teaser__label">{recipe.name}</span>
+        {recipe.aliases && recipe.aliases.length > 0 && (
+          <span className="recipe-teaser__alias_label">
+            {`Aliases: ${recipe.aliases.join(', ')}`}
+          </span>
+        )}
       </button>
     );
   }
diff --git a/src/containers/settings/RecipesScreen.js b/src/containers/settings/RecipesScreen.js
index ff3c688fa..52bf31383 100644
--- a/src/containers/settings/RecipesScreen.js
+++ b/src/containers/settings/RecipesScreen.js
@@ -128,7 +128,7 @@ export default @inject('stores', 'actions') @observer class RecipesScreen extend
       // All search recipes from local recipes
       ...this.createPreviews(
         this.customRecipes
-          .filter((service) => service.name.toLowerCase().includes(this.state.needle.toLowerCase())),
+          .filter((service) => service.name.toLowerCase().includes(this.state.needle.toLowerCase()) || (service.aliases || []).some(alias => alias.toLowerCase().includes(this.state.needle.toLowerCase()))),
       ),
     ]) : recipeFilter;
 
diff --git a/src/models/Recipe.js b/src/models/Recipe.js
index e616055d6..0d97d4472 100644
--- a/src/models/Recipe.js
+++ b/src/models/Recipe.js
@@ -12,6 +12,8 @@ export default class Recipe {
 
   version = '';
 
+  aliases = [];
+
   path = '';
 
   serviceURL = '';
@@ -61,6 +63,7 @@ export default class Recipe {
     this.id = data.id || this.id;
     this.name = data.name || this.name;
     this.version = data.version || this.version;
+    this.aliases = data.aliases || this.aliases;
     this.path = data.path;
 
     this.serviceURL = data.config.serviceURL || this.serviceURL;
diff --git a/src/models/RecipePreview.js b/src/models/RecipePreview.js
index 7a37ccb56..6a9ce3080 100644
--- a/src/models/RecipePreview.js
+++ b/src/models/RecipePreview.js
@@ -9,6 +9,8 @@ export default class RecipePreview {
 
   featured = false;
 
+  aliases = [];
+
   constructor(data) {
     if (!data.id) {
       throw Error('RecipePreview requires Id');
diff --git a/src/styles/recipes.scss b/src/styles/recipes.scss
index 37c2febf6..628d28f05 100644
--- a/src/styles/recipes.scss
+++ b/src/styles/recipes.scss
@@ -69,6 +69,11 @@
     display: block;
   }
 
+  .recipe-teaser__alias_label {
+    display: block;
+    font-size: x-small;
+  }
+
   h2 {
     z-index: 10;
   }