Add session token to session storage.

package-lock.json

@@ -1784,9 +1784,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "12.19.3",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.19.3.tgz",
-      "integrity": "sha512-8Jduo8wvvwDzEVJCOvS/G6sgilOLvvhn1eMmK3TW8/T217O7u1jdrK6ImKLv80tVryaPSVeKu6sjDEiFjd4/eg==",
+      "version": "12.19.14",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.19.14.tgz",
+      "integrity": "sha512-2U9uLN46+7dv9PiS8VQJcHhuoOjiDPZOLAt0WuA1EanEknIMae+2QbMhayF7cgGqjvRVIfNpt+6jLPczJZFiRw==",
       "dev": true
     },
     "@types/q": {

package.json

@@ -31,7 +31,7 @@
     "@angular/compiler-cli": "~10.2.0",
     "@types/jasmine": "~3.5.0",
     "@types/jasminewd2": "~2.0.3",
-    "@types/node": "^12.11.1",
+    "@types/node": "^12.19.14",
     "codelyzer": "^6.0.0",
     "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",

src/app/_helpers/unsafe-key-store.ts

@@ -1,4 +1,5 @@
-import * as openpgp from '../../assets/js/openpgp.min.js';
+// import * as openpgp from '../../assets/js/openpgp.min.js';
+const openpgp = require('../../assets/js/openpgp.min.js');
 
 export function UnsafeKeyStore(): void {
   this.key = undefined;
@@ -13,7 +14,7 @@ UnsafeKeyStore.prototype.fingerprint = function(): any {
   return this.key.keyPacket.fingerprint;
 };
 
-UnsafeKeyStore.prototype.keyid = function(): any {
+UnsafeKeyStore.prototype.keyId = function(): any {
   return this.key.getKeyId();
 };
 

src/app/_services/auth.service.ts

@@ -4,16 +4,24 @@ import { hobaParseChallengeHeader } from '../../assets/js/hoba.js';
 import { signChallenge } from '../../assets/js/hoba-pgp.js';
 
 const origin = 'http://localhost:4444';
+const pgpKeyStore = new UnsafeKeyStore();
 
 @Injectable({
   providedIn: 'root'
 })
 export class AuthService {
-  pgpKeyStore = new UnsafeKeyStore();
-  sessionToken = undefined;
+  sessionToken: any;
   sessionLoginCount = 0;
+  privateKey: any;
 
-  constructor() {}
+  constructor() {
+    if (sessionStorage.getItem(btoa('CICADA_SESSION_TOKEN'))) {
+      this.sessionToken = sessionStorage.getItem(btoa('CICADA_SESSION_TOKEN'));
+    }
+    if (localStorage.getItem(btoa('CICADA_PRIVATE_KEY'))) {
+      this.privateKey = localStorage.getItem(btoa('CICADA_PRIVATE_KEY'));
+    }
+  }
 
   setState(s): void {
     (document.getElementById('state') as HTMLInputElement).value = s;
@@ -51,6 +59,7 @@ export class AuthService {
         throw new Error('login rejected');
       }
       this.sessionToken = xhr.getResponseHeader('Token');
+      sessionStorage.setItem(btoa('CICADA_SESSION_TOKEN'), this.sessionToken);
       this.sessionLoginCount++;
       this.setState('click to perform login ' + this.sessionLoginCount + ' with token ' + this.sessionToken);
       console.log('received', xhr.responseText);
@@ -59,7 +68,7 @@ export class AuthService {
     xhr.send();
   }
 
-  getChallenge(callback): void {
+  getChallenge(): void {
     const xhr = new XMLHttpRequest();
     xhr.responseType = 'arraybuffer';
     xhr.open('GET', origin + window.location.search.substring(1));
@@ -67,7 +76,7 @@ export class AuthService {
       if (xhr.status === 401) {
         const authHeader = xhr.getResponseHeader('WWW-Authenticate');
         const o = hobaParseChallengeHeader(authHeader);
-        callback(o);
+        this.loginResponse(o).then();
       }
     };
     xhr.send();
@@ -84,7 +93,7 @@ export class AuthService {
       }
     } else {
       try {
-        const o = this.getChallenge(this.loginResponse);
+        const o = this.getChallenge();
         return true;
       } catch (e) {
         console.error('login challenge failed', e);
@@ -94,21 +103,22 @@ export class AuthService {
   }
 
 
-  async loginResponse(o): Promise<void> {
-    const r = await signChallenge(o.challenge, o.realm, origin, this.pgpKeyStore);
+  async loginResponse(o): Promise<any> {
+    const r = await signChallenge(o.challenge, o.realm, origin, pgpKeyStore);
     this.sendResponse(r);
   }
 
   loginView(): void {
     document.getElementById('one').style.display = 'none';
     document.getElementById('two').style.display = 'block';
-    this.setState('click to log in with PGP key ' + this.pgpKeyStore.keyId().toHex());
+    this.setState('click to log in with PGP key ' + pgpKeyStore.keyId().toHex());
   }
 
   async setKey(privateKeyArmored): Promise<boolean> {
     console.log('settings pk' + privateKeyArmored);
     try {
-      await this.pgpKeyStore.set(privateKeyArmored);
+      await pgpKeyStore.set(privateKeyArmored);
+      localStorage.setItem(btoa('CICADA_PRIVATE_KEY'), privateKeyArmored);
     } catch (e) {
       console.error('failed setting key', e);
       return false;
@@ -116,4 +126,9 @@ export class AuthService {
     this.loginView();
     return true;
   }
+
+  logout(): void {
+    sessionStorage.removeItem(btoa('CICADA_SESSION_TOKEN'));
+    window.location.reload(true);
+  }
 }

src/app/auth/add-key/add-key.component.html

@@ -31,7 +31,7 @@
 
           </form>
         </div>
-        <div  id="two" style="display: none" class="card-body p-4">
+        <div  id="two" style="display: none" class="card-body p-4 align-items-center">
 
           <div class="text-center w-75 m-auto">
             <h4 class="text-dark-50 text-center font-weight-bold">Enter Passphrase</h4>
@@ -48,11 +48,20 @@
               </div>
             </mat-form-field>
 
-            <button mat-raised-button matRipple color="primary" type="submit" [disabled]="loading">
-              <span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>
+            <div class="form-group mb-0 text-center">
+              <button mat-raised-button matRipple color="primary" type="submit">
+  <!--              <span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>-->
                 Login
               </button>
+            </div>
           </form>
+
+          <div class="row mt-3">
+            <div class="col-12 text-center">
+              <p class="text-muted">Change private key? <a (click)="switchWindows()" class="text-muted ml-1"><b>Enter private key</b></a></p>
+            </div> <!-- end col-->
+          </div>
+          <!-- end row -->
         </div>
       </div>
     </div>

src/app/auth/add-key/add-key.component.ts

@@ -43,6 +43,14 @@ export class AddKeyComponent implements OnInit, AfterViewInit {
     this.passphraseForm = this.formBuilder.group({
       passphrase: ['', Validators.required],
     });
+    if (this.authService.privateKey !== undefined ) {
+      this.authService.setKey(this.authService.privateKey).then(r => {
+        if (this.authService.sessionToken !== undefined) {
+          this.authService.setState(
+            'click to perform login ' + this.authService.sessionLoginCount + ' with token ' + this.authService.sessionToken);
+        }
+      });
+    }
   }
 
   get keyFormStub(): any { return this.keyForm.controls; }
@@ -55,11 +63,10 @@ export class AddKeyComponent implements OnInit, AfterViewInit {
 
     this.loading = true;
     this.authService.setKey(this.keyFormStub.key.value).then();
-    this.switchWindows();
   }
 
   login(): void {
-    if (this.passphraseForm.invalid) { return; }
+    // if (this.passphraseForm.invalid) { return; }
     this.authService.login();
   }
 

src/app/auth/auth-routing.module.ts

@@ -5,8 +5,8 @@ import { AuthComponent } from './auth.component';
 import {AddKeyComponent} from './add-key/add-key.component';
 
 const routes: Routes = [
-  { path: '', component: AuthComponent },
-  { path: 'key', component: AddKeyComponent },
+  { path: '', component: AddKeyComponent },
+  { path: '**', redirectTo: '', pathMatch: 'full'},
 ];
 
 @NgModule({

tsconfig.app.json

@@ -3,7 +3,9 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/app",
-    "types": []
+    "types": [
+      "node",
+    ]
   },
   "files": [
     "src/main.ts",