Skip to content
Permalink
Browse files
feat(project): proof of new project workflow concept (DEV-1001) (#765)
* feat(project): create ontology and lists

* refactor: delete console.logs

* fix(project): edit ontology and lists

* test(list): fix failing unit tests

* feat(beta): feature toggle on the project main page

* test(board): resolve failing test

* feat(instance): workflow when creating new res instance

* fix: resolve issues when closing dialog box

* feat(project): add settings component

* refactor: make eslint happy

* test: resolve failing tests

* fix(project): resolve issue in  old project settings

* fix(project): resolve issue in old project settings

* fix(project): resolve some permission issues

* fix(project): stop loading

* refactor(project): remove commented code
  • Loading branch information
kilchenmann committed Jun 16, 2022
1 parent 7c824bf commit fb29253f1ab9cbdd0f18cbca703d10db0ee3427f
Show file tree
Hide file tree
Showing 39 changed files with 526 additions and 152 deletions.
@@ -8,10 +8,13 @@ import { HelpComponent } from './main/help/help.component';
import { MainComponent } from './main/main.component';
import { StatusComponent } from './main/status/status.component';
import { OntologyClassInstanceComponent } from './project/beta/ontology-classes/ontology-class-instance/ontology-class-instance.component';
import { SettingsComponent } from './project/beta/settings/settings.component';
// project
import { BoardComponent } from './project/board/board.component';
import { CollaborationComponent } from './project/collaboration/collaboration.component';
import { ListInfoFormComponent } from './project/list/list-info-form/list-info-form.component';
import { ListComponent } from './project/list/list.component';
import { OntologyFormComponent } from './project/ontology/ontology-form/ontology-form.component';
import { OntologyComponent } from './project/ontology/ontology.component';
import { PermissionComponent } from './project/permission/permission.component';
import { ProjectComponent } from './project/project.component';
@@ -111,6 +114,11 @@ const routes: Routes = [
path: 'info', // old path setup to avoid 404 when typing beta in front of project
redirectTo: ''
},
{
path: 'add-ontology',
component: OntologyFormComponent,
canActivate: [AuthGuard]
},
{
path: 'ontology',
component: HintComponent,
@@ -135,6 +143,11 @@ const routes: Routes = [
path: 'ontology/:onto/:class/:instance',
component: OntologyClassInstanceComponent,
},
{
path: 'add-list',
component: ListInfoFormComponent,
canActivate: [AuthGuard]
},
{
path: 'list',
component: HintComponent,
@@ -147,19 +160,23 @@ const routes: Routes = [
},
{
path: 'settings',
component: StatusComponent,
data: { status: 501, comment: 'Here you will be able to configure the project: e.g. setup collaboration and permissions.' },
canActivate: [AuthGuard]
},
{
path: 'settings/collaboration',
component: CollaborationComponent,
canActivate: [AuthGuard]
},
{
path: 'settings/permissions',
component: PermissionComponent,
canActivate: [AuthGuard]
component: SettingsComponent,
canActivate: [AuthGuard],
children: [
{
path: '',
pathMatch: 'full',
redirectTo: 'collaboration'
},
{
path: 'collaboration',
component: CollaborationComponent
},
{
path: 'permissions',
component: PermissionComponent
},
]
},
{
path: '**',
@@ -164,6 +164,7 @@ import { TextComponent } from './workspace/resource/representation/text/text.com
import { OntologyClassesComponent } from './project/beta/ontology-classes/ontology-classes.component';
import { OntologyClassItemComponent } from './project/beta/ontology-classes/ontology-class-item/ontology-class-item.component';
import { OntologyClassInstanceComponent } from './project/beta/ontology-classes/ontology-class-instance/ontology-class-instance.component';
import { SettingsComponent } from './project/beta/settings/settings.component';

// translate: AoT requires an exported function for factories
export function httpLoaderFactory(httpClient: HttpClient) {
@@ -314,7 +315,8 @@ export function httpLoaderFactory(httpClient: HttpClient) {
TextComponent,
OntologyClassesComponent,
OntologyClassItemComponent,
OntologyClassInstanceComponent
OntologyClassInstanceComponent,
SettingsComponent
],
imports: [
AngularSplitModule.forRoot(),
@@ -1,5 +1,5 @@
<div class="hint" [innerHtml]="content"></div>

<a mat-button [href]="documentation" target="_blank" color="primary" class="external-url">
<a *ngIf="documentation" mat-button [href]="documentation" target="_blank" color="primary" class="external-url">
Read more in the user guide<mat-icon class="suffix">launch</mat-icon>
</a>
@@ -32,12 +32,12 @@
<!-- TODO: create a mat dialog actions component with the following buttons: Cancel to reset and OK to confirm action -->
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Suspend
Yes, suspend
</button>
</mat-dialog-actions>
</div>
@@ -179,12 +179,12 @@
Do you want to delete this node?
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Delete
Yes, delete
</button>
</mat-dialog-actions>
</div>
@@ -208,12 +208,12 @@
Do you want to delete this list?
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Delete
Yes, delete
</button>
</mat-dialog-actions>
</div>
@@ -237,12 +237,12 @@
Do you want to delete this data model?
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Delete
Yes, delete
</button>
</mat-dialog-actions>
</div>
@@ -268,12 +268,12 @@
Do you want to delete this resource class?
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Delete
Yes, delete
</button>
</mat-dialog-actions>
</div>
@@ -308,12 +308,12 @@
Do you want to delete this property?
<mat-dialog-actions>
<button mat-button mat-dialog-close class="cancel-button center" [mat-dialog-close]="false">
Cancel
No, keep it
</button>
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'warn'" class="confirm-button center"
[mat-dialog-close]="true">
Delete
Yes, delete
</button>
</mat-dialog-actions>
</div>
@@ -347,7 +347,7 @@
<span class="fill-remaining-space"></span>
<button mat-button mat-raised-button [color]="'primary'" class="confirm-button center"
[mat-dialog-close]="{confirmed: true, comment: comment}" [disabled]="!comment">
Save
Update
</button>
</mat-dialog-actions>
</div>
@@ -27,11 +27,14 @@

<!-- add new resource instance if instance id is called "add" -->
<div class="single-instance-form" *ngIf="instanceId && instanceId === 'add'">
<h3>Create new {{classId}} instance</h3>
<h3>Create new resource of type: {{resClass?.label}}</h3>
<app-resource-instance-form
[selectedResourceClassIri]="classId"
[selectedProject]="projectId">
</app-resource-instance-form>
</div>

<!-- display single resource instance if instance id exists and is not called "add" -->
<div class="single-instance" *ngIf="instanceId && instanceId !== 'add'">
<app-resource [resourceIri]="resourceIri"></app-resource>
</div>
@@ -1,6 +1,8 @@
import { Component } from '@angular/core';
import { Component, OnChanges } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ReadOntology, ResourceClassDefinition } from '@dasch-swiss/dsp-js';
import { AppInitService } from 'src/app/app-init.service';
import { CacheService } from 'src/app/main/cache/cache.service';
import { OntologyService } from 'src/app/project/ontology/ontology.service';
import { FilteredResources, SearchParams } from 'src/app/workspace/results/list-view/list-view.component';
import { SplitSize } from 'src/app/workspace/results/results.component';
@@ -10,13 +12,21 @@ import { SplitSize } from 'src/app/workspace/results/results.component';
templateUrl: './ontology-class-instance.component.html',
styleUrls: ['./ontology-class-instance.component.scss']
})
export class OntologyClassInstanceComponent {
export class OntologyClassInstanceComponent implements OnChanges {

projectId: string;

ontoId: string;

// id (iri) of resource class
classId: string;

resClass: ResourceClassDefinition;

// uuid of resource instance
instanceId: string;
// id (iri) or resource instance
resourceIri: string;

searchParams: SearchParams;

@@ -30,6 +40,7 @@ export class OntologyClassInstanceComponent {

constructor(
private _ais: AppInitService,
private _cache: CacheService,
private _route: ActivatedRoute,
private _ontologyService: OntologyService
) {
@@ -46,16 +57,22 @@ export class OntologyClassInstanceComponent {
const className = params['class'];

// get the resource class id from route
this.classId = `${iriBase}/ontology/${projectCode}/${ontologyName}/v2#${className}`;
this.ontoId = `${iriBase}/ontology/${projectCode}/${ontologyName}/v2`;
this.classId = `${this.ontoId}#${className}`;

this.instanceId = params['instance'];
if (this.instanceId) {
// single instance
// single instance view

if (this.instanceId === 'add') {
// create new res class instance: display res instance form
this.ngOnChanges();
} else {
// get the single resource instance
this.resourceIri = `${this._ais.dspAppConfig.iriBase}/${projectCode}/${this.instanceId}`;
}
} else {
// display all resource instances of this resource class
this.searchParams = {
query: this._setGravsearch(this.classId),
mode: 'gravsearch'
@@ -64,6 +81,16 @@ export class OntologyClassInstanceComponent {
});
}

ngOnChanges() {
this._cache.get('currentProjectOntologies').subscribe(
(ontologies: ReadOntology[]) => {
// find ontology of current resource class to get the class label
const classes = ontologies[ontologies.findIndex(onto => onto.id === this.ontoId)].getAllClassDefinitions();
this.resClass = <ResourceClassDefinition>classes[classes.findIndex(res => res.id === this.classId)];
}
);
}

openSelectedResources(res: FilteredResources) {

this.selectedResources = res;
@@ -1,14 +1,15 @@
<span class="link" [routerLink]="link">
<h2 matLine class="label mat-subheading-1">{{resClass.label}}</h2>
<span matLine class="instances">
{{results | i18nPlural: itemPluralMapping['instance']}}
{{results | i18nPlural: itemPluralMapping['resource']}}
</span>
</span>

<span class="overlay-buttons hover-only">
<span class="overlay-buttons hover-only" *ngIf="projectMember">
<!-- with the following button, it should be possible to edit the resource class in a quick way; but maybe we don't need it
<button mat-icon-button class="conf" [routerLink]="link + '/conf'">
<mat-icon>tune</mat-icon>
</button>
</button> -->
<button mat-icon-button class="add" [routerLink]="link + '/add'">
<mat-icon>add</mat-icon>
</button>
@@ -14,6 +14,8 @@ export class OntologyClassItemComponent implements OnInit {

@Input() resClass: ClassDefinition;

@Input() projectMember: boolean;

gravsearch: string;

results: number;
@@ -22,9 +24,9 @@ export class OntologyClassItemComponent implements OnInit {

// i18n setup
itemPluralMapping = {
instance: {
'=1': '1 instance',
other: '# instances'
resource: {
'=1': '1 resource',
other: '# resources'
}
};

@@ -1,5 +1,5 @@
<mat-list-item *ngFor="let class of classesToDisplay">
<app-ontology-class-item [resClass]="class">
<app-ontology-class-item [resClass]="class" [projectMember]="projectMember">

</app-ontology-class-item>
</mat-list-item>
@@ -11,6 +11,8 @@ export class OntologyClassesComponent implements OnInit {

@Input() resClasses: ClassDefinition[];

@Input() projectMember: boolean;

classesToDisplay: ClassDefinition[] = [];

constructor(
@@ -0,0 +1,8 @@
<nav mat-tab-nav-bar mat-align-tabs="center" class="settings navigation" animationDuration="0ms">
<a mat-tab-link *ngFor="let link of navigation; let first = first" id="{{link.route}}" [routerLink]="link.route"
routerLinkActive="active-tab" #rla="routerLinkActive" [active]="rla.isActive">
<mat-icon class="tab-icon">{{link.icon}}</mat-icon>
{{link.label}}
</a>
</nav>
<router-outlet></router-outlet>
@@ -0,0 +1 @@

@@ -0,0 +1,29 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';

import { SettingsComponent } from './settings.component';

describe('SettingsComponent', () => {
let component: SettingsComponent;
let fixture: ComponentFixture<SettingsComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ SettingsComponent ],
imports: [
RouterTestingModule
]
})
.compileComponents();
});

beforeEach(() => {
fixture = TestBed.createComponent(SettingsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});

0 comments on commit fb29253

Please sign in to comment.