fix: slash and password copy

package.json

@@ -33,11 +33,10 @@
  "@angular/service-worker": "^8.0.0",
  "@auth0/angular-jwt": "^2.0.0",
  "@datorama/akita": "^3.15.1",
- "@ng-expandable-input/cdk": "^1.0.0",
- "@ng-expandable-input/material": "^1.0.0",
+ "@ng-expandable-input/cdk": "^1.2.1",
+ "@ng-expandable-input/material": "^1.2.1",
  "core-js": "^3.1.3",
  "immer": "^3.1.3",
- "ng2-validation": "^4.2.0",
  "ngx-clipboard": "^12.1.0",
  "ngx-messages": "^0.3.0",
  "rxjs": "^6.0.0",

src/app/content/components/category-list/category-list.component.scss

@@ -4,7 +4,7 @@
  }
 
  mat-expandable-input .icons {
- margin: 0px 10px 6px;
+ margin: 0 10px 0;
  }
 }
 

src/app/content/components/category-list/category-list.component.ts

@@ -45,7 +45,7 @@ export class CategoryListComponent implements OnInit, AfterViewInit, OnDestroy {
  first()
  );
 
- combineLatest(definedCategories$, this.searchFor$).pipe(
+ combineLatest([definedCategories$, this.searchFor$]).pipe(
  auditTime(0)
  )
  .subscribe(([_c, s]) => {

src/app/content/components/item-form/item-form.component.ts

@@ -1,8 +1,8 @@
-import { Component, OnInit, Input, HostListener } from '@angular/core';
-import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';
+import { Component, HostListener, Input, OnInit } from '@angular/core';
+import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
 import { MatDialogRef } from '@angular/material/dialog';
-import { CustomValidators } from 'ng2-validation';
 import { IItem, IItemFormResult } from '@app/content/models';
+import { urlValidator } from '@app/content/services/misc';
 
 
 @Component({
@@ -28,7 +28,7 @@ export class ItemFormComponent implements OnInit {
  this.saveItemForm = this._fb.group({
  id: [this.item.id],
  name: [this.item.name, Validators.required],
- url: [this.item.url, CustomValidators.url],
+ url: [this.item.url, urlValidator],
  account: [this.item.account],
  username: [this.item.username],
  password: [this.item.password],
@@ -54,7 +54,7 @@ export class ItemFormComponent implements OnInit {
 
  @HostListener('document:keydown', ['$event'])
  closeOnEsc(event: KeyboardEvent) {
- if (event.keyCode === 27) {
+ if (event.key === 'Escape') {
  this.dialogRef.close(null);
  }
  }

src/app/content/components/item/item.component.html

@@ -1,5 +1,14 @@
 <td data-th="Name:" class="cell">
- <a *ngIf="item.url" [href]="item.url" target="_blank" [matTooltip]="item.name" [innerHTML]="item.name | highlight: searchFor"></a>
+ <a 
+ *ngIf="item.url"
+ [href]="item.url"
+ target="_blank"
+ ngxClipboard
+ [cbContent]="item.password"
+ [matTooltip]="item.name"
+ [innerHTML]="item.name | highlight: searchFor"
+ >
+ </a>
  <span *ngIf="!item.url" [innerHTML]="item.name | highlight: searchFor"></span>
 </td>
 

src/app/content/services/backend.mock.service.ts

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { ICategory, IItem, IItemFormResult } from '@app/content/models';
 import { IBackendService } from '@app/content/services';
 import { ID } from '@datorama/akita';
-import { asyncScheduler, BehaviorSubject, Observable, of } from 'rxjs';
+import { asyncScheduler, BehaviorSubject, Observable, scheduled } from 'rxjs';
 
 const initialItems: IItem[] = [
  // tslint:disable:max-line-length
@@ -29,23 +29,23 @@ export class BackendMockService implements IBackendService {
  secret: string | undefined;
 
  fetchAll() {
- return of({
+ return scheduled([{
  categories: this._categories.getValue(),
  items: this._items.getValue(),
  result: 'success'
- }, asyncScheduler);
+ }], asyncScheduler);
  }
 
  getCategories() {
- return of(this._categories.getValue(), asyncScheduler);
+ return scheduled([this._categories.getValue()], asyncScheduler);
  }
 
  addCategory(name: string): Observable<ICategory> {
  const categories = this._categories.getValue();
  let maxId = Math.max(...categories.map(x => (<number>x.id)));
  const newCategory = { id: ++maxId, name };
  this._categories.next([...categories, newCategory]);
- return of(newCategory, asyncScheduler);
+ return scheduled([newCategory], asyncScheduler);
  }
 
  updateCategory(category: ICategory) {
@@ -55,7 +55,7 @@ export class BackendMockService implements IBackendService {
  : x;
  });
  this._categories.next(categories);
- return of(true, asyncScheduler);
+ return scheduled([true], asyncScheduler);
  }
 
  removeCategory(opts: { id: number, cascade: boolean }) {
@@ -69,19 +69,19 @@ export class BackendMockService implements IBackendService {
  this._categories.next(newCategories);
  this._items.next(newItems);
 
- return of(true, asyncScheduler);
+ return scheduled([true], asyncScheduler);
  }
 
  getItems() {
- return of(this._items, asyncScheduler);
+ return scheduled([this._items], asyncScheduler);
  }
 
  addItem(info: IItemFormResult) {
  const items = this._items.getValue();
  let maxId = Math.max(...items.map(x => <number>x.id));
  const item = { ...info.item, id: ++maxId as ID };
  this._items.next([...items, item]);
- return of(item, asyncScheduler);
+ return scheduled([item], asyncScheduler);
  }
 
  updateItem(info: IItemFormResult) {
@@ -94,13 +94,13 @@ export class BackendMockService implements IBackendService {
  this._items.next(items);
  const item = newItems.find(x => x.id === info.item.id);
 
- return of(item, asyncScheduler);
+ return scheduled([item], asyncScheduler);
  }
 
  removeItem(id: number) {
  const items = this._items.getValue().filter(x => x.id === id);
  this._items.next(items);
- return of(true, asyncScheduler);
+ return scheduled([true], asyncScheduler);
  }
 
  secretPassphraseChange(secret: string | undefined) {

src/app/content/services/misc.ts

@@ -0,0 +1,12 @@
+import { AbstractControl, ValidatorFn, Validators } from '@angular/forms';
+
+export const urlValidator: ValidatorFn = (control: AbstractControl) => {
+ if (isPresent(Validators.required(control))) { return null; }
+
+ const v: string = control.value;
+ return /^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})).?)(?::\d{2,5})?(?:[/?#]\S*)?$/i.test(v) ? null : { 'url': true };
+};
+
+export function isPresent(obj: any): boolean {
+ return obj !== undefined && obj !== null;
+}

src/app/content/state/categories/categories.query.ts

@@ -18,19 +18,19 @@ export class CategoriesQuery extends QueryEntity<CategoriesState, ICategory> {
  }
 
  selectCategoryItems() {
- return combineLatest(
+ return combineLatest([
  this.selectAll(),
- this.itemsQuery.selectAll(),
- ).pipe(
+ this.itemsQuery.selectAll()
+ ]).pipe(
  map(([categories, items]) => categories.map(associateItemsWithCategory(items)))
  );
  }
 
  selectVisibleCategoryItems() {
- return combineLatest(
+ return combineLatest([
  this.selectCategoryItems(),
  this.select(s => s.ui.searchFor)
- ).pipe(
+ ]).pipe(
  map(([categoryItems, searchFor]) => {
  if (!searchFor) {
  return categoryItems;

src/app/content/state/categories/categories.service.spec.ts

@@ -23,8 +23,8 @@ describe('Categories Store', () => {
  ]
  });
 
- service = TestBed.get(CategoriesService);
- query = TestBed.get(CategoriesQuery);
+ service = TestBed.get<CategoriesService>(CategoriesService);
+ query = TestBed.get<CategoriesQuery>(CategoriesQuery);
  });
 
  it('should add two categories', () => {

src/app/core/pwa.service.ts

@@ -28,9 +28,9 @@ export class PwaService {
  this.isAppInstalledSubj$.next(true);
  });
 
- this.showCustomButton$ = combineLatest(
+ this.showCustomButton$ = combineLatest([
  this.promptEvent$, this.isAppInstalledSubj$.asObservable()
- ).pipe(
+ ]).pipe(
  map(([promptEvent, isAppInstalled]) => !!promptEvent && !isAppInstalled)
  );
  }

yarn.lock

@@ -339,15 +339,15 @@
  schematics-utilities "^1.1.1"
  tslib "^1.9.0"
 
-"@ng-expandable-input/cdk@^1.0.0":
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/@ng-expandable-input/cdk/-/cdk-1.0.0.tgz#a98677d3c4849b2c684db69adb2ff3ad7cd17e82"
+"@ng-expandable-input/cdk@^1.2.1":
+ version "1.2.1"
+ resolved "https://registry.yarnpkg.com/@ng-expandable-input/cdk/-/cdk-1.2.1.tgz#f5b3cea5dd613717b28ee3dedb6e57fb3f692efc"
  dependencies:
  tslib "^1.9.0"
 
-"@ng-expandable-input/material@^1.0.0":
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/@ng-expandable-input/material/-/material-1.0.0.tgz#68ad01764831597f8c494a51d4cc0d7e38e187ee"
+"@ng-expandable-input/material@^1.2.1":
+ version "1.2.1"
+ resolved "https://registry.yarnpkg.com/@ng-expandable-input/material/-/material-1.2.1.tgz#b8c5c8a9937e9554df4d31b3688f713a96564f1b"
  dependencies:
  tslib "^1.9.0"
 
@@ -951,7 +951,7 @@ babel-messages@^6.23.0:
  dependencies:
  babel-runtime "^6.22.0"
 
-babel-runtime@^6.22.0, babel-runtime@^6.26.0, babel-runtime@^6.6.1:
+babel-runtime@^6.22.0, babel-runtime@^6.26.0:
  version "6.26.0"
  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
  dependencies:
@@ -1065,7 +1065,7 @@ blocking-proxy@^1.0.0:
  dependencies:
  minimist "^1.2.0"
 
-bluebird@^3.3.0, bluebird@^3.4.6, bluebird@^3.5.1, bluebird@^3.5.3:
+bluebird@^3.3.0, bluebird@^3.5.1, bluebird@^3.5.3:
  version "3.5.5"
  resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.5.tgz#a8d0afd73251effbbd5fe384a77d73003c17a71f"
 
@@ -3708,15 +3708,6 @@ [email protected], less@^3.8.0:
  request "^2.83.0"
  source-map "~0.6.0"
 
-libphonenumber-js@^0.4.5:
- version "0.4.52"
- resolved "https://registry.yarnpkg.com/libphonenumber-js/-/libphonenumber-js-0.4.52.tgz#19aec62488f039faee243df14d68ae56d77780a6"
- dependencies:
- babel-runtime "^6.6.1"
- bluebird "^3.4.6"
- minimist "^1.2.0"
- xml2js "^0.4.17"
-
 [email protected]:
  version "2.1.1"
  resolved "https://registry.yarnpkg.com/license-webpack-plugin/-/license-webpack-plugin-2.1.1.tgz#f0ab760f7f301c76f5af52e480f320656b5721bb"
@@ -4152,12 +4143,6 @@ ng-packagr@^5.1.0:
  terser "^4.0.0"
  update-notifier "^3.0.0"
 
-ng2-validation@^4.2.0:
- version "4.2.0"
- resolved "https://registry.yarnpkg.com/ng2-validation/-/ng2-validation-4.2.0.tgz#f38d441d3fb7e862155166480045aaff9ad11dbb"
- dependencies:
- libphonenumber-js "^0.4.5"
-
 ngx-clipboard@^12.1.0:
  version "12.1.0"
  resolved "https://registry.yarnpkg.com/ngx-clipboard/-/ngx-clipboard-12.1.0.tgz#41d10c9d031d5d6e854f8c21c85460c96685b10b"