Skip to content

Commit 5e0e195

Browse files
imranhsayedimranhsayed
committed
Update readme
1 parent 184170b commit 5e0e195

File tree

17 files changed

+254
-217
lines changed

17 files changed

+254
-217
lines changed

‎frontend/next.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
const path = require("path");
22
module.exports = {
3-
trailingSlash: false,
3+
trailingSlash: true,
44
webpackDevMiddleware: (config) => {
55
config.watchOptions = {
66
poll: 1000,

‎frontend/package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,11 +26,11 @@
2626
"dompurify": "^2.0.15",
2727
"graphql": "^15.3.0",
2828
"lodash": "^4.17.20",
29-
"next": "^10.0.0",
29+
"next": "^10.0.1",
3030
"nprogress": "^0.2.0",
3131
"prop-types": "^15.7.2",
32-
"react": "^16.13.1",
33-
"react-dom": "^16.13.1",
32+
"react": "^17.0.1",
33+
"react-dom": "^17.0.1",
3434
"react-lazy-load-image-component": "^1.5.0",
3535
"sass": "^1.26.11"
3636
},

‎frontend/pages/[...slug].js

Lines changed: 33 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,17 @@
11
import Layout from "../src/components/layout";
22
import client from "../src/apollo/client";
3-
import { GET_PAGE } from "../src/queries/get-page";
4-
import { GET_MENUS } from "../src/queries/get-menus";
3+
import { GET_PAGE } from "../src/queries/pages/get-page";
4+
import { GET_PAGES } from "../src/queries/pages/get-pages";
55
import { sanitize } from "../src/utils/functions";
66
import { useRouter } from "next/router";
7+
import { customPagesSlugs } from "../src/utils/slugs";
78

8-
const Page = ({ menus, page, path }) => {
9+
const Page = ({ data }) => {
910
const router = useRouter();
10-
11-
// @TODO 'path' variable can be used later to render custom templates.
12-
console.warn("page", router.query.slug);
11+
const { page } = data;
1312

1413
return (
15-
<Layout menus={menus}>
14+
<Layout data={data}>
1615
<div>
1716
<h1 dangerouslySetInnerHTML={{ __html: sanitize(page?.title) }} />
1817
<div dangerouslySetInnerHTML={{ __html: sanitize(page?.content) }} />
@@ -33,9 +32,14 @@ export async function getStaticProps({ params }) {
3332

3433
return {
3534
props: {
36-
menus: data?.headerMenus?.edges ?? [],
37-
page: data?.page ?? {},
38-
path: params?.slug.join("/"),
35+
data: {
36+
menus: {
37+
headerMenus: data?.headerMenus?.edges || [],
38+
footerMenus: data?.footerMenus?.edges || []
39+
},
40+
page: data?.page ?? {},
41+
path: params?.slug.join("/"),
42+
}
3943
},
4044
/**
4145
* Revalidate means that if a new request comes to server, then every 1 sec it will check
@@ -63,21 +67,26 @@ export async function getStaticProps({ params }) {
6367
*
6468
* @returns {Promise<{paths: [], fallback: boolean}>}
6569
*/
66-
export async function getStaticPaths() {
67-
const { data, loading, networkStatus } = await client.query({
68-
query: GET_MENUS,
69-
});
70+
export async function getStaticPaths () {
71+
const { data } = await client.query({
72+
query: GET_PAGES
73+
})
7074

71-
const pathsData = [];
75+
const pathsData = [];
7276

73-
(data?.headerMenus?.edges ?? []).map((item) => {
74-
const pathArray = item.node.path.split("/");
75-
const filteredPaths = pathArray.filter((path) => "" !== path);
76-
pathsData.push({ params: { slug: filteredPaths } });
77-
});
77+
(data?.pages?.nodes ?? []).map((page) => {
78+
/**
79+
* Check if slug existsing and exclude the custom pages, from dynamic pages creation
80+
* as they will automatically be generated when we create their respective directories
81+
* with their names under 'pages'.
82+
*/
83+
if ( page?.slug && !customPagesSlugs.includes(page?.slug)) {
84+
pathsData.push({ params: { slug: [page?.slug] } })
85+
}
86+
})
7887

79-
return {
80-
paths: pathsData,
81-
fallback: false,
82-
};
88+
return {
89+
paths: pathsData,
90+
fallback: false
91+
}
8392
}

‎frontend/pages/blog/[slug].js

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,12 @@ import { sanitize } from "../../src/utils/functions";
66
import Image from "../../src/components/image";
77
import DisqusComment from "../../src/components/blog/discuss-comments";
88

9-
const SingleBlog = ({menus, post, path}) => {
9+
const SingleBlog = ({data}) => {
10+
11+
const { post } = data;
12+
1013
return (
11-
<Layout menus={menus}>
14+
<Layout data={data}>
1215
<div className="flex my-8">
1316
<div className="w-3/4">
1417
<h1 className="mb-4" dangerouslySetInnerHTML={{__html: sanitize(post.title)}}/>
@@ -36,9 +39,14 @@ export async function getStaticProps({ params }) {
3639

3740
return {
3841
props: {
39-
menus: data?.headerMenus?.edges ?? [],
40-
post: data?.post ?? {},
41-
path: params?.slug
42+
data: {
43+
menus: {
44+
headerMenus: data?.headerMenus?.edges || [],
45+
footerMenus: data?.footerMenus?.edges || []
46+
},
47+
post: data?.post ?? {},
48+
path: params?.slug
49+
}
4250
},
4351
};
4452
}

‎frontend/pages/blog/index.js

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ import { PER_PAGE_FIRST, totalPagesCount } from "../../src/utils/pagination";
55
import Pagination from "../../src/components/blog/pagination";
66
import Posts from "../../src/components/blog/posts";
77

8-
const Blog = ({ menus, posts }) => {
9-
const pagesCount = totalPagesCount(posts?.pageInfo?.offsetPagination?.total ?? 0);
8+
const Blog = ({ data }) => {
9+
const pagesCount = totalPagesCount(data?.posts?.pageInfo?.offsetPagination?.total ?? 0);
1010

1111
return (
12-
<Layout menus={menus}>
13-
<Posts posts={posts}/>
12+
<Layout data={data}>
13+
<Posts posts={data?.posts}/>
1414
<Pagination pagesCount={pagesCount} postName="blog" />
1515
</Layout>
1616
);
@@ -19,7 +19,7 @@ const Blog = ({ menus, posts }) => {
1919
export default Blog;
2020

2121
export async function getStaticProps() {
22-
const { data, loading, networkStatus } = await client.query({
22+
const { data } = await client.query({
2323
query: GET_POSTS,
2424
variables: {
2525
perPage: PER_PAGE_FIRST,
@@ -29,8 +29,13 @@ export async function getStaticProps() {
2929

3030
return {
3131
props: {
32-
menus: data?.headerMenus?.edges ?? [],
33-
posts: data?.posts,
32+
data: {
33+
menus: {
34+
headerMenus: data?.headerMenus?.edges || [],
35+
footerMenus: data?.footerMenus?.edges || []
36+
},
37+
posts: data?.posts,
38+
}
3439
},
3540
revalidate: 1,
3641
};

‎frontend/pages/blog/page/[page_no].js

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@ import Layout from "../../../src/components/layout";
66
import Pagination from "../../../src/components/blog/pagination";
77
import Posts from "../../../src/components/blog/posts";
88

9-
const Page = ({ menus, posts }) => {
9+
const Page = ({data}) => {
10+
const { posts } = data;
1011
const router = useRouter();
1112

1213
const { pageInfo } = posts ?? {};
@@ -22,7 +23,7 @@ const Page = ({ menus, posts }) => {
2223
}
2324

2425
return (
25-
<Layout menus={menus}>
26+
<Layout data={data}>
2627
<Posts posts={posts}/>
2728
<Pagination pagesCount={pagesCount} postName="blog" />
2829
</Layout>
@@ -46,8 +47,13 @@ export async function getStaticProps({ params }) {
4647
});
4748
return {
4849
props: {
49-
menus: data?.headerMenus?.edges ?? [],
50-
posts: data?.posts,
50+
data: {
51+
menus: {
52+
headerMenus: data?.headerMenus?.edges || [],
53+
footerMenus: data?.footerMenus?.edges || []
54+
},
55+
posts: data?.posts,
56+
}
5157
},
5258
revalidate: 1,
5359
};

‎frontend/pages/index.js

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,31 @@
1-
import Layout from "../src/components/layout";
2-
import { GET_MENUS } from "../src/queries/get-menus";
31
import client from "../src/apollo/client";
2+
import { GET_MENUS } from "../src/queries/get-menus";
3+
import Layout from "../src/components/layout";
44

5-
const Home = ({ menus }) => {
6-
return (
7-
<Layout menus={menus}>
8-
<div
9-
style={{
10-
margin: "50px",
11-
justifyContent: "center",
12-
display: "flex",
13-
fontSize: "60px",
14-
}}
15-
>
16-
Welcome!
17-
</div>
18-
</Layout>
19-
);
20-
};
5+
export default function Home( {data} ) {
216

22-
export default Home;
7+
return (
8+
<Layout data={data}>
9+
content
10+
</Layout>
11+
)
12+
}
2313

2414
export async function getStaticProps() {
25-
const { data, loading, networkStatus } = await client.query({
26-
query: GET_MENUS,
27-
});
28-
return { props: { menus: data?.headerMenus?.edges ?? [] }, revalidate: 1 };
15+
16+
const { data } = await client.query({
17+
query: GET_MENUS
18+
});
19+
20+
return {
21+
props:{
22+
data: {
23+
menus: {
24+
headerMenus: data?.headerMenus?.edges || [],
25+
footerMenus: data?.footerMenus?.edges || []
26+
}
27+
}
28+
},
29+
revalidate: 1
30+
}
2931
}

‎frontend/src/components/header/index.js

Lines changed: 0 additions & 12 deletions
This file was deleted.

‎frontend/src/components/header/navbar.js

Lines changed: 0 additions & 76 deletions
This file was deleted.

‎frontend/src/components/layout/header/index.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import Nav from "./nav";
2+
import {isEmpty} from 'lodash'
3+
4+
const Header = ({headerMenus}) => {
5+
6+
if ( isEmpty(headerMenus) ) {
7+
return null;
8+
}
9+
10+
return (
11+
<header>
12+
<Nav headerMenus={headerMenus}/>
13+
</header>
14+
)
15+
}
16+
17+
export default Header

0 commit comments

Comments
 (0)