From d4b731841315c8dbe9bdfb0b1d1c5634658dd31b Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Mon, 10 Oct 2022 15:28:36 +0200
Subject: [PATCH] fix: smart search for new services
---
.../api/src/lib/services/supportedVersions.ts | 60 ++++++++++++-------
.../services/[id]/configuration/type.svelte | 49 ++++++++++++++-
2 files changed, 86 insertions(+), 23 deletions(-)
diff --git a/apps/api/src/lib/services/supportedVersions.ts b/apps/api/src/lib/services/supportedVersions.ts
index 64f049961..d84d1bd65 100644
--- a/apps/api/src/lib/services/supportedVersions.ts
+++ b/apps/api/src/lib/services/supportedVersions.ts
@@ -29,7 +29,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'stable',
ports: {
main: 8000
- }
+ },
+ labels: ['analytics', 'plausible', 'plausible-analytics', 'gdpr', 'no-cookie']
},
{
name: 'nocodb',
@@ -39,7 +40,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8080
- }
+ },
+ labels: ['nocodb', 'airtable', 'database']
},
{
name: 'minio',
@@ -49,7 +51,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 9001
- }
+ },
+ labels: ['minio', 's3', 'storage']
},
{
name: 'vscodeserver',
@@ -59,7 +62,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8080
- }
+ },
+ labels: ['vscodeserver', 'vscode', 'code-server', 'ide']
},
{
name: 'wordpress',
@@ -70,7 +74,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 80
- }
+ },
+ labels: ['wordpress', 'blog', 'cms']
},
{
name: 'vaultwarden',
@@ -80,7 +85,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 80
- }
+ },
+ labels: ['vaultwarden', 'password-manager', 'passwords']
},
{
name: 'languagetool',
@@ -90,7 +96,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8010
- }
+ },
+ labels: ['languagetool', 'grammar', 'spell-checker']
},
{
name: 'n8n',
@@ -100,7 +107,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 5678
- }
+ },
+ labels: ['n8n', 'workflow', 'automation', 'ifttt', 'zapier', 'nodered']
},
{
name: 'uptimekuma',
@@ -110,7 +118,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 3001
- }
+ },
+ labels: ['uptimekuma', 'uptime', 'monitoring']
},
{
name: 'ghost',
@@ -121,7 +130,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 2368
- }
+ },
+ labels: ['ghost', 'blog', 'cms']
},
{
name: 'meilisearch',
@@ -132,7 +142,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 7700
- }
+ },
+ labels: ['meilisearch', 'search', 'search-engine']
},
{
name: 'umami',
@@ -143,7 +154,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'postgresql-latest',
ports: {
main: 3000
- }
+ },
+ labels: ['umami', 'analytics', 'gdpr', 'no-cookie']
},
{
name: 'hasura',
@@ -154,7 +166,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'v2.10.0',
ports: {
main: 8080
- }
+ },
+ labels: ['hasura', 'graphql', 'database']
},
{
name: 'fider',
@@ -165,7 +178,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'stable',
ports: {
main: 3000
- }
+ },
+ labels: ['fider', 'feedback', 'suggestions']
},
{
name: 'appwrite',
@@ -176,7 +190,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: '1.0',
ports: {
main: 80
- }
+ },
+ labels: ['appwrite', 'database', 'storage', 'api', 'serverless']
},
// {
// name: 'moodle',
@@ -198,7 +213,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8000
- }
+ },
+ labels: ['glitchtip', 'error-reporting', 'error', 'sentry', 'bugsnag']
},
{
name: 'searxng',
@@ -209,7 +225,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8080
- }
+ },
+ labels: ['searxng', 'search', 'search-engine']
},
{
name: 'weblate',
@@ -220,7 +237,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8080
- }
+ },
+ labels: ['weblate', 'translation', 'localization']
},
// {
// name: 'taiga',
@@ -242,7 +260,8 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 3000
- }
+ },
+ labels: ['grafana', 'monitoring', 'metrics', 'dashboard']
},
{
name: 'trilium',
@@ -253,6 +272,7 @@ export const supportedServiceTypesAndVersions = [
recommendedVersion: 'latest',
ports: {
main: 8080
- }
+ },
+ labels: ['trilium', 'notes', 'note-taking', 'wiki']
},
];
diff --git a/apps/ui/src/routes/services/[id]/configuration/type.svelte b/apps/ui/src/routes/services/[id]/configuration/type.svelte
index bd4bbd74e..dcc6aee03 100644
--- a/apps/ui/src/routes/services/[id]/configuration/type.svelte
+++ b/apps/ui/src/routes/services/[id]/configuration/type.svelte
@@ -27,10 +27,12 @@
<script lang="ts">
export let types: any;
+ let search = '';
+ let filteredTypes = types;
+
import { page } from '$app/stores';
import { goto } from '$app/navigation';
import { get, post } from '$lib/api';
- import { t } from '$lib/translations';
import { errorNotification } from '$lib/common';
import ServiceIcons from '$lib/components/svg/services/ServiceIcons.svelte';
@@ -45,10 +47,50 @@
return errorNotification(error);
}
}
+ function doSearch() {
+ filteredTypes = types.filter(
+ (type: any) =>
+ type.name.toLowerCase().includes(search.toLowerCase()) ||
+ type.labels.some((label: string) => label.toLowerCase().includes(search.toLowerCase()))
+ );
+ }
+ function cleanupSearch() {
+ search = '';
+ filteredTypes = types;
+ }
</script>
-<div class="flex flex-wrap justify-center">
- {#each types as type}
+<div class="container lg:mx-auto lg:p-0 px-8 pt-5">
+ <div class="input-group flex w-full">
+ <div class="btn btn-square cursor-default no-animation hover:bg-error" on:click={cleanupSearch}>
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ class="w-6 h-6"
+ viewBox="0 0 24 24"
+ stroke-width="1.5"
+ stroke="currentcolor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ >
+ <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+ <line x1="18" y1="6" x2="6" y2="18" />
+ <line x1="6" y1="6" x2="18" y2="18" />
+ </svg>
+ </div>
+ <input
+ id="search"
+ class="input w-full"
+ type="text"
+ placeholder="Search for services"
+ bind:value={search}
+ on:input={() => doSearch()}
+ />
+ </div>
+</div>
+<div class="container lg:mx-auto lg:pt-20 lg:p-0 px-8 pt-20">
+<div class="flex flex-wrap justify-center gap-8">
+ {#each filteredTypes as type}
<div class="p-2">
<form on:submit|preventDefault={() => handleSubmit(type.name)}>
<button type="submit" class="box-selection relative text-xl font-bold hover:bg-pink-600">
@@ -59,3 +101,4 @@
</div>
{/each}
</div>
+</div>