Merge pull request #253 from harunurhan/fix-252

add JSONSchema type

Author: harunurhan

src/abstract-list-field/abstract-list-field.component.ts

@@ -25,7 +25,7 @@ import { List } from 'immutable';
 import { AbstractFieldComponent } from '../abstract-field';
 
 import { JsonStoreService, AppGlobalsService, PathUtilService } from '../shared/services';
-import { PathCache } from '../shared/interfaces';
+import { PathCache, JSONSchema } from '../shared/interfaces';
 
 /**
  * Abstract component to share code of common operations of all array fields
@@ -36,7 +36,7 @@ import { PathCache } from '../shared/interfaces';
 export abstract class AbstractListFieldComponent extends AbstractFieldComponent {
 
   values: List<any>;
-  schema: Object;
+  schema: JSONSchema;
   path: Array<any>;
   pathCache: PathCache = {};
 

src/add-field-dropdown/add-field-dropdown.component.html

@@ -5,7 +5,7 @@
       <input [(ngModel)]="expression" placeholder="filter" (click)="$event.stopPropagation()">
     </li>
     <li class="divider dropdown-divider"></li>
-    <li *ngFor="let key of schema | differentKeys:fields | filterByExpression:expression">
+    <li *ngFor="let key of schema.properties | differentKeys:fields | filterByExpression:expression">
       <a class="dropdown-item" href="javascript:void(0)" (click)="onFieldSelect(key)">{{key}}</a>
     </li>
   </ul>

src/add-field-dropdown/add-field-dropdown.component.spec.ts

@@ -29,21 +29,24 @@ import { AddFieldDropdownComponent } from './add-field-dropdown.component';
 import { Ng2BootstrapModule } from 'ng2-bootstrap';
 
 import { DifferentKeysPipe, FilterByExpressionPipe } from '../shared/pipes';
-
 import { DomUtilService, EmptyValueService, PathUtilService, TabsUtilService } from '../shared/services';
+import { JSONSchema } from '../shared/interfaces';
 
-const schemaProperties = {
-  propA: {},
-  propB: {},
-  propNotInValueA: {},
-  propNotInValueB: {}
+const testSchema: JSONSchema = {
+  type: 'object',
+  properties: {
+    propA: { type: 'string' },
+    propB: { type: 'string' },
+    propNotInValueA: { type: 'string' },
+    propNotInValueB: { type: 'string' }
+  }
 };
 const fields = Set(['propA', 'propB']);
 const mockDifferentKeys = Set(['propNotInValueB', 'propNotInValueA']);
 const emptyValue = 'empty-value';
 
 class MockEmptyValueService extends EmptyValueService {
-  generateEmptyValue(schema: Object): any {
+  generateEmptyValue(schema: JSONSchema): any {
     return emptyValue;
   }
 }
@@ -78,7 +81,7 @@ describe('AddFieldToObjectDropdownComponent', () => {
     fixture = TestBed.createComponent(AddFieldDropdownComponent);
     component = fixture.componentInstance;
     component.fields = fields;
-    component.schema = schemaProperties;
+    component.schema = testSchema;
     fixture.detectChanges();
 
     nativeEl = fixture.nativeElement;

src/add-field-dropdown/add-field-dropdown.component.ts

@@ -25,6 +25,7 @@ import { Component, Input, Output, EventEmitter, ElementRef } from '@angular/cor
 import { Set } from 'immutable';
 
 import { DomUtilService, EmptyValueService, PathUtilService } from '../shared/services';
+import { JSONSchema } from '../shared/interfaces';
 
 @Component({
   selector: 'add-field-dropdown',
@@ -35,8 +36,7 @@ import { DomUtilService, EmptyValueService, PathUtilService } from '../shared/se
 })
 export class AddFieldDropdownComponent {
 
-  // 'propeties' of an object schema
-  @Input() schema: Object;
+  @Input() schema: JSONSchema;
   @Input() fields: Set<string>;
   @Input() pathString: string;
 
@@ -50,7 +50,7 @@ export class AddFieldDropdownComponent {
     public pathUtilService: PathUtilService) { }
 
   get disabled(): boolean {
-    return Object.keys(this.schema).length === this.fields.size;
+    return Object.keys(this.schema.properties).length === this.fields.size;
   }
 
   onDropdownShown() {

src/add-new-element-button/add-new-element-button.component.ts

@@ -4,6 +4,7 @@ import { List } from 'immutable';
 
 
 import { DomUtilService, EmptyValueService, JsonStoreService, PathUtilService } from '../shared/services';
+import { JSONSchema } from '../shared/interfaces';
 
 @Component({
   selector: 'add-new-element-button',
@@ -16,15 +17,15 @@ import { DomUtilService, EmptyValueService, JsonStoreService, PathUtilService }
 export class AddNewElementButtonComponent {
 
   @Input() path: Array<any>;
-  @Input() schema: Object;
+  @Input() schema: JSONSchema;
 
   constructor(public domUtilService: DomUtilService,
     public emptyValueService: EmptyValueService,
     public jsonStoreService: JsonStoreService,
     public pathUtilService: PathUtilService) { }
 
   addNewElement() {
-    let itemSchema = this.schema['items'];
+    let itemSchema = this.schema.items;
     let emptyValue = this.emptyValueService.generateEmptyValue(itemSchema);
     let values: List<any> = this.jsonStoreService.getIn(this.path) || List();
     this.jsonStoreService.setIn(this.path, values.push(emptyValue));

src/any-type-field/any-type-field.component.ts

@@ -27,6 +27,7 @@ import {
 } from '@angular/core';
 
 import { AppGlobalsService, ComponentTypeService } from '../shared/services';
+import { JSONSchema } from '../shared/interfaces';
 
 /**
  * AnyFieldComponent
@@ -48,7 +49,7 @@ import { AppGlobalsService, ComponentTypeService } from '../shared/services';
 })
 export class AnyTypeFieldComponent {
 
-  @Input() schema: Object;
+  @Input() schema: JSONSchema;
   @Input() path: Array<any>;
   @Input() value: any;
 
@@ -60,6 +61,6 @@ export class AnyTypeFieldComponent {
   }
 
   get isDisabled(): boolean {
-    return this.schema && this.schema['disabled'] && !this.appGlobalsService.adminMode;
+    return this.schema && this.schema.disabled && !this.appGlobalsService.adminMode;
   }
 }

src/complex-list-field/complex-list-field.component.ts

@@ -35,7 +35,7 @@ import { AbstractListFieldComponent } from '../abstract-list-field';
 
 import { AppGlobalsService, JsonStoreService, DomUtilService, PathUtilService } from '../shared/services';
 
-import { LongListNavigatorConfig } from '../shared/interfaces';
+import { LongListNavigatorConfig, JSONSchema } from '../shared/interfaces';
 
 @Component({
   selector: 'complex-list-field',
@@ -48,7 +48,7 @@ import { LongListNavigatorConfig } from '../shared/interfaces';
 export class ComplexListFieldComponent extends AbstractListFieldComponent implements OnChanges, OnInit {
 
   @Input() values: List<Map<string, any>>;
-  @Input() schema: Object;
+  @Input() schema: JSONSchema;
   @Input() path: Array<any>;
 
   paginatedIndices: Array<number>;
@@ -68,7 +68,7 @@ export class ComplexListFieldComponent extends AbstractListFieldComponent implem
   }
 
   ngOnInit() {
-    this.navigator = this.schema['longListNavigatorConfig'];
+    this.navigator = this.schema.longListNavigatorConfig;
     if (this.navigator) {
       this.paginatedIndices = this.getIndicesForPage(this.currentPage);
     } else {

src/find-replace/find-replace.component.ts

@@ -26,6 +26,7 @@ import { DomSanitizer } from '@angular/platform-browser';
 import { List, Map } from 'immutable';
 
 import { FindReplaceAllService, JsonStoreService, ModalService } from '../shared/services';
+import { JSONSchema } from '../shared/interfaces';
 
 @Component({
   selector: 'find-replace',
@@ -38,7 +39,7 @@ import { FindReplaceAllService, JsonStoreService, ModalService } from '../shared
 export class FindReplaceComponent {
 
   @Input() path: Array<any>;
-  @Input() schema: Object;
+  @Input() schema: JSONSchema;
 
   private replaced: List<any> | Map<string, any>;
 

src/json-editor.component.html

@@ -1,7 +1,7 @@
 <div class="row editor-container">
   <div class="col-md-2 menu-container">
     <tree-menu [record]="_record" [schema]="schema"></tree-menu>
-    <add-field-dropdown [fields]="keys" [pathString]="''" (onFieldAdd)="onFieldAdd($event)" [schema]="schema.properties">Add field</add-field-dropdown>
+    <add-field-dropdown [fields]="keys" [pathString]="''" (onFieldAdd)="onFieldAdd($event)" [schema]="schema">Add field</add-field-dropdown>
     <div *ngIf="config.enableAdminModeSwitch" class="admin-mode" tooltip="Allows editing all fields (use with care)">
       <input id="admin-mode-checkbox" type="checkbox" [(ngModel)]="appGlobalsService.adminMode" />
       <label class="admin-mode" for="admin-mode-checkbox">Enable Admin Mode</label>

src/json-editor.component.ts

@@ -66,7 +66,7 @@ export class JsonEditorComponent extends AbstractTrackerComponent implements OnI
 
   @Input() config: JsonEditorConfig;
   @Input() record: Object;
-  @Input() schema: Object;
+  @Input() schema: any;
   @Input() errorMap: SchemaValidationErrors = {};
   @Input() templates: { [templateName: string]: TemplateRef<any> } = {};