diff --git a/src/components/MobileNavBar.tsx b/src/components/MobileNavBar.tsx index 94821b5..c5268cf 100644 --- a/src/components/MobileNavBar.tsx +++ b/src/components/MobileNavBar.tsx @@ -6,19 +6,19 @@ import { useRouter } from 'next/router'; import QuotaCount from './QuotaCount'; import Modal from './Modal'; -const NavBar: FC = () => { +const MobileNavBar: FC = () => { const { data: sessionData } = useSession(); const { asPath } = useRouter(); - const [ modalVisible, setModalVisible ] = useState(false); - + const [ mobileModalVisible, setMobileModalVisible ] = useState(false); + return (
{/* Top Nav */}
- +
{(sessionData) ? (
{sessionData.user.email}
) : (<>)} @@ -30,9 +30,9 @@ const NavBar: FC = () => {
- {(modalVisible) ? + {(mobileModalVisible) ? (
- +
) : (<>)} {/* Bottom Nav */} @@ -52,4 +52,4 @@ const NavBar: FC = () => { ) } -export default NavBar; \ No newline at end of file +export default MobileNavBar; \ No newline at end of file diff --git a/src/components/Modal.tsx b/src/components/Modal.tsx index 81bfc49..5c4bab1 100644 --- a/src/components/Modal.tsx +++ b/src/components/Modal.tsx @@ -15,12 +15,14 @@ const Modal: FC = ({ setModalVisibleCallback }) => { const handleYesNotification = () => { const res = setNotificationApi.mutateAsync({ isNotify: true }); + localStorage.setItem("modal_displayed", "true") setModalVisibleCallback(false); } const handleNoNotification = () => { const res = setNotificationApi.mutateAsync({ isNotify: false }); + localStorage.setItem("modal_displayed", "true") setModalVisibleCallback(false); } diff --git a/src/components/QuotaCount.tsx b/src/components/QuotaCount.tsx index c8eac5f..c3bf186 100644 --- a/src/components/QuotaCount.tsx +++ b/src/components/QuotaCount.tsx @@ -1,6 +1,6 @@ import { signIn, signOut, useSession } from 'next-auth/react'; import Link from 'next/link'; -import React, { useState, type FC } from 'react' +import React, { useState, type FC, useEffect } from 'react' import { api } from '~/utils/api'; interface QuotaCountProps { @@ -9,6 +9,8 @@ interface QuotaCountProps { const QuotaCount: FC = ({ setModalVisibleCallback }) => { + const [ localModalValue, setLocalModalValue ] = useState(false) + let searchQuota = 0; let generateQuota = 0; let bookmarkQuota = 0; @@ -25,12 +27,12 @@ const QuotaCount: FC = ({ setModalVisibleCallback }) => { if (modalDisplayed === null || modalDisplayed === "false") { //If modal_displayed is false or undefined setModalVisibleCallback(true) - localStorage.setItem("modal_displayed", "true") - //One more tRPC procedure to tell that the user has seen the Modal + } } } + return ( <>