diff --git a/packages/hoppscotch-sh-admin/locales/en.json b/packages/hoppscotch-sh-admin/locales/en.json index e7bcd817..37dc5afc 100644 --- a/packages/hoppscotch-sh-admin/locales/en.json +++ b/packages/hoppscotch-sh-admin/locales/en.json @@ -31,6 +31,7 @@ }, "confirm_changes": "Hoppscotch server must restart to reflect the new changes. Confirm changes made to the server configurations?", "input_empty": "Please fill all the fields before updating the configurations", + "input_validation_error": "Some fields have invalid values. Please correct them before updating the configurations", "data_sharing": { "title": "Data Sharing", "description": "Help improve Hoppscotch by sharing anonymous data", @@ -48,6 +49,7 @@ "enable_email_auth": "Enable Email based authentication", "enable_smtp": "Enable SMTP", "host": "MAILER HOST", + "input_validation": "SMTP URL should start with smtp(s)://", "password": "MAILER PASSWORD", "port": "MAILER PORT", "secure": "MAILER SECURE", diff --git a/packages/hoppscotch-sh-admin/src/components.d.ts b/packages/hoppscotch-sh-admin/src/components.d.ts index 0d8c40d4..55894938 100644 --- a/packages/hoppscotch-sh-admin/src/components.d.ts +++ b/packages/hoppscotch-sh-admin/src/components.d.ts @@ -40,8 +40,10 @@ declare module 'vue' { IconLucideChevronDown: typeof import('~icons/lucide/chevron-down')['default'] IconLucideHelpCircle: typeof import('~icons/lucide/help-circle')['default'] IconLucideInbox: typeof import('~icons/lucide/inbox')['default'] + IconLucideInfo: typeof import('~icons/lucide/info')['default'] IconLucideSearch: typeof import('~icons/lucide/search')['default'] IconLucideUser: typeof import('~icons/lucide/user')['default'] + IconLucideX: typeof import('~icons/lucide/x')['default'] SettingsAuthProvider: typeof import('./components/settings/AuthProvider.vue')['default'] SettingsConfigurations: typeof import('./components/settings/Configurations.vue')['default'] SettingsDataSharing: typeof import('./components/settings/DataSharing.vue')['default'] diff --git a/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue b/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue index 63763262..38f62a56 100644 --- a/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue +++ b/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue @@ -87,6 +87,16 @@ @click="toggleMask(field.key)" /> + +
+
+ + {{ field.error }} +
+
@@ -99,9 +109,9 @@ diff --git a/packages/hoppscotch-sh-admin/src/helpers/configs.ts b/packages/hoppscotch-sh-admin/src/helpers/configs.ts index 08ee88df..2a6f8d81 100644 --- a/packages/hoppscotch-sh-admin/src/helpers/configs.ts +++ b/packages/hoppscotch-sh-admin/src/helpers/configs.ts @@ -1,5 +1,9 @@ +import { ref } from 'vue'; import { InfraConfigEnum } from './backend/graphql'; +// Check if any input validation has failed +export const hasInputValidationFailed = ref(false); + export type SsoAuthProviders = 'google' | 'microsoft' | 'github'; export type ServerConfigs = { diff --git a/packages/hoppscotch-sh-admin/src/pages/settings.vue b/packages/hoppscotch-sh-admin/src/pages/settings.vue index 8cfa58fd..97480c29 100644 --- a/packages/hoppscotch-sh-admin/src/pages/settings.vue +++ b/packages/hoppscotch-sh-admin/src/pages/settings.vue @@ -33,7 +33,7 @@
@@ -57,6 +57,7 @@ import { computed, ref } from 'vue'; import { useI18n } from '~/composables/i18n'; import { useToast } from '~/composables/toast'; import { useConfigHandler } from '~/composables/useConfigHandler'; +import { hasInputValidationFailed } from '~/helpers/configs'; const t = useI18n(); const toast = useToast(); @@ -91,6 +92,17 @@ const areAnyFieldsEmpty = computed(() => workingConfigs.value ? AreAnyConfigFieldsEmpty(workingConfigs.value) : false ); +const triggerSaveChangesModal = () => { + if (areAnyFieldsEmpty.value) { + return toast.error(t('configs.input_empty')); + } + + if (hasInputValidationFailed.value) { + return toast.error(t('configs.input_validation_error')); + } + showSaveChangesModal.value = true; +}; + const restartServer = () => { if (areAnyFieldsEmpty.value) { return toast.error(t('configs.input_empty')); diff --git a/packages/hoppscotch-sh-admin/src/pages/teams/index.vue b/packages/hoppscotch-sh-admin/src/pages/teams/index.vue index 837f4e77..1b605ba3 100644 --- a/packages/hoppscotch-sh-admin/src/pages/teams/index.vue +++ b/packages/hoppscotch-sh-admin/src/pages/teams/index.vue @@ -53,7 +53,12 @@
- +
- +