diff --git a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js index 5030835709..2baa0a935d 100644 --- a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js +++ b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js @@ -3,7 +3,13 @@ import { useIntl } from 'react-intl'; import { Header, List } from '@buffetjs/custom'; import { Text } from '@buffetjs/core'; import { Pencil } from '@buffetjs/icons'; -import { SettingsPageTitle, SizedInput, useUserPermissions, request } from 'strapi-helper-plugin'; +import { + SettingsPageTitle, + SizedInput, + useUserPermissions, + getYupInnerErrors, + request, +} from 'strapi-helper-plugin'; import { get, upperFirst } from 'lodash'; import { Row } from 'reactstrap'; import pluginPermissions from '../../permissions'; @@ -92,16 +98,14 @@ const ProvidersPage = () => { } }, [isLoadingForPermissions]); + const formToRender = useMemo(() => { + return providerToEditName === 'email' ? forms.email : forms.providers; + }, [providerToEditName]); + const handleClick = useCallback(() => { buttonSubmitRef.current.click(); }, []); - const handleSubmit = useCallback(async e => { - e.preventDefault(); - - setIsSubmiting(true); - }, []); - const handleToggle = useCallback(() => { setIsOpen(prev => !prev); }, []); @@ -134,9 +138,47 @@ const ProvidersPage = () => { setShowForm(true); }, []); - const formToRender = useMemo(() => { - return providerToEditName === 'email' ? forms.email.form : forms.providers.form; - }, [providerToEditName]); + const handleSubmit = useCallback( + async e => { + e.preventDefault(); + const { schema } = formToRender; + let errors = {}; + + setIsSubmiting(true); + + try { + await schema.validate(modifiedData[providerToEditName], { abortEarly: false }); + + try { + await request(getRequestURL('providers'), { + method: 'PUT', + body: { providers: modifiedData }, + }); + + strapi.notification.success(getTrad('notification.success.submit')); + + dispatch({ type: 'ON_SUBMIT_SUCCEEDED' }); + + handleToggle(); + } catch (err) { + console.error(err); + strapi.notification.error('notification.error'); + } + } catch (err) { + console.error(err); + errors = getYupInnerErrors(err); + console.log(errors); + } + + dispatch({ + type: 'SET_ERRORS', + errors, + }); + + setIsSubmiting(false); + }, + [formToRender, handleToggle, modifiedData, providerToEditName] + ); return ( <> @@ -192,7 +234,7 @@ const ProvidersPage = () => { {showForm && (
- {formToRender.map(input => { + {formToRender.form.map(input => { const label = input.label.params ? { ...input.label, params: { provider: upperFirst(providerToEditName) } } : input.label; diff --git a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/forms.js b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/forms.js index 2846dd4304..0fd3098b2a 100644 --- a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/forms.js +++ b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/forms.js @@ -1,3 +1,6 @@ +import * as yup from 'yup'; +import { translatedErrors } from 'strapi-helper-plugin'; + import { getTrad } from '../../../utils'; const forms = { @@ -15,6 +18,9 @@ const forms = { }, }, ], + schema: yup.object().shape({ + enabled: yup.bool().required(translatedErrors.required), + }), }, providers: { form: [ @@ -78,6 +84,24 @@ const forms = { disabled: true, }, ], + schema: yup.object().shape({ + enabled: yup.bool().required(translatedErrors.required), + key: yup.string().when('enabled', { + is: true, + then: yup.string().required(translatedErrors.required), + otherwise: yup.string(), + }), + secret: yup.string().when('enabled', { + is: true, + then: yup.string().required(translatedErrors.required), + otherwise: yup.string(), + }), + callback: yup.string().when('enabled', { + is: true, + then: yup.string().required(translatedErrors.required), + otherwise: yup.string(), + }), + }), }, };