added linking workspace

angular/labarchives/dist/inline.bundle.js.map

-{"version":3,"sources":["webpack/bootstrap dc7a5ffb2d3940551b4d"],"names":[],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAQ,oBAAoB;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAY,2BAA2B;AACvC;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA,kDAA0C,oBAAoB,WAAW","file":"inline.bundle.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t\"inline\": 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap dc7a5ffb2d3940551b4d"],"sourceRoot":"webpack:///"}
\ No newline at end of file
+{"version":3,"sources":["webpack/bootstrap 2cba05d120dd741157d1"],"names":[],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAQ,oBAAoB;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAY,2BAA2B;AACvC;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA,kDAA0C,oBAAoB,WAAW","file":"inline.bundle.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [], result;\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n \t\tif(executeModules) {\n \t\t\tfor(i=0; i < executeModules.length; i++) {\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = executeModules[i]);\n \t\t\t}\n \t\t}\n \t\treturn result;\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// objects to store loaded and loading chunks\n \tvar installedChunks = {\n \t\t\"inline\": 0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// on error function for async loading\n \t__webpack_require__.oe = function(err) { console.error(err); throw err; };\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 2cba05d120dd741157d1"],"sourceRoot":"webpack:///"}
\ No newline at end of file

angular/labarchives/src/app/components/helpers.ts

+export class WorkspaceUser {
+  username: string;
+  id: string;
+}
+export class Checks {
+  link: any = undefined;
+  rdmp: boolean = false;
+  linkCreated: boolean = false;
+  linkWithOther: boolean = false;
+  master: boolean = false;
+  comparing: boolean = false;
+
+  clear() {
+    this.linkCreated = false;
+    this.linkWithOther = false;
+  }
+}
+
+export class Creation {
+  id: string;
+  created: boolean = false;
+  name: string = '';
+  namespace: string;
+  blank: boolean = true;
+  template: any;
+  description: string = '';
+  group: any;
+  validateMessage: string;
+  location: string;
+
+  clear() {
+    this.location = '';
+    this.description = '';
+    this.name = '';
+    this.id = '';
+  }
+
+  nameHasSpaces() {
+    return /\s/g.test(this.name);
+  }
+}
+export class CreationAlert {
+  message: string = '';
+  className: string = 'danger';
+  status: string = '';
+
+  set({message, status, className}) {
+    this.message = message;
+    this.status = status;
+    this.className = className;
+  }
+
+  clear() {
+    this.message = '';
+    this.className = 'danger';
+    this.status = '';
+  }
+
+}
+
+export class CurrentWorkspace {
+  path_with_namespace: string = '';
+  web_url: string = '';
+  location: string;
+}

angular/labarchives/src/app/components/labarchives-link.component.ts

+import {Input, Output, Component, OnInit, Inject, Injector, EventEmitter} from '@angular/core';
+import {SimpleComponent} from '../shared/form/field-simple.component';
+import {FieldBase} from '../shared/form/field-base';
+import {FormGroup, FormControl, Validators} from '@angular/forms';
+import * as _ from "lodash-es";
+
+import {Checks} from './helpers';
+import {LabarchivesService} from '../labarchives.service';
+
+// STEST-22
+declare var jQuery: any;
+
+/**
+ * Contributor Model
+ *
+ * @author <a target='_' href='https://github.com/moisbo'>moisbo</a>
+ *
+ */
+export class LabarchivesLinkField extends FieldBase<any> {
+
+  closeLabel: string;
+  processing: boolean;
+  workspaceDetailsTitle: string;
+  workspaceDefinition: string;
+  currentWorkspace: any;
+  processingLabel: string;
+  processingMessage: string;
+  processingSuccess: string;
+  processingFail: string;
+  processingStatus: string;
+
+  checks: Checks;
+  rdmp: string;
+
+  @Input() LinkItem: EventEmitter<any> = new EventEmitter<any>();
+
+  labarchivesService: LabarchivesService;
+
+  constructor(options: any, injector: any) {
+    super(options, injector);
+    this.labarchivesService = this.getFromInjector(LabarchivesService);
+    this.closeLabel = 'Close';
+    this.processing = false;
+    this.workspaceDetailsTitle = 'Workspace Title';
+    this.workspaceDefinition = '';
+    this.currentWorkspace = {};
+    this.processingLabel = 'Processing...';
+    this.processingMessage = 'processing message';
+    this.checks = new Checks();
+    this.processingSuccess = 'Success';
+    this.processingFail = 'Failed';
+    this.processingStatus = '';
+  }
+
+  init() {
+    this.rdmp = this.fieldMap._rootComp.rdmp;
+  }
+
+  registerEvents() {
+    this.fieldMap['List'].field['link'].subscribe(this.linkItem.bind(this));
+  }
+
+  createFormModel(valueElem: any = undefined): any {
+    if (valueElem) {
+      this.value = valueElem;
+    }
+
+    this.formModel = new FormControl(this.value || []);
+
+    if (this.value) {
+      this.setValue(this.value);
+    }
+
+    return this.formModel;
+  }
+
+  setValue(value: any) {
+    this.formModel.patchValue(value, {emitEvent: false});
+    this.formModel.markAsTouched();
+  }
+
+  setEmptyValue() {
+    this.value = [];
+    return this.value;
+  }
+
+  async linkItem(item: any) {
+    try {
+      jQuery('#linkModal').modal('show');
+      this.processing = true;
+      this.processingStatus = 'linking';
+      const link = await this.labarchivesService.link(item, this.rdmp);
+      this.processingStatus = 'done';
+      this.checks.link = true;
+      this.processing = false;
+      if (link.status) {
+        this.checks.linkCreated = true;
+        this.checks.master = true;
+        this.processingFail = undefined;
+      } else {
+        this.checks.linkWithOther = true
+      }
+    } catch (e) {
+      this.processing = false;
+      this.checks.linkWithOther = true
+    }
+  }
+}
+
+/**
+ * Component that Links Workspaces to Workspace Records in Stash
+ */
+@Component({
+  selector: 'ws-labarchiveslink',
+  template: `
+    <div id="linkModal" class="modal fade" data-keyboard="false">
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h4 class="modal-title">Link Workspace</h4>
+          </div>
+          <div class="modal-body">
+            <h5>{{ field.workspaceDetailsTitle }}</h5>
+            <p *ngFor="let item of field.workspaceDefinition">{{ item.label }} :
+              {{ field.currentWorkspace[item.name]}}</p>
+            <h5>{{ field.processingLabel }}</h5>
+            <p>{{ field.processingMessage }}&nbsp;<span
+              *ngIf="field.checks.master; then isDone; else isSpinning"></span></p>
+            <p *ngIf="field.checks.comparing">{{ field.comparingLabel }}&nbsp;<span
+              *ngIf="field.checks.link; then isDone; else isSpinning"></span></p>
+            <p *ngIf="field.checks.link == false">{{ field.statusLabel }}&nbsp;<span
+              *ngIf="field.checks.rdmp; then isDone; else isSpinning"></span></p>
+            <p class="alert alert-success" *ngIf="field.checks.linkCreated">{{ field.processingSuccess }}</p>
+            <p class="alert alert-danger" *ngIf="field.checks.linkWithOther">{{ field.processingFail }}</p>
+            <p class="alert alert-danger" *ngIf="field.processingStatus === 'done' && field.processingFail">
+              {{ field.processingFail }}</p>
+            <ng-template #isDone>
+              <i class="fa fa-check-circle"></i>
+            </ng-template>
+            <ng-template #isSpinning>
+              <i class="fa fa-spinner fa-spin"></i>
+            </ng-template>
+          </div>
+          <div class="modal-footer">
+            <span *ngIf="field.processing; then waitForProcessing; else finishProcessing"></span>
+            <ng-template #finishProcessing>
+              <button type="button" class="btn btn-secondary" data-dismiss="modal">{{ field.closeLabel }}</button>
+            </ng-template>
+            <ng-template #waitForProcessing>
+              <button type="button" class="btn btn-secondary disabled" data-dismiss="modal">{{ field.closeLabel }}
+              </button>
+            </ng-template>
+          </div>
+        </div>
+      </div>
+    </div>
+  `
+})
+export class LabarchivesLinkComponent extends SimpleComponent {
+  field: LabarchivesLinkField;
+
+  ngOnInit() {
+    this.field.init();
+    this.field.registerEvents();
+  }
+}

angular/labarchives/src/app/components/labarchives-list.component.ts

@@ -16,36 +16,34 @@ export class LabarchivesListField extends FieldBase<any> {
   workspaces: any;
 
   @Input() user: any;
+  @Output() link: EventEmitter<any> = new EventEmitter<any>();
 
   constructor(options: any, injector: any) {
     super(options, injector);
     this.columns = [
-      {'show': false, 'property': 'id'},
       {'label': 'Name', 'property': 'name'},
-      {'label': 'Description', 'property': 'description'},
+      {'label': 'Default', 'property': 'isDefault'},
       {'label': 'Location', 'property': 'web_url', 'link': 'true'}
     ];
     this.rdmpLinkLabel = 'Plan';
     this.syncLabel = 'Sync';
-
   }
 
   registerEvents() {
     this.fieldMap['Login'].field['userLogin'].subscribe(this.listWorkspaces.bind(this));
+    //this.fieldMap['Link'].field['linkItem'].subscribe(this.listWorkspaces.bind(this));
   }
 
   listWorkspaces(labUser: any) {
-    const notebooks = labUser['notebooks'];
-    if (notebooks && notebooks['notebook']) {
-      const nbs = notebooks['notebook'];
-      console.log(nbs);
-      this.workspaces = nbs.map((nb) => {
-        const isDefault = nb['is-default'];
+    if (labUser && labUser.notebooks) {
+      this.workspaces = labUser.notebooks.map((nb) => {
+        const isDefault = nb['isDefault'] ? 'default' : '';
         return {
+          id: nb['id'],
           name: nb['name'],
-          description: isDefault._ !== 'false' ? 'default' : '',
+          description: isDefault,
           web_url: '',
-          rdmp: {info: '', id: nb['id']}
+          rdmp: {info: ''}
         }
       });
     } else {
@@ -54,9 +52,10 @@ export class LabarchivesListField extends FieldBase<any> {
   }
 
   linkWorkspace(item: any) {
-    alert('linking')
+    this.link.emit(item);
   }
 
+
 }
 
 
@@ -64,7 +63,7 @@ export class LabarchivesListField extends FieldBase<any> {
   selector: 'ws-labarchiveslist',
   template: `
     <div class="row">
-      <div class="col-lg-10">
+      <div *ngIf="field.workspaces" class="col-lg-10">
         <div class="">
           <table class="table">
             <thead>
@@ -79,23 +78,23 @@ export class LabarchivesListField extends FieldBase<any> {
             <tr *ngFor="let item of field.workspaces">
               <ng-container *ngFor="let column of field.columns">
                 <td *ngIf="column.show != false">
-                <span *ngIf="column.link; else noProcessing ">
-                  <a target="_blank" rel="noopener noreferrer"
-                     href="{{ item[column.property] }}">{{ item[column.property]}}</a>
-                </span>
+                  <span *ngIf="column.link; else noProcessing ">
+                    <a target="_blank" rel="noopener noreferrer"
+                       href="{{ item[column.property] }}">{{ item[column.property]}}</a>
+                  </span>
                   <ng-template #multivalue></ng-template>
                   <ng-template #noProcessing><span>{{ item[column.property] }}</span></ng-template>
                 </td>
               </ng-container>
               <td>
-            <span *ngIf="item.rdmp.info && item.rdmp.info.rdmp; else isNotLinked ">
-              <button disabled type="button" class="btn btn-success btn-block"
-                      *ngIf="item.rdmp.info.rdmp === field.rdmp"> Linked </button>
-              <button disabled type="button" class="btn btn-info btn-block" *ngIf="item.rdmp.info.rdmp != field.rdmp"> Linked to another RDMP</button>
-            </span>
+                  <span *ngIf="item.rdmp.info && item.rdmp.info.rdmp; else isNotLinked ">
+                    <button disabled type="button" class="btn btn-success btn-block"
+                            *ngIf="item.rdmp.info.rdmp === field.rdmp"> Linked </button>
+                    <button disabled type="button" class="btn btn-info btn-block"
+                            *ngIf="item.rdmp.info.rdmp != field.rdmp"> Linked to another RDMP</button>
+                  </span>
                 <ng-template #isNotLinked>
-                  <button type="button" class="btn btn-info btn-block" (click)="field.linkWorkspace(item)"> Link
-                  </button>
+                  <button type="button" class="btn btn-info btn-block" (click)="field.linkWorkspace(item)">Link</button>
                 </ng-template>
               </td>
             </tr>
@@ -104,17 +103,12 @@ export class LabarchivesListField extends FieldBase<any> {
           <div *ngIf="field.loading" class="">
             <img class="center-block" src="/images/loading.svg">
           </div>
-          <p *ngIf="field.failedObjects.length > 0">There were {{ field.failedObjects.length }} records that failed to
-            load</p>
-          <p *ngIf="field.accessDeniedObjects.length > 0">There were {{ field.accessDeniedObjects.length }} records that
-            you do not have access to</p>
-          <div class="">
-            <button type="button" class="btn btn-default" (click)="field.listWorkspaces()"><i
-              class="fa fa-refresh"></i>&nbsp;{{ field.syncLabel }}
-            </button>
-          </div>
           <div>
-            <p></p>
+            <p *ngIf="field.failedObjects.length > 0">There were {{ field.failedObjects.length }} records that failed to
+              load</p>
+            <p *ngIf="field.accessDeniedObjects.length > 0">There were {{ field.accessDeniedObjects.length }} records
+              that
+              you do not have access to</p>
           </div>
         </div>
       </div>

angular/labarchives/src/app/components/labarchives-login.component.ts

@@ -3,6 +3,8 @@ import {FormGroup, FormControl, Validators, NgForm} from '@angular/forms';
 import {SimpleComponent} from '../shared/form/field-simple.component';
 import {FieldBase} from '../shared/form/field-base';
 
+declare var jQuery: any;
+
 import {LabarchivesService} from "../labarchives.service";
 
 export class LabarchivesLoginField extends FieldBase<any> {
@@ -15,14 +17,17 @@ export class LabarchivesLoginField extends FieldBase<any> {
 
   submitted = false;
   errorMessage: string = undefined;
+  closeLabel: string;
 
   user: any;
+  loggedIn: boolean;
   labarchivesService: LabarchivesService;
 
   @Output() userLogin = new EventEmitter<any>();
 
   constructor(options: any, injector: any) {
     super(options, injector);
+    this.closeLabel = 'Close';
     this.labarchivesService = this.getFromInjector(LabarchivesService);
   }
 
@@ -34,9 +39,10 @@ export class LabarchivesLoginField extends FieldBase<any> {
       this.user = {username: form.username, password: form.password};
       const login = await this.labarchivesService.login(this.user.username, this.user.password);
       if (login.status) {
-        this.user.loggedIn = true;
+        this.loggedIn = true;
         this.userLogin.emit(login.labUser);
         this.submitted = true;
+        this.errorMessage = null;
       } else {
         this.errorMessage = login.message;
       }
@@ -56,13 +62,17 @@ export class LabarchivesLoginField extends FieldBase<any> {
     return '';
   }
 
+  loginViaInstitution() {
+    jQuery('#institutionModal').modal('show');
+  }
+
 }
 
 @Component({
   selector: 'ws-labarchiveslogin',
   template: `
     <div class="row">
-      <div class="col-md-5 col-md-offset-2">
+      <div *ngIf="!field.loggedIn" class="col-md-5 col-md-offset-2">
         <form #form="ngForm">
           <div class="form-group">
             <label>{{ field.usernameLabel }}</label>
@@ -75,15 +85,16 @@ export class LabarchivesLoginField extends FieldBase<any> {
                    attr.aria-label="{{ field.passwordLabel }}">
           </div>
           <div class="form-row">
-            <button (click)="field.login(form.value)" type="submit" [disabled]="!field.valid" class="btn btn-primary">
-              Login
-            </button>
-          </div>
-          <div>
-            <p>or</p>
-          </div>
-          <div class="form-group">
-            <button type="submit" [disabled]="!field.valid" class="btn btn-primary">Login trough UTS</button>
+            <p>
+              <button (click)="field.login(form.value)" type="submit" [disabled]="!field.valid" class="btn btn-primary">
+                Login via KEY
+              </button>
+              or
+              <button (click)="field.loginViaInstitution()" type="submit" [disabled]="!field.valid"
+                      class="btn btn-info">
+                Login trough UTS
+              </button>
+            </p>
           </div>
           <div class="alert alert-danger" *ngIf="field.errorMessage">{{ field.errorMessage }}</div>
           <div>
@@ -92,6 +103,21 @@ export class LabarchivesLoginField extends FieldBase<any> {
         </form>
       </div>
     </div>
+    <div id="institutionModal" class="modal fade">
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h4 class="modal-title">Login via UTS</h4>
+          </div>
+          <div class="modal-body">
+            <p>Login not available please use Key method</p>
+          </div>
+          <div class="modal-footer">
+            <button type="button" class="btn btn-secondary" data-dismiss="modal">{{ field.closeLabel }}</button>
+          </div>
+        </div>
+      </div>
+    </div>
   `
 })
 export class LabarchivesLoginComponent extends SimpleComponent {

angular/labarchives/src/app/labarchives-form.component.ts

@@ -10,6 +10,7 @@ import {TranslationService} from './shared/translation-service';
 
 import {LabarchivesLoginComponent, LabarchivesLoginField} from './components/labarchives-login.component';
 import {LabarchivesListComponent, LabarchivesListField} from './components/labarchives-list.component';
+import {LabarchivesLinkField, LabarchivesLinkComponent} from './components/labarchives-link.component';
 
 import * as jQuery from 'jquery';
 
@@ -133,7 +134,8 @@ export class LabarchivesFormComponent extends LoadableComponent {
   loadForm() {
     this.fcs.addComponentClasses({
       'LabarchivesLoginField': {'meta': LabarchivesLoginField, 'comp': LabarchivesLoginComponent},
-      'LabarchivesListField': {'meta': LabarchivesListField, 'comp': LabarchivesListComponent}
+      'LabarchivesListField': {'meta': LabarchivesListField, 'comp': LabarchivesListComponent},
+      'LabarchivesLinkField': {'meta': LabarchivesLinkField, 'comp': LabarchivesLinkComponent}
     });
 
     this.RecordsService.getForm(this.oid, this.recordType, this.editMode).then((obs: any) => {

angular/labarchives/src/app/labarchives.module.ts

@@ -8,13 +8,14 @@ import {LabarchivesService} from "./labarchives.service";
 import {LabarchivesFormComponent} from './labarchives-form.component';
 import {LabarchivesLoginComponent} from './components/labarchives-login.component';
 import {LabarchivesListComponent} from './components/labarchives-list.component';
+import {LabarchivesLinkComponent} from "./components/labarchives-link.component";
 
 @NgModule({
   imports: [
     BrowserModule, ReactiveFormsModule, FormsModule, SharedModule
   ],
   declarations: [
-    LabarchivesFormComponent, LabarchivesLoginComponent, LabarchivesListComponent
+    LabarchivesFormComponent, LabarchivesLoginComponent, LabarchivesListComponent, LabarchivesLinkComponent
   ],
   exports: [],
   providers: [
@@ -24,7 +25,7 @@ import {LabarchivesListComponent} from './components/labarchives-list.component'
     LabarchivesFormComponent
   ],
   entryComponents: [
-    LabarchivesFormComponent, LabarchivesListComponent, LabarchivesLoginComponent
+    LabarchivesFormComponent, LabarchivesListComponent, LabarchivesLoginComponent, LabarchivesLinkComponent
   ]
 })
 export class LabarchivesModule {

angular/labarchives/src/app/labarchives.service.ts

@@ -49,12 +49,12 @@ export class LabarchivesService extends BaseService {
   }
 
 
-  public async createRequest(request: any, rdmpId: string) {
-    const wsUrl = this.brandingAndPortalUrl + '/ws/labarchives/create';
+  public async link(workspace: any, rdmpId: string) {
+    const wsUrl = this.brandingAndPortalUrl + '/ws/labarchives/link';
     try {
       const result = await this.http.post(
         wsUrl,
-        {request: request, rdmp: rdmpId},
+        {rdmp: rdmpId, workspace: workspace},
         this.options
       ).toPromise();
       return Promise.resolve(this.extractData(result));
@@ -63,17 +63,4 @@ export class LabarchivesService extends BaseService {
     }
   }
 
-  public async getUserInfo() {
-    const wsUrl = this.brandingAndPortalUrl + '/user/info';
-    try {
-      const result = await this.http.get(
-        wsUrl,
-        this.options
-      ).toPromise();
-      return Promise.resolve((this.extractData(result)));
-    } catch (e) {
-      return Promise.reject(new Error(e));
-    }
-  }
-
 }

api/UserInfo.js

+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+class UserInfo {
+    constructor(id, orcid, fullName, notebooks) {
+        this.id = id;
+        this.orcid = orcid;
+        this.fullName = fullName;
+        this.notebooks = notebooks['notebook'].map(nb => {
+            const getDefault = nb['is-default'];
+            const isDefault = getDefault['_'] !== 'false';
+            return new Notebook(nb['id'], nb['name'], isDefault);
+        });
+    }
+}
+exports.UserInfo = UserInfo;
+class Notebook {
+    constructor(id, name, isDefault) {
+        this.id = id;
+        this.name = name;
+        this.isDefault = isDefault;
+    }
+}

api/controllers/LabarchivesController.js

@@ -4,6 +4,7 @@ const Rx_1 = require("rxjs/Rx");
 require("rxjs/add/operator/map");
 const controller = require("../core/CoreController");
 const Config_1 = require("../Config");
+const UserInfo_1 = require("../UserInfo");
 var Controllers;
 (function (Controllers) {
     class LabarchivesController extends controller.Controllers.Core.Controller {
@@ -11,6 +12,7 @@ var Controllers;
             super();
             this._exportedMethods = [
                 'login',