Upgrade dependencies

package.json

@@ -11,21 +11,21 @@
     "test-ci": "jest --ci --coverage"
   },
   "dependencies": {
-    "@codesandbox/sandpack-react": "^0.19.0",
+    "@codesandbox/sandpack-react": "^0.19.6",
     "@docsearch/react": "3",
     "@giscus/react": "^2.0.3",
     "@mapbox/rehype-prism": "^0.8.0",
     "@mdx-js/loader": "^2.1.1",
     "@mdx-js/react": "^2.1.1",
-    "@next/mdx": "^12.1.5",
+    "@next/mdx": "^12.1.6",
     "algoliasearch": "^4.13.0",
     "classnames": "^2.3.1",
     "dayjs": "^1.11.1",
-    "next": "12.1.5",
+    "next": "12.1.6",
     "next-compose-plugins": "^2.2.1",
     "next-themes": "^0.1.1",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
     "react-icons": "^4.3.1",
     "rehype-react": "^7.1.1",
     "rehype-slug": "^5.0.1",
@@ -36,18 +36,18 @@
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.1.1",
-    "@types/jest": "^27.4.1",
-    "@types/node": "17.0.25",
-    "@types/react": "18.0.6",
-    "autoprefixer": "^10.4.4",
+    "@types/jest": "^27.5.0",
+    "@types/node": "17.0.31",
+    "@types/react": "18.0.8",
+    "autoprefixer": "^10.4.7",
     "dotenv": "^16.0.0",
-    "eslint": "8.13.0",
-    "eslint-config-next": "12.1.5",
+    "eslint": "8.14.0",
+    "eslint-config-next": "12.1.6",
     "gray-matter": "^4.0.3",
-    "jest": "^27.5.1",
+    "jest": "^28.0.3",
     "nanoid": "^3.3.3",
-    "postcss": "^8.4.12",
+    "postcss": "^8.4.13",
     "tailwindcss": "^3.0.24",
-    "typescript": "4.6.3"
+    "typescript": "4.6.4"
   }
 }

pages/blog.tsx

@@ -3,10 +3,8 @@ import { ReactElement } from 'react';
 import { postLists } from 'lib/posts';
 import cn from 'classnames';
 import dynamic from 'next/dynamic';
+import PostCardLoading from 'components/RUA/loading/PostCardLoading'
 
-const PostCardLoading = dynamic(
-  () => import('components/RUA/loading/PostCardLoading')
-);
 const PostCard = dynamic(() => import('components/PostCard'), {
   loading: () => <PostCardLoading />,
 });

pages/gists.tsx

@@ -8,8 +8,8 @@ import avatar from 'public/images/img/avatar.svg';
 import Link from 'next/link';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
+import Loading from 'components/RUA/loading/RUALoading'
 
-const Loading = dynamic(() => import('components/RUA/loading/RUALoading'));
 const MainLayout = dynamic(() => import('layouts/MainLayout'));
 const GistsCode = dynamic(() => import('components/gists/GistsCode'), {
   loading: () => <Loading />,