Merge pull request #41 from iranpsc/feat/about-me

fix aboutMe bugs

Author: m6hdix

src/components/Button.jsx

@@ -3,6 +3,7 @@ import loaderGif from "../assets/gif/ajax-loader.gif";
 
 const ButtonElement = styled.button`
   border-radius: 10px;
+  white-space: nowrap;
   background-color: ${(props) =>
     props.color
       ? props.disabled

src/pages/Settings/Tabs/aboutme-tab/AboutMeTab.jsx

@@ -14,6 +14,7 @@ const Container = styled.div`
   height: 100%;
   overflow-y: auto;
   padding-right: 15px;
+  padding-left: 1%;
  
 `;
 

src/pages/Settings/Tabs/aboutme-tab/CountryCity.jsx

@@ -32,6 +32,7 @@ const Label = styled.label`
 
 const CountryCity = () => {
   const { state, dispatch } = useGlobalState();
+  
   const [fields, setFields] = useState({
     cities: [],
     countries: [],
@@ -42,6 +43,7 @@ const CountryCity = () => {
   useEffect(() => {
     if (!isFieldsLoaded) {
       const loadFields = () => {
+
         setFields({
           cities: getFieldsByTabName("misc", "iranian-cities"),
           countries: getFieldsByTabName("misc", "countries"),
@@ -53,20 +55,25 @@ const CountryCity = () => {
     }
   }, [isFieldsLoaded]);
 
-  const getTranslation = (fieldsType, stateValue) => {
-    if (!isFieldsLoaded) return "";
-    const selectedField = fields[fieldsType].find(
-      (field) => field.name.trim().toLowerCase() === stateValue?.trim().toLowerCase()
-    );
-    return selectedField ? selectedField.translation : "";
-  };
+ const getTranslation = (fieldsType, stateValue) => {
+  if (!isFieldsLoaded) return "";
+  const selectedField = fields[fieldsType].find(
+    (field) =>
+      field?.name &&
+      field.name.trim().toLowerCase() === stateValue?.trim().toLowerCase()
+  );
+  return selectedField ? selectedField.translation : "";
+};
 
-  const handleFieldChange = (fieldsType, translation, actionType) => {
-    const selectedField = fields[fieldsType].find((field) => field.translation === translation);
-    if (selectedField) {
-      dispatch({ type: actionType, payload: selectedField.name });
-    }
-  };
+
+ const handleFieldChange = (fieldsType, translation, actionType) => {
+  const selectedField = fields[fieldsType].find(
+    (field) => field?.translation === translation
+  );
+  if (selectedField) {
+    dispatch({ type: actionType, payload: selectedField.name });
+  }
+};
 
   const options = [
     {

src/pages/Settings/Tabs/aboutme-tab/EducationsAndJob.jsx

@@ -73,14 +73,14 @@ const EducationsAndJob = () => {
     <Container>
       <div>
         <Label htmlFor="education">
-          {getFieldTranslationByNames("479")}
+          {getFieldTranslationByNames("1440")}
         </Label>
         <Select
           id="education"
           value={state.education || ""} 
           onChange={handleEducationChange}
         >
-          <option value="">{getFieldTranslationByNames("479")}</option>
+          <option value="">{getFieldTranslationByNames("1440")}</option>
           {educationFields.map((field) => (
             <option key={field.name} value={field.name}>
               {field.translation}

src/pages/Settings/Tabs/aboutme-tab/SaveInfo.jsx

@@ -65,7 +65,7 @@ const SaveInfo = () => {
             {getFieldTranslationByNames("780")}
           </p>
         </Text>
-        <Button label={getFieldTranslationByNames("782")} fit onclick={saveData} />
+        <Button  label={getFieldTranslationByNames("782")} fit onclick={saveData} />
       </Header>
     </>
   );