Fix hardcoded lang name in app header

pages/ide/brainfuck.tsx

@@ -14,7 +14,7 @@ const IDE: NextPage = () => {
         <title>{LANG_NAME} | Esolang Park</title>
       </Head>
       <div style={{ height: "100%", display: "flex", flexDirection: "column" }}>
-        <Header />
+        <Header langName={LANG_NAME} />
         <div style={{ flexGrow: 1 }}>
           <Mainframe langName={LANG_ID} provider={LangProvider} />
         </div>

pages/ide/deadfish.tsx

@@ -14,7 +14,7 @@ const IDE: NextPage = () => {
         <title>{LANG_NAME} | Esolang Park</title>
       </Head>
       <div style={{ height: "100%", display: "flex", flexDirection: "column" }}>
-        <Header />
+        <Header langName={LANG_NAME} />
         <div style={{ flexGrow: 1 }}>
           <Mainframe langName={LANG_ID} provider={LangProvider} />
         </div>

ui/header.tsx

@@ -2,7 +2,7 @@ import { Button, Card, Icon } from "@blueprintjs/core";
 import { GitHubIcon } from "./custom-icons";
 import { useDarkMode } from "./providers/dark-mode-provider";
 
-export const Header = () => {
+export const Header = ({ langName }: { langName: string }) => {
   const DarkMode = useDarkMode();
 
   const brandSection = (
@@ -14,7 +14,7 @@ export const Header = () => {
   );
 
   const langSection = (
-    <div style={{ flex: 0, textAlign: "center" }}>Brainfuck</div>
+    <div style={{ flex: 0, textAlign: "center" }}>{langName}</div>
   );
 
   const infoSection = (