DX-2013 | Payment flow

public/index.html

@@ -121,26 +121,36 @@
 
     <!-- start of linkedIn insight tag -->
     <script type="text/javascript">
-      _linkedin_partner_id = "5847546";
-      window._linkedin_data_partner_ids =
-        window._linkedin_data_partner_ids || [];
-      window._linkedin_data_partner_ids.push(_linkedin_partner_id);
+      if (
+        window.location.hostname === "dataxplorer.org" ||
+        window.location.hostname === "www.dataxplorer.org"
+      ) {
+        _linkedin_partner_id = "5847546";
+        window._linkedin_data_partner_ids =
+          window._linkedin_data_partner_ids || [];
+        window._linkedin_data_partner_ids.push(_linkedin_partner_id);
+      }
     </script>
     <script type="text/javascript">
-      (function (l) {
-        if (!l) {
-          window.lintrk = function (a, b) {
-            window.lintrk.q.push([a, b]);
-          };
-          window.lintrk.q = [];
-        }
-        var s = document.getElementsByTagName("script")[0];
-        var b = document.createElement("script");
-        b.type = "text/javascript";
-        b.async = true;
-        b.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js";
-        s.parentNode.insertBefore(b, s);
-      })(window.lintrk);
+      if (
+        window.location.hostname === "dataxplorer.org" ||
+        window.location.hostname === "www.dataxplorer.org"
+      ) {
+        (function (l) {
+          if (!l) {
+            window.lintrk = function (a, b) {
+              window.lintrk.q.push([a, b]);
+            };
+            window.lintrk.q = [];
+          }
+          var s = document.getElementsByTagName("script")[0];
+          var b = document.createElement("script");
+          b.type = "text/javascript";
+          b.async = true;
+          b.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js";
+          s.parentNode.insertBefore(b, s);
+        })(window.lintrk);
+      }
     </script>
     <noscript>
       <img
@@ -153,7 +163,12 @@
     </noscript>
     <!-- start of linkedIn insight tag -->
     <script>
-      window.lintrk("track", { conversion_id: 16130146 });
+      if (
+        window.location.hostname === "dataxplorer.org" ||
+        window.location.hostname === "www.dataxplorer.org"
+      ) {
+        window.lintrk("track", { conversion_id: 16130146 });
+      }
     </script>
     <!-- end of linkedIn track tag -->
     <!-- LiveSession.io code -->

src/app/Routes.tsx

@@ -27,6 +27,7 @@ import {
 } from "app/modules/callback-module/payment";
 import { useRecoilValue } from "recoil";
 import { fetchPlanLoadingAtom } from "./state/recoil/atoms";
+import { APPLICATION_JSON } from "./state/api";
 
 const LandingModule = lazy(
   () => import("app/modules/home-module/sub-modules/landing")
@@ -184,7 +185,7 @@ const IntercomBootupComponent = () => {
         `${process.env.REACT_APP_API}/users/intercom-hash`,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${newToken}`,
           },
         }

src/app/hooks/useChartsRawData.tsx

@@ -11,6 +11,7 @@ import {
   ChartRenderedItem,
 } from "app/modules/chart-module/data";
 import { isEqual } from "lodash";
+import { APPLICATION_JSON } from "app/state/api";
 
 const getValidMapping = (
   chartFromAPI: ChartRenderedItem | null,
@@ -157,7 +158,7 @@ export function useChartsRawData(props: {
         }/${id}`,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }
@@ -235,7 +236,7 @@ export function useChartsRawData(props: {
         {
           signal: abortControllerRef.current.signal,
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }

src/app/hooks/useCheckUserPlan.tsx

@@ -1,4 +1,5 @@
 import { useAuth0 } from "@auth0/auth0-react";
+import { APPLICATION_JSON } from "app/state/api";
 import { fetchPlanLoadingAtom, planDialogAtom } from "app/state/recoil/atoms";
 import { useStoreState } from "app/state/store/hooks";
 import axios from "axios";
@@ -55,7 +56,7 @@ export function useCheckUserPlan() {
     axios
       .get(`${process.env.REACT_APP_API}/users/plan-data`, {
         headers: {
-          "Content-Type": "application/json",
+          "Content-Type": APPLICATION_JSON,
           Authorization: `Bearer ${token}`,
         },
       })

src/app/hooks/useGetChartsStoriesCountByDataset.tsx

@@ -1,3 +1,4 @@
+import { APPLICATION_JSON } from "app/state/api";
 import { useStoreState } from "app/state/store/hooks";
 import axios from "axios";
 import { get } from "lodash";
@@ -18,7 +19,7 @@ const useGetChartsStoriesCountByDataset = (datasetId: string) => {
         `${process.env.REACT_APP_API}/datasets/${datasetId}/charts-stories/count`,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }

src/app/hooks/useGetDatasetContent.tsx

@@ -1,3 +1,4 @@
+import { APPLICATION_JSON } from "app/state/api";
 import { useStoreState } from "app/state/store/hooks";
 import axios from "axios";
 import React, { useEffect } from "react";
@@ -21,7 +22,7 @@ const useGetDatasetContent = (datasetId: string, pageSize: number = 10) => {
         }/${datasetId}/data?page=${nextPageToken}&pageSize=${pageSize}`,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }

src/app/hooks/useSearchMediaSources.tsx

@@ -1,3 +1,4 @@
+import { APPLICATION_JSON } from "app/state/api";
 import { useStoreState } from "app/state/store/hooks";
 import axios from "axios";
 import { get } from "lodash";
@@ -17,7 +18,7 @@ export function useSearchMediaSources(source: string, elementType: string) {
 
   const DEFAULT_SEARCH_QUERY = "figma";
 
-  const contentType = "application/json";
+  const contentType = APPLICATION_JSON;
 
   const getYoutubeVideos = async (q: string, nextPage: boolean) => {
     await axios

src/app/modules/callback-module/index.tsx

@@ -5,6 +5,7 @@ import { useAuth0 } from "@auth0/auth0-react";
 import { PageLoader } from "app/modules/common/page-loader";
 import axios from "axios";
 import { useCookie, useTitle } from "react-use";
+import { APPLICATION_JSON } from "app/state/api";
 
 function AuthCallbackModule() {
   useTitle("DX Dataxplorer - Auth Callback");
@@ -24,7 +25,7 @@ function AuthCallbackModule() {
         `${process.env.REACT_APP_API}/users/duplicate-landing-story/${id}`,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${newToken}`,
           },
         }
@@ -45,7 +46,7 @@ function AuthCallbackModule() {
         {},
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${newToken}`,
           },
         }

src/app/modules/callback-module/payment.tsx

@@ -7,6 +7,7 @@ import Container from "@material-ui/core/Container";
 import { PageLoader } from "app/modules/common/page-loader";
 import HomeFooter from "app/modules/home-module/components/Footer";
 import BgEllipses from "app/modules/home-module/assets/full-bg-ellipses.svg";
+import { APPLICATION_JSON } from "app/state/api";
 
 const CommonLink = (props: { to: string; text: string; replace?: boolean }) => {
   return (
@@ -41,7 +42,7 @@ const CommonLink = (props: { to: string; text: string; replace?: boolean }) => {
 
 export function PaymentSuccessCallbackModule() {
   const history = useHistory();
-  const { isAuthenticated, getAccessTokenSilently } = useAuth0();
+  const { user, isAuthenticated, getAccessTokenSilently } = useAuth0();
 
   const [loading, setLoading] = React.useState(true);
   const [success, setSuccess] = React.useState(false);
@@ -61,7 +62,7 @@ export function PaymentSuccessCallbackModule() {
             },
             {
               headers: {
-                "Content-Type": "application/json",
+                "Content-Type": APPLICATION_JSON,
                 Authorization: `Bearer ${token}`,
               },
             }
@@ -75,6 +76,19 @@ export function PaymentSuccessCallbackModule() {
             setError(error.message);
             setLoading(false);
           });
+        axios
+          .get(
+            `${process.env.REACT_APP_API}/stripe/auto-update-address/${user?.sub}`,
+            {
+              headers: {
+                "Content-Type": APPLICATION_JSON,
+                Authorization: `Bearer ${token}`,
+              },
+            }
+          )
+          .catch((error) => {
+            console.error(error);
+          });
       });
     }
   }, [isAuthenticated]);

src/app/modules/chart-module/index.tsx

@@ -60,6 +60,7 @@ import {
   planDialogAtom,
 } from "app/state/recoil/atoms";
 import { IDatasetDetails } from "./components/toolbox/steps/panels-content/SelectDataset";
+import { APPLICATION_JSON } from "app/state/api";
 
 export default function ChartModule() {
   const { user, isLoading, isAuthenticated } = useAuth0();
@@ -286,7 +287,7 @@ export default function ChartModule() {
       try {
         return await axios.post(`${process.env.REACT_APP_API}/chart/`, chart, {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         });

src/app/modules/common/newsletterForm/index.tsx

@@ -1,4 +1,5 @@
 import { yupResolver } from "@hookform/resolvers/yup";
+import { APPLICATION_JSON } from "app/state/api";
 import { emailSchema } from "app/utils/emailValidation";
 import axios, { AxiosResponse, AxiosError } from "axios";
 import React from "react";
@@ -55,7 +56,7 @@ export default function NewsletterForm(
         },
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
           },
         }
       )

src/app/modules/dataset-module/routes/edit/index.tsx

@@ -1,5 +1,6 @@
 import { Container } from "@material-ui/core";
 import MetaData from "app/modules/dataset-module/routes/upload-module/upload-steps/metaData";
+import { APPLICATION_JSON } from "app/state/api";
 import { allAssetsSortBy } from "app/state/recoil/atoms";
 import { useStoreActions, useStoreState } from "app/state/store/hooks";
 import axios from "axios";
@@ -71,7 +72,7 @@ export default function EditMetaData() {
         { ...formDetails },
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }

src/app/modules/dataset-module/routes/upload-module/component/dropzone/index.tsx

@@ -9,6 +9,7 @@ import {
 import { uploadAreacss } from "app/modules/dataset-module/routes/upload-module/style";
 import { ReactComponent as UploadIcon } from "app/modules/dataset-module/routes/upload-module/assets/upload.svg";
 import { formatBytes } from "app/utils/formatBytes";
+import { APPLICATION_JSON } from "app/state/api";
 
 interface DropzoneProps {
   uploadError: boolean;
@@ -19,7 +20,7 @@ interface DropzoneProps {
 export const DropZone = (props: DropzoneProps) => {
   const ACCEPTED_FILES = {
     "text/csv": [".csv"],
-    "application/json": [".json"],
+    [APPLICATION_JSON]: [".json"],
     "application/vnd.oasis.opendocument.spreadsheet": [".ods"],
     "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": [
       ".xlsx",

src/app/modules/dataset-module/routes/upload-module/upload-steps/index.tsx

@@ -29,6 +29,7 @@ import { dataUploadTabAtom, planDialogAtom } from "app/state/recoil/atoms";
 import BasicSwitch from "app/components/Switch/BasicSwitch";
 import Search from "@material-ui/icons/Search";
 import DesktopWindowsIcon from "@material-ui/icons/DesktopWindows";
+import { APPLICATION_JSON } from "app/state/api";
 
 interface Props {
   datasetId: string;
@@ -171,7 +172,7 @@ function DatasetUploadSteps(props: Props) {
         { ...formDetails, authId: user?.sub, id: props.datasetId },
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
         }
@@ -279,7 +280,7 @@ function DatasetUploadSteps(props: Props) {
         { ...externalDataset, id },
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
             Authorization: `Bearer ${token}`,
           },
           onUploadProgress,

src/app/modules/home-module/sub-modules/contact/index.tsx

@@ -14,6 +14,7 @@ import { useTitle } from "react-use";
 import { PageLoader } from "app/modules/common/page-loader";
 import NewsletterBlock from "./newsletterBlock";
 import { FieldErrors } from "react-hook-form";
+import { APPLICATION_JSON } from "app/state/api";
 
 const CssTextField = withStyles({
   root: {
@@ -80,7 +81,7 @@ export default function ContactModule() {
         contactFormDetails,
         {
           headers: {
-            "Content-Type": "application/json",
+            "Content-Type": APPLICATION_JSON,
           },
         }
       )