From 859d2b9dda9bda4b19b5c8a7b24c95e472df53a2 Mon Sep 17 00:00:00 2001
From: Zhongnan Su <szhongna@amazon.com>
Date: Mon, 15 Apr 2024 06:54:23 +0000
Subject: [PATCH] [MD] Validate length of title to be less or equal than 32
 characters

Signed-off-by: Zhongnan Su <szhongna@amazon.com>
---
 CHANGELOG.md                                              | 1 +
 .../validation/datasource_form_validation.test.ts         | 5 +++++
 .../components/validation/datasource_form_validation.ts   | 8 +++++++-
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 17d4ec919e3d..1b440f5d657a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -116,6 +116,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [BUG][Multiple Datasource]Read hideLocalCluster setting from yml and set in data source selector and data source menu ([#6361](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6361))
 - [BUG] Fix for checkForFunctionProperty so that order does not matter ([#6248](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6248))
 - [BUG][Multiple Datasource] Validation succeed as long as status code in response is 200 ([#6399](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6399))
+- [BUG][Multiple Datasource] Add Validation for title length to be less or equal than 32 characters in create flow ([#6452](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6452))
 
 ### 🚞 Infrastructure
 
diff --git a/src/plugins/data_source_management/public/components/validation/datasource_form_validation.test.ts b/src/plugins/data_source_management/public/components/validation/datasource_form_validation.test.ts
index d0ef842ad4f5..7b92a355e908 100644
--- a/src/plugins/data_source_management/public/components/validation/datasource_form_validation.test.ts
+++ b/src/plugins/data_source_management/public/components/validation/datasource_form_validation.test.ts
@@ -40,6 +40,11 @@ describe('DataSourceManagement: Form Validation', () => {
       );
       expect(result).toBe(false);
     });
+    test('should fail validation when title is longer than 32 characters', () => {
+      form.title = 'test'.repeat(10);
+      const result = performDataSourceFormValidation(form, [], '', authenticationMethodRegistry);
+      expect(result).toBe(false);
+    });
     test('should fail validation when endpoint is not valid', () => {
       form.endpoint = mockDataSourceAttributesWithAuth.endpoint;
       const result = performDataSourceFormValidation(form, [], '', authenticationMethodRegistry);
diff --git a/src/plugins/data_source_management/public/components/validation/datasource_form_validation.ts b/src/plugins/data_source_management/public/components/validation/datasource_form_validation.ts
index 32c87fbee7d1..56841e399328 100644
--- a/src/plugins/data_source_management/public/components/validation/datasource_form_validation.ts
+++ b/src/plugins/data_source_management/public/components/validation/datasource_form_validation.ts
@@ -50,7 +50,7 @@ export const isTitleValid = (
     error: '',
   };
   /* Title validation */
-  if (!title?.trim?.().length) {
+  if (!title.trim().length) {
     isValid.valid = false;
   } else if (
     title.toLowerCase() !== existingTitle.toLowerCase() &&
@@ -62,6 +62,12 @@ export const isTitleValid = (
     isValid.error = i18n.translate('dataSourcesManagement.validation.titleExists', {
       defaultMessage: 'This title is already in use',
     });
+  } else if (title.length > 32) {
+    /* title length validation */
+    isValid.valid = false;
+    isValid.error = i18n.translate('dataSourcesManagement.validation.titleLength', {
+      defaultMessage: 'Title must be less than 32 characters',
+    });
   }
   return isValid;
 };