Open upload dialog when CSV upload is closed on landing page

googlemaps · Feb 2, 2024 · a95eccb · a95eccb
1 parent 5b40a43
commit a95eccb
Show file tree

Hide file tree

Showing 7 changed files with 35 additions and 12 deletions.
diff --git a/application/frontend/src/app/core/actions/upload.actions.ts b/application/frontend/src/app/core/actions/upload.actions.ts
@@ -7,11 +7,14 @@
  * https://opensource.org/licenses/MIT.
  */
 
-import { createAction } from '@ngrx/store';
+import { createAction, props } from '@ngrx/store';
 
 export const openDialog = createAction('[Upload] Open Dialog');
 
 export const closeDialog = createAction('[Upload] Close Dialog');
 
-export const openCsvDialog = createAction('[Upload] Open CSV Dialog');
+export const openCsvDialog = createAction(
+  '[Upload] Open CSV Dialog',
+  props<{ openUploadDialogOnClose?: boolean }>()
+);
 export const closeCsvDialog = createAction('[Upload] Close CSV Dialog');
diff --git a/application/frontend/src/app/core/containers/main-actions/main-actions.component.ts b/application/frontend/src/app/core/containers/main-actions/main-actions.component.ts
@@ -59,7 +59,7 @@ export class MainActionsComponent implements OnInit {
   }
 
   onCsvUpload(): void {
-    this.store.dispatch(UploadActions.openCsvDialog());
+    this.store.dispatch(UploadActions.openCsvDialog({}));
   }
 
   onCSVDownload(): void {

diff --git a/application/frontend/src/app/core/containers/upload-dialog/upload-dialog.component.ts b/application/frontend/src/app/core/containers/upload-dialog/upload-dialog.component.ts
@@ -93,7 +93,7 @@ export class UploadDialogComponent {
 
   loadFromCsv(): void {
     this.dialogRef.close();
-    this.store.dispatch(UploadActions.openCsvDialog());
+    this.store.dispatch(UploadActions.openCsvDialog({ openUploadDialogOnClose: true }));
   }
 
   cancel(): void {

diff --git a/application/frontend/src/app/core/effects/upload.effects.ts b/application/frontend/src/app/core/effects/upload.effects.ts
@@ -27,6 +27,7 @@ import { Modal } from '../models';
 import { UploadType } from '../models/upload';
 import * as fromUI from '../selectors/ui.selectors';
 import { MessageService, NormalizationService } from '../services';
+import { forkJoin, of } from 'rxjs';
 
 @Injectable()
 export class UploadEffects {
@@ -46,9 +47,18 @@ export class UploadEffects {
           })
           .afterClosed()
       ),
-      mergeMap((dialogResult) => {
+      mergeMap((dialogResult) =>
+        forkJoin([
+          of(dialogResult),
+          this.store.pipe(select(fromUI.selectOpenUploadDialogOnClose), first()),
+        ])
+      ),
+      mergeMap(([dialogResult, openUploadDialog]) => {
         if (!dialogResult) {
-          return [UploadActions.openDialog()];
+          if (openUploadDialog) {
+            return [UploadActions.openDialog()];
+          }
+          return [];
         }
         const actions: Action[] = [UploadActions.closeCsvDialog()];
         actions.push(ConfigActions.setTimezone({ newTimezone: dialogResult.timezone }));

diff --git a/application/frontend/src/app/core/reducers/ui.reducer.ts b/application/frontend/src/app/core/reducers/ui.reducer.ts
@@ -38,6 +38,7 @@ export interface State {
   mouseOverId?: number;
   page: Page;
   splitSizes?: number[];
+  openUploadDialogOnClose?: boolean;
 }
 
 export const initialState: State = {
@@ -48,6 +49,7 @@ export const initialState: State = {
   mouseOverId: null,
   page: Page.Welcome,
   splitSizes: [50, 50],
+  openUploadDialogOnClose: false,
 };
 
 export const reducer = createReducer(
@@ -58,7 +60,11 @@ export const reducer = createReducer(
     mouseOverId: null,
   })),
   on(WelcomePageActions.initialize, () => ({ ...initialState })),
-  on(UploadActions.openCsvDialog, (state) => ({ ...state, modal: Modal.CsvUpload })),
+  on(UploadActions.openCsvDialog, (state, action) => ({
+    ...state,
+    modal: Modal.CsvUpload,
+    openUploadDialogOnClose: action.openUploadDialogOnClose,
+  })),
   on(DownloadActions.downloadPDF, (state) => ({ ...state, modal: Modal.DownloadPDF })),
   on(UploadActions.openDialog, WelcomePageActions.openUploadDialog, (state) => ({
     ...state,
@@ -128,3 +134,6 @@ export const selectHasMap = (state: State): boolean => state.hasMap;
 export const selectSplitSizes = (state: State): number[] => state.splitSizes;
 
 export const selectMouseOverId = (state: State): number => state.mouseOverId;
+
+export const selectOpenUploadDialogOnClose = (state: State): boolean =>
+  state.openUploadDialogOnClose;
diff --git a/application/frontend/src/app/core/selectors/ui.selectors.ts b/application/frontend/src/app/core/selectors/ui.selectors.ts
@@ -34,3 +34,8 @@ export const selectStarted = createSelector(
 );
 
 export const selectMouseOverId = createSelector(selectUIState, fromUI.selectMouseOverId);
+
+export const selectOpenUploadDialogOnClose = createSelector(
+  selectUIState,
+  fromUI.selectOpenUploadDialogOnClose
+);
diff --git a/application/frontend/src/app/welcome/containers/welcome-page/welcome-page.component.ts b/application/frontend/src/app/welcome/containers/welcome-page/welcome-page.component.ts
@@ -10,7 +10,7 @@
 import { Component, ChangeDetectionStrategy, OnInit } from '@angular/core';
 import { select, Store } from '@ngrx/store';
 import { Observable } from 'rxjs';
-import { DocumentationActions, StorageApiActions, UploadActions } from 'src/app/core/actions';
+import { DocumentationActions, StorageApiActions } from 'src/app/core/actions';
 import { selectHasStorageApiRoot } from 'src/app/core/selectors/config.selectors';
 import { State } from 'src/app/reducers';
 import { WelcomePageActions } from '../../actions';
@@ -47,10 +47,6 @@ export class WelcomePageComponent implements OnInit {
     this.store.dispatch(StorageApiActions.openLoadDialog());
   }
 
-  loadFromCsv(): void {
-    this.store.dispatch(UploadActions.openCsvDialog());
-  }
-
   onHelp(): void {
     this.store.dispatch(DocumentationActions.open());
   }