View transaction logs
diff --git a/src/app/features/invoke-wallet/components/qr-code/qr-code.component.ts b/src/app/features/invoke-wallet/components/qr-code/qr-code.component.ts
index 677d112..a76def0 100644
--- a/src/app/features/invoke-wallet/components/qr-code/qr-code.component.ts
+++ b/src/app/features/invoke-wallet/components/qr-code/qr-code.component.ts
@@ -18,20 +18,27 @@ import {InitializedTransaction} from '@core/models/InitializedTransaction';
import {PresentationsResultsComponent} from '../presentations-results/presentations-results.component';
import {DeviceDetectorService} from '@core/services/device-detector.service';
import {LocalStorageService} from '@core/services/local-storage.service';
-import * as constants from '@core/constants/constants';
+import * as constants from '@core/constants/general';
import {MatDialog, MatDialogModule} from '@angular/material/dialog';
import {OpenLogsComponent} from '@shared/elements/open-logs/open-logs.component';
import {VerifierEndpointService} from "@core/services/verifier-endpoint.service";
import {WalletResponse} from "@core/models/WalletResponse";
import {ConcludedTransaction} from "@core/models/ConcludedTransaction";
+import { QRCodeModule } from 'angularx-qrcode';
+import {SafeUrl} from "@angular/platform-browser";
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-declare let QRCode: any;
@Component({
selector: 'vc-qr-code',
standalone: true,
- imports: [CommonModule, SharedModule, PresentationsResultsComponent, OpenLogsComponent, MatDialogModule],
+ imports: [
+ CommonModule,
+ SharedModule,
+ PresentationsResultsComponent,
+ OpenLogsComponent,
+ MatDialogModule,
+ QRCodeModule
+ ],
templateUrl: './qr-code.component.html',
styleUrls: ['./qr-code.component.scss'],
providers: [VerifierEndpointService],
@@ -44,13 +51,13 @@ export class QrCodeComponent implements OnInit, OnDestroy {
destroy$ = new Subject();
stopPlay$ = new ReplaySubject(1);
- @ViewChild('qrCode') qrCode!: ElementRef;
isCrossDevice = true;
transaction!: InitializedTransaction;
- redirectUrl!: string;
+ deepLinkTxt!: string;
scheme!: string;
+ qrCodeDownloadLink!: SafeUrl;
readonly dialog!: MatDialog;
@Output() transactionConcludedEvent = new EventEmitter
();
@@ -82,19 +89,18 @@ export class QrCodeComponent implements OnInit, OnDestroy {
if (!this.transaction) {
this.navigateService.goHome();
} else {
- this.redirectUrl = this.buildQrCode(this.transaction);
+ this.deepLinkTxt = this.buildQrCode(this.transaction);
if (this.isCrossDevice) {
this.pollingRequest(this.transaction.transaction_id);
}
}
}
- ngAfterViewInit() {
- if (this.isCrossDevice) {
- new QRCode(this.qrCode.nativeElement, this.redirectUrl);
- }
+ onChangeURL(url: SafeUrl) {
+ this.qrCodeDownloadLink = url;
}
+
pollingRequest(transaction_id: string) {
const source = interval(2000);
source
diff --git a/src/app/features/invoke-wallet/services/wallet-response-processor.service.ts b/src/app/features/invoke-wallet/services/wallet-response-processor.service.ts
index dd49796..12b2f81 100644
--- a/src/app/features/invoke-wallet/services/wallet-response-processor.service.ts
+++ b/src/app/features/invoke-wallet/services/wallet-response-processor.service.ts
@@ -1,6 +1,6 @@
import {Injectable} from "@angular/core";
import {SharedAttestation} from "@core/models/presentation/SharedAttestation";
-import {AttestationFormat} from "@core/models/AttestationFormat";
+import {AttestationFormat} from "@core/models/attestation/AttestationFormat";
import {JSONPath} from "jsonpath-plus";
import {ConcludedTransaction} from "@core/models/ConcludedTransaction";
import {DecodersRegistryService} from "@core/services/decoders-registry.service";
diff --git a/src/app/features/presentation-request-preparation/components/attestation/attestation.component.html b/src/app/features/presentation-request-preparation/components/attestation/attestation.component.html
new file mode 100644
index 0000000..148f337
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/attestation/attestation.component.html
@@ -0,0 +1,31 @@
+
+
+
+ {{ nameOf(attestation) }}
+
+
+
+
+
+ -- attributes by --
+
+
+ {{ labelOf(method) }}
+
+
+ Please choose a method
+
+
+
+ -- format --
+
+
+ {{ format.value }}
+
+
+ Please choose an format
+
+
+
+
+
diff --git a/src/app/features/presentation-request-preparation/components/attestation/attestation.component.ts b/src/app/features/presentation-request-preparation/components/attestation/attestation.component.ts
new file mode 100644
index 0000000..4a399d8
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/attestation/attestation.component.ts
@@ -0,0 +1,83 @@
+import {Component, EventEmitter, Input, Output} from "@angular/core";
+import {CommonModule, KeyValue} from "@angular/common";
+import {SharedModule} from "@shared/shared.module";
+import {WalletLayoutComponent} from "@core/layout/wallet-layout/wallet-layout.component";
+import {MatInputModule} from "@angular/material/input";
+import {MatSelectModule} from "@angular/material/select";
+import {MatRadioModule} from "@angular/material/radio";
+import {FormControl, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {AttributeSelectionMethod, ScenarioAttestation} from "@features/presentation-request-preparation/models/ScenarioAttestation";
+import {SUPPORTED_ATTESTATIONS, SUPPORTED_FORMATS} from "@core/constants/attestations";
+import {MatExpansionModule} from "@angular/material/expansion";
+import {AttestationFormat} from "@core/models/attestation/AttestationFormat";
+import {AttestationSelection} from "@features/presentation-request-preparation/models/ScenarioSelection";
+import {FormatSelectOption} from "@features/presentation-request-preparation/components/attestation/model/format-select-option";
+
+@Component({
+ selector: 'vc-scenario-attestation',
+ standalone: true,
+ imports: [
+ CommonModule,
+ SharedModule,
+ WalletLayoutComponent,
+ MatInputModule,
+ MatSelectModule,
+ MatRadioModule,
+ ReactiveFormsModule,
+ FormsModule,
+ MatExpansionModule,
+ ],
+ templateUrl: './attestation.component.html'
+})
+export class AttestationComponent {
+
+ @Input() attestation!: ScenarioAttestation;
+ @Output() attestationSelectionEvent = new EventEmitter();
+
+ protected readonly supportedFormats: FormatSelectOption[] = this.formatOptions()
+
+ methodControl = new FormControl(null, Validators.required);
+ formatControl = new FormControl(null, Validators.required);
+
+ selectedMethod: AttributeSelectionMethod | null = null;
+ selectedFormat: AttestationFormat | null = null;
+
+ labelOf(method: AttributeSelectionMethod): string {
+ if (method == AttributeSelectionMethod.ALL_ATTRIBUTES) {
+ return "All attributes";
+ } else {
+ return "Specific attributes";
+ }
+ }
+
+ formatOptions(): FormatSelectOption[] {
+ function enumKeys(obj: O): K[] {
+ return Object.keys(obj).filter(k => !Number.isNaN(k)) as K[]
+ }
+
+ let result: FormatSelectOption[] = [];
+ for (const enumKey of enumKeys(AttestationFormat)) {
+ const format = AttestationFormat[enumKey];
+ result.push({
+ key: format,
+ value: format,
+ disabled: !SUPPORTED_FORMATS.includes(format)
+ })
+ }
+ return result
+ }
+
+ emit() {
+ this.attestationSelectionEvent.emit({
+ type: this.attestation.attestationType,
+ format: this.selectedFormat,
+ attributeSelectionMethod: this.selectedMethod
+ });
+ }
+
+ nameOf(attestation: ScenarioAttestation): string {
+ return SUPPORTED_ATTESTATIONS[attestation.attestationType as string].name
+ }
+
+ protected readonly frameElement = frameElement;
+}
diff --git a/src/app/features/presentation-request-preparation/components/attestation/model/format-select-option.ts b/src/app/features/presentation-request-preparation/components/attestation/model/format-select-option.ts
new file mode 100644
index 0000000..4c3e5a3
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/attestation/model/format-select-option.ts
@@ -0,0 +1,5 @@
+export type FormatSelectOption = {
+ key: string,
+ value: string,
+ disabled: boolean
+}
diff --git a/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.html b/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.html
new file mode 100644
index 0000000..6f8105e
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.html
@@ -0,0 +1,15 @@
+
+
+
+ {{ nameOf(selection.type) }}
+ in {{ selection.format }} format
+
+
+
+
+
+ All Attributes
+
+
+
+
diff --git a/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.ts b/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.ts
new file mode 100644
index 0000000..cbd0ec0
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/attribute-selection/attribute-selection.component.ts
@@ -0,0 +1,171 @@
+import {Component, EventEmitter, inject, Input, OnChanges, OnInit, Output, SimpleChanges} from "@angular/core";
+import {CommonModule} from "@angular/common";
+import {SharedModule} from "@shared/shared.module";
+import {WalletLayoutComponent} from "@core/layout/wallet-layout/wallet-layout.component";
+import {AttestationSelection, ScenarioSelection} from "@features/presentation-request-preparation/models/ScenarioSelection";
+import {AttestationType} from "@core/models/attestation/AttestationType";
+import {SUPPORTED_ATTESTATIONS} from "@core/constants/attestations";
+import {AttributeSelectionMethod} from "@features/presentation-request-preparation/models/ScenarioAttestation";
+import {MatButtonModule} from "@angular/material/button";
+import {MatCardModule} from "@angular/material/card";
+import {MatDialog} from "@angular/material/dialog";
+import {
+ SelectableAttestationAttributesComponent
+} from "@features/presentation-request-preparation/components/selectable-attestation-attributes/selectable-attestation-attributes.component";
+import {AttestationFormat} from "@core/models/attestation/AttestationFormat";
+import {InputDescriptor} from "@core/models/presentation/InputDescriptor";
+import {DialogResult} from "@features/presentation-request-preparation/components/selectable-attestation-attributes/model/DialogResult";
+import {MSO_MDOC_BY_TYPE} from "@core/data/MsoMdocDocuments";
+import {MsoMdocPresentationService} from "@core/services/mso-mdoc-presentation.service";
+import {MatBadgeModule} from "@angular/material/badge";
+
+@Component({
+ selector: 'vc-attribute-selection',
+ standalone: true,
+ imports: [
+ CommonModule,
+ SharedModule,
+ WalletLayoutComponent,
+ MatButtonModule,
+ MatCardModule,
+ MatBadgeModule,
+ ],
+ providers: [MsoMdocPresentationService],
+ templateUrl: './attribute-selection.component.html'
+})
+export class AttributeSelectionComponent implements OnInit, OnChanges {
+
+ constructor(
+ private readonly msoMdocPresentationService: MsoMdocPresentationService,
+ ) {
+ }
+
+ @Input() scenarioSelection!: ScenarioSelection;
+ @Output() attributesCollectedEvent = new EventEmitter();
+
+ readonly dialog: MatDialog = inject(MatDialog);
+
+ inputDescriptorsByType: { [id: string]: InputDescriptor } = {}
+
+ ngOnInit(): void {
+ this.prepareDescriptorsForNonSelectable()
+ }
+
+ prepareDescriptorsForNonSelectable() {
+ let allAttributesSelections = this.scenarioSelection.selections.filter((selection: AttestationSelection) =>
+ selection.attributeSelectionMethod === AttributeSelectionMethod.ALL_ATTRIBUTES
+ )
+ allAttributesSelections.forEach((selection: AttestationSelection) => {
+ switch (selection.format) {
+ case AttestationFormat.MSO_MDOC:
+ let msoMdoc = MSO_MDOC_BY_TYPE[selection.type as string];
+ let inputDescriptor = this.msoMdocPresentationService.msoMdocInputDescriptorOf(msoMdoc, "")
+ this.inputDescriptorsByType[selection.type] = inputDescriptor;
+ break;
+ case AttestationFormat.SD_JWT_VC:
+ console.error("Format " + AttestationFormat.SD_JWT_VC + " not suppoerted yet");
+ break;
+ case AttestationFormat.JWT_VC_JSON:
+ console.error("Format " + AttestationFormat.JWT_VC_JSON + " not suppoerted yet");
+ break;
+ }
+ })
+ }
+
+ nameOf(attestationType: AttestationType) {
+ return SUPPORTED_ATTESTATIONS[attestationType as string].name;
+ }
+
+ isSelectable(selection: AttestationSelection) {
+ return selection.attributeSelectionMethod == AttributeSelectionMethod.SELECTABLE;
+ }
+
+ popAttributesSelector(format: AttestationFormat, type: AttestationType, attestationName: string) {
+ const dialogRef = this.dialog.open(SelectableAttestationAttributesComponent, {
+ data: {
+ type: type,
+ format: format,
+ attestationName: attestationName,
+ seed: this.inputDescriptorsByType[type as string]
+ }
+ });
+ dialogRef.afterClosed().subscribe(result => {
+ // result can be null or undefined if popup is closed without saving selection (clicking on 'close' button or focus lost)
+ if (result) {
+ this.updateInputDescriptorsDictionary(result.data as DialogResult);
+ }
+ });
+ }
+
+ updateInputDescriptorsDictionary(dialogResult: DialogResult) {
+ if (dialogResult.inputDescriptor) {
+ this.inputDescriptorsByType[dialogResult.attestationType as string] = dialogResult.inputDescriptor;
+ } else {
+ delete this.inputDescriptorsByType[dialogResult.attestationType as string]
+ }
+ this.emitAttributesCollectedEvent();
+ }
+
+ emitAttributesCollectedEvent() {
+ let result: InputDescriptor[] = [];
+ Object.keys(this.inputDescriptorsByType).forEach((item) => {
+ result.push(this.inputDescriptorsByType[item]);
+ });
+ this.attributesCollectedEvent.emit(result);
+ }
+
+ ngOnChanges(changes: SimpleChanges): void {
+ if (!changes["scenarioSelection"].firstChange) {
+ let currentSelection = changes["scenarioSelection"].currentValue as ScenarioSelection;
+ let previousSelection = changes["scenarioSelection"].previousValue as ScenarioSelection;
+ if (currentSelection.scenarioName !== previousSelection.scenarioName) {
+ console.log("scenario changed...re-setting everything")
+ this.inputDescriptorsByType = {};
+ } else {
+ Object.keys(this.inputDescriptorsByType).forEach((item) => {
+ if (this.attributeSelectionChanged(currentSelection, previousSelection, item as AttestationType)) {
+ delete this.inputDescriptorsByType[item];
+ }
+ });
+ }
+ }
+ this.prepareDescriptorsForNonSelectable();
+ this.emitAttributesCollectedEvent();
+ }
+
+ fieldsSelectedNo(type: AttestationType): number {
+ if (this.inputDescriptorsByType[type as string])
+ return this.inputDescriptorsByType[type as string].constraints.fields.length;
+ else
+ return 0;
+ }
+
+ canShowFieldsSelected(type: AttestationType): boolean {
+ if (this.inputDescriptorsByType[type as string])
+ return this.inputDescriptorsByType[type as string].constraints.fields.length > 0;
+ else
+ return false;
+ }
+
+ private attributeSelectionChanged(
+ currentScenario: ScenarioSelection,
+ previousScenario: ScenarioSelection,
+ attestationType: AttestationType
+ ): boolean {
+ let current = currentScenario.selections.filter((selection: AttestationSelection) =>
+ selection.type === attestationType
+ )
+ let previous = previousScenario.selections.filter((selection: AttestationSelection) =>
+ selection.type === attestationType
+ )
+ // Previously existed and now removed
+ if (previous && previous.length >= 1 && (!current || current.length == 0)) {
+ return true
+ }
+ // Selection method or format changed
+ if (previous && previous.length >= 1 && current && current.length >= 1) {
+ return previous[0].attributeSelectionMethod != current[0].attributeSelectionMethod || previous[0].format != current[0].format;
+ }
+ return false;
+ }
+}
diff --git a/src/app/features/presentation-request-preparation/components/scenario/scenario.component.html b/src/app/features/presentation-request-preparation/components/scenario/scenario.component.html
new file mode 100644
index 0000000..d3a2eaf
--- /dev/null
+++ b/src/app/features/presentation-request-preparation/components/scenario/scenario.component.html
@@ -0,0 +1,23 @@
+
+
+
+
+ select scenario
+
+
+ {{ scenario.name }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{{ data.attestationName }}
+
+
+
+
+
+
+
+
+
+ {{ field.label }}
+
+
+
+
+
+
Define your presentation request
+
+ Follow the steps to specify what will be requested from the wallet to present.
+
+
+
+
+
+
+ Or, if this doesn't work for you, go straight to defining your presentation request
+ here
+
+
+
-
Proceed to authentication
-
-
-
-
-
-
-
-
-
-
- {{field.label}}
-
-
-
-
-
Change default custom scheme
+
+
+
+
+ Current custom scheme value is: {{ schemeValue }}
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/features/home/components/input-scheme/input-scheme.component.scss b/src/app/shared/elements/input-scheme/input-scheme.component.scss
similarity index 100%
rename from src/app/features/home/components/input-scheme/input-scheme.component.scss
rename to src/app/shared/elements/input-scheme/input-scheme.component.scss
diff --git a/src/app/features/home/components/input-scheme/input-scheme.component.spec.ts b/src/app/shared/elements/input-scheme/input-scheme.component.spec.ts
similarity index 95%
rename from src/app/features/home/components/input-scheme/input-scheme.component.spec.ts
rename to src/app/shared/elements/input-scheme/input-scheme.component.spec.ts
index 95ed5c4..6d0a7cc 100644
--- a/src/app/features/home/components/input-scheme/input-scheme.component.spec.ts
+++ b/src/app/shared/elements/input-scheme/input-scheme.component.spec.ts
@@ -1,7 +1,7 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { InputSchemeComponent } from './input-scheme.component';
-import { SharedModule } from '@app/shared/shared.module';
+import { SharedModule } from '@shared/shared.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatInputModule } from '@angular/material/input';
diff --git a/src/app/features/home/components/input-scheme/input-scheme.component.ts b/src/app/shared/elements/input-scheme/input-scheme.component.ts
similarity index 71%
rename from src/app/features/home/components/input-scheme/input-scheme.component.ts
rename to src/app/shared/elements/input-scheme/input-scheme.component.ts
index 1d8858c..988c39f 100644
--- a/src/app/features/home/components/input-scheme/input-scheme.component.ts
+++ b/src/app/shared/elements/input-scheme/input-scheme.component.ts
@@ -5,14 +5,16 @@ import { MatIconModule } from '@angular/material/icon';
import { FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
import { MatInputModule } from '@angular/material/input';
import { ErrorStateMatcher } from './error-state-matcher';
-import { SharedModule } from '@app/shared/shared.module';
-import { LocalStorageService } from '@app/core/services/local-storage.service';
-import { DEFAULT_SCHEME, SCHEME } from '@app/core/constants/constants';
+import { SharedModule } from '@shared/shared.module';
+import { LocalStorageService } from '@core/services/local-storage.service';
+import { DEFAULT_SCHEME, SCHEME } from '@core/constants/general';
+import {MatDialogModule} from "@angular/material/dialog";
+import {MatButtonModule} from "@angular/material/button";
@Component({
selector: 'vc-input-scheme',
standalone: true,
- imports: [CommonModule, MatExpansionModule, FormsModule, ReactiveFormsModule, MatInputModule, SharedModule, MatIconModule],
+ imports: [CommonModule, MatExpansionModule, FormsModule, ReactiveFormsModule, MatInputModule, SharedModule, MatIconModule, MatDialogModule, MatButtonModule],
templateUrl: './input-scheme.component.html',
styleUrls: ['./input-scheme.component.scss']
})