fix: add clearAppKeys action and loading state to portal hooks (#883)

equinor · Dec 9, 2024 · e7c1c08 · e7c1c08
1 parent 326e07b
commit e7c1c08
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 13 deletions.
diff --git a/client/packages/core/src/modules/portal-config/hooks/use-portal-config.ts b/client/packages/core/src/modules/portal-config/hooks/use-portal-config.ts
@@ -15,6 +15,7 @@ export const usePortal = () => {
 	return {
 		portal: value || portalConfig.current,
 		error,
+		isLoading: !value,
 	};
 };
 
@@ -31,12 +32,12 @@ export const usePortalConfig = () => {
 
 export const usePortalAppsConfig = () => {
 	const { app, context } = useFramework<[PortalConfig, AppModule]>().modules;
-	const { portal } = usePortal();
+	const { portal, isLoading } = usePortal();
 
 	useEffect(() => {
 		const sub = context.currentContext$.subscribe((context) => {
 			if ((portal.portalConfig.contexts || []).length > 0) {
-				context && portal.getAppKeysByContext(context.id);
+				context ? portal.getAppKeysByContext(context.id) : portal.clearAppKeys();
 			} else {
 				portal.getAppKeys();
 			}
@@ -60,7 +61,7 @@ export const usePortalAppsConfig = () => {
 	return {
 		apps,
 		error,
-		isLoading: !apps,
+		isLoading: isLoading,
 	};
 };
 

diff --git a/client/packages/core/src/modules/portal-config/portal.ts b/client/packages/core/src/modules/portal-config/portal.ts
@@ -18,6 +18,7 @@ export interface IPortal {
 	appKeys: string[];
 	getAppKeysByContext(contextId: string): void;
 	getAppKeys(): void;
+	clearAppKeys(): void;
 }
 
 export type CurrentPortal = IPortal;
@@ -41,6 +42,10 @@ export class Portal implements IPortal {
 		this.#state.next(actions.fetchAppKeysByContextId({ contextId }, true));
 	}
 
+	clearAppKeys(): void {
+		this.#state.next(actions.clearAppKeys());
+	}
+
 	getAppKeys(): void {
 		this.#state.next(actions.fetchAppKeys());
 	}

diff --git a/client/packages/core/src/modules/portal-config/state/actions.ts b/client/packages/core/src/modules/portal-config/state/actions.ts
@@ -36,6 +36,14 @@ const createActions = () => ({
 		(apps: string[]) => ({ payload: apps }),
 		(error: unknown) => ({ payload: error })
 	),
+	clearAppKeys: createAsyncAction(
+		'clear_apps',
+		(update?: boolean) => ({
+			payload: null,
+			meta: { update },
+		}),
+		(apps: string[]) => ({ payload: apps })
+	),
 	setAppKeys: createAction('set_apps', (apps: string[], update?: boolean) => ({
 		payload: apps,
 		meta: {

diff --git a/client/packages/core/src/modules/portal-config/state/create-reducer.ts b/client/packages/core/src/modules/portal-config/state/create-reducer.ts
@@ -31,6 +31,9 @@ export const createReducer = (value: PortalStateInitial = {}) =>
 		builder.addCase(actions.setAppKeys, (state, action) => {
 			state.apps = action.payload;
 		});
+		builder.addCase(actions.clearAppKeys, (state, action) => {
+			state.apps = [];
+		});
 	});
 
 export default createReducer;
diff --git a/client/packages/portal-client/src/components/portal-menu/PortalMenu.tsx b/client/packages/portal-client/src/components/portal-menu/PortalMenu.tsx
@@ -6,8 +6,7 @@ import { appsMatchingSearch, usePortalApps } from '@portal/core';
 import { useState, useMemo } from 'react';
 import { useFavorites } from '@portal/core';
 import styled from 'styled-components';
-import { AppContextMessage, AppGroup, LoadingMenu } from '@portal/components';
-import { useApps } from '@equinor/fusion-framework-react/app';
+import { AppGroup, LoadingMenu } from '@portal/components';
 
 const Styles = {
 	Divider: styled.div`
@@ -37,10 +36,11 @@ const Styles = {
 	AppsListWrapper: styled.div`
 		overflow: auto;
 		height: inherit;
+		min-width: 550px;
 	`,
 
-	Wrapper: styled.div`
-		column-count: 3;
+	Wrapper: styled.div<{ count?: number }>`
+		column-count: ${({ count }) => (count && count > 1 ? 3 : 0)};
 		height: 100%;
 		gap: 1.5rem;
 		overflow: auto;
@@ -140,15 +140,14 @@ export function MenuGroups() {
 							</Styles.CategoryWrapper>
 						</Styles.Divider>
 						<Styles.AppsListWrapper>
-							<AppContextMessage />
 							{displayAppGroups && !!displayAppGroups?.length ? (
 								activeItem.includes('Pinned Apps') && favorites?.length === 0 ? (
 									<InfoMessage>
 										Looks like you do not have any pinned apps yet. <br /> Click the star on apps to
 										add them to the pinned app section.
 									</InfoMessage>
 								) : (
-									<Styles.Wrapper>
+									<Styles.Wrapper count={displayAppGroups.length}>
 										{displayAppGroups &&
 											displayAppGroups.map((appGroup) => {
 												appGroup.apps = appGroup.apps.sort((a, b) => {

diff --git a/client/packages/portal-client/src/lib/portal-framework-config.tsx b/client/packages/portal-client/src/lib/portal-framework-config.tsx
@@ -70,10 +70,12 @@ export function createPortalFramework(portalConfig: PortalConfig) {
 
 		enableAppModule(config);
 
-		config.configureHttpClient('app', {
-			baseUri: new URL('/apps-proxy/', location.origin).href,
-			defaultScopes: portalConfig.serviceDiscovery.client.defaultScopes,
-		});
+		if (process.env.NODE_ENV === 'development') {
+			config.configureHttpClient('app', {
+				baseUri: new URL('/apps-proxy/', location.origin).href,
+				defaultScopes: portalConfig.serviceDiscovery.client.defaultScopes,
+			});
+		}
 
 		config.configureMsal(portalConfig.msal.client, portalConfig.msal.options);