fix the tab issue inside add-event modal

Author: EnsiyehE

src/components/events/partials/ModalTabsAndPages/NewMetadataPage.tsx

@@ -18,7 +18,7 @@ const NewMetadataPage = ({
 	header?: ParseKeys
 }) => {
 	const { t } = useTranslation();
-
+	console.log(metadataCatalogs);
 	return (
 		<ModalContentTable>
 			{

src/components/shared/DropDown.tsx

@@ -209,6 +209,7 @@ const DropDown = <T, >({
 		<AsyncSelect
 			ref={selectRef}
 			{...commonProps}
+            openMenuOnFocus={false}
 			noOptionsMessage={() => t("SELECT_NO_MATCHING_RESULTS")}
 			cacheOptions
 			defaultOptions={formatOptions(

src/components/shared/wizard/RenderMultiField.tsx

@@ -83,7 +83,9 @@ const RenderMultiField = ({
 
 			// reset inputValue
 			setInputValue("");
-		}
+		} else {
+		setEditMode(false);
+	}
 	};
 
 	// Remove item/value from inserted field values
@@ -204,7 +206,11 @@ const ShowValue = ({
 	showCheck: boolean,
 }) => {
 	return (
-		<div onClick={() => setEditMode(true)} className="show-edit">
+	<div
+  		tabIndex={0}
+  		onClick={() => setEditMode(true)}
+  		className="show-edit"
+			>
 			{field.value instanceof Array && field.value.length !== 0 ? (
 				<ul>
 					{field.value.map((item, key) => (