Don't log debug level logs in prod (#5527)

app/client/build.sh

@@ -6,7 +6,7 @@ GIT_SHA=$(eval git rev-parse HEAD)
 echo $GIT_SHA
 echo "Sentry Auth Token: $SENTRY_AUTH_TOKEN"
 
-REACT_APP_SENTRY_RELEASE=$GIT_SHA EXTEND_ESLINT=true craco --max-old-space-size=4096 build --config craco.build.config.js
+REACT_APP_SENTRY_RELEASE=$GIT_SHA REACT_APP_CLIENT_LOG_LEVEL=ERROR EXTEND_ESLINT=true craco --max-old-space-size=4096 build --config craco.build.config.js
 
 rm ./build/static/js/*.js.map
 echo "build finished"

app/client/package.json

@@ -154,7 +154,7 @@
   },
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
-    "start": "BROWSER=none EXTEND_ESLINT=true REACT_APP_ENVIRONMENT=DEVELOPMENT HOST=dev.appsmith.com craco start",
+    "start": "BROWSER=none EXTEND_ESLINT=true REACT_APP_ENVIRONMENT=DEVELOPMENT REACT_APP_CLIENT_LOG_LEVEL=debug HOST=dev.appsmith.com craco start",
     "build": "./build.sh",
     "build-local": "craco --max-old-space-size=4096 build --config craco.build.config.js",
     "build-staging": "REACT_APP_ENVIRONMENT=STAGING craco --max-old-space-size=4096 build --config craco.build.config.js",

app/client/public/index.html

@@ -34,10 +34,10 @@
   <noscript>You need to enable JavaScript to run this app.</noscript>
   <div id="loader" style="width: 30vw;"></div>
   <!--
-    To keep zIndex for tooltips higher than app comments, todo remove when migrating to Tooltip2 
+    To keep zIndex for tooltips higher than app comments, todo remove when migrating to Tooltip2
     Currently the className does not apply to the portal root, so we're unable to work with z-indexes based on that
   -->
-  <div id="tooltip-root"></div> 
+  <div id="tooltip-root"></div>
   <div id="header-root"></div>
   <div id="root"></div>
   <script type="text/javascript">
@@ -80,7 +80,7 @@
         return window.localStorage.setItem(key, value);
       }
     };
-    
+
     // Note: The following handler is necessary for when we have a new deployment.
 
     // What happens?
@@ -103,7 +103,7 @@
       const regex = /\/static\/js\/(\w.+).js$/;
       const chunkLoadErrorMessage = "Unexpected token '<'"
       if(regex.test(url) && url.indexOf(window.location.host) > -1 && message.includes(chunkLoadErrorMessage)) {
-        console.log("chunk load failed!", url);
+        console.error("chunk load failed!", url);
         // First check if we've set the flag to not reload on chunk load fail
         const donotReload = localStorageUtil.getItem("donotReloadOnChunkLoadFail");
           if(!donotReload){
@@ -131,7 +131,7 @@
       if ("serviceWorker" in navigator) {
         window.addEventListener("load", function () {
           navigator.serviceWorker.register("/pageService.js").catch(error => {
-            console.log("Service Worker Registration failed: " + error);
+            console.error("Service Worker Registration failed: " + error);
           });
         });
       }

app/client/src/comments/CommentsShowcaseCarousel/CommentsCarouselModal.tsx

@@ -13,7 +13,7 @@ function ShowcaseCarouselModal({ children }: { children: React.ReactNode }) {
       isOpen
       left={25}
       onClose={() => {
-        console.log("handle close");
+        // TODO (rishabh) handle close
       }}
       overlayClassName="comments-onboarding-carousel"
       scrollContents

app/client/src/components/designSystems/appsmith/TableComponent/CommonUtilities.test.ts

@@ -31,7 +31,6 @@ describe("TableUtilities", () => {
       "url",
       true,
     );
-    // console.log(JSON.stringify(sortedTableData));
     expect(sortedTableData).toStrictEqual(expected);
   });
 });

app/client/src/components/editorComponents/GlobalSearch/parseDocumentationContent.ts

@@ -1,6 +1,7 @@
 import marked from "marked";
 import { HelpBaseURL } from "constants/HelpConstants";
 import { algoliaHighlightTag } from "./utils";
+import log from "loglevel";
 
 /**
  * @param {String} HTML representing a single element
@@ -211,7 +212,7 @@ const parseDocumentationContent = (item: any): string | undefined => {
     const content = strip(documentObj.body.innerHTML).trim();
     return content;
   } catch (e) {
-    console.log(e, "err");
+    log.error(e);
     return;
   }
 };

app/client/src/configs/index.ts

@@ -96,7 +96,7 @@ const getConfigsFromEnvVars = (): INJECTED_CONFIGS => {
       (process.env.REACT_APP_CLIENT_LOG_LEVEL as
         | "debug"
         | "error"
-        | undefined) || "debug",
+        | undefined) || "error",
     google: process.env.REACT_APP_GOOGLE_MAPS_API_KEY || "",
     enableTNCPP: process.env.REACT_APP_TNC_PP
       ? process.env.REACT_APP_TNC_PP.length > 0

app/client/src/pages/Editor/APIEditor/ResultPagination.tsx

@@ -46,8 +46,6 @@ class ResultPagination extends React.Component<Props> {
           previousPage,
           totalPages,
         }) => {
-          console.log(hasNextPage, "hasNextPage");
-
           return (
             <PaginationContainer>
               <div

app/client/src/pages/Editor/Canvas.tsx

@@ -5,6 +5,8 @@ import { ContainerWidgetProps } from "widgets/ContainerWidget";
 import { WidgetProps } from "widgets/BaseWidget";
 import PropertyPane from "pages/Editor/PropertyPane";
 import ArtBoard from "pages/common/ArtBoard";
+import log from "loglevel";
+import * as Sentry from "@sentry/react";
 
 interface CanvasProps {
   dsl: ContainerWidgetProps<WidgetProps>;
@@ -28,7 +30,8 @@ const Canvas = memo((props: CanvasProps) => {
       </>
     );
   } catch (error) {
-    console.log("Error rendering DSL", error);
+    log.error("Error rendering DSL", error);
+    Sentry.captureException(error);
     return null;
   }
 });

app/client/src/pages/Editor/Explorer/Widgets/WidgetContextMenu.tsx

@@ -19,7 +19,6 @@ export function WidgetContextMenu(props: {
 }) {
   const { widgetId } = props;
   const parentId = useSelector((state: AppState) => {
-    // console.log(state.ui.pageWidgets[props.pageId], props.widgetId);
     return state.ui.pageWidgets[props.pageId][props.widgetId].parentId;
   });
   const widget = useSelector((state: AppState) => {

app/client/src/pages/common/CustomizedDropdown/dropdownHelpers.tsx

@@ -3,6 +3,7 @@ import { IconNames } from "@blueprintjs/icons";
 import { Direction, Directions } from "utils/helpers";
 import { PopoverPosition } from "@blueprintjs/core";
 import history from "utils/history";
+import log from "loglevel";
 
 export const DropdownOnSelectActions: { [id: string]: string } = {
   REDIRECT: "redirect",
@@ -26,7 +27,7 @@ export const getOnSelectAction = (
       }
       break;
     default:
-      console.log("No such action registered", type);
+      log.error("No such action registered", type);
   }
 };
 

app/client/src/sagas/CommentSagas/index.ts

@@ -47,6 +47,7 @@ import { get } from "lodash";
 
 import { commentModeSelector } from "selectors/commentsSelectors";
 import { AppState } from "reducers";
+import log from "loglevel";
 
 function* createUnpublishedCommentThread(
   action: ReduxAction<Partial<CreateCommentThreadRequest>>,
@@ -315,7 +316,8 @@ function* fetchUnreadCommentsCount() {
     yield put(fetchUnreadCommentThreadsCountSuccess(response.data.count > 0));
     // }
   } catch (e) {
-    console.log(e, "handle error");
+    log.error(e);
+    // todo (rishabh) handle error
   }
 }
 

app/client/src/sagas/GlobalSearchSagas.ts

@@ -16,6 +16,7 @@ import {
 import { AppState } from "reducers";
 import { getIsEditorInitialized } from "selectors/editorSelectors";
 import { RecentEntity } from "components/editorComponents/GlobalSearch/utils";
+import log from "loglevel";
 
 export function* updateRecentEntity(actionPayload: ReduxAction<RecentEntity>) {
   try {
@@ -61,7 +62,7 @@ export function* updateRecentEntity(actionPayload: ReduxAction<RecentEntity>) {
       );
     }
   } catch (e) {
-    console.log(e, "error");
+    log.error(e);
   }
 }
 

app/client/src/utils/AppsmithUtils.tsx

@@ -150,7 +150,7 @@ export const createNewApiName = (actions: ActionDataState, pageId: string) => {
 };
 
 export const noop = () => {
-  console.log("noop");
+  log.debug("noop");
 };
 
 export const stopEventPropagation = (e: any) => {
@@ -182,7 +182,9 @@ export const convertToString = (value: any): string => {
 const getEnvLogLevel = (configLevel: LogLevelDesc): LogLevelDesc => {
   let logLevel = configLevel;
   if (localStorage && localStorage.getItem) {
-    const localStorageLevel = localStorage.getItem("logLevel") as LogLevelDesc;
+    const localStorageLevel = localStorage.getItem(
+      "logLevelOverride",
+    ) as LogLevelDesc;
     if (localStorageLevel) logLevel = localStorageLevel;
   }
   return logLevel;

app/client/src/utils/storage.ts

@@ -122,10 +122,8 @@ export const setOnboardingWelcomeState = async (onboardingState: boolean) => {
     await store.setItem(STORAGE_KEYS.ONBOARDING_WELCOME_STATE, onboardingState);
     return true;
   } catch (error) {
-    console.log(
-      "An error occurred when setting onboarding welcome state: ",
-      error,
-    );
+    log.error("An error occurred when setting onboarding welcome state: ");
+    log.error(error);
     return false;
   }
 };
@@ -137,10 +135,8 @@ export const getOnboardingWelcomeState = async () => {
     );
     return onboardingState;
   } catch (error) {
-    console.log(
-      "An error occurred when getting onboarding welcome state: ",
-      error,
-    );
+    log.error("An error occurred when getting onboarding welcome state: ");
+    log.error(error);
   }
 };
 
@@ -154,7 +150,8 @@ export const setRecentAppEntities = async (entities: any, appId: string) => {
     recentEntities[appId] = entities;
     await store.setItem(STORAGE_KEYS.RECENT_ENTITIES, recentEntities);
   } catch (error) {
-    console.log("An error occurred while saving recent entities", error);
+    log.error("An error occurred while saving recent entities");
+    log.error(error);
   }
 };
 
@@ -165,7 +162,8 @@ export const fetchRecentAppEntities = async (appId: string) => {
     )) as Record<string, any>;
     return (recentEntities && recentEntities[appId]) || [];
   } catch (error) {
-    console.log("An error occurred while fetching recent entities", error);
+    log.error("An error occurred while fetching recent entities");
+    log.error(error);
   }
 };
 
@@ -181,7 +179,8 @@ export const deleteRecentAppEntities = async (appId: string) => {
     }
     await store.setItem(STORAGE_KEYS.RECENT_ENTITIES, recentEntities);
   } catch (error) {
-    console.log("An error occurred while saving recent entities", error);
+    log.error("An error occurred while saving recent entities");
+    log.error(error);
   }
 };
 
@@ -190,7 +189,8 @@ export const setCommentsIntroSeen = async (flag: boolean) => {
     await store.setItem(STORAGE_KEYS.COMMENTS_INTRO_SEEN, flag);
     return true;
   } catch (error) {
-    console.log("An error occurred when setting COMMENTS_INTRO_SEEN", error);
+    log.error("An error occurred when setting COMMENTS_INTRO_SEEN");
+    log.error(error);
     return false;
   }
 };
@@ -202,7 +202,8 @@ export const getCommentsIntroSeen = async () => {
     )) as boolean;
     return commentsIntroSeen;
   } catch (error) {
-    console.log("An error occurred while fetching COMMENTS_INTRO_SEEN", error);
+    log.error("An error occurred while fetching COMMENTS_INTRO_SEEN");
+    log.error(error);
   }
 };
 
@@ -211,10 +212,8 @@ export const setOnboardingFormInProgress = async (flag?: boolean) => {
     await store.setItem(STORAGE_KEYS.ONBOARDING_FORM_IN_PROGRESS, flag);
     return true;
   } catch (error) {
-    console.log(
-      "An error occurred when setting ONBOARDING_FORM_IN_PROGRESS",
-      error,
-    );
+    log.error("An error occurred when setting ONBOARDING_FORM_IN_PROGRESS");
+    log.error(error);
     return false;
   }
 };
@@ -226,9 +225,7 @@ export const getOnboardingFormInProgress = async () => {
     );
     return onboardingFormInProgress;
   } catch (error) {
-    console.log(
-      "An error occurred while fetching ONBOARDING_FORM_IN_PROGRESS",
-      error,
-    );
+    log.error("An error occurred while fetching ONBOARDING_FORM_IN_PROGRESS");
+    log.error(error);
   }
 };

app/client/src/widgets/ListWidget/ListWidget.tsx

@@ -592,7 +592,7 @@ class ListWidget extends BaseWidget<ListWidgetProps<WidgetProps>, WidgetState> {
 
         childCanvas.children = canvasChildren;
       } catch (e) {
-        console.log({ error: e });
+        log.error(e);
       }
 
       return this.renderChild(childCanvas);

app/client/src/widgets/TableWidget/TablePropertyPaneConfig.ts

@@ -447,8 +447,6 @@ export default [
             {
               sectionName: "Styles",
               hidden: (props: TableWidgetProps, propertyPath: string) => {
-                // const baseProperty = getBasePropertyPath(propertyPath);
-                // console.log("Table log:", { baseProperty }, { propertyPath });
                 const columnType = get(props, `${propertyPath}.columnType`, "");
 
                 return (

app/client/src/widgets/TableWidget/derived.js

@@ -197,7 +197,11 @@ export default {
             try {
               computedValues = JSON.parse(column.computedValue);
             } catch (e) {
-              console.log("Error parsing column value: ", column.computedValue);
+              console.error(
+                e,
+                "Error parsing column value: ",
+                column.computedValue,
+              );
             }
           } else if (Array.isArray(column.computedValue)) {
             computedValues = column.computedValue;
@@ -401,7 +405,7 @@ export default {
             );
           }
         } catch (e) {
-          console.log(e);
+          console.error(e);
         }
         const filterValue = result;
         if (filterOperator === "AND") {