refactor: Remove legacyAppLoader files and configurations

legacyAppLoader/package.json → client/apps/legacyAppLoader/package.json

@@ -5,8 +5,8 @@
   "type": "module",
   "main": "src/index.ts",
   "scripts": {
-    "prebuild": "rm -f ../client/packages/portal-client/src/assets/appLegacyLoader.js",
-    "build": "fusion-framework-cli app build && mv ./dist/app-bundle.js ../client/packages/portal-client/src/assets/appLegacyLoader.js",
+    "prebuild": "rm -f ../../packages/portal-client/src/assets/appLegacyLoader.js",
+    "build:appLoader": "fusion-framework-cli app build && mv ./dist/app-bundle.js ../../packages/portal-client/src/assets/appLegacyLoader.js",
     "build:resources": "tsc && vite build",
     "dev": "fusion-framework-cli app dev -c vite.config.js",
     "docker": "cd .. && sh docker-script.sh app-react",
@@ -42,4 +42,4 @@
     "@types/react-router-dom": "^5.3.3",
     "vite-plugin-static-copy": "^0.17.0"
   }
-}
+}

client/apps/legacyAppLoader/src/app-loader/components/LegacyAppLoader.tsx

@@ -0,0 +1,45 @@
+import { lazy } from 'react';
+import AppWrapperLegacy, { getLegacyFusion } from './LegacyAppWrapper';
+
+import { AppConfig } from '@equinor/fusion-framework-module-app';
+import { AppManifest as LegacyAppManifest } from '@equinor/fusion';
+
+import LegacyAppContainer from '../legacy-interopt/LegacyAppContainer';
+import { MessagePage } from './MessagePage';
+export type LegacyEnv = {
+	basename: string;
+	config: AppConfig;
+	manifest: LegacyAppManifest;
+};
+
+export const createLegacyAppLoader = (appKey: string) =>
+	lazy(async () => {
+		const appContainer = getLegacyFusion().app.container as LegacyAppContainer;
+		const [basename] = window.location.pathname.match(/\/?apps\/[a-z|-]+\//) ?? [''];
+
+		if (Object.keys(appContainer.allApps).length === 0) {
+			await appContainer.getAllAsync();
+		}
+
+		const config = await appContainer.setCurrentAppAsync(appKey);
+
+		if (!config) {
+			return {
+				default: () => <MessagePage type="Warning" title="No config" />,
+			};
+		}
+
+		const env = {
+			basename,
+			config,
+			manifest: { ...appContainer.currentApp } as LegacyAppManifest,
+		};
+
+		return {
+			default: () => (
+				<>
+					<AppWrapperLegacy appKey={appKey} env={env} />
+				</>
+			),
+		};
+	});

client/apps/legacyAppLoader/src/app-loader/components/LegacyAppWrapper.tsx

@@ -0,0 +1,63 @@
+import { Suspense, useMemo } from 'react';
+
+import { useFramework } from '@equinor/fusion-framework-react';
+
+import { GLOBAL_FUSION_CONTEXT_KEY } from '../legacy-interopt/static';
+import { createLegacyRender } from '../legacy-interopt';
+
+import { MessagePage } from './MessagePage';
+import { ProgressLoader } from './ProgressLoader';
+
+import { LegacyEnv } from './LegacyAppLoader';
+
+const DEBUG_LOG = false;
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+export const getLegacyFusion = () => window[GLOBAL_FUSION_CONTEXT_KEY];
+/**
+ * Legacy wrapper element
+ * this should be removed in future when applications are moved over to ESM
+ */
+
+export const AppWrapperLegacy = (props: { appKey: string; env: LegacyEnv }): JSX.Element => {
+	const { appKey, env } = props;
+	const fusion = useFramework();
+	const legacyFusion = getLegacyFusion();
+	const manifest = getLegacyFusion().app.container.get(appKey) || null;
+
+	const AppComponent = useMemo(() => {
+		if (!manifest) {
+			console.warn('🌍❗️ Portal Legacy:', 'missing application manifest');
+			return null;
+		}
+
+		/** sanity check if the `registerApp` has been loaded */
+		if (!manifest.render && !manifest.AppComponent) {
+			DEBUG_LOG &&
+				console.warn('🌍❗️ Portal Legacy:', 'no render or component, make sure app script is loading');
+			return null;
+		}
+
+		DEBUG_LOG && console.debug('🌍 Portal:', 'creating application component', manifest);
+
+		const render = manifest.render ?? createLegacyRender(manifest, legacyFusion);
+		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+		// @ts-ignore
+		return render(fusion, env);
+	}, [fusion, legacyFusion, manifest, env]);
+
+	if (!AppComponent) {
+		return (
+			<MessagePage title="Loader Error">
+				<p>Failed to render application, missing app component</p>
+			</MessagePage>
+		);
+	}
+	return (
+		<Suspense fallback={<ProgressLoader title="Loading" />}>
+			<AppComponent />
+		</Suspense>
+	);
+};
+
+export default AppWrapperLegacy;

client/apps/legacyAppLoader/src/app-loader/components/LegacyWrapper.tsx

@@ -0,0 +1,23 @@
+import { useFramework } from '@equinor/fusion-framework-react';
+import { PropsWithChildren } from 'react';
+
+import { AppModule } from '@equinor/fusion-framework-module-app';
+import { NavigationModule } from '@equinor/fusion-framework-module-navigation';
+import { LegacyFusionWrapper } from '../legacy-interopt/components';
+import { useAppModules } from '@equinor/fusion-framework-react-app';
+import { ProgressLoader } from './ProgressLoader';
+
+export const LegacyWrapper = ({ children }: PropsWithChildren<unknown>) => {
+	const framework = useFramework<[AppModule, NavigationModule]>();
+	const appFramework = useAppModules<[AppModule]>();
+
+	return (
+		<LegacyFusionWrapper
+			framework={framework}
+			loader={<ProgressLoader title="Loading" />}
+			appFramework={appFramework}
+		>
+			{children}
+		</LegacyFusionWrapper>
+	);
+};

client/package.json

@@ -7,6 +7,7 @@
     "start": "npx lerna run serve",
     "build": "npx lerna run build",
     "build:apps": "npx lerna run build:apps",
+    "build:appLoader": "npx lerna run build:appLoader",
     "test:all": "test:coverage && build:coverage",
     "test": "lerna  run test",
     "test:coverage": "lerna run test:coverage",

clientBackend.Dockerfile

@@ -9,10 +9,19 @@ WORKDIR /app-client
 
 COPY ["/client", "."]
 
+WORKDIR  /app-client/apps/legacyAppLoader
+
+RUN yarn install --frozen-lockfile
+RUN yarn run build:appLoader
+
+WORKDIR /app-client
+
 RUN yarn install --frozen-lockfile
 
 RUN npx yarn run build
 
+
+
 # 2: Build & run web server
 # ----------------------------------------------------