Introducing EE Version - active Development

Author: FalkWolsky

client/config/test/jest.config.js

@@ -6,14 +6,10 @@ export function currentDirName(importMetaUrl) {
   return dirname(fileURLToPath(importMetaUrl));
 }
 
-
 const globals = {};
 buildVars.forEach(({ name, defaultValue }) => {
   globals[name] = process.env[name] || defaultValue;
 });
-const edition = process.env.REACT_APP_EDITION;
-const isEEGlobal = edition === "enterprise-global";
-const isEE = edition === "enterprise" || isEEGlobal;
 const currentDir = currentDirName(import.meta.url);
 
 export default {
@@ -22,8 +18,7 @@ export default {
     "react-markdown": path.resolve(currentDir, "./mocks/react-markdown.js"),
     "\\.md\\?url$": path.resolve(currentDir, "./mocks/markdown-url-module.js"),
     "^@lowcoder-ee(.*)$": path.resolve(
-      currentDir,
-      isEE ? "../../packages/lowcoder/src/ee/$1" : "../../packages/lowcoder/src/$1"
+      currentDir, "../../packages/lowcoder/src/$1"
     ),
     "lowcoder-sdk": path.resolve(currentDir, "../../packages/lowcoder/src/index.sdk"),
   },

client/package.json

@@ -13,7 +13,6 @@
     "start": "yarn workspace lowcoder start",
     "start-win": "LOWCODER_API_SERVICE_URL=http://localhost:3000 yarn start",
     "start:ee": "REACT_APP_EDITION=enterprise yarn workspace lowcoder start",
-    "start:ee-global": "REACT_APP_EDITION=enterprise-global yarn workspace lowcoder start",
     "build": "yarn node ./scripts/build.js",
     "test": "jest && yarn workspace lowcoder-comps test",
     "prepare": "yarn workspace lowcoder prepare",

client/packages/lowcoder-design/src/icons/index.ts

@@ -315,6 +315,7 @@ export { ReactComponent as RecyclerIcon } from "./remix/delete-bin-line.svg";
 export { ReactComponent as MarketplaceIcon } from "./icon-application-marketplace.svg";
 export { ReactComponent as FavoritesIcon } from "./icon-application-favorites.svg";
 export { ReactComponent as HomeSettingIcon } from "./remix/settings-4-line.svg";
+export { ReactComponent as EnterpriseIcon } from "./remix/earth-line.svg";
 
 
 // new

client/packages/lowcoder/src/app.tsx

@@ -14,15 +14,16 @@ import {
   IMPORT_APP_FROM_TEMPLATE_URL,
   INVITE_LANDING_URL,
   isAuthUnRequired,
-  MARKETPLACE_TYPE_URL,
   MARKETPLACE_URL,
   ORG_AUTH_LOGIN_URL,
   ORG_AUTH_REGISTER_URL,
   QUERY_LIBRARY_URL,
   SETTING,
   TRASH_URL,
   USER_AUTH_URL,
+  ADMIN_APP_URL,
 } from "constants/routesURL";
+
 import React from "react";
 import { createRoot } from "react-dom/client";
 import { Helmet } from "react-helmet";
@@ -38,7 +39,7 @@ import LazyRoute from "components/LazyRoute";
 import AppFromTemplate from "pages/ApplicationV2/AppFromTemplate";
 import AppEditor from "pages/editor/AppEditor";
 import { getAntdLocale } from "i18n/antdLocale";
-import { CodeEditorTooltipContainer } from "base/codeEditor/codeEditor";
+// import { CodeEditorTooltipContainer } from "base/codeEditor/codeEditor";
 import { ProductLoading } from "components/ProductLoading";
 import { language, trans } from "i18n";
 import { loadComps } from "comps";
@@ -155,6 +156,7 @@ class AppIndex extends React.Component<AppIndexProps, any> {
                 TRASH_URL,
                 SETTING,
                 MARKETPLACE_URL,
+                ADMIN_APP_URL,
               ]}
               // component={ApplicationListPage}
               component={ApplicationHome}

client/packages/lowcoder/src/comps/comps/gridLayoutComp/canvasView.tsx

@@ -23,6 +23,7 @@ import { ScrollBar } from "lowcoder-design";
 
 const UICompContainer = styled.div<{ $maxWidth?: number; readOnly?: boolean; $bgColor: string }>`
   height: 100%;
+  min-height: 100vh;
   margin: 0 auto;
   max-width: ${(props) => props.$maxWidth || 1600}px;
   background-color: ${(props) => props.$bgColor};

client/packages/lowcoder/src/comps/comps/remoteComp/loaders.tsx

@@ -11,12 +11,11 @@ async function npmLoader(
   remoteInfo: RemoteCompInfo
 ): Promise<CompConstructor | null> {
 
-  console.log("remoteInfo: ", remoteInfo);
-
   // Falk: removed "packageVersion = "latest" as default value fir packageVersion - to ensure no automatic version jumping.
+  const localPackageVersion = remoteInfo.packageVersion || "latest";
 
   const { packageName, packageVersion, compName } = remoteInfo;
-  const entry = `${NPM_PLUGIN_ASSETS_BASE_URL}/${packageName}@${packageVersion}/index.js`;
+  const entry = `${NPM_PLUGIN_ASSETS_BASE_URL}/${packageName}@${localPackageVersion}/index.js`;
   // const entry = `../../../../../public/package/index.js`; 
   // console.log("Entry", entry);
   try {

client/packages/lowcoder/src/constants/applicationConstants.ts

@@ -130,7 +130,8 @@ export interface AppPermissionInfo {
   publicToMarketplace: boolean;
 }
 
-export type AppViewMode = "edit" | "preview" | "view" | "view_marketplace";
+// adding viewMode for marketplace and adminMode for Admin area use
+export type AppViewMode = "edit" | "preview" | "view" | "view_marketplace" | "admin";
 
 export type AppPathParams = {
   viewMode: AppViewMode;

client/packages/lowcoder/src/constants/routesURL.ts

@@ -20,6 +20,7 @@ export const PERMISSION_SETTING_DETAIL = `${PERMISSION_SETTING}/:groupId`;
 export const ORGANIZATION_SETTING_DETAIL = `${ORGANIZATION_SETTING}/:orgId`;
 
 export const ALL_APPLICATIONS_URL = "/apps";
+export const ADMIN_APP_URL = "/ee/:applicationId/:viewMode";
 export const APPLICATION_MARKETPLACE_URL = `https://app.lowcoder.cloud/apps`;
 export const MODULE_APPLICATIONS_URL = "/apps/module";
 export const MARKETPLACE_URL = `/marketplace`;

client/packages/lowcoder/src/i18n/locales/en.ts

@@ -1585,7 +1585,8 @@ export const en = {
     "oauthProviders": "User Authentication",
     "appUsage": "App Usage Logs",
     "environments": "Environments",
-    "premium": "Premium"
+    "premium": "Premium",
+    "AppUsage": "Global App Usage",
   },
 
 

client/packages/lowcoder/src/pages/ApplicationV2/index.tsx

@@ -9,6 +9,7 @@ import {
   QUERY_LIBRARY_URL,
   SETTING,
   TRASH_URL,
+  ADMIN_APP_URL
 } from "constants/routesURL";
 import { getUser, isFetchingUser } from "redux/selectors/usersSelectors";
 import { useDispatch, useSelector } from "react-redux";
@@ -26,7 +27,8 @@ import {
   PointIcon,
   RecyclerIcon,
   MarketplaceIcon,
-  AppsIcon
+  AppsIcon,
+  EnterpriseIcon
 } from "lowcoder-design";
 import React, { useEffect, useState } from "react";
 import { fetchAllApplications, fetchHomeData } from "redux/reduxActions/applicationActions";
@@ -53,6 +55,10 @@ import { foldersSelector } from "../../redux/selectors/folderSelector";
 import Setting from "pages/setting";
 import { TypographyText } from "../../components/TypographyText";
 import { messageInstance } from "lowcoder-design";
+import { isEE } from "util/envUtils";
+
+// adding App Editor, so we can show Apps inside the Admin Area
+import AppEditor from "../editor/AppEditor";
 
 const TabLabel = styled.div`
   font-weight: 500;
@@ -408,6 +414,18 @@ export default function ApplicationHome() {
               },
             ],
           },
+          isEE() ? {
+            items: [
+              {
+                text: <TabLabel>{trans("settings.AppUsage")}</TabLabel>,
+                routePath: "/ee/6600ae8724a23f365ba2ed4c/admin",
+                routePathExact: false,
+                routeComp: AppEditor,
+                icon: ({ selected, ...otherProps }) => selected ? ( <EnterpriseIcon {...otherProps} width={"24px"}/> ) : ( <EnterpriseIcon {...otherProps} width={"24px"}/> ),
+                visible: ({ user }) => user.orgDev,
+              },
+            ],
+          } : { items: [] },
         ]}
       />
       {user.orgDev && (