Improve voices list of sample sites - group voices by language

jsakamoto · May 30, 2024 · c6a8073 · c6a8073
1 parent 263cf97
commit c6a8073
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/SampleSites/Components/Pages/Index.razor b/SampleSites/Components/Pages/Index.razor
@@ -22,9 +22,14 @@
         Voice:
         <select @onchange="OnChangeVoice" style="max-width:100%;">
             <option value="@(default(string))">(unset)</option>
-            @foreach (var voice in Voices.OrderBy(v => v.Lang).ThenBy(v => v.VoiceURI))
+            @foreach (var voicesOfLang in Voices.GroupBy(v => v.Lang))
             {
-                <option @key="voice.VoiceIdentity" value="@voice.VoiceIdentity" selected="@(voice.VoiceIdentity == this.VoiceId)">@voice.Name (@voice.Lang)</option>
+                <optgroup label="@voicesOfLang.Key">
+                    @foreach (var voice in voicesOfLang.OrderBy(v => v.Lang).ThenBy(v => v.VoiceURI))
+                    {
+                        <option @key="voice.VoiceIdentity" value="@voice.VoiceIdentity" selected="@(voice.VoiceIdentity == this.VoiceId)">@voice.Name</option>
+                    }
+                </optgroup>
             }
         </select>
     </p>