tamam

.env

@@ -0,0 +1,6 @@
+WORDPRESS_API_URL=https://xtechnology.co/graphql/
+
+
+# Only required if you want to enable preview mode
+# WORDPRESS_AUTH_REFRESH_TOKEN=
+# WORDPRESS_PREVIEW_SECRET=

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

components/alert.js

@@ -1,42 +1,41 @@
-import Container from './container'
-import cn from 'classnames'
-import { EXAMPLE_PATH } from '../lib/constants'
+import cn from "classnames";
+import { EXAMPLE_PATH } from "../lib/constants";
+import Container from "./container";
+import Link from "next/link";
 
 export default function Alert({ preview }) {
-  return (
-    <div
-      className={cn('border-b', {
-        'bg-accent-7 border-accent-7 text-white': preview,
-        'bg-accent-1 border-accent-2': !preview,
-      })}
-    >
-      <Container>
-        <div className="py-2 text-center text-sm">
-          {preview ? (
-            <>
-              This is a page preview.{' '}
-              <a
-                href="/api/exit-preview"
-                className="underline hover:text-cyan duration-200 transition-colors"
-              >
-                Click here
-              </a>{' '}
-              to exit preview mode.
-            </>
-          ) : (
-            <>
-              The source code for this blog is{' '}
-              <a
-                href={`https://github.com/vercel/next.js/tree/canary/examples/${EXAMPLE_PATH}`}
-                className="underline hover:text-success duration-200 transition-colors"
-              >
-                available on GitHub
-              </a>
-              .
-            </>
-          )}
-        </div>
-      </Container>
+ return (
+  <div
+   className={cn("border-b", {
+    "bg-accent-7 border-accent-7 text-white": preview,
+    "bg-accent-1 border-accent-2": !preview,
+   })}
+  >
+   <Container>
+    <div className="py-2 text-center text-sm">
+     {preview ? (
+      <>
+       This is a page preview. <Link href={"/api/exit-preview"} />
+       <a className="underline hover:text-cyan duration-200 transition-colors">
+        {" "}
+        Click here
+       </a>{" "}
+       to exit preview mode.
+      </>
+     ) : (
+      <>
+       The source code for this blog is{" "}
+       <a
+        href={`https://github.com/vercel/next.js/tree/canary/examples/${EXAMPLE_PATH}`}
+        className="underline hover:text-success duration-200 transition-colors"
+       >
+        available on GitHub
+       </a>
+       .
+      </>
+     )}
     </div>
-  )
+   </Container>
+  </div>
+ );
 }

jsconfig.json

@@ -0,0 +1,14 @@
+{
+ "compilerOptions": {
+  "module": "ESNext",
+  "moduleResolution": "Node",
+  "target": "ES2020",
+  "jsx": "preserve",
+  "strictNullChecks": true,
+  "strictFunctionTypes": true
+ },
+ "exclude": [
+  "node_modules",
+  "**/node_modules/*"
+ ]
+}

lib/api.js

@@ -1,51 +1,51 @@
-const API_URL = process.env.WORDPRESS_API_URL
+const API_URL = process.env.WORDPRESS_API_URL;
 
-async function fetchAPI(query = '', { variables } = {}) {
-  const headers = { 'Content-Type': 'application/json' }
+async function fetchAPI(query = "", { variables } = {}) {
+ const headers = { "Content-Type": "application/json" };
 
-  if (process.env.WORDPRESS_AUTH_REFRESH_TOKEN) {
-    headers[
-      'Authorization'
-    ] = `Bearer ${process.env.WORDPRESS_AUTH_REFRESH_TOKEN}`
-  }
+ if (process.env.WORDPRESS_AUTH_REFRESH_TOKEN) {
+  headers[
+   "Authorization"
+  ] = `Bearer ${process.env.WORDPRESS_AUTH_REFRESH_TOKEN}`;
+ }
 
-  // WPGraphQL Plugin must be enabled
-  const res = await fetch(`${API_URL}/graphql`, {
-    headers,
-    method: 'POST',
-    body: JSON.stringify({
-      query,
-      variables,
-    }),
-  })
+ // WPGraphQL Plugin must be enabled
+ const res = await fetch(`${API_URL}/graphql`, {
+  headers,
+  method: "POST",
+  body: JSON.stringify({
+   query,
+   variables,
+  }),
+ });
 
-  const json = await res.json()
-  if (json.errors) {
-    console.error(json.errors)
-    throw new Error('Failed to fetch API')
-  }
-  return json.data
+ const json = await res.json();
+ if (json.errors) {
+  console.error(json.errors);
+  throw new Error("Failed to fetch API");
+ }
+ return json.data;
 }
 
-export async function getPreviewPost(id, idType = 'DATABASE_ID') {
-  const data = await fetchAPI(
-    `
+export async function getPreviewPost(id, idType = "DATABASE_ID") {
+ const data = await fetchAPI(
+  `
     query PreviewPost($id: ID!, $idType: PostIdType!) {
       post(id: $id, idType: $idType) {
         databaseId
         slug
         status
       }
     }`,
-    {
-      variables: { id, idType },
-    }
-  )
-  return data.post
+  {
+   variables: { id, idType },
+  }
+ );
+ return data.post;
 }
 
 export async function getAllPostsWithSlug() {
-  const data = await fetchAPI(`
+ const data = await fetchAPI(`
     {
       posts(first: 10000) {
         edges {
@@ -55,13 +55,13 @@ export async function getAllPostsWithSlug() {
         }
       }
     }
-  `)
-  return data?.posts
+  `);
+ return data?.posts;
 }
 
 export async function getAllPostsForHome(preview) {
-  const data = await fetchAPI(
-    `
+ const data = await fetchAPI(
+  `
     query AllPosts {
       posts(first: 20, where: { orderby: { field: DATE, order: DESC } }) {
         edges {
@@ -90,28 +90,28 @@ export async function getAllPostsForHome(preview) {
       }
     }
   `,
-    {
-      variables: {
-        onlyEnabled: !preview,
-        preview,
-      },
-    }
-  )
+  {
+   variables: {
+    onlyEnabled: !preview,
+    preview,
+   },
+  }
+ );
 
-  return data?.posts
+ return data?.posts;
 }
 
 export async function getPostAndMorePosts(slug, preview, previewData) {
-  const postPreview = preview && previewData?.post
-  // The slug may be the id of an unpublished post
-  const isId = Number.isInteger(Number(slug))
-  const isSamePost = isId
-    ? Number(slug) === postPreview.id
-    : slug === postPreview.slug
-  const isDraft = isSamePost && postPreview?.status === 'draft'
-  const isRevision = isSamePost && postPreview?.status === 'publish'
-  const data = await fetchAPI(
-    `
+ const postPreview = preview && previewData?.post;
+ // The slug may be the id of an unpublished post
+ const isId = Number.isInteger(Number(slug));
+ const isSamePost = isId
+  ? Number(slug) === postPreview.id
+  : slug === postPreview.slug;
+ const isDraft = isSamePost && postPreview?.status === "draft";
+ const isRevision = isSamePost && postPreview?.status === "publish";
+ const data = await fetchAPI(
+  `
     fragment AuthorFields on User {
       name
       firstName
@@ -155,9 +155,9 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
         ...PostFields
         content
         ${
-          // Only some of the fields of a revision are considered as there are some inconsistencies
-          isRevision
-            ? `
+         // Only some of the fields of a revision are considered as there are some inconsistencies
+         isRevision
+          ? `
         revisions(first: 1, where: { orderby: { field: MODIFIED, order: DESC } }) {
           edges {
             node {
@@ -173,7 +173,7 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
           }
         }
         `
-            : ''
+          : ""
         }
       }
       posts(first: 3, where: { orderby: { field: DATE, order: DESC } }) {
@@ -185,28 +185,28 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
       }
     }
   `,
-    {
-      variables: {
-        id: isDraft ? postPreview.id : slug,
-        idType: isDraft ? 'DATABASE_ID' : 'SLUG',
-      },
-    }
-  )
+  {
+   variables: {
+    id: isDraft ? postPreview.id : slug,
+    idType: isDraft ? "DATABASE_ID" : "SLUG",
+   },
+  }
+ );
 
-  // Draft posts may not have an slug
-  if (isDraft) data.post.slug = postPreview.id
-  // Apply a revision (changes in a published post)
-  if (isRevision && data.post.revisions) {
-    const revision = data.post.revisions.edges[0]?.node
+ // Draft posts may not have an slug
+ if (isDraft) data.post.slug = postPreview.id;
+ // Apply a revision (changes in a published post)
+ if (isRevision && data.post.revisions) {
+  const revision = data.post.revisions.edges[0]?.node;
 
-    if (revision) Object.assign(data.post, revision)
-    delete data.post.revisions
-  }
+  if (revision) Object.assign(data.post, revision);
+  delete data.post.revisions;
+ }
 
-  // Filter out the main post
-  data.posts.edges = data.posts.edges.filter(({ node }) => node.slug !== slug)
-  // If there are still 3 posts, remove the last one
-  if (data.posts.edges.length > 2) data.posts.edges.pop()
+ // Filter out the main post
+ data.posts.edges = data.posts.edges.filter(({ node }) => node.slug !== slug);
+ // If there are still 3 posts, remove the last one
+ if (data.posts.edges.length > 2) data.posts.edges.pop();
 
-  return data
+ return data;
 }

next.config.js

@@ -11,9 +11,8 @@ module.exports = {
    process.env.WORDPRESS_API_URL.match(/(http(?:s)?:\/\/)(.*)/)[2], // Valid WP Image domain.
    "2.gravatar.com",
    "secure.gravatar.com",
-   "xtechnology.co",
   ],
-  loader: 'imgix',
-  path: 'https://xtechnology.co/',
+  loader: "imgix",
+  path: "",
  },
-};
+};