Merge pull request #1620 from LalitDeore/test

Fix - App activation and redirection issue for onprem

frontend/src/App.jsx

@@ -476,8 +476,8 @@ const App = (message, props) => {
         	    />
         	  }
         	/>
-			{/* <Route exact path="/apps/:appid" element={<AppExplorer userdata={userdata} isLoggedIn={isLoggedIn} isLoaded={isLoaded}  globalUrl={globalUrl} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor} checkLogin={checkLogin} {...props} />} />
+			<Route exact path="/apps/:appid" element={<AppExplorer userdata={userdata} isLoggedIn={isLoggedIn} isLoaded={isLoaded}  globalUrl={globalUrl} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor} checkLogin={checkLogin} {...props} />} />
-			<Route exact path="/apis/:appid" element={<ApiExplorerWrapper serverside={false} userdata={userdata} isLoggedIn={isLoggedIn} isMobile={false} selectedApp={undefined} isLoaded={isLoaded}globalUrl={globalUrl} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor} checkLogin={checkLogin} {...props} />} /> */}
+			<Route exact path="/apis/:appid" element={<ApiExplorerWrapper serverside={false} userdata={userdata} isLoggedIn={isLoggedIn} isMobile={false} selectedApp={undefined} isLoaded={isLoaded}globalUrl={globalUrl} surfaceColor={theme.palette.surfaceColor} inputColor={theme.palette.inputColor} checkLogin={checkLogin} {...props} />} />
 			<Route
 				exact
 				path="/detections/sigma"

frontend/src/components/AppGrid.jsx

@@ -417,8 +417,8 @@ const AppGrid = (props) => {
                   {hits.map((data, index) => {
                     const appUrl =
                               isCloud === true ?
-                              `/apps/${data.id}`
+                              `/apps/${data.objectID}`
-                                : `https://shuffler.io/apps/${data.objectID}`;
+                                : `apps/${data.objectID}`;
 
                               if (data.name === "" && data.id === "") {
                                 return null

frontend/src/components/AppModal.jsx

@@ -590,7 +590,7 @@ const AppModal = ({ open, onClose, app, globalUrl, getApps }) => {
 					</Typography>
 	  			</a>
                 <Link
-                  to={isCloud ? "/apps/" + (app?.id || app?.objectID) : `https://shuffler.io/apps/${app?.objectID || app?.id}`}
+                  to={isCloud ? `/apps/${app?.id || app?.objectID}` : `/apps/${app?.id || app?.published_id || app?.objectID}`}
                   style={{ textDecoration: "none", color: "#f85a3e", marginTop: "-2px" }}
                   target="_blank"
                   rel="noopener noreferrer"

frontend/src/components/SearchData.jsx

@@ -495,7 +495,7 @@ const SearchData = props => {
                                 })
                             }
 
-                            var parsedUrl = isCloud ? `/apps/${hit.objectID}` : `https://shuffler.io/apps/${hit.objectID}`
+                            var parsedUrl = isCloud ? `/apps/${hit.objectID}` : `/apps/${hit.objectID}`
                             parsedUrl += `?queryID=${hit.__queryID}`
 
                             return (

frontend/src/views/AppExplorer.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useContext } from "react";
+import React, { useState, useEffect, useContext, useRef } from "react";
 
 import theme from "../theme.jsx";
 import ReactGA from "react-ga4";
@@ -223,6 +223,7 @@ const AppExplorer = (props) => {
     result: baseResult,
   });
   const [executing, setExecuting] = useState(false);
+  const [activatedApps, setActivatedApps] = useState([]);
   const [anchorEl, setAnchorEl] = React.useState(null);
   const [creatorProfile, setCreatorProfile] = React.useState({});
   const [selectedTab, setSelectedTab] = React.useState(0);
@@ -247,6 +248,7 @@ const AppExplorer = (props) => {
   })
 
   const isCloud = (window.location.host === "localhost:3002" || window.location.host === "shuffler.io") ? true : (process.env.IS_SSR === "true");
+  const isFirstRequestSentRef = useRef(false); 
 
 
   // FIXME: This is used, as useEffect() creates an issue with apps not loading at all
@@ -299,13 +301,15 @@ const AppExplorer = (props) => {
       if (serverside) {
         console.log("Not getting app because serverside.");
       } else {
-        if (params.appid.length === 32 || params.appid.length === 36) {
+        if (isCloud) {
-          handleEditApp(params.appid);
+          if (params.appid.length === 32 || params.appid.length === 36) {
-          runAlgoliaAppSearch(params.appid, false, true);
+            handleEditApp(params.appid);
-        } else {
+            runAlgoliaAppSearch(params.appid, false, true);
-          runAlgoliaAppSearch(params.appid);
+          } else {
+            runAlgoliaAppSearch(params.appid);
   
-          //handleEditApp()
+            //handleEditApp()
+          }
         }
       }
       //parseIncomingOpenapiData(YAML.parse(data))
@@ -344,6 +348,86 @@ const AppExplorer = (props) => {
   	  loadOrganization(userdata.active_org.id) 
   }
 
+  const getApps = () => {
+      // Get apps from localstorage
+      var storageApps = []
+      try {
+        const appstorage = localStorage.getItem("apps")
+        storageApps = JSON.parse(appstorage)
+        if (storageApps === null || storageApps === undefined || storageApps.length === 0) {
+          storageApps = []
+        } else {
+          setActivatedApps(storageApps)
+        }
+      } catch (e) {
+        //console.log("Failed to get apps from localstorage: ", e)
+      }
+
+
+      fetch(globalUrl + "/api/v1/apps", {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          Accept: "application/json",
+        },
+        credentials: "include",
+      })
+        .then((response) => {
+          if (response.status !== 200) {
+            console.log("Status not 200 for apps :O!");
+  
+            //if (isCloud) {
+            //  window.location.pathname = "/search";
+            //}
+          }
+  
+          return response.json();
+        })
+        .then((responseJson) => {
+          var privateapps = [];
+          var valid = [];
+          var invalid = [];
+          for (var key in responseJson) {
+            const app = responseJson[key];
+  
+            if (app.categories !== undefined && app.categories !== null && app?.categories.includes("Eradication")) {
+              app.categories = ["EDR"]
+            }
+  
+            if (app.is_valid && !(!app.activated && app.generated)) {
+              privateapps.push(app);
+            } else if (
+              app.private_id !== undefined &&
+              app.private_id.length > 0
+            ) {
+              valid.push(app);
+            } else {
+              invalid.push(app);
+            }
+          }
+  
+          privateapps.push(...valid);
+          privateapps.push(...invalid);
+          setActivatedApps(privateapps);
+
+          if (params.appid.length === 32 || params.appid.length === 36) {
+            handleEditApp(params.appid, privateapps);
+            runAlgoliaAppSearch(params.appid, false, true, privateapps);
+          } else {
+            runAlgoliaAppSearch(params.appid,true, false, privateapps);
+          }
+        })
+        .catch((error) => {
+          toast(error.toString());
+        });
+  };
+
+  useEffect(() => {
+    if (activatedApps?.length === 0 && !isCloud) {
+      getApps();
+    }
+  }, [activatedApps]);
+
   var activateButton = (
     <Link to={`/apps/new?id=${appId}`} style={{ textDecoration: "none" }}>
       <Button
@@ -785,15 +869,101 @@ const AppExplorer = (props) => {
       });
   };
 
-  const handleEditApp = (appid) => {
+  
+
+    const HandleActivateApp = (appid) => {
+        if (isFirstRequestSentRef.current) {
+            console.log("Skipping duplicate activation request for app:", appid);
+            return;
+        }
+        
+        isFirstRequestSentRef.current = true; 
+
+        toast.info("App is not activated. Activating it now. Please wait...");
+      
+        const baseURL = globalUrl;
+        const url = `${baseURL}/api/v1/apps/${appid}/activate`;
+      
+        fetch(url, {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+          },
+          credentials: "include",
+        })
+          .then((response) => response.json())
+          .then((responseJson) => {
+            if (!responseJson.success) {
+              toast.error("Failed to activate app. Redirecting to https://shuffler.io. Please wait...");
+              setTimeout(() => {
+                window.location.replace(`https://shuffler.io/apps/${appid}`);
+              }, 2000);
+              return;
+            }
+
+            localStorage.removeItem("apps");
+            getApps();
+          })
+          .catch((error) => {
+            console.log("App activation error: ", error.toString());
+            toast.error("Failed to activate app. Redirecting to https://shuffler.io. Please wait...");
+            setTimeout(() => {
+              window.location.href = `https://shuffler.io/apps/${appid}`;
+            }, 2000);
+          });
+    };
+
+  
+  
+
+  const handleEditApp = (appid, privateapps) => {
     if (serverside === true) {
       return;
     }
 
-		setAppId(appid)
+    var newAppId = appid
+    var appIdFound = false
+  
+    if (!isCloud) {
+      // Ensure privateapps is always an array
+      privateapps = Array.isArray(privateapps) ? privateapps : [];
+  
+      let found = privateapps.find(app => {
+          return app.id?.trim().toLowerCase() === appid
+      });
+  
+      if (!found) {
+          found = privateapps.find(app => {
+              return app.published_id?.trim().toLowerCase() === appid;
+          });
+      }
   
   
-    fetch(`${globalUrl}/api/v1/apps/${appid}/config`, {
+      if (found && found.id) {
+          newAppId = found.id;
+          appIdFound = true
+      } else {
+        if (!isFirstRequestSentRef.current) {
+          HandleActivateApp(appid);
+          return;
+      } else {
+          toast.info("App activated but can't load it for now. Loading app on https://shuffler.io. Please wait...");
+          setTimeout(() => {
+              window.location.href = `https://shuffler.io/apps/${appid}`;
+          }, 3000);
+      }
+      }
+      
+    }
+
+    setAppId(newAppId)
+
+    if (isFirstRequestSentRef.current && !isCloud && !appIdFound) {
+      return
+    }
+
+    fetch(`${globalUrl}/api/v1/apps/${newAppId}/config`, {
       method: "GET",
       headers: {
         "Content-Type": "application/json",
@@ -1424,7 +1594,7 @@ const AppExplorer = (props) => {
       });
   };
 
-  const runAlgoliaAppSearch = (appname, isOriginal, triggerOnly) => {
+  const runAlgoliaAppSearch = (appname, isOriginal, triggerOnly, privatedapps) => {
     const index = searchClient.initIndex("appsearch");
 
     console.log("Running appsearch for: ", appname);
@@ -1439,7 +1609,7 @@ const AppExplorer = (props) => {
 		if (hits !== undefined && hits !== null && hits.length === 1) {
 			found = true
 			if (isOriginal !== false) {
-				handleEditApp(hits[0].objectID)
+				handleEditApp(hits[0].objectID, privatedapps)
 			} else {
 				setSecondaryApp(hits[0])
 			}
@@ -1474,7 +1644,7 @@ const AppExplorer = (props) => {
 			} else {
 				if (isOriginal !== false) {
 					found = true
-					handleEditApp(hit.objectID);
+					handleEditApp(hit.objectID, privatedapps);
 				} else {
 					console.log("Found second app: ", hit);
 					hit.name = hit.name.charAt(0).toUpperCase() + hit.name.slice(1);
@@ -1489,7 +1659,7 @@ const AppExplorer = (props) => {
 	    if (!found) {
 			if (hits.length > 0) {
 				if (isOriginal !== false) {
-					handleEditApp(hits[0].objectID)
+					handleEditApp(hits[0].objectID, privatedapps)
 				} else {
 					setSecondaryApp(hits[0]);
 				}
@@ -1547,11 +1717,13 @@ const AppExplorer = (props) => {
 	setTriggers([])
     //handleEditApp(params.appid)
 
-    if (params.appid.length === 32 || params.appid.length === 36) {
+    if (isCloud) {
-      handleEditApp(params.appid);
+      if (params.appid.length === 32 || params.appid.length === 36) {
-			runAlgoliaAppSearch(params.appid, false, true);
+        handleEditApp(params.appid);
-    } else {
+        runAlgoliaAppSearch(params.appid, false, true);
-      runAlgoliaAppSearch(params.appid);
+      } else {
+        runAlgoliaAppSearch(params.appid);
+      }
     }
   }
 
@@ -4046,7 +4218,7 @@ const AppExplorer = (props) => {
 
           {isMobile ? null : (
             <Button
-			  variant={userdata.active_apps !== undefined && userdata.active_apps !== null && userdata.active_apps.includes(appId) ? "outlined": "contained"}
+			  variant={(userdata.active_apps !== undefined && userdata.active_apps !== null && userdata.active_apps.includes(appId) || !isCloud) ? "outlined": "contained"}
               component="label"
               color="primary"
               onClick={() => {
@@ -4091,7 +4263,7 @@ const AppExplorer = (props) => {
               }}
               style={{ height: 40, marginTop: 5 }}
             >
-			  {userdata.active_apps !== undefined && userdata.active_apps !== null && userdata.active_apps.includes(appId) ?
+			  {((userdata.active_apps !== undefined && userdata.active_apps !== null && userdata.active_apps.includes(appId) )|| !isCloud ) ?
 				  "Deactivate App"
 				  :
 				  "Activate App"