diff --git a/packages/hoppscotch-sh-admin/locales/en.json b/packages/hoppscotch-sh-admin/locales/en.json index d338e30b3..c8895175c 100644 --- a/packages/hoppscotch-sh-admin/locales/en.json +++ b/packages/hoppscotch-sh-admin/locales/en.json @@ -33,12 +33,21 @@ }, "load_error": "Unable to load server configurations", "mail_configs": { - "description": " Configure the smtp configurations", - "enable": "Email based authentication", - "smtp_url": "MAILER SMTP URL", "address_from": "MAILER FROM ADDRESS", + "custom_smtp_configs": "Use Custom SMTP Configurations", + "description": " Configure the smtp configurations", + "enable_email_auth": "Enable Email based authentication", + "enable_smtp": "Enable SMTP", + "host": "MAILER HOST", + "password": "MAILER PASSWORD", + "port": "MAILER PORT", + "secure": "MAILER SECURE", + "smtp_url": "MAILER SMTP URL", + "tls_reject_unauthorized": "TLS REJECT UNAUTHORIZED", "title": "SMTP Configurations", - "update_failure": "Failed to update smtp configurations!!" + "toggle_failure": "Failed to toggle smtp!!", + "update_failure": "Failed to update smtp configurations!!", + "user": "MAILER USER" }, "reset": { "confirm_reset": "Hoppscotch server must restart to reflect the new changes. Confirm the reset of server configurations?", @@ -210,6 +219,7 @@ "admin_id": "Admin ID", "cancel": "Cancel", "confirm_team_deletion": "Confirm deletion of the workspace?", + "copy": "Copy", "create_team": "Create Workspace", "date": "Date", "delete_team": "Delete Workspace", @@ -262,6 +272,7 @@ "admin_id": "Admin ID", "cancel": "Cancel", "created_on": "Created On", + "copy_link": "Copy Link", "date": "Date", "delete": "Delete", "delete_user": "Delete User", diff --git a/packages/hoppscotch-sh-admin/src/components.d.ts b/packages/hoppscotch-sh-admin/src/components.d.ts index 6cc64dfd3..82f464e2c 100644 --- a/packages/hoppscotch-sh-admin/src/components.d.ts +++ b/packages/hoppscotch-sh-admin/src/components.d.ts @@ -1,46 +1,45 @@ // generated by unplugin-vue-components // We suggest you to commit this file into source control // Read more: https://github.com/vuejs/core/pull/3399 -import '@vue/runtime-core' +import '@vue/runtime-core'; -export {} +export {}; declare module '@vue/runtime-core' { export interface GlobalComponents { - AppHeader: typeof import('./components/app/Header.vue')['default'] - AppLogin: typeof import('./components/app/Login.vue')['default'] - AppLogout: typeof import('./components/app/Logout.vue')['default'] - AppModal: typeof import('./components/app/Modal.vue')['default'] - AppSidebar: typeof import('./components/app/Sidebar.vue')['default'] - AppToast: typeof import('./components/app/Toast.vue')['default'] - DashboardMetricsCard: typeof import('./components/dashboard/MetricsCard.vue')['default'] - HoppButtonPrimary: typeof import('@hoppscotch/ui')['HoppButtonPrimary'] - HoppButtonSecondary: typeof import('@hoppscotch/ui')['HoppButtonSecondary'] - HoppSmartAnchor: typeof import('@hoppscotch/ui')['HoppSmartAnchor'] - HoppSmartConfirmModal: typeof import('@hoppscotch/ui')['HoppSmartConfirmModal'] - HoppSmartInput: typeof import('@hoppscotch/ui')['HoppSmartInput'] - HoppSmartItem: typeof import('@hoppscotch/ui')['HoppSmartItem'] - HoppSmartLink: typeof import('@hoppscotch/ui')['HoppSmartLink'] - HoppSmartPicture: typeof import('@hoppscotch/ui')['HoppSmartPicture'] - HoppSmartSpinner: typeof import('@hoppscotch/ui')['HoppSmartSpinner'] - IconLucideInbox: typeof import('~icons/lucide/inbox')['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'] - SettingsReset: typeof import('./components/settings/Reset.vue')['default'] - SettingsServerRestart: typeof import('./components/settings/ServerRestart.vue')['default'] - SettingsSmtpConfiguration: typeof import('./components/settings/SmtpConfiguration.vue')['default'] - SetupDataSharingAndNewsletter: typeof import('./components/setup/DataSharingAndNewsletter.vue')['default'] - TeamsAdd: typeof import('./components/teams/Add.vue')['default'] - TeamsDetails: typeof import('./components/teams/Details.vue')['default'] - TeamsInvite: typeof import('./components/teams/Invite.vue')['default'] - TeamsMembers: typeof import('./components/teams/Members.vue')['default'] - TeamsPendingInvites: typeof import('./components/teams/PendingInvites.vue')['default'] - Tippy: typeof import('vue-tippy')['Tippy'] - UiAutoResetIcon: typeof import('./components/ui/AutoResetIcon.vue')['default'] - UsersDetails: typeof import('./components/users/Details.vue')['default'] - UsersInviteModal: typeof import('./components/users/InviteModal.vue')['default'] - UsersSharedRequests: typeof import('./components/users/SharedRequests.vue')['default'] + AppHeader: typeof import('./components/app/Header.vue')['default']; + AppLogin: typeof import('./components/app/Login.vue')['default']; + AppLogout: typeof import('./components/app/Logout.vue')['default']; + AppModal: typeof import('./components/app/Modal.vue')['default']; + AppSidebar: typeof import('./components/app/Sidebar.vue')['default']; + AppToast: typeof import('./components/app/Toast.vue')['default']; + DashboardMetricsCard: typeof import('./components/dashboard/MetricsCard.vue')['default']; + HoppButtonPrimary: typeof import('@hoppscotch/ui')['HoppButtonPrimary']; + HoppButtonSecondary: typeof import('@hoppscotch/ui')['HoppButtonSecondary']; + HoppSmartAnchor: typeof import('@hoppscotch/ui')['HoppSmartAnchor']; + HoppSmartConfirmModal: typeof import('@hoppscotch/ui')['HoppSmartConfirmModal']; + HoppSmartInput: typeof import('@hoppscotch/ui')['HoppSmartInput']; + HoppSmartItem: typeof import('@hoppscotch/ui')['HoppSmartItem']; + HoppSmartLink: typeof import('@hoppscotch/ui')['HoppSmartLink']; + HoppSmartPicture: typeof import('@hoppscotch/ui')['HoppSmartPicture']; + HoppSmartSpinner: typeof import('@hoppscotch/ui')['HoppSmartSpinner']; + IconLucideInbox: typeof import('~icons/lucide/inbox')['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']; + SettingsReset: typeof import('./components/settings/Reset.vue')['default']; + SettingsServerRestart: typeof import('./components/settings/ServerRestart.vue')['default']; + SettingsSmtpConfiguration: typeof import('./components/settings/SmtpConfiguration.vue')['default']; + SetupDataSharingAndNewsletter: typeof import('./components/setup/DataSharingAndNewsletter.vue')['default']; + TeamsAdd: typeof import('./components/teams/Add.vue')['default']; + TeamsDetails: typeof import('./components/teams/Details.vue')['default']; + TeamsInvite: typeof import('./components/teams/Invite.vue')['default']; + TeamsMembers: typeof import('./components/teams/Members.vue')['default']; + TeamsPendingInvites: typeof import('./components/teams/PendingInvites.vue')['default']; + Tippy: typeof import('vue-tippy')['Tippy']; + UiAutoResetIcon: typeof import('./components/ui/AutoResetIcon.vue')['default']; + UsersDetails: typeof import('./components/users/Details.vue')['default']; + UsersInviteModal: typeof import('./components/users/InviteModal.vue')['default']; + UsersSharedRequests: typeof import('./components/users/SharedRequests.vue')['default']; } - } diff --git a/packages/hoppscotch-sh-admin/src/components/settings/ServerRestart.vue b/packages/hoppscotch-sh-admin/src/components/settings/ServerRestart.vue index 1cd0c25a4..641ec1e3f 100644 --- a/packages/hoppscotch-sh-admin/src/components/settings/ServerRestart.vue +++ b/packages/hoppscotch-sh-admin/src/components/settings/ServerRestart.vue @@ -22,6 +22,7 @@ import { EnableAndDisableSsoDocument, ResetInfraConfigsDocument, ToggleAnalyticsCollectionDocument, + ToggleSmtpDocument, UpdateInfraConfigsDocument, } from '~/helpers/backend/graphql'; import { ServerConfigs } from '~/helpers/configs'; @@ -52,6 +53,7 @@ const updateAllowedAuthProviderMutation = useMutation( const toggleDataSharingMutation = useMutation( ToggleAnalyticsCollectionDocument ); +const toggleSMTPMutation = useMutation(ToggleSmtpDocument); // Mutation handlers const { @@ -59,6 +61,7 @@ const { updateAuthProvider, resetInfraConfigs, updateDataSharingConfigs, + toggleSMTPConfigs, } = useConfigHandler(props.workingConfigs); // Call relevant mutations on component mount and initiate server restart @@ -111,6 +114,12 @@ onMounted(async () => { if (!dataSharingResult) { return triggerComponentUnMount(); } + + const smtpResult = await toggleSMTPConfigs(toggleSMTPMutation); + + if (!smtpResult) { + return triggerComponentUnMount(); + } } restart.value = true; diff --git a/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue b/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue index e8bb9f9f6..0b3c55404 100644 --- a/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue +++ b/packages/hoppscotch-sh-admin/src/components/settings/SmtpConfiguration.vue @@ -22,30 +22,66 @@ :on="smtpConfigs.enabled" @change="smtpConfigs.enabled = !smtpConfigs.enabled" > - {{ t('configs.mail_configs.enable') }} + {{ t('configs.mail_configs.enable_smtp') }}
+
+ + {{ t('configs.mail_configs.enable_email_auth') }} + + + + {{ t('configs.mail_configs.custom_smtp_configs') }} + +
- - - - - +
+
+ + {{ field.name }} + +
+ + + + + + + +
@@ -91,13 +127,47 @@ type Field = { }; const smtpConfigFields = reactive([ - { name: t('configs.mail_configs.smtp_url'), key: 'mailer_smtp_url' }, - { name: t('configs.mail_configs.address_from'), key: 'mailer_from_address' }, + { + name: t('configs.mail_configs.smtp_url'), + key: 'mailer_smtp_url', + }, + { + name: t('configs.mail_configs.address_from'), + key: 'mailer_from_address', + }, + { + name: t('configs.mail_configs.host'), + key: 'mailer_smtp_host', + }, + { + name: t('configs.mail_configs.port'), + key: 'mailer_smtp_port', + }, + { + name: t('configs.mail_configs.user'), + key: 'mailer_smtp_user', + }, + { + name: t('configs.mail_configs.password'), + key: 'mailer_smtp_password', + }, + { + name: t('configs.mail_configs.secure'), + key: 'mailer_smtp_secure', + }, + { + name: t('configs.mail_configs.tls_reject_unauthorized'), + key: 'mailer_tls_reject_unauthorized', + }, ]); const maskState = reactive>({ mailer_smtp_url: true, mailer_from_address: true, + mailer_smtp_host: true, + mailer_smtp_port: true, + mailer_smtp_user: true, + mailer_smtp_password: true, }); const toggleMask = (fieldKey: keyof ServerConfigs['mailConfigs']['fields']) => { @@ -106,4 +176,35 @@ const toggleMask = (fieldKey: keyof ServerConfigs['mailConfigs']['fields']) => { const isMasked = (fieldKey: keyof ServerConfigs['mailConfigs']['fields']) => maskState[fieldKey]; + +const fieldCondition = (field: Field) => { + const advancedFields = [ + 'mailer_smtp_host', + 'mailer_smtp_port', + 'mailer_smtp_user', + 'mailer_smtp_password', + 'mailer_smtp_secure', + 'mailer_tls_reject_unauthorized', + ]; + const basicFields = ['mailer_smtp_url']; + + if (field.key === 'mailer_from_address') { + return true; + } + + if (smtpConfigs.value.fields.mailer_use_custom_configs) { + return ( + !basicFields.includes(field.key) && advancedFields.includes(field.key) + ); + } else return basicFields.includes(field.key); +}; + +const isCheckboxField = (field: Field) => { + const checkboxKeys = ['mailer_smtp_secure', 'mailer_tls_reject_unauthorized']; + return checkboxKeys.includes(field.key); +}; + +const toggleCheckbox = (field: Field) => + ((smtpConfigs.value.fields[field.key] as boolean) = + !smtpConfigs.value.fields[field.key]); diff --git a/packages/hoppscotch-sh-admin/src/components/teams/PendingInvites.vue b/packages/hoppscotch-sh-admin/src/components/teams/PendingInvites.vue index 366ce1138..5389d4901 100644 --- a/packages/hoppscotch-sh-admin/src/components/teams/PendingInvites.vue +++ b/packages/hoppscotch-sh-admin/src/components/teams/PendingInvites.vue @@ -1,5 +1,7 @@ @@ -32,26 +38,17 @@