change project url structure

web3index · Aug 31, 2021 · a032a1c · a032a1c · vercel · Aug 31, 2021
1 parent 4ae11e1
commit a032a1c
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 23 deletions.
diff --git a/components/ProjectHeader/index.tsx b/components/ProjectHeader/index.tsx
@@ -48,7 +48,7 @@ const ProjectHeader = ({ next, prev, color, ...props }) => {
               </StyledButton>
             </Link>
             <Box css={{ display: "flex", alignItems: "center" }}>
-              <Link href={`/project/${prev}`} passHref>
+              <Link href={`/${prev}`} passHref>
                 <StyledButton
                   css={{
                     padding: 0,
@@ -77,7 +77,7 @@ const ProjectHeader = ({ next, prev, color, ...props }) => {
                   </Box>
                 </StyledButton>
               </Link>
-              <Link href={`/project/${next}`} passHref>
+              <Link href={`/${next}`} passHref>
                 <StyledButton
                   css={{
                     padding: 0,

diff --git a/components/Table/index.tsx b/components/Table/index.tsx
@@ -94,11 +94,7 @@ const Table = ({ columns, data, ...props }) => {
           {firstPageRows.map((row, rowIndex) => {
             prepareRow(row);
             return (
-              <Link
-                key={rowIndex}
-                href={`/project/${row.values.slug}`}
-                passHref
-              >
+              <Link key={rowIndex} href={`/${row.values.slug}`} passHref>
                 <Box
                   as="a"
                   css={{

diff --git a/next.config.js b/next.config.js
@@ -7,6 +7,15 @@ const withMDX = require("@next/mdx")({
 
 const nextConfig = {
   pageExtensions: ["js", "jsx", "md", "mdx", "ts", "tsx"],
+  async redirects() {
+    return [
+      {
+        source: "/project/:slug",
+        destination: "/:slug",
+        permanent: false,
+      },
+    ];
+  },
 };
 
 module.exports = withMDX(nextConfig);
diff --git a/pages/project/[slug].tsx → pages/[slug].tsx b/pages/project/[slug].tsx → pages/[slug].tsx
@@ -1,29 +1,29 @@
 import Ajv from "ajv";
-import schema from "../../schema.json";
-import registry from "../../registry.json";
-import { trophies } from "../../lib/utils";
-import Layout from "../../layouts";
-import ProjectHeader from "../../components/ProjectHeader";
-import Box from "../../components/Box";
-import Section from "../../components/Section";
-import Container from "../../components/Container";
-import LineAndBarGraph from "../../components/LineAndBarGraph";
+import schema from "../schema.json";
+import registry from "../registry.json";
+import { trophies } from "../lib/utils";
+import Layout from "../layouts";
+import ProjectHeader from "../components/ProjectHeader";
+import Box from "../components/Box";
+import Section from "../components/Section";
+import Container from "../components/Container";
+import LineAndBarGraph from "../components/LineAndBarGraph";
 import { ResponsiveContainer } from "recharts";
 import { useEffect, useRef, useState } from "react";
 import { request, gql } from "graphql-request";
-import { styled } from "../../stitches.config";
-import Button from "../../components/Button";
+import { styled } from "../stitches.config";
+import Button from "../components/Button";
 import {
   TwitterLogoIcon,
   GitHubLogoIcon,
   Link1Icon,
   ExternalLinkIcon,
 } from "@modulz/radix-icons";
 import { NextSeo } from "next-seo";
-import seo from "../../next-seo.config";
+import seo from "../next-seo.config";
 import { useRouter } from "next/router";
-import { getProject } from "../api/projects/[id]";
-import { getProjects } from "../api/projects";
+import { getProject } from "./api/projects/[id]";
+import { getProjects } from "./api/projects";
 
 const SocialButton = ({ icon, children, ...props }) => {
   const SocialButton = styled(Button, {
@@ -114,14 +114,14 @@ const Project = ({ slug, index, projects, project }) => {
           index === 0
             ? projects[projects.length - 1]?.slug
             : projects[index - 1]?.slug;
-        router.push(`/project/${prev}`);
+        router.push(`/${prev}`);
       }
       if (key === "ArrowRight") {
         const next =
           index === projects.length - 1
             ? projects[0]?.slug
             : projects[index + 1]?.slug;
-        router.push(`/project/${next}`);
+        router.push(`/${next}`);
       }
     }
     window.addEventListener("keydown", downHandler);