Make posts request

Author: imranhsayed

pages/blog/index.js

@@ -0,0 +1,38 @@
+import Layout from '../../src/components/layout';
+// import { PER_PAGE_FIRST, totalPagesCount } from '../../src/utils/pagination';
+// import Pagination from '../../src/components/blog/pagination';
+// import Posts from '../../src/components/blog/posts';
+import axios from 'axios';
+import { GET_POSTS_ENDPOINT, HEADER_FOOTER_ENDPOINT } from '../../src/utils/constants/endpoints';
+import { getPosts } from '../../src/utils/blog';
+
+const Blog = ( { headerFooter } ) => {
+	// const pagesCount = totalPagesCount( data?.posts?.pageInfo?.offsetPagination?.total ?? 0 );
+	return (
+		<Layout headerFooter={ headerFooter || {} } seo={null}>
+			{/*<Posts posts={data?.posts?.edges ?? []}/>*/}
+			{/*<Pagination pagesCount={pagesCount} postName="blog" />*/}
+		</Layout>
+	);
+};
+
+export default Blog;
+
+export async function getStaticProps() {
+	const { data: headerFooterData } = await axios.get( HEADER_FOOTER_ENDPOINT );
+	const { data: postsData } = await getPosts();
+	
+	return {
+		props: {
+			headerFooter: headerFooterData?.data ?? {},
+			postsData: postsData || {}
+		},
+		
+		/**
+		 * Revalidate means that if a new request comes to server, then every 1 sec it will check
+		 * if the data is changed, if it is changed then it will update the
+		 * static file inside .next folder with the new data, so that any 'SUBSEQUENT' requests should have updated data.
+		 */
+		revalidate: 1,
+	};
+}

src/utils/blog.js

@@ -0,0 +1,27 @@
+/**
+ * External Dependencies.
+ */
+import axios from 'axios';
+
+/**
+ * Internal Dependencies.
+ */
+import { GET_POSTS_ENDPOINT } from './constants/endpoints';
+
+/**
+ * Get Posts.
+ *
+ * @return {Promise<void>}
+ */
+
+export const getPosts = async ( pageNo = 1 ) => {
+	return await axios.get( `${ GET_POSTS_ENDPOINT }?page_no=${ pageNo }` )
+		.then( res => {
+			if ( 200 === res.data.status ) {
+				return res;
+			} else {
+				return {};
+			}
+		} )
+		.catch( err => console.log( err.response.data.message ) );
+};

src/utils/constants/endpoints.js

@@ -1,4 +1,5 @@
 export const HEADER_FOOTER_ENDPOINT = `${ process.env.NEXT_PUBLIC_WORDPRESS_SITE_URL }/wp-json/rae/v1/header-footer?header_location_id=hcms-menu-header&footer_location_id=hcms-menu-footer`;
+export const GET_POSTS_ENDPOINT = `${process.env.NEXT_PUBLIC_WORDPRESS_SITE_URL}/wp-json/rae/v1/posts`;
 export const GET_PRODUCTS_ENDPOINT = `${process.env.NEXT_PUBLIC_SITE_URL}/api/get-products`;
 
 /**