fix: ProblemInfoMenu: display language as human-readable label

src/components/ProblemInfoMenu.tsx

@@ -19,6 +19,7 @@ import {
 } from "@chakra-ui/react";
 import { Link as ReactRouterLink } from "react-router-dom";
 import type { DetailResponse, RuntimeInfo } from "../app/services/problem";
+import { LanguageMap } from "./Languages";
 
 const TitleItem = ({ word }: { word: string }) => (
     <h2>
@@ -76,7 +77,7 @@ export default function ProblemInfoMenu(props: ProblemInfoMenuProps) {
                             {props.data?.context.Languages.map((l) => (
                                 <WrapItem key={l.Lang}>
                                     <Tag variant="outline" size="sm" colorScheme="pink">
-                                        {l.Lang}
+                                        {LanguageMap[l.Lang].label}
                                     </Tag>
                                 </WrapItem>
                             ))}
@@ -122,7 +123,7 @@ export default function ProblemInfoMenu(props: ProblemInfoMenuProps) {
                         <Select size="sm" onChange={(e) => setLang(e.target.value)} value={lang}>
                             {props.data?.context.Languages.map((l) => (
                                 <option key={l.Lang} value={l.Lang}>
-                                    {l.Lang}
+                                    {LanguageMap[l.Lang].label}
                                 </option>
                             ))}
                         </Select>