diff --git a/src/client/features/auth/AuthWrapper.tsx b/src/client/features/auth/AuthWrapper.tsx
index ddfaefec..0fc89cb6 100644
--- a/src/client/features/auth/AuthWrapper.tsx
+++ b/src/client/features/auth/AuthWrapper.tsx
@@ -1,5 +1,6 @@
import { JSX, PropsWithChildren } from 'react';
+import { Spinner } from '@nextui-org/react';
import { useQuery } from '@tanstack/react-query';
import { useRouter } from 'next/router';
import { LOGIN_PAGE_URL } from 'src/common/common-constants';
@@ -20,11 +21,12 @@ const AuthWrapper = ({ children }: PropsWithChildren): JSX.Element => {
setToken('');
void router.replace(LOGIN_PAGE_URL);
}
+ return {};
},
queryKey: [CHECK_AUTH_TOKEN_QUERY_KEY],
refetchOnMount: false,
});
- return <>{isLoading ? 'Loading... ' : children};
+ return <>{isLoading ?
: children};
};
export default AuthWrapper;
diff --git a/src/client/features/auth/LoginButton.tsx b/src/client/features/auth/LoginButton.tsx
index 17d6e583..813b7fd9 100644
--- a/src/client/features/auth/LoginButton.tsx
+++ b/src/client/features/auth/LoginButton.tsx
@@ -1,7 +1,7 @@
'use client';
import { JSX, useCallback } from 'react';
-import { Button } from '@mui/base/Button';
+import { Button } from '@nextui-org/react';
import { useRouter } from 'next/router';
import { useAuthToken } from 'src/client/features/auth/hooks/use-auth-token';
import { useAuthorized } from 'src/client/features/auth/hooks/use-authorized';
diff --git a/src/client/features/blog/BlogList.tsx b/src/client/features/blog/BlogList.tsx
index e305eaa3..2f312faf 100644
--- a/src/client/features/blog/BlogList.tsx
+++ b/src/client/features/blog/BlogList.tsx
@@ -6,7 +6,7 @@ import { useBlogListQuery } from './hooks/use-blog-list-query';
const BlogList = (): JSX.Element => {
const { data: blogList = [], error, isFetching } = useBlogListQuery();
return (
-
+
{error &&
Failed to load
}
{isFetching ?
Loading...
: blogList.map((item) =>
)}
diff --git a/src/client/features/blog/BlogListItem.tsx b/src/client/features/blog/BlogListItem.tsx
index a7d5027e..06b496b8 100644
--- a/src/client/features/blog/BlogListItem.tsx
+++ b/src/client/features/blog/BlogListItem.tsx
@@ -1,6 +1,6 @@
import type { JSX } from 'react';
-import { Button } from '@mui/base';
+import { Button } from '@nextui-org/react';
import Link from 'next/link';
import { BLOG_PAGE_URL } from 'src/common/common-constants';
import { dayjs } from 'src/common/common-date';
@@ -11,7 +11,7 @@ import styles from './BlogListItem.module.scss';
const BlogListItem = ({ item }: BlogListItemProps): JSX.Element => {
const { _id: itemId, date, title, link, linkCaption } = item;
return (
-
+
{dayjs(date).utc().format('MMMM DD, YYYY')}
{title}
{link}
diff --git a/src/client/features/career/CareerList.tsx b/src/client/features/career/CareerList.tsx
index a5e3c7a2..dda80ea2 100644
--- a/src/client/features/career/CareerList.tsx
+++ b/src/client/features/career/CareerList.tsx
@@ -6,7 +6,7 @@ import { useCareerListQuery } from './hooks/use-career-list-query';
const CareerList = (): JSX.Element => {
const { data: careerList = [], error, isFetching } = useCareerListQuery();
return (
-
+
{error &&
Failed to load
}
{isFetching ?
Loading...
: careerList.map((item) =>
)}
diff --git a/src/client/features/career/CareerListItem.tsx b/src/client/features/career/CareerListItem.tsx
index 1f162f35..5ba7570f 100644
--- a/src/client/features/career/CareerListItem.tsx
+++ b/src/client/features/career/CareerListItem.tsx
@@ -1,6 +1,6 @@
import type { JSX } from 'react';
-import { Button } from '@mui/base';
+import { Button } from '@nextui-org/react';
import Link from 'next/link';
import { CAREER_PAGE_URL } from 'src/common/common-constants';
import { dayjs } from 'src/common/common-date';
@@ -11,7 +11,7 @@ import styles from './CareerListItem.module.scss';
const CareerListItem = ({ item }: CareerListItemProps): JSX.Element => {
const { _id: itemId, endDate, description, post, site, startDate, title, tools } = item;
return (
-
+
{title}
{dayjs(startDate).utc().format('MMMM DD, YYYY')}
diff --git a/src/client/features/career/CareerModal.tsx b/src/client/features/career/CareerModal.tsx
index 6bf6a65f..acf8d83f 100644
--- a/src/client/features/career/CareerModal.tsx
+++ b/src/client/features/career/CareerModal.tsx
@@ -2,7 +2,7 @@ import type { JSX } from 'react';
import { useCallback } from 'react';
import DatePicker from 'react-datepicker';
-import { Button } from '@mui/base/Button';
+import { Button } from '@nextui-org/react';
import { useMutation } from '@tanstack/react-query';
import { Field, Form, Formik } from 'formik';
import CommonModal from 'src/common/components/CommonModal';
@@ -32,9 +32,9 @@ const CareerModal = (): JSX.Element => {
);
return (
-
+
initialValues={initialValues} onSubmit={onSubmit}>
-
{error && error.message}
-
+
diff --git a/src/client/features/summary/Summary.tsx b/src/client/features/summary/Summary.tsx
index d49c44a8..897fd8e4 100644
--- a/src/client/features/summary/Summary.tsx
+++ b/src/client/features/summary/Summary.tsx
@@ -7,7 +7,7 @@ import ApiLink from 'src/common/components/ApiLink';
import styles from './Summary.module.scss';
const Summary = (): JSX.Element => (
-
+
-
Blog page
diff --git a/src/common/components/CommonModal.module.scss b/src/common/components/CommonModal.module.scss
deleted file mode 100644
index ec86e765..00000000
--- a/src/common/components/CommonModal.module.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-@import 'src/assets/colors';
-@import 'src/assets/variables';
-
-.modal {
- background-color: $darkBlueColor;
- opacity: 0.6;
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- padding: $padding-lg;
-}
-
-.content {
- background-color: white;
- border-radius: $border;
- border: $border $purpleColor solid;
- padding: $padding-md;
- position: relative;
-}
diff --git a/src/common/components/CommonModal.tsx b/src/common/components/CommonModal.tsx
index e09219bc..b3a103c0 100644
--- a/src/common/components/CommonModal.tsx
+++ b/src/common/components/CommonModal.tsx
@@ -1,15 +1,23 @@
import type { JSX, PropsWithChildren } from 'react';
-import { Modal } from '@mui/base/Modal';
+import { Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Spinner } from '@nextui-org/react';
-import styles from './CommonModal.module.scss';
import { ModalProps } from './commpon-components-types';
-const CommonModal = ({ children, isLoading, isOpen, handleClose }: PropsWithChildren): JSX.Element => (
-
-
- {isLoading ?
Loading...
: children}
-
{children}
+ {children}
diff --git a/src/common/components/Navigation.tsx b/src/common/components/Navigation.tsx
index 3990f032..77540909 100644
--- a/src/common/components/Navigation.tsx
+++ b/src/common/components/Navigation.tsx
@@ -7,8 +7,8 @@ import ApiLink from './ApiLink';
import styles from './Navigation.module.scss';
const Navigation = (): ReactElement => (
-