diff --git a/src/components/ui/CountrySelect.jsx b/src/components/ui/CountrySelect.jsx
index 6ccd7e7..c713a1c 100644
--- a/src/components/ui/CountrySelect.jsx
+++ b/src/components/ui/CountrySelect.jsx
@@ -6,11 +6,10 @@ import CountriesJSON from "../../data/countries/countries.json";
 export default function CountrySelect({ label }) {
 	const { country, changeCountry } = useUser();
 	const { language, screensTranslations } = useUser();
-
 	const [isSubmenuOpen, setIsSubmenuOpen] = useState(false);
 
 	function handleChangeCountry(country) {
-		changeCountry({ name: country.fr, iso: country.alpha2 });
+		changeCountry({ name: country.fr, iso: country.alpha2, label: country[language.toLowerCase()] });
 		handleShowHideSubmenu();
 	}
 	function handleShowHideSubmenu() {
@@ -24,7 +23,6 @@ export default function CountrySelect({ label }) {
 		if (event.type === "click") {
 			// !event.target.closest(".country-select")
 			setIsSubmenuOpen(false);
-			console.log("click");
 		}
 	}, []);
 	const checkClick = useCallback((event) => {
@@ -43,7 +41,11 @@ export default function CountrySelect({ label }) {
 		};
 	}, [checkEsc, checkClick]);
 
-	const countryOptions = CountriesJSON.map((country) => (
+	const countryAlphabeticList = CountriesJSON.sort((a, b) =>
+		a[language.toLowerCase()].localeCompare(b[language.toLowerCase()])
+	);
+
+	const countryOptions = countryAlphabeticList.map((country) => (
 		<li key={uuidv4()} className='country-select__option' onClick={() => handleChangeCountry(country)}>
 			<img className='flag' src={`/img/flags/32x32/${country.alpha2}.png`} alt={country.fr} />
 			{country[language.toLowerCase()]}
@@ -62,7 +64,7 @@ export default function CountrySelect({ label }) {
 						src={`/img/flags/32x32/${country.iso}.png`}
 						alt={country.fr}
 					/>
-					{country.name}
+					{country.label}
 				</button>
 				<ul className='country-select__country-list' aria-hidden={!isSubmenuOpen}>
 					{countryOptions}