moving combining pages to /explore

source/src/App.tsx

@@ -12,6 +12,7 @@ import Navbar from "./components/Navbar"
 import Footer from "./components/Footer"
 
 import PostList from "./pages/PostList"
+import Explore from "./pages/Explore"
 import Page from "./pages/Page"
 import NotFound from "./pages/NotFound"
 import Portfolio from "./pages/Portfolio"
@@ -224,11 +225,8 @@ export default class App extends React.Component<AppProps, AppState> {
 										/>
 									</Route>
 
-									<Route exact path="/archives">
+									<Route exact path="/explore">
-										<PostList
+										<Explore />
-											key="archives"
-											title="Archives"
-										/>
 									</Route>
 
 									<Route exact path="/portfolio">

source/src/data/NavbarData.tsx

@@ -1,12 +1,5 @@
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
-import {
+import { faHome, faUserTie, faHiking } from "@fortawesome/free-solid-svg-icons"
-	faHome,
-	faArchive,
-	faUserTie,
-	faHashtag,
-	faListUl,
-	faHiking,
-} from "@fortawesome/free-solid-svg-icons"
 
 // item from sidebar data
 export type Item = {
@@ -29,21 +22,6 @@ const NavbarData: Array<Item> = [
 		path: "/explore",
 		icon: <FontAwesomeIcon icon={faHiking} />,
 	},
-	{
-		title: "Categories",
-		path: "/categories",
-		icon: <FontAwesomeIcon icon={faListUl} />,
-	},
-	{
-		title: "Tags",
-		path: "/tags",
-		icon: <FontAwesomeIcon icon={faHashtag} />,
-	},
-	{
-		title: "Archives",
-		path: "/archives",
-		icon: <FontAwesomeIcon icon={faArchive} />,
-	},
 	{
 		title: "Portfolio",
 		path: "/portfolio",

source/src/pages/Explore.tsx

@@ -0,0 +1,46 @@
+import React from "react"
+import styled from "styled-components"
+import { Helmet } from "react-helmet-async"
+
+import theming from "../theming"
+
+const StyledNotFound = styled.div`
+	margin: auto;
+	margin-top: 2rem;
+	text-align: center;
+	color: ${(props) =>
+		theming.theme(props.theme.currentTheme, {
+			light: "#111111",
+			dark: "#EEEEEE",
+		})};
+`
+
+export default class Explore extends React.Component {
+	render() {
+		return (
+			<>
+				<Helmet>
+					<title>pomp | Explore</title>
+
+					<meta property="og:title" content="Explore" />
+					<meta property="og:type" content="website" />
+					<meta
+						property="og:url"
+						content={`${process.env.PUBLIC_URL}`}
+					/>
+					<meta
+						property="og:image"
+						content={`${process.env.PUBLIC_URL}/icon/icon.svg`}
+					/>
+					<meta
+						property="og:description"
+						content="search and explore"
+					/>
+				</Helmet>
+				<StyledNotFound className="card main-content">
+					Explore!!
+				</StyledNotFound>
+			</>
+		)
+	}
+}