complete edit and details part of loan

src/core/components/SelectBox.jsx

@@ -9,23 +9,22 @@ function SelectBox({
                        handleChange,
                        error,
                        onBlur,
+                       schema,
                        disabled,
                        helperText,
                        isLoading,
                        errorEcured,
-                       variant
+                       variant = "outlined"
                    }) {
     const t = useTranslations();
 
     return (
         <FormControl
             disabled={disabled || false}
-            variant={variant || "outlined"}
-            margin="normal"
+            variant={variant}
             fullWidth
             size="small"
             error={error}
-            sx={{mt: 0}}
         >
             <InputLabel>{label}</InputLabel>
             <Select
@@ -38,16 +37,15 @@ function SelectBox({
 
             >
                 {isLoading ? (
-                    <MenuItem
-                        sx={{color: "primary.main"}}>{t("LoanRequest.text_field_loading_provinces_list")}</MenuItem>
+                    <MenuItem sx={{color: "primary.main"}}>{t("text_field_loading")}</MenuItem>
                 ) : errorEcured ? (
                     <MenuItem sx={{color: "secondary.main"}}>
-                        {t("LoanRequest.text_field_error_fetching_provinces")}
+                        {t("text_field_error_fetching")}
                     </MenuItem>
                 ) : (
                     selectors.map((selector) => (
-                        <MenuItem key={selector.id} value={selector.value}>
-                            {selector.name}
+                        <MenuItem key={selector.id} value={selector[schema.value]}>
+                            {selector[schema.name]}
                         </MenuItem>
                     ))
                 )}