diff --git a/frontend/src/api/channels/createWebhook.ts b/frontend/src/api/channels/createWebhook.ts
index 67a0de7a7b..f63cb2e32b 100644
--- a/frontend/src/api/channels/createWebhook.ts
+++ b/frontend/src/api/channels/createWebhook.ts
@@ -9,19 +9,21 @@ const create = async (
 ): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
 	try {
 		let httpConfig = {};
+		const username = props.username ? props.username.trim() : '';
+		const password = props.password ? props.password.trim() : '';
 
-		if (props.username !== '' && props.password !== '') {
+		if (username !== '' && password !== '') {
 			httpConfig = {
 				basic_auth: {
-					username: props.username,
-					password: props.password,
+					username,
+					password,
 				},
 			};
-		} else if (props.username === '' && props.password !== '') {
+		} else if (username === '' && password !== '') {
 			httpConfig = {
 				authorization: {
-					type: 'bearer',
-					credentials: props.password,
+					type: 'Bearer',
+					credentials: password,
 				},
 			};
 		}
diff --git a/frontend/src/api/channels/editWebhook.ts b/frontend/src/api/channels/editWebhook.ts
index a96850c2db..f6a661644f 100644
--- a/frontend/src/api/channels/editWebhook.ts
+++ b/frontend/src/api/channels/editWebhook.ts
@@ -9,18 +9,21 @@ const editWebhook = async (
 ): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
 	try {
 		let httpConfig = {};
-		if (props.username !== '' && props.password !== '') {
+		const username = props.username ? props.username.trim() : '';
+		const password = props.password ? props.password.trim() : '';
+
+		if (username !== '' && password !== '') {
 			httpConfig = {
 				basic_auth: {
-					username: props.username,
-					password: props.password,
+					username,
+					password,
 				},
 			};
-		} else if (props.username === '' && props.password !== '') {
+		} else if (username === '' && password !== '') {
 			httpConfig = {
 				authorization: {
-					type: 'bearer',
-					credentials: props.password,
+					type: 'Bearer',
+					credentials: password,
 				},
 			};
 		}
diff --git a/frontend/src/api/channels/testWebhook.ts b/frontend/src/api/channels/testWebhook.ts
index 4b915e9a3a..26c93f3d4a 100644
--- a/frontend/src/api/channels/testWebhook.ts
+++ b/frontend/src/api/channels/testWebhook.ts
@@ -9,19 +9,21 @@ const testWebhook = async (
 ): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
 	try {
 		let httpConfig = {};
+		const username = props.username ? props.username.trim() : '';
+		const password = props.password ? props.password.trim() : '';
 
-		if (props.username !== '' && props.password !== '') {
+		if (username !== '' && password !== '') {
 			httpConfig = {
 				basic_auth: {
-					username: props.username,
-					password: props.password,
+					username,
+					password,
 				},
 			};
-		} else if (props.username === '' && props.password !== '') {
+		} else if (username === '' && password !== '') {
 			httpConfig = {
 				authorization: {
-					type: 'bearer',
-					credentials: props.password,
+					type: 'Bearer',
+					credentials: password,
 				},
 			};
 		}