From 57031fed103f0fb3eacada7e4c3412d3eb1ccaa4 Mon Sep 17 00:00:00 2001
From: Thakur Karthik <iamkarthik08@gmail.com>
Date: Mon, 26 Oct 2020 12:30:01 +0530
Subject: [PATCH] Fix theme breaking with a slash in url (#1391)

Fixes #1386
---
 app/client/src/AppRouter.tsx     |  4 +++-
 app/client/src/utils/helpers.tsx | 19 +++++++++++++++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/app/client/src/AppRouter.tsx b/app/client/src/AppRouter.tsx
index 2b9daf0615..fb0bd5ef32 100644
--- a/app/client/src/AppRouter.tsx
+++ b/app/client/src/AppRouter.tsx
@@ -36,13 +36,15 @@ import { connect } from "react-redux";
 
 import * as Sentry from "@sentry/react";
 import AnalyticsUtil from "utils/AnalyticsUtil";
+import { trimTrailingSlash } from "utils/helpers";
+
 const SentryRoute = Sentry.withSentryRouting(Route);
 
 const loadingIndicator = <PageLoadingBar />;
 
 function changeAppBackground(currentTheme: any) {
   if (
-    window.location.pathname === "/applications" ||
+    trimTrailingSlash(window.location.pathname) === "/applications" ||
     window.location.pathname.indexOf("/settings/") !== -1
   ) {
     document.body.style.backgroundColor =
diff --git a/app/client/src/utils/helpers.tsx b/app/client/src/utils/helpers.tsx
index 826682644d..7b6dea68d0 100644
--- a/app/client/src/utils/helpers.tsx
+++ b/app/client/src/utils/helpers.tsx
@@ -117,3 +117,22 @@ export const isMac = () => {
     typeof navigator !== "undefined" ? navigator.platform : undefined;
   return !platform ? false : /Mac|iPod|iPhone|iPad/.test(platform);
 };
+
+/**
+ * Removes the trailing slashes from the path
+ * @param path
+ * @example
+ * ```js
+ * let trimmedUrl = trimTrailingSlash('/url/')
+ * console.log(trimmedUrl) //will output /url
+ * ```
+ * @example
+ * ```js
+ * let trimmedUrl = trimTrailingSlash('/yet-another-url//')
+ * console.log(trimmedUrl) // will output /yet-another-url
+ * ```
+ */
+export const trimTrailingSlash = (path: string) => {
+  const trailingUrlRegex = /\/+$/;
+  return path.replace(trailingUrlRegex, "");
+};