Merge pull request #1728 from AlexandruValeanu/1691_import_export_data

GH-1691: Add import/export menu in client app

packages/altair-app/src/app/modules/altair/altair.module.ts

@@ -20,6 +20,7 @@ import { getReducer, metaReducers, reducerToken } from './store';
 
 import { QueryEffects } from './effects/query.effect';
 import { WindowsEffects } from './effects/windows.effect';
+import { WindowsMetaEffects } from './effects/windows-meta.effect';
 import { QueryCollectionEffects } from './effects/query-collection.effect';
 import { PluginEventEffects } from './effects/plugin-event.effect';
 import { LocalEffects } from './effects/local.effect';
@@ -139,6 +140,7 @@ const providers = [
     EffectsModule.forRoot([
       QueryEffects,
       WindowsEffects,
+      WindowsMetaEffects,
       QueryCollectionEffects,
       PluginEventEffects,
       LocalEffects,

packages/altair-app/src/app/modules/altair/containers/app/app.component.html

@@ -141,6 +141,8 @@
               <li nz-menu-item (click)="showSettingsDialog()">{{ 'SETTINGS_TEXT' | translate }}</li>
               <li nz-menu-item (click)="externalLink($event, 'https://github.com/altair-graphql/altair')">{{ 'STAR_ON_GITHUB_TEXT' | translate }}</li>
               <li nz-menu-item (click)="externalLink($event, 'https://github.com/altair-graphql/altair/issues/new?template=Bug_report.md')">{{ 'REPORT_BUG_TEXT' | translate }}</li>
+              <li nz-menu-item (click)="exportBackupData()">{{ 'EXPORT_BACKUP_DATA_TEXT' | translate }}</li>
+              <li nz-menu-item (click)="importBackupData()">{{ 'IMPORT_BACKUP_DATA_TEXT' | translate }}</li>
             </ul>
           </nz-dropdown-menu>
         </ul>

packages/altair-app/src/app/modules/altair/containers/app/app.component.ts

@@ -50,6 +50,7 @@ import { RootState } from 'altair-graphql-core/build/types/state/state.interface
 import { AltairConfig } from 'altair-graphql-core/build/config';
 import { WindowState } from 'altair-graphql-core/build/types/state/window.interfaces';
 import { AltairPanel } from 'altair-graphql-core/build/plugin/panel';
+import { openFile } from '../../utils';
 
 @UntilDestroy({ checkProperties: true })
 @Component({
@@ -347,6 +348,14 @@ export class AppComponent  {
     this.store.dispatch(new windowActions.ReopenClosedWindowAction());
   }
 
+  exportBackupData() {
+    this.store.dispatch(new windowsMetaActions.ExportBackupDataAction());
+  }
+
+  importBackupData() {
+    this.store.dispatch(new windowsMetaActions.ImportBackupDataAction());
+  }
+
   importWindow() {
     this.store.dispatch(new windowsActions.ImportWindowAction());
   }

packages/altair-app/src/app/modules/altair/effects/windows-meta.effect.ts

@@ -0,0 +1,47 @@
+import { EMPTY, Observable } from 'rxjs';
+
+import { switchMap } from 'rxjs/operators';
+import { Injectable } from '@angular/core';
+import { Action } from '@ngrx/store';
+import { Actions, ofType, createEffect } from '@ngrx/effects';
+
+import {
+  ElectronAppService,
+} from '../services';
+
+import * as windowsMetaActions from '../store/windows-meta/windows-meta.action';
+
+import { openFile } from '../utils';
+
+@Injectable()
+export class WindowsMetaEffects {
+
+  exportBackupData$: Observable<Action> = createEffect(() => {
+    return this.actions$
+      .pipe(
+        ofType(windowsMetaActions.EXPORT_BACKUP_DATA),
+        switchMap(() => {
+          this.electronAppService.exportBackupData();
+          return EMPTY;
+        })
+      )
+  }, { dispatch: false });
+
+  importBackupData$: Observable<Action> = createEffect(() => {
+    return this.actions$
+      .pipe(
+        ofType(windowsMetaActions.IMPORT_BACKUP_DATA),
+        switchMap(() => {
+          openFile({ accept: '.agbkp' }).then((fileContent: string) => {
+            this.electronAppService.importBackupData(fileContent);
+          });
+          return EMPTY;
+        })
+      )
+  }, { dispatch: false });
+
+  constructor(
+    private actions$: Actions,
+    private electronAppService: ElectronAppService,
+  ) {}
+}

packages/altair-app/src/app/modules/altair/effects/windows.effect.ts

@@ -6,9 +6,6 @@ import { Injectable } from '@angular/core';
 import { Store, Action } from '@ngrx/store';
 import { createEffect, Actions, ofType } from '@ngrx/effects';
 
-import * as fromRoot from '../store';
-import * as fromWindows from '../store/windows/windows.reducer';
-
 import * as windowActions from '../store/windows/windows.action';
 import * as windowsMetaActions from '../store/windows-meta/windows-meta.action';
 import * as localActions from '../store/local/local.action';

packages/altair-app/src/app/modules/altair/modules/icons/icons.module.ts

@@ -31,6 +31,7 @@ import {
   FolderPlus,
   Github,
   Grid,
+  HardDrive,
   Heart,
   Home,
   Info,
@@ -85,6 +86,7 @@ const icons = {
   FolderPlus,
   Github,
   Grid,
+  HardDrive,
   Heart,
   Home,
   Info,

packages/altair-app/src/app/modules/altair/store/windows-meta/windows-meta.action.ts

@@ -12,6 +12,9 @@ export const SHOW_SETTINGS_DIALOG = 'SHOW_SETTINGS_DIALOG';
 export const SHOW_ENVIRONMENT_MANAGER = 'SHOW_ENVIRONMENT_MANAGER';
 export const SHOW_PLUGIN_MANAGER = 'SHOW_PLUGIN_MANAGER';
 
+export const EXPORT_BACKUP_DATA = 'EXPORT_BACKUP_DATA';
+export const IMPORT_BACKUP_DATA = 'IMPORT_BACKUP_DATA';
+
 export class SetActiveWindowIdAction implements NGRXAction {
   readonly type = SET_ACTIVE_WINDOW_ID;
 
@@ -72,6 +75,18 @@ export class ShowPluginManagerAction implements NGRXAction {
   constructor(public payload?: { value: boolean }) { }
 }
 
+export class ExportBackupDataAction implements NGRXAction {
+  readonly type = EXPORT_BACKUP_DATA;
+
+  constructor(public payload?: any) {}
+}
+
+export class ImportBackupDataAction implements NGRXAction {
+  readonly type = IMPORT_BACKUP_DATA;
+
+  constructor(public payload?: any) {}
+}
+
 export type Action =
   | SetActiveWindowIdAction
   | SetNextWindowActiveAction
@@ -83,4 +98,6 @@ export type Action =
   | ShowSettingsDialogAction
   | ShowEnvironmentManagerAction
   | ShowPluginManagerAction
+  | ExportBackupDataAction
+  | ImportBackupDataAction
   ;

packages/altair-app/src/app/modules/altair/store/windows/windows.action.ts

@@ -1,7 +1,5 @@
 import { Action as NGRXAction } from '@ngrx/store';
 
-import * as fromWindows from './windows.reducer';
-
 export const ADD_WINDOW = 'ADD_WINDOW';
 export const SET_WINDOWS = 'SET_WINDOWS';
 export const REMOVE_WINDOW = 'REMOVE_WINDOW';

packages/altair-app/src/assets/i18n/default.json

@@ -110,6 +110,9 @@
   "IMPORT_CURL_TITLE_SUBTEXT": "Paste your cURL command below",
   "IMPORT_BUTTON": "Import",
 
+  "EXPORT_BACKUP_DATA_TEXT": "Export backup data...",
+  "IMPORT_BACKUP_DATA_TEXT": "Import backup data...",
+
   "COLLECTIONS_TEXT": "Collections",
   "COLLECTIONS_EMPTY_TEXT": "Your collections would appear here.",
   "SAVE_TO_COLLECTION_BUTTON": "Add to collection",

packages/altair-electron/src/app/menu.js

@@ -118,11 +118,11 @@ class MenuManager {
         label: 'Data',
         submenu: [
           {
-            label: 'Export data...',
+            label: 'Export backup data...',
             click: () => this.actionManager.exportAppData(),
           },
           {
-            label: 'Restore data...',
+            label: 'Import backup data...',
             click: () => this.actionManager.importAppData(),
           },
         ]