Noded/frontend
3
0
Fork 0
Code Issues 47 Pull Requests Releases Wiki Activity

Add offline caching for databases, database columns, and database entries
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Garrett Mills
2020-10-21 22:40:20 -05:00
parent 8de9db08a6
commit 02d8505b05
7 changed files with 635 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/editor/database/columns/columns.component.ts
View File

@@ -38,7 +38,8 @@ export class ColumnsComponent implements OnInit {
this.columnSets = this.columnSets.map(x => {
x.field = x.headerName;
return x;
})
});
this.modals.dismiss(this.columnSets);
} else {
this.modals.dismiss();
@@ -46,10 +47,9 @@ export class ColumnsComponent implements OnInit {
}
onDeleteClick(i) {
const newSets = this.columnSets.filter((x, index) => {
this.columnSets = this.columnSets.filter((x, index) => {
return index !== i;
});
this.columnSets = newSets;
}
onUpArrow(i) {

109
src/app/components/editor/database/database.component.ts
View File

@@ -1,5 +1,5 @@
import {Component, Input, OnInit, ViewChild} from '@angular/core';
import {ApiService} from '../../../service/api.service';
import {ApiService, ResourceNotAvailableOfflineError} from '../../../service/api.service';
import {AlertController, LoadingController, ModalController} from '@ionic/angular';
import {ColumnsComponent} from './columns/columns.component';
import {AgGridAngular} from 'ag-grid-angular';
@@ -29,6 +29,7 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit {
public dirty = false;
public lastClickRow = -1;
public dbName = '';
public notAvailableOffline = false;
protected dbId!: string;
public get readonly() {
@@ -181,102 +182,52 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit {
// Load the database record itself
if ( !this.node.Value.Value && this.editorService.canEdit() ) {
await new Promise((res, rej) => {
this.api.post(`/db/${this.page.UUID}/${this.node.UUID}/create`).subscribe({
next: result => {
this.dbRecord = result.data;
this.dbName = result.data.Name;
this.node.Value.Mode = 'database';
this.node.Value.Value = result.data.UUID;
this.node.value = result.data.UUID;
res();
},
error: rej,
});
});
this.dbRecord = await this.api.createDatabase(this.page.UUID, this.node.UUID);
this.dbName = this.dbRecord.Name;
this.node.Value.Mode = 'database';
this.node.Value.Value = this.dbRecord.UUID;
this.node.value = this.dbRecord.UUID;
} else {
await new Promise((res, rej) => {
this.api.get(`/db/${this.page.UUID}/${this.node.UUID}/get/${this.node.Value.Value}`).subscribe({
next: result => {
this.dbRecord = result.data;
this.dbName = result.data.Name;
res();
},
error: rej,
});
});
try {
this.dbRecord = await this.api.getDatabase(this.page.UUID, this.node.UUID, this.node.Value.Value);
this.dbName = this.dbRecord.Name;
this.notAvailableOffline = false;
} catch (e: unknown) {
if ( e instanceof ResourceNotAvailableOfflineError ) {
this.notAvailableOffline = true;
} else {
throw e;
}
}
}
// Load the columns
await new Promise((res, rej) => {
this.api.get(`/db/${this.page.UUID}/${this.node.UUID}/get/${this.node.Value.Value}/columns`).subscribe({
next: result => {
this.setColumns(result.data);
res();
},
error: rej,
});
});
const columns = await this.api.getDatabaseColumns(this.page.UUID, this.node.UUID, this.node.Value.Value);
this.setColumns(columns);
// Load the data
await new Promise((res, rej) => {
this.api.get(`/db/${this.page.UUID}/${this.node.UUID}/get/${this.node.Value.Value}/data`).subscribe({
next: result => {
this.rowData = result.data.map(x => x.RowData);
this.agGridElement.api.setRowData(this.rowData);
res();
},
error: rej,
});
});
const rows = await this.api.getDatabaseEntries(this.page.UUID, this.node.UUID, this.node.Value.Value);
this.rowData = rows.map(x => x.RowData);
this.agGridElement.api.setRowData(this.rowData);
this.pendingSetup = false;
this.dirty = false;
}
public performDelete(): void | Promise<void> {
return new Promise((res, rej) => {
this.api.post(`/db/${this.page.UUID}/${this.node.UUID}/drop/${this.node.Value.Value}`).subscribe({
next: result => {
res();
},
error: rej,
});
});
public async performDelete(): Promise<void> {
await this.api.deleteDatabase(this.page.UUID, this.node.UUID, this.node.Value.Value);
}
public async performSave(): Promise<void> {
// Save the columns first
await new Promise((res, rej) => {
this.api.post(`/db/${this.page.UUID}/${this.node.UUID}/set/${this.node.Value.Value}/columns`, {columns: this.columnDefs}).subscribe({
next: result => {
res();
},
error: rej,
});
});
await this.api.saveDatabaseColumns(this.page.UUID, this.node.UUID, this.node.Value.Value, this.columnDefs);
// Save the data
await new Promise((res, rej) => {
this.api.post(`/db/${this.page.UUID}/${this.node.UUID}/set/${this.node.Value.Value}/data`, this.rowData).subscribe({
next: result => {
this.rowData = result.data.map(x => x.RowData);
this.agGridElement.api.setRowData(this.rowData);
res();
},
error: rej,
});
});
const rows = await this.api.saveDatabaseEntries(this.page.UUID, this.node.UUID, this.node.Value.Value, this.rowData);
this.rowData = rows.map(x => x.RowData);
this.agGridElement.api.setRowData(this.rowData);
// Save the name
await new Promise((res, rej) => {
this.api.post(`/db/${this.page.UUID}/${this.node.UUID}/set/${this.node.Value.Value}/name`, { Name: this.dbName }).subscribe({
next: result => {
res();
},
error: rej,
});
});
await this.api.saveDatabaseName(this.page.UUID, this.node.UUID, this.node.Value.Value, this.dbName);
this.dirty = false;
}