Skip to content

Commit

Permalink
Asset create dialog edit form (#788)
Browse files Browse the repository at this point in the history
  • Loading branch information
illfixit authored Aug 7, 2024
1 parent 78f2219 commit 11bf2fc
Show file tree
Hide file tree
Showing 56 changed files with 4,062 additions and 58 deletions.
2 changes: 1 addition & 1 deletion CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ the detailed section referring to by linking pull requests or issues.
- Assets Page search input field is now case insensitive
- Enchance EDC UI terminologies
- Performance improvement when fetching a single contract agreement
- Temporary reimplement the Edit Asset as a Dialog
- Temporary reimplement the Create Asset as a Dialog
- Markdown support for Reference files description, Conditions for use fields
- Fixed wrong date format displayed when creating a new data offer

Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,20 @@
import {ActiveFeatureSet} from 'src/app/core/config/active-feature-set';
import {DataAddressTypeSelectItem} from './data-address-type-select-item';
import {DataAddressTypeSelectMode} from './data-address-type-select-mode';

export const dataAddressTypeSelectItems = (
type: DataAddressTypeSelectMode,
activeFeatureSet: ActiveFeatureSet,
): DataAddressTypeSelectItem[] => {
const items: DataAddressTypeSelectItem[] = [];

if (type.startsWith('Datasource') && activeFeatureSet.hasMdsFields()) {
items.push({
id: 'On-Request',
label: '"On Request" Data Offer',
});
}

items.push(
{
id: 'Http',
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import {Component, HostBinding, Input, OnChanges} from '@angular/core';
import {FormControl} from '@angular/forms';
import {ActiveFeatureSet} from 'src/app/core/config/active-feature-set';
import {SimpleChangesTyped} from '../../../core/utils/angular-utils';
import {DataAddressType} from './data-address-type';
import {dataAddressTypeSelectItems} from './data-address-type-select-items';
Expand All @@ -23,10 +24,12 @@ export class DataAddressTypeSelectComponent implements OnChanges {
@Input()
mode: DataAddressTypeSelectMode = 'Datasource-Create';

items = dataAddressTypeSelectItems(this.mode);
constructor(private activeFeatureSet: ActiveFeatureSet) {}

items = dataAddressTypeSelectItems(this.mode, this.activeFeatureSet);
ngOnChanges(changes: SimpleChangesTyped<DataAddressTypeSelectComponent>) {
if (changes.mode) {
this.items = dataAddressTypeSelectItems(this.mode);
this.items = dataAddressTypeSelectItems(this.mode, this.activeFeatureSet);
}
}
}
Original file line number Diff line number Diff line change
@@ -1,30 +1,26 @@
import {Component, Input, OnChanges} from '@angular/core';
import {Component, Input} from '@angular/core';
import {FormControl} from '@angular/forms';
import {SimpleChangesTyped} from '../../../core/utils/angular-utils';
import {DataAddressType} from '../../data-address/data-address-type-select/data-address-type';
import {dataAddressTypeSelectItems} from '../../data-address/data-address-type-select/data-address-type-select-items';
import {DataAddressTypeSelectMode} from '../../data-address/data-address-type-select/data-address-type-select-mode';

@Component({
selector: 'edit-asset-form-data-address-type-select',
templateUrl: 'edit-asset-form-data-address-type-select.component.html',
})
export class EditAssetFormDataAddressTypeSelectComponent implements OnChanges {
export class EditAssetFormDataAddressTypeSelectComponent {
@Input()
label!: string;

@Input()
control!: FormControl<DataAddressType | null>;

@Input()
mode: DataAddressTypeSelectMode = 'Datasource-Create';

items = dataAddressTypeSelectItems(this.mode);
ngOnChanges(
changes: SimpleChangesTyped<EditAssetFormDataAddressTypeSelectComponent>,
) {
if (changes.mode) {
this.items = dataAddressTypeSelectItems(this.mode);
}
}
items = [
{
id: 'Http',
label: 'REST-API Endpoint',
},
{
id: 'Custom-Data-Address-Json',
label: `Custom Datasource-Create Config (JSON)`,
},
];
}
Original file line number Diff line number Diff line change
Expand Up @@ -30,14 +30,38 @@
</mat-radio-group>
</div>

<!-- Data Source Type -->
<ng-container
*ngIf="form.datasource.value.dataSourceAvailability === 'On-Request'">
<!-- Contact E-Mail for On Request Assets -->
<edit-asset-form-input
class="mt-2"
fieldId="create-asset-form-contact-email"
label="Contact E-Mail"
placeholder="contact@my-org.com"
[ctrl]="form.datasource.controls.contactEmail"
>This email address will be offered to potential consumers for
contacting you. This is done in place of having an actual data source
connected.</edit-asset-form-input
>

<!-- Contact E-Mail Subject for On Request Assets -->
<edit-asset-form-input
class="mt-5"
fieldId="create-asset-form-contact-subject"
label="Preferred E-Mail Subject"
placeholder="Data Offer 'xyz'"
[ctrl]="form.datasource.controls.contactPreferredEmailSubject"
>Will be added to the mailto-link and displayed to potential consumers
to use.</edit-asset-form-input
>
</ng-container>

<ng-container
*ngIf="
form.datasource.controls.dataSourceAvailability.value === 'Datasource'
">
<!-- Data Address Type -->
<div [ngClass]="{'mt-5': multipleDataSourceOptionsAvailable()}">
<div class="mt-5">
<edit-asset-form-data-address-type-select
label="Type"
mode="Datasource-Create"
Expand Down Expand Up @@ -369,34 +393,6 @@
</div>
</ng-container>
</ng-container>

<!-- On Request -->

<ng-container
*ngIf="form.datasource.value.dataSourceAvailability === 'On-Request'">
<!-- Contact E-Mail for On Request Assets -->
<edit-asset-form-input
class="mt-2"
fieldId="create-asset-form-contact-email"
label="Contact E-Mail"
placeholder="contact@my-org.com"
[ctrl]="form.datasource.controls.contactEmail"
>This email address will be offered to potential consumers for
contacting you. This is done in place of having an actual data source
connected.</edit-asset-form-input
>

<!-- Contact E-Mail Subject for On Request Assets -->
<edit-asset-form-input
class="mt-5"
fieldId="create-asset-form-contact-subject"
label="Preferred E-Mail Subject"
placeholder="Data Offer 'xyz'"
[ctrl]="form.datasource.controls.contactPreferredEmailSubject"
>Will be added to the mailto-link and displayed to potential consumers
to use.</edit-asset-form-input
>
</ng-container>
</edit-asset-form-group>

<edit-asset-form-group
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -125,11 +125,7 @@ export class EditAssetFormInitializer {
return {
...this.emptyHttpDatasource(),
dataSourceAvailability:
asset.dataSourceAvailability === 'LIVE'
? 'Unchanged'
: this.activeFeatureSet.hasMdsFields()
? 'On-Request'
: 'Datasource',
asset.dataSourceAvailability === 'LIVE' ? 'Unchanged' : 'On-Request',
contactEmail: asset.onRequestContactEmail ?? '',
contactPreferredEmailSubject: asset.onRequestContactEmailSubject ?? '',
};
Expand Down
106 changes: 106 additions & 0 deletions src/app/core/services/asset-data-source-mapper-legacy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
import {Injectable} from '@angular/core';
import {UiDataSource} from '@sovity.de/edc-client';
import {AssetDatasourceFormValue} from '../../routes/connector-ui/asset-page/asset-edit-dialog/form/model/asset-datasource-form-model';
import {HttpDatasourceHeaderFormValue} from '../../routes/connector-ui/asset-page/asset-edit-dialog/form/model/http-datasource-header-form-model';
import {getAuthFields} from '../utils/form-value-utils';
import {QueryParamsMapper} from './query-params-mapper';

@Injectable({providedIn: 'root'})
export class AssetDataSourceMapperLegacy {
constructor(private queryParamsMapper: QueryParamsMapper) {}

buildDataSourceOrNullLegacy(
formValue: AssetDatasourceFormValue,
): UiDataSource | null {
if (
!formValue?.dataAddressType ||
formValue.dataAddressType === 'Unchanged'
) {
return null;
}
return this.buildDataSourceLegacy(formValue);
}

buildDataSourceLegacy(formValue: AssetDatasourceFormValue): UiDataSource {
switch (formValue?.dataAddressType) {
case 'Custom-Data-Address-Json':
return this.buildCustomDataSourceLegacy(formValue);
case 'On-Request':
return this.buildOnRequestDataSourceLegacy(formValue);
case 'Http':
return this.buildHttpDataSourceLegacy(formValue);
default:
throw new Error(
`Invalid Data Address Type ${formValue?.dataAddressType}`,
);
}
}

private buildCustomDataSourceLegacy(
formValue: AssetDatasourceFormValue,
): UiDataSource {
const json = JSON.parse(formValue.dataDestination?.trim()!!);
return {
type: 'CUSTOM',
customProperties: json,
};
}

private buildHttpDataSourceLegacy(
formValue: AssetDatasourceFormValue,
): UiDataSource {
const baseUrl = this.queryParamsMapper.getBaseUrlWithoutQueryParams(
formValue.httpUrl!,
)!;
const queryString = this.queryParamsMapper.getFullQueryString(
formValue.httpUrl!,
formValue.httpQueryParams ?? [],
);

const authFields = getAuthFields(formValue);

return {
type: 'HTTP_DATA',
httpData: {
method: formValue.httpMethod,
baseUrl,
queryString: queryString ?? undefined,
authHeaderName: authFields.authHeaderName ?? undefined,
authHeaderValue: {
secretName: authFields.authHeaderSecretName ?? undefined,
rawValue: authFields.authHeaderValue ?? undefined,
},
headers: this.buildHttpHeaders(formValue.httpHeaders ?? []),
enableMethodParameterization: formValue.httpProxyMethod,
enablePathParameterization: formValue.httpProxyPath,
enableQueryParameterization: formValue.httpProxyQueryParams,
enableBodyParameterization: formValue.httpProxyBody,
},
};
}

private buildOnRequestDataSourceLegacy(
formValue: AssetDatasourceFormValue,
): UiDataSource {
return {
type: 'ON_REQUEST',
onRequest: {
contactEmail: formValue.contactEmail!!,
contactPreferredEmailSubject: formValue.contactPreferredEmailSubject!!,
},
};
}

private buildHttpHeaders(
headers: HttpDatasourceHeaderFormValue[],
): Record<string, string> {
return Object.fromEntries(
headers
.map((header) => [
header.headerName?.trim() || '',
header.headerValue?.trim() || '',
])
.filter((a) => a[0] && a[1]),
);
}
}
Loading

0 comments on commit 11bf2fc

Please sign in to comment.