From b0110f20d2312c0017719012703a1c8e2ee8b498 Mon Sep 17 00:00:00 2001
From: Gazook89 <58999374+Gazook89@users.noreply.github.com>
Date: Sun, 23 Oct 2022 22:05:21 -0500
Subject: [PATCH] add alphabetic sort, add keys, minor changes

---
 client/homebrew/editor/metadataEditor/metadataEditor.jsx | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
index ff6edbfa9..4f39f4d1b 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
@@ -254,14 +254,12 @@ const MetadataEditor = createClass({
 	renderLanguageDropdown : function(){
 		const langCodes = ['en', 'de', 'fr', 'ja', 'es', 'it'];
 		const listLanguages = ()=>{
-			return _.map(langCodes, (code)=>{
+			return _.map(langCodes.sort(), (code, index)=>{
 				const languageNames = new Intl.DisplayNames([code], { type: 'language' });
-				return <option value={`${code}`}>{`${languageNames.of(code)}`}</option>;
+				return <option key={index} value={`${code}`}>{`${languageNames.of(code)}`}</option>;
 			});
 		};
 
-
-
 		return <div className='field language'>
 			<label>language</label>
 			<input type='text' className='value'
@@ -274,11 +272,10 @@ const MetadataEditor = createClass({
 			<datalist id='languageList'>
 				{listLanguages()}
 			</datalist>
-			<span class='validity'>Must be 2-3 letters, optionally followed by '-...'</span>
+			<span className='validity'>Must be 2-3 letters, optionally followed by '-...'</span>
 		</div>;
 	},
 
-
 	render : function(){
 		return <div className='metadataEditor'>
 			<div className='field title'>