Reactでログイン、登録ページでエラーが出る

前提

現在ポートフォリオを作成しており、
<MuiNavbar />　というヘッダーを表示したいのですが、
エラーになってしまいます。

URL
https://manga-kousatu-net.vercel.app/

github
https://github.com/takoyan33/manga-kousatu.net/tree/new-main

実現したいこと

発生している問題・エラーメッセージ

他のページだと表示されているのですが、
なぜかlogin.tsx,register.tsxだと下記のエラーが出てしまいます。
どちらもログインしていない状態で使うページなので、
そこの関係だと考えたのですが、なぜか分かりません。
よろしくお願いします。

エラーメッセージ
Unhandled Runtime Error
FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).

Source
layouts/components/MuiNavbar.tsx (33:22) @ MuiNavbar

  31 | 
  32 |   let router = useRouter();
> 33 |   const auth = getAuth();
     |                      ^
  34 |   const user = auth.currentUser;
  35 |   console.log(user);
  36 |

該当のソースコード

JavaScript
1#login.tsx
2import { app } from "../firebaseConfig";
3import { getAuth } from "firebase/auth";
4import { useRouter } from "next/router";
5import { useEffect } from "react";
6import { MuiNavbar } from "../layouts/components/MuiNavbar";
7import Head from "next/head";
8import Loginauth from "./api/auth/Loginauth";
9
10export default function Login() {
11  const router = useRouter();
12
13  return (
14    <div>
15      <Head>
16        <title>Manga Study/ログイン</title>
17        <meta name="description" content="漫画考察.net" />
18        <link rel="icon" href="/favicon.ico" />
19      </Head>
20
21      <MuiNavbar />
22      <div className="max-w-7xl m-auto">
23        <h2 className="m-5 my-12 text-center text-2xl font-semibold">
24          ログイン
25        </h2>
26
27        <Loginauth />
28      </div>
29    </div>
30  );
31}

JavaScript
1#MuiNaver.tsx
2import { AppBar, Toolbar, Button, Stack } from "@mui/material";
3import { useState } from "react";
4import Link from "next/link";
5import { database, app } from "../../firebaseConfig.js";
6import { collection } from "firebase/firestore";
7import { useRouter } from "next/router";
8import { getAuth, signOut } from "firebase/auth";
9import Box from "@mui/material/Box";
10import Avatar from "@mui/material/Avatar";
11import Menu from "@mui/material/Menu";
12import MenuItem from "@mui/material/MenuItem";
13import ListItemIcon from "@mui/material/ListItemIcon";
14import Divider from "@mui/material/Divider";
15import IconButton from "@mui/material/IconButton";
16import Typography from "@mui/material/Typography";
17import Settings from "@mui/icons-material/Settings";
18import Logout from "@mui/icons-material/Logout";
19import React from "react";
20import Tooltip from "@mui/material/Tooltip";
21import Image from "next/image";
22
23export const MuiNavbar = () => {
24  const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
25  const open = Boolean(anchorEl);
26  const handleClick = (event: React.MouseEvent<HTMLElement>) => {
27    setAnchorEl(event.currentTarget);
28  };
29  const handleClose = () => {
30    setAnchorEl(null);
31  };
32
33  let router = useRouter();
34  const auth = getAuth();
35  const user = auth.currentUser;
36  console.log(user);
37
38  const logout = () => {
39    sessionStorage.removeItem("Token");
40
41    signOut(auth)
42      .then(() => {
43        alert("ログアウトしました");
44        router.push("/");
45      })
46      .catch((error) => {
47        alert("ログアウトに失敗しました");
48      });
49  };
50
51  return (
52    <AppBar position="static" color="transparent" className="w-full m-0">
53      <Box
54        sx={{ display: "flex", alignItems: "center", textAlign: "center" }}
55        className="w-full m-0"
56      >
57        <Toolbar className="w-full m-0">
58          <Typography
59            variant="h6"
60            component="div"
61            sx={{ flexGrow: 1, textAlign: "left" }}
62          >
63            <Link href="/">
64              <Image
65                src="/magastudylogo.png"
66                width="200"
67                height="30"
68                alt="ロゴ"
69              />
70            </Link>
71          </Typography>
72          <Tooltip title="Account settings">
73            <IconButton
74              onClick={handleClick}
75              size="small"
76              sx={{ ml: 2 }}
77              aria-controls={open ? "account-menu" : undefined}
78              aria-haspopup="true"
79              aria-expanded={open ? "true" : undefined}
80            >
81              <Avatar sx={{ width: 32, height: 32 }}>=</Avatar>
82            </IconButton>
83          </Tooltip>
84        </Toolbar>
85      </Box>
86
87      <Menu
88        anchorEl={anchorEl}
89        id="account-menu"
90        open={open}
91        onClose={handleClose}
92        onClick={handleClose}
93        PaperProps={{
94          elevation: 0,
95          sx: {
96            overflow: "visible",
97            filter: "drop-shadow(0px 2px 8px rgba(0,0,0,0.32))",
98            mt: 1.5,
99            "& .MuiAvatar-root": {
100              width: 32,
101              height: 32,
102              ml: -0.5,
103              mr: 1,
104            },
105            "&:before": {
106              content: '""',
107              display: "block",
108              position: "absolute",
109              top: 0,
110              right: 14,
111              width: 10,
112              height: 10,
113              bgcolor: "background.paper",
114              transform: "translateY(-50%) rotate(45deg)",
115              zIndex: 0,
116            },
117          },
118        }}
119        transformOrigin={{ horizontal: "right", vertical: "top" }}
120        anchorOrigin={{ horizontal: "right", vertical: "bottom" }}
121      >
122        <Divider />
123        <MenuItem>
124          <ListItemIcon>
125            <Settings fontSize="small" />
126          </ListItemIcon>
127          <Link href="/about">About</Link>
128        </MenuItem>
129        {user && (
130          <>
131            <MenuItem>
132              {user.photoURL && (
133                <Image
134                  className="m-auto text-center max-w-sm"
135                  height={30}
136                  width={30}
137                  src={user.photoURL}
138                />
139              )}
140
141              <Link href="/profile">プロフィール</Link>
142            </MenuItem>
143            <MenuItem>
144              <Button color="inherit" onClick={logout}>
145                <Logout fontSize="small" />
146                ログアウト
147              </Button>
148            </MenuItem>
149          </>
150        )}
151        {!user && (
152          <>
153            <MenuItem>
154              <ListItemIcon>
155                <Logout fontSize="small" />
156              </ListItemIcon>
157              <Link href="/login">ログイン</Link>
158            </MenuItem>
159            <MenuItem>
160              <ListItemIcon>
161                <Logout fontSize="small" />
162              </ListItemIcon>
163              <Link href="/register">新規登録</Link>
164            </MenuItem>
165          </>
166        )}
167      </Menu>
168    </AppBar>
169  );
170};
171
172

試したこと

補足情報（FW/ツールのバージョンなど）

{
"name": "croud-next",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build && next export",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@emotion/react": "^11.10.4",
"@emotion/styled": "^11.9.3",
"@fortawesome/fontawesome-svg-core": "^6.1.1",
"@fortawesome/free-brands-svg-icons": "^6.1.1",
"@fortawesome/free-solid-svg-icons": "^6.1.1",
"@fortawesome/react-fontawesome": "^0.2.0",
"@hookform/resolvers": "^2.9.7",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"@mui/icons-material": "^5.8.4",
"@mui/material": "^5.0.0-rc.1",
"@mui/styled-engine-sc": "^5.0.0-rc.1",
"draft-js": "^0.11.7",
"draftjs-to-html": "^0.9.1",
"firebase": "^9.8.4",
"moment": "^2.29.4",
"next": "12.1.6",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-draft-wysiwyg": "^1.15.0",
"react-hook-form": "^7.34.2",
"react-image-resizer": "^1.3.0",
"react-spinners": "^0.13.4",
"react-tag-input": "^6.8.1",
"react-tag-input-component": "^1.1.1",
"styled-components": "^5.3.5",
"yup": "^0.32.11"
},
"devDependencies": {
"@types/node": "^18.0.3",
"@types/react": "^18.0.15",
"autoprefixer": "^10.4.7",
"eslint": "8.18.0",
"eslint-config-next": "12.1.6",
"postcss": "^8.4.14",
"tailwindcss": "^3.1.4",
"typescript": "^4.7.4"
}
}