ensure required fields present and update translations

apideck-libraries · Jun 14, 2024 · 12d45b6 · 12d45b6
1 parent 6df84e5
commit 12d45b6
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 12 deletions.
diff --git a/src/components/AuthorizeButton.tsx b/src/components/AuthorizeButton.tsx
@@ -129,11 +129,7 @@ const AuthorizeButton = ({ connection, onConnectionChange }: Props) => {
     );
   }
 
-  const buttonText =
-    typeof connection?.service_id === 'string' &&
-    connection?.service_id.length > 15
-      ? t('Authorize')
-      : `${t('Authorize')} ${connection.name}`;
+  const buttonText = t('Authorize', { connectionName: connection.name });
   return (
     <Button
       text={buttonText}

diff --git a/src/components/ConnectionForm.tsx b/src/components/ConnectionForm.tsx
@@ -50,6 +50,31 @@ const ConnectionForm = ({ connection, setCurrentView, settings }: Props) => {
     initialValues,
     enableReinitialize: true,
     onSubmit: async (values) => {
+      // Check if all required fields have values
+      const allRequiredFieldsFilled = formFields.every((field) => {
+        const fieldValue = values[field.id];
+        if (field.required) {
+          if (field.type === 'multi-select' || field.type === 'select') {
+            // Assuming multi-select fields store an array of strings
+            return Array.isArray(fieldValue) && fieldValue.length > 0;
+          } else {
+            // Handle other types as non-array values
+            return fieldValue !== undefined && (fieldValue as unknown) !== '';
+          }
+        }
+        return true; // If not required, no need to check
+      });
+
+      if (!allRequiredFieldsFilled) {
+        setValidationState('idle');
+        addToast({
+          type: 'error',
+          title: t('Missing required fields'),
+          description: t('Please fill all required fields before submitting.'),
+        });
+        return;
+      }
+
       if (connection.validation_support) {
         setValidationState('validating');
         const updatedConnection = await updateConnection({

diff --git a/src/utils/i18n.ts b/src/utils/i18n.ts
@@ -63,7 +63,7 @@ const resources = {
       'Something went wrong': 'Something went wrong',
       'The integration could not be authorized. Please make sure your settings are correct and try again.':
         'The integration could not be authorized. Please make sure your settings are correct and try again.',
-      Authorize: 'Authorize',
+      Authorize: 'Authorize {{connectionName}}',
       'Missing required fields': 'Missing required fields',
       'Missing required field mappings.': 'Missing required field mappings.',
       'Field Mapping': 'Field Mapping',
@@ -145,7 +145,7 @@ const resources = {
       'Something went wrong': 'Er is iets misgegaan',
       'The integration could not be authorized. Please make sure your settings are correct and try again.':
         'De integratie kon niet worden geautoriseerd. Controleer of je instellingen correct zijn en probeer het opnieuw.',
-      Authorize: 'Autoriseren',
+      Authorize: '{{connectionName}} Autoriseren',
       'Missing required fields': 'Ontbrekende verplichte velden',
       'Missing required field mappings.':
         'Ontbrekende verplichte veldmappings.',
@@ -229,7 +229,7 @@ const resources = {
       'Something went wrong': 'Quelque chose a mal tourné',
       'The integration could not be authorized. Please make sure your settings are correct and try again.':
         "L'intégration n'a pas pu être autorisée. Veuillez vérifier que vos paramètres sont corrects et réessayez.",
-      Authorize: 'Autoriser',
+      Authorize: 'Autoriser {{connectionName}}',
       'Missing required fields': 'Champs obligatoires manquants',
       'Missing required field mappings.':
         'Mappages de champs obligatoires manquants.',
@@ -312,7 +312,7 @@ const resources = {
       'Something went wrong': 'Etwas ist schiefgelaufen',
       'The integration could not be authorized. Please make sure your settings are correct and try again.':
         'Die Integration konnte nicht autorisiert werden. Bitte stellen Sie sicher, dass Ihre Einstellungen korrekt sind und versuchen Sie es erneut.',
-      Authorize: 'Autorisieren',
+      Authorize: '{{connectionName}} Autorisieren',
       'Missing required fields': 'Fehlende erforderliche Felder',
       'Missing required field mappings.':
         'Fehlende erforderliche Feldzuordnungen.',
@@ -395,7 +395,7 @@ const resources = {
       'Something went wrong': 'Algo salió mal',
       'The integration could not be authorized. Please make sure your settings are correct and try again.':
         'La integración no pudo ser autorizada. Por favor, asegúrate de que tus ajustes son correctos y vuelve a intentarlo.',
-      Authorize: 'Autorizar',
+      Authorize: 'Autorizar {{connectionName}}',
       'Missing required fields': 'Faltan campos requeridos',
       'Missing required field mappings.': 'Faltan mapeos de campos requeridos.',
       'Field Mapping': 'Mapeo de Campo',

diff --git a/stories/Vault.stories.tsx b/stories/Vault.stories.tsx
@@ -29,8 +29,8 @@ const Template: Story<Props> = (args) => (
     trigger={<button className="p-2 border rounded shadow">Open modal</button>}
     {...args}
     showConsumer={true}
-    unifyBaseUrl="http://localhost:3050"
-    token="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZWRpcmVjdF91cmkiOiJodHRwczovL215c2Fhcy5jb20vZGFzaGJvYXJkIiwiY29uc3VtZXJfbWV0YWRhdGEiOnsiYWNjb3VudF9uYW1lIjoiU3BhY2VYIiwidXNlcl9uYW1lIjoiRWxvbiBNdXNrIiwiZW1haWwiOiJlbG9uQG11c2suY29tIiwiaW1hZ2UiOiJodHRwczovL3d3dy5zcGFjZXguY29tL3N0YXRpYy9pbWFnZXMvc2hhcmUuanBnIn0sImN1c3RvbV9jb25zdW1lcl9zZXR0aW5ncyI6eyJmZWF0dXJlX2ZsYWdfMSI6dHJ1ZSwidGF4X3JhdGVzIjpbeyJpZCI6IjYiLCJsYWJlbCI6IjYlIn0seyJpZCI6IjIxIiwibGFiZWwiOiIyMSUifV19LCJ0aGVtZSI6eyJmYXZpY29uIjoiaHR0cHM6Ly9yZXMuY2xvdWRpbmFyeS5jb20vcG9zdG1hbi9pbWFnZS91cGxvYWQvdF90ZWFtX2xvZ28vdjE2Mjk4ODY5NTgvdGVhbS9lM2JkN2RhZTRiODQ0MTliOWVjMGQzNGQ4NTVlMTE4MTZlOTRhY2QxYWY4OTRiMjNkYTQ0ZTkyNzA4ZTAzYTgxIiwicHJpbWFyeV9jb2xvciI6IiMyODZlZmEiLCJwcml2YWN5X3VybCI6Imh0dHBzOi8vY29tcGxpYW5jZS5hcGlkZWNrLmNvbS9wcml2YWN5LXBvbGljeSIsInNpZGVwYW5lbF9iYWNrZ3JvdW5kX2NvbG9yIjoiIzI4NmVmYSIsInNpZGVwYW5lbF90ZXh0X2NvbG9yIjoiI0ZGRkZGRiIsInRlcm1zX3VybCI6Imh0dHBzOi8vd3d3LnRlcm1zZmVlZC5jb20vdGVybXMtY29uZGl0aW9ucy85NTdjODVjMWIwODlhZTllMzIxOWM4M2VmZjY1Mzc3ZSIsInZhdWx0X25hbWUiOiJBcGlkZWNrIFZhdWx0In0sInNldHRpbmdzIjp7InVuaWZpZWRfYXBpcyI6WyJjcm0iLCJocmlzIiwicG9zIiwiZmlsZS1zdG9yYWdlIl0sImhpZGVfcmVzb3VyY2Vfc2V0dGluZ3MiOmZhbHNlLCJzYW5kYm94X21vZGUiOmZhbHNlLCJpc29sYXRpb25fbW9kZSI6ZmFsc2UsInNlc3Npb25fbGVuZ3RoIjoiMzBtIiwic2hvd19sb2dzIjp0cnVlLCJzaG93X3N1Z2dlc3Rpb25zIjpmYWxzZSwic2hvd19zaWRlYmFyIjp0cnVlLCJhdXRvX3JlZGlyZWN0IjpmYWxzZX0sImNvbnN1bWVyX2lkIjoidGVzdC1jb25zdW1lciIsImFwcGxpY2F0aW9uX2lkIjoiMjIyMiIsInNjb3BlcyI6W10sImlhdCI6MTcxMjg0MTkzNSwiZXhwIjoxNzEyODQzNzM1fQ.IO6kcAqYTCiCKWhNw6TCPkIF45YvQgw1wRY4rgMRr6A"
+    unifyBaseUrl="https://localhost:3050"
+    token="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZWRpcmVjdF91cmkiOiJodHRwczovL215c2Fhcy5jb20vZGFzaGJvYXJkIiwiY29uc3VtZXJfbWV0YWRhdGEiOnsiYWNjb3VudF9uYW1lIjoiU3BhY2VYIiwidXNlcl9uYW1lIjoiRWxvbiBNdXNrIiwiZW1haWwiOiJlbG9uQG11c2suY29tIiwiaW1hZ2UiOiJodHRwczovL3d3dy5zcGFjZXguY29tL3N0YXRpYy9pbWFnZXMvc2hhcmUuanBnIn0sImN1c3RvbV9jb25zdW1lcl9zZXR0aW5ncyI6eyJmZWF0dXJlX2ZsYWdfMSI6dHJ1ZSwidGF4X3JhdGVzIjpbeyJsYWJlbCI6IjYlIn0seyJsYWJlbCI6IjIxJSJ9XX0sInRoZW1lIjp7ImZhdmljb24iOiJodHRwczovL3Jlcy5jbG91ZGluYXJ5LmNvbS9hcGlkZWNrL2ljb25zL2ludGVyY29tIiwibG9nbyI6Imh0dHBzOi8vcmVzLmNsb3VkaW5hcnkuY29tL2FwaWRlY2svaWNvbnMvaW50ZXJjb20iLCJwcmltYXJ5X2NvbG9yIjoiIzI4NmVmYSIsInNpZGVwYW5lbF9iYWNrZ3JvdW5kX2NvbG9yIjoiIzI4NmVmYSIsInNpZGVwYW5lbF90ZXh0X2NvbG9yIjoiI0ZGRkZGRiIsInZhdWx0X25hbWUiOiJJbnRlcmNvbSIsInByaXZhY3lfdXJsIjoiaHR0cHM6Ly9jb21wbGlhbmNlLmFwaWRlY2suY29tL3ByaXZhY3ktcG9saWN5IiwidGVybXNfdXJsIjoiaHR0cHM6Ly93d3cudGVybXNmZWVkLmNvbS90ZXJtcy1jb25kaXRpb25zLzk1N2M4NWMxYjA4OWFlOWUzMjE5YzgzZWZmNjUzNzdlIn0sInNldHRpbmdzIjp7InVuaWZpZWRfYXBpcyI6WyJjcm0iLCJjcm0iXSwiaGlkZV9yZXNvdXJjZV9zZXR0aW5ncyI6ZmFsc2UsInNhbmRib3hfbW9kZSI6ZmFsc2UsImlzb2xhdGlvbl9tb2RlIjpmYWxzZSwic2Vzc2lvbl9sZW5ndGgiOiIzMG0iLCJzaG93X2xvZ3MiOnRydWUsInNob3dfc3VnZ2VzdGlvbnMiOmZhbHNlLCJzaG93X3NpZGViYXIiOnRydWUsImF1dG9fcmVkaXJlY3QiOmZhbHNlLCJoaWRlX2d1aWRlcyI6ZmFsc2UsImFsbG93X2FjdGlvbnMiOlsiZGVsZXRlIiwiZGlzYWJsZSJdfSwiY29uc3VtZXJfaWQiOiJ0ZXN0LWNvbnN1bWVyIiwiYXBwbGljYXRpb25faWQiOiIyMjIyIiwic2NvcGVzIjpbXSwiaWF0IjoxNzE4MzcyNDIzLCJleHAiOjE3MTgzNzQyMjN9.oUc3c1-Wk6kOpsdX0leQCWIy3NtUiCLCmHJZCSAa9t4"
   />
 );