Merge pull request #79 from contentstack/fix/ECO-3097-SRE-ts-fixes

fix:SRE issue fix removed JS with TS files

Author: Amitkanswal

.eslintrc.json

@@ -21,6 +21,8 @@
   "rules": {
       "react/prop-types":0,
       "no-undef":"off",
-      "no-unused-vars": "off"
+      "no-unused-vars": "off",
+      "react-hooks/exhaustive-deps":"off",
+      "@next/next/no-img-element":"off"
   }
 }

contentstack-sdk/index.js

@@ -0,0 +1,132 @@
+import * as Utils from "@contentstack/utils";
+import ContentstackLivePreview from "@contentstack/live-preview-utils";
+import getConfig from "next/config";
+import {
+  customHostUrl,
+  initializeContentStackSdk,
+  isValidCustomHostUrl,
+} from "./utils";
+
+type GetEntry = {
+  contentTypeUid: string;
+  referenceFieldPath: string[] | undefined;
+  jsonRtePath: string[] | undefined;
+};
+
+type GetEntryByUrl = {
+  entryUrl: string | undefined;
+  contentTypeUid: string;
+  referenceFieldPath: string[] | undefined;
+  jsonRtePath: string[] | undefined;
+};
+
+const { publicRuntimeConfig } = getConfig();
+const envConfig = process.env.CONTENTSTACK_API_KEY
+  ? process.env
+  : publicRuntimeConfig;
+
+let customHostBaseUrl = envConfig.CONTENTSTACK_API_HOST as string;
+customHostBaseUrl = customHostUrl(customHostBaseUrl);
+
+// SDK initialization
+const Stack = initializeContentStackSdk();
+
+// set host url only for custom host or non prod base url's
+if (isValidCustomHostUrl(customHostBaseUrl)) {
+  Stack.setHost(customHostBaseUrl);
+}
+
+// Setting LP if enabled
+ContentstackLivePreview.init({
+  //@ts-ignore
+  stackSdk: Stack,
+  clientUrlParams: {
+    host: envConfig.CONTENTSTACK_APP_HOST,
+  },
+  stackDetails: {
+    apiKey: envConfig.CONTENTSTACK_API_KEY,
+    environment: envConfig.CONTENTSTACK_ENVIRONMENT,
+  },
+  enable: envConfig.CONTENTSTACK_LIVE_PREVIEW === "true",
+  ssr: false,
+})?.catch((err) => console.error(err));
+
+export const { onEntryChange } = ContentstackLivePreview;
+
+const renderOption = {
+  span: (node: any, next: any) => next(node.children),
+};
+
+/**
+ *
+ * fetches all the entries from specific content-type
+ * @param {* content-type uid} contentTypeUid
+ * @param {* reference field name} referenceFieldPath
+ * @param {* Json RTE path} jsonRtePath
+ *
+ */
+export const getEntry = ({
+  contentTypeUid,
+  referenceFieldPath,
+  jsonRtePath,
+}: GetEntry) => {
+  return new Promise((resolve, reject) => {
+    const query = Stack.ContentType(contentTypeUid).Query();
+    if (referenceFieldPath) query.includeReference(referenceFieldPath);
+    query
+      .toJSON()
+      .find()
+      .then(
+        (result) => {
+          jsonRtePath &&
+            Utils.jsonToHTML({
+              entry: result,
+              paths: jsonRtePath,
+              renderOption,
+            });
+          resolve(result);
+        },
+        (error) => {
+          reject(error);
+        }
+      );
+  });
+};
+
+/**
+ *fetches specific entry from a content-type
+ *
+ * @param {* content-type uid} contentTypeUid
+ * @param {* url for entry to be fetched} entryUrl
+ * @param {* reference field name} referenceFieldPath
+ * @param {* Json RTE path} jsonRtePath
+ * @returns
+ */
+export const getEntryByUrl = ({
+  contentTypeUid,
+  entryUrl,
+  referenceFieldPath,
+  jsonRtePath,
+}: GetEntryByUrl) => {
+  return new Promise((resolve, reject) => {
+    const blogQuery = Stack.ContentType(contentTypeUid).Query();
+    if (referenceFieldPath) blogQuery.includeReference(referenceFieldPath);
+    blogQuery.toJSON();
+    const data = blogQuery.where("url", `${entryUrl}`).find();
+    data.then(
+      (result) => {
+        jsonRtePath &&
+          Utils.jsonToHTML({
+            entry: result,
+            paths: jsonRtePath,
+            renderOption,
+          });
+        resolve(result[0]);
+      },
+      (error) => {
+        console.error(error);
+        reject(error);
+      }
+    );
+  });
+};

contentstack-sdk/index.ts

@@ -1,8 +1,80 @@
-import { Region } from "contentstack";
-export const customHostUrl = (baseUrl: string):string => {
+import { Config, Region, LivePreview, Stack } from "contentstack";
+import getConfig from "next/config";
+const { publicRuntimeConfig } = getConfig();
+const envConfig = process.env.CONTENTSTACK_API_KEY
+  ? process.env
+  : publicRuntimeConfig;
+const {
+  CONTENTSTACK_API_KEY,
+  CONTENTSTACK_DELIVERY_TOKEN,
+  CONTENTSTACK_ENVIRONMENT,
+  CONTENTSTACK_BRANCH,
+  CONTENTSTACK_REGION,
+  CONTENTSTACK_MANAGEMENT_TOKEN,
+  CONTENTSTACK_API_HOST,
+  CONTENTSTACK_APP_HOST,
+  CONTENTSTACK_LIVE_PREVIEW,
+} = envConfig;
+
+// basic env validation
+export const isBasicConfigValid = () => {
+  return (
+    !!CONTENTSTACK_API_KEY &&
+    !!CONTENTSTACK_DELIVERY_TOKEN &&
+    !!CONTENTSTACK_ENVIRONMENT
+  );
+};
+// Live preview config validation
+export const isLpConfigValid = () => {
+  return (
+    !!CONTENTSTACK_LIVE_PREVIEW &&
+    !!CONTENTSTACK_MANAGEMENT_TOKEN &&
+    !!CONTENTSTACK_API_HOST &&
+    !!CONTENTSTACK_APP_HOST
+  );
+};
+// set region
+const setRegion = (): Region => {
+  let region = "US" as keyof typeof Region;
+  if (!!CONTENTSTACK_REGION && CONTENTSTACK_REGION !== "us") {
+    region = CONTENTSTACK_REGION.toLocaleUpperCase().replace(
+      "-",
+      "_"
+    ) as keyof typeof Region;
+  }
+  return Region[region];
+};
+// set LivePreview config
+const setLivePreviewConfig = (): LivePreview => {
+  if (!isLpConfigValid())
+    throw new Error("Your LP config is set to true. Please make you have set all required LP config in .env");
+  return {
+    management_token: CONTENTSTACK_MANAGEMENT_TOKEN as string,
+    enable: CONTENTSTACK_LIVE_PREVIEW === "true",
+    host: CONTENTSTACK_API_HOST as string,
+  } as LivePreview;
+};
+// contentstack sdk initialization
+export const initializeContentStackSdk = (): Stack => {
+  if (!isBasicConfigValid())
+    throw new Error("Please set you .env file before running starter app");
+  const stackConfig: Config = {
+    api_key: CONTENTSTACK_API_KEY as string,
+    delivery_token: CONTENTSTACK_DELIVERY_TOKEN as string,
+    environment: CONTENTSTACK_ENVIRONMENT as string,
+    region: setRegion(),
+    branch: CONTENTSTACK_BRANCH || "main",
+  };
+  if (CONTENTSTACK_LIVE_PREVIEW === "true") {
+    stackConfig.live_preview = setLivePreviewConfig();
+  }
+  return Stack(stackConfig);
+};
+// api host url
+export const customHostUrl = (baseUrl: string): string => {
   return baseUrl.replace("api", "cdn");
 };
-
+// generate prod api urls
 export const generateUrlBasedOnRegion = (): string[] => {
   return Object.keys(Region).map((region) => {
     if (region === "US") {
@@ -11,7 +83,7 @@ export const generateUrlBasedOnRegion = (): string[] => {
     return `${region}-cdn.contentstack.com`;
   });
 };
-
+// prod url validation for custom host
 export const isValidCustomHostUrl = (url: string): boolean => {
-  return url? !generateUrlBasedOnRegion().includes(url):false;
+  return url ? !generateUrlBasedOnRegion().includes(url) : false;
 };