adding loggers to see vercel env variables

Author: ahmedmustafamo

packages/react-renderer-demo/src/components/mdx/share-button.js

@@ -15,19 +15,15 @@ const HashTagSvg = (props) => (
   ></path>
 );
 
-const ShareButton = ({ path }) => {
-  console.log(process.env.NEXT_PUBLIC_VAR_VAL);
-
-  return (
-    <CopyToClipboard text={urlFormatter(path)}>
-      <IconButton size="medium">
-        <SvgIcon fontSize="small" viewBox="0 0 48 48">
-          <HashTagSvg />
-        </SvgIcon>
-      </IconButton>
-    </CopyToClipboard>
-  );
-};
+const ShareButton = ({ path }) => (
+  <CopyToClipboard text={urlFormatter(path)}>
+    <IconButton size="medium">
+      <SvgIcon fontSize="small" viewBox="0 0 48 48">
+        <HashTagSvg />
+      </SvgIcon>
+    </IconButton>
+  </CopyToClipboard>
+);
 
 ShareButton.propTypes = {
   path: PropTypes.string.isRequired,

packages/react-renderer-demo/src/helpers/url-formatter.js

@@ -1,9 +1,16 @@
 export const urlFormatter = (initPath) => {
-  const env = process.env.NEXT_PUBLIC_VERCEL_ENV;
-  const url = process.env.NEXT_PUBLIC_VERCEL_URL;
-  const branchUrl = process.env.NEXT_PUBLIC_VERCEL_BRANCH_URL;
+  const nextEnv = process.env.NEXT_PUBLIC_VERCEL_ENV;
+  const nextUrl = process.env.NEXT_PUBLIC_VERCEL_URL;
+  const nextBranchUrl = process.env.NEXT_PUBLIC_VERCEL_BRANCH_URL;
 
-  if (env === 'preview') {
+  const env = process.env.VERCEL_ENV;
+  const url = process.env.VERCEL_URL;
+  const branchUrl = process.env.VERCEL_BRANCH_URL;
+
+  console.log(`NEXT_PUBLIC_VERCEL_ENV= ${nextEnv}, NEXT_PUBLIC_VERCEL_URL= ${nextUrl}, NEXT_PUBLIC_VERCEL_BRANCH_URL= ${nextBranchUrl}`);
+  console.log(`VERCEL_ENV= ${env}, VERCEL_URL= ${url}, VERCEL_BRANCH_URL= ${branchUrl}`);
+
+  if (env === 'preview' || nextEnv === 'preview') {
     return `https://${branchUrl + initPath}`;
   }