add wde field

apps/eo/e2e-eo/.cypress-cucumber-preprocessorrc.json

@@ -0,0 +1,7 @@
+{
+  "stepDefinitions": [
+    "src/e2e/[filepath].ts",
+    "src/e2e/[filepart]/**/*.ts",
+    "src/e2e/login/**/*.ts"
+  ]
+}

apps/eo/e2e-eo/src/e2e/dashboard/dashboard.ts

@@ -14,20 +14,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { Given, Then, When } from '@badeball/cypress-cucumber-preprocessor';
-import { DashboardPo, LandingPagePO, LoginPo, SharedPO } from '../../page-objects';
+import { Then, When } from '@badeball/cypress-cucumber-preprocessor';
+import { DashboardPo } from '../../page-objects';
 
 const dashboard = new DashboardPo();
-const landingPage = new LandingPagePO();
-const login = new LoginPo();
-const shared = new SharedPO();
-
-Given('I am logged in as Charlotte CSR', () => {
-  landingPage.navigateTo();
-  shared.clickOnlyNecessaryButton(); // To get rid of Cookie Consent banner
-  landingPage.clickLoginButton();
-  login.clickCharlotteLogin();
-});
 
 When('I am on the dashboard page', () => {
   dashboard.urlIsDashboardPage();

apps/eo/e2e-eo/src/e2e/login/login.ts

@@ -27,6 +27,13 @@ Given('I am on the landing page', () => {
   landingPage.headerIsVisible();
 });
 
+Given('I am logged in as Charlotte CSR', () => {
+  landingPage.navigateTo();
+  shared.clickOnlyNecessaryButton(); // To get rid of Cookie Consent banner
+  landingPage.clickLoginButton();
+  login.clickCharlotteLogin();
+});
+
 When('I click the first start button to login', () => {
   landingPage.clickLoginButton();
 });

apps/eo/e2e-eo/src/e2e/transfers/create-transfer-agreeement.feature

@@ -0,0 +1,11 @@
+Feature: Create transfer agreement
+
+  Scenario: Charlotte CSR can create a new transfer agreement
+    Given I am logged in as Charlotte CSR
+    When I go to the transfers page
+    And I click on the new transfer agreement button
+    And I can see a modal to create a new agreement
+    And I enter details for a transfer agreement
+    And I click create transfer agreement
+    And I can see the modal to create a new agreement has closed
+    Then I can see the new agreement in the table on the transfers page

apps/eo/e2e-eo/src/e2e/transfers/create-transfer-agreement.ts

@@ -0,0 +1,48 @@
+/**
+ * @license
+ * Copyright 2020 Energinet DataHub A/S
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License2");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Then, When } from '@badeball/cypress-cucumber-preprocessor';
+import { TransfersPo } from '../../page-objects/transfers.po';
+
+const transfers = new TransfersPo();
+
+When('I click on the new transfer agreement button', () => {
+  transfers.clickNewAgreementButton();
+});
+
+When('I enter details for a transfer agreement', () => {
+  transfers.enterDetailsForNewAgreement();
+});
+
+When('I click create transfer agreement', () => {
+  transfers.clickCreateAgreementButton();
+});
+
+When('I can see a modal to create a new agreement', () => {
+  transfers.newAgreementModalIsVisible();
+});
+
+Then('I can see the new agreement in the table on the transfers page', () =>
+  transfers.newlyCreatedAgreementIsVisible()
+);
+
+Then('I can see the modal to create a new agreement has closed', () =>
+  transfers.newAgreementModalIsNotOnScreen()
+);
+
+Then('I can close the new agreement modal', () => {
+  transfers.clickCloseNewAgreementModalButton();
+});

apps/eo/e2e-eo/src/e2e/transfers/transfers.feature

@@ -10,12 +10,17 @@ Feature: Transfers Page
     And I can see the table has a paginator
     And I can see a button to create a new agreement
 
-  Scenario: Charlotte CSR can create a new transfer agreement
-    Given I am logged in as Charlotte CSR
-    When I go to the transfers page
-    And I click on the new transfer agreement button
-    And I can see a modal to create a new agreement
-    And I enter details for a transfer agreement
-    And I click create transfer agreement
-    And I can see the modal to create a new agreement has closed
-    Then I can see the new agreement in the table on the transfers page
+  Scenario: Charlotte CSR has no transfer agreements
+      Given I am logged in as Charlotte CSR
+      When I go to the transfers page
+      And I don't have any existing transfer agreements
+      Then I can see a message that I have no transfer agreements
+      And I see no loading indicators
+      And I see no errors
+
+  Scenario: Fetching transfer agreements fails
+      Given I am logged in as Charlotte CSR
+      And the API for transfer agreements is down
+      When I go to the transfers page
+      Then I can see a general error message
+      And I see no loading indicators

apps/eo/e2e-eo/src/e2e/transfers/transfers.ts

@@ -14,42 +14,29 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { Given, Then, When } from '@badeball/cypress-cucumber-preprocessor';
-import { LandingPagePO, LoginPo, SharedPO } from '../../page-objects';
+import { Then, When } from '@badeball/cypress-cucumber-preprocessor';
+import { SharedPO } from '../../page-objects';
 import { TransfersPo } from '../../page-objects/transfers.po';
 
 const transfers = new TransfersPo();
-const landingPage = new LandingPagePO();
-const login = new LoginPo();
 const shared = new SharedPO();
 
-Given('I am logged in as Charlotte CSR', () => {
-  landingPage.navigateTo();
-  shared.clickOnlyNecessaryButton(); // To get rid of Cookie Consent banner
-  landingPage.clickLoginButton();
-  login.clickCharlotteLogin();
-});
-
 When('I go to the transfers page', () => {
   shared.clickTransfersMenuItem();
   transfers.urlIsTransfersPage();
   transfers.headerIsVisible();
 });
 
-When('I click on the new transfer agreement button', () => {
-  transfers.clickNewAgreementButton();
-});
-
-When('I enter details for a transfer agreement', () => {
-  transfers.enterDetailsForNewAgreement();
-});
-
-When('I click create transfer agreement', () => {
-  transfers.clickCreateAgreementButton();
+When('the API for transfer agreements is down', () => {
+  cy.intercept('GET', 'https://demo.energioprindelse.dk/api/transfer-agreements', {
+    statusCode: 500,
+  });
 });
 
-When('I can see a modal to create a new agreement', () => {
-  transfers.newAgreementModalIsVisible();
+When("I don't have any existing transfer agreements", () => {
+  cy.intercept('GET', 'https://demo.energioprindelse.dk/api/transfer-agreements', {
+    statusCode: 204,
+  });
 });
 
 Then('I can see a header text in the table card', () => transfers.cardHeaderIsVisible());
@@ -60,14 +47,18 @@ Then('I can see the table has a paginator', () => transfers.paginatorIsVisible()
 
 Then('I can see a button to create a new agreement', () => transfers.newAgreementButtonIsVisible());
 
-Then('I can see the new agreement in the table on the transfers page', () =>
-  transfers.newlyCreatedAgreementIsVisible()
-);
+Then('I can see a message that I have no transfer agreements', () => {
+  transfers.noTransferAgreementsTextIsVisible();
+});
 
-Then('I can see the modal to create a new agreement has closed', () =>
-  transfers.newAgreementModalIsNotOnScreen()
-);
+Then('I see no loading indicators', () => {
+  transfers.loadingTransferAgreementsIndicatorIsNotVisible();
+});
+
+Then('I can see a general error message', () => {
+  transfers.generalErrorIsVisible();
+});
 
-Then('I can close the new agreement modal', () => {
-  transfers.clickCloseNewAgreementModalButton();
+Then('I see no errors', () => {
+  transfers.generalErrorIsNotVisible();
 });

apps/eo/e2e-eo/src/page-objects/transfers.po.ts

@@ -26,10 +26,16 @@ export class TransfersPo {
   private newAgreementDateRangeStartInput = '[data-testid="new-agreement-start-date-input"]';
   private newAgreementDateRangeEndInput = '[data-testid="new-agreement-end-date-input"]';
   private newAgreementReceiverInput = '[data-testid="new-agreement-receiver-input"]';
+  private walletDepositEndpointInput = '[data-testid="wallet-deposit-endpoint-input"]';
+  private testBase64EncodedWalletDepositEndpoint =
+    'eyJFbmRwb2ludCI6Imh0dHA6Ly9sb2NhbGhvc3Q6Nzg5MC8iLCJQdWJsaWNLZXkiOiJBVTBWVFVzQUFBQUJ5aE5KRmxENlZhVUZPajRGRzcybmVkSmxVbDRjK0xVejdpV0tRNEkzM1k0Q2J5OVBQTm5SdXRuaWUxT1NVRS9ud0RWTWV3bW14TnFFTkw5a0RZeHdMQWs9IiwiVmVyc2lvbiI6MX0=';
   private paginator = '[data-testid="table-paginator"]';
   private testReceiverId = '11111111';
   private testStartDate = '12052023';
   private testEndDate = '14052023';
+  private noTransferAgreementsText = 'You do not have any transfer agreements to show right now.';
+  private loadingTransferAgreementsIndicator = '.watt-table-loading-cell';
+  private generalErrorMessage = 'eo-popup-message';
 
   // Visibility
   headerIsVisible = () => cy.get('h2').should('contain.text', this.pageHeaderText);
@@ -42,6 +48,14 @@ export class TransfersPo {
   newAgreementModalIsNotOnScreen = () => cy.get(this.newAgreementModal).should('not.exist');
   newlyCreatedAgreementIsVisible = () =>
     cy.get(this.transfersTable).should('contain', this.testReceiverId);
+  generalErrorIsVisible = () => cy.get(this.generalErrorMessage).should('be.visible');
+  generalErrorIsNotVisible = () => cy.get(this.generalErrorMessage).should('not.exist');
+  noTransferAgreementsTextIsVisible = () =>
+    cy.get('p').should('contain', this.noTransferAgreementsText);
+  loadingTransferAgreementsIndicatorIsVisible = () =>
+    cy.get(this.loadingTransferAgreementsIndicator).should('be.visible');
+  loadingTransferAgreementsIndicatorIsNotVisible = () =>
+    cy.get(this.loadingTransferAgreementsIndicator).should('not.exist');
 
   // Interaction
   clickNewAgreementButton() {
@@ -53,6 +67,7 @@ export class TransfersPo {
     cy.get(this.newAgreementDateRangeStartInput).type(this.testStartDate);
     cy.get(this.newAgreementHasEndDate).click();
     cy.get(this.newAgreementDateRangeEndInput).type(this.testEndDate);
+    cy.get(this.walletDepositEndpointInput).type(this.testBase64EncodedWalletDepositEndpoint);
   }
 
   clickCreateAgreementButton() {
@@ -65,6 +80,8 @@ export class TransfersPo {
         senderName: 'Producent A/S',
         senderTin: '11223344',
         receiverTin: '11111111',
+        Base64EncodedWalletDepositEndpoint:
+          'eyJFbmRwb2ludCI6Imh0dHA6Ly9sb2NhbGhvc3Q6Nzg5MC8iLCJQdWJsaWNLZXkiOiJBVTBWVFVzQUFBQUJ5aE5KRmxENlZhVUZPajRGRzcybmVkSmxVbDRjK0xVejdpV0tRNEkzM1k0Q2J5OVBQTm5SdXRuaWUxT1NVRS9ud0RWTWV3bW14TnFFTkw5a0RZeHdMQWs9IiwiVmVyc2lvbiI6MX0=',
       },
     });
     cy.get(this.createNewAgreementButton).click();

build/infrastructure/eo/chart/Chart.yaml

@@ -2,4 +2,4 @@ apiVersion: v2
 name: eo-frontend
 description: A Helm chart for Kubernetes
 type: application
-version: 0.3.315
+version: 0.3.316

build/infrastructure/eo/chart/values.yaml

@@ -2,4 +2,4 @@ app:
   replicaCount: 2
   image:
     name: ghcr.io/energinet-datahub/eo-frontend-app
-    tag: 0.3.315
+    tag: 0.3.316

libs/eo/transfers/src/lib/eo-transfers-create-modal.component.ts

@@ -22,16 +22,16 @@ import {
   ViewChild,
   ViewEncapsulation,
 } from '@angular/core';
-import { getUnixTime } from 'date-fns';
 import { RxPush } from '@rx-angular/template/push';
 
 import { WATT_MODAL, WattModalComponent } from '@energinet-datahub/watt/modal';
 import { WattValidationMessageComponent } from '@energinet-datahub/watt/validation-message';
 
 import { EoTransfersService } from './eo-transfers.service';
-import { EoTransfersStore } from './eo-transfers.store';
-import { EoTransfersFormComponent } from './eo-transfers-form.component';
+import { EoExistingTransferAgreement, EoTransfersStore } from './eo-transfers.store';
+import { EoTransfersFormComponent } from './form/eo-transfers-form.component';
 import { EoAuthStore } from '@energinet-datahub/eo/shared/services';
+import { Observable, of } from 'rxjs';
 
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -60,6 +60,8 @@ import { EoAuthStore } from '@energinet-datahub/eo/shared/services';
 
       <eo-transfers-form
         [senderTin]="authStore.getTin$ | push"
+        [existingTransferAgreements]="existingTransferAgreements$ | push"
+        (receiverTinChanged)="onReceiverTinChange($event)"
         (submitted)="createAgreement($event)"
         (canceled)="modal.close(false)"
       ></eo-transfers-form>
@@ -73,6 +75,7 @@ export class EoTransfersCreateModalComponent {
   protected creatingTransferAgreementFailed = false;
   protected isFormValid = false;
   protected opened = false;
+  protected existingTransferAgreements$: Observable<EoExistingTransferAgreement[]> = of([]);
 
   constructor(
     private service: EoTransfersService,
@@ -92,36 +95,39 @@ export class EoTransfersCreateModalComponent {
 
   onClosed() {
     this.opened = false;
+    this.existingTransferAgreements$ = of([]);
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  createAgreement(transferAgreement: any) {
-    const { receiverTin, startDate, startDateTime, endDate, endDateTime } = transferAgreement;
-    if (!receiverTin || !startDate || !startDateTime) return;
+  onReceiverTinChange(receiverTin: string | null) {
+    this.existingTransferAgreements$ = this.store.getExistingTransferAgreements$(receiverTin);
+  }
+
+  createAgreement(transferAgreement: {
+    receiverTin: string;
+    base64EncodedWalletDepositEndpoint: string;
+    period: { startDate: number; endDate: number | null; hasEndDate: boolean };
+  }) {
+    const { receiverTin, base64EncodedWalletDepositEndpoint, period } = transferAgreement;
+    const { startDate, endDate } = period;
 
-    const transfer = {
-      startDate: getUnixTime(new Date(startDate).setHours(parseInt(startDateTime), 0, 0, 0)),
-      endDate:
-        endDate && endDateTime
-          ? getUnixTime(new Date(endDate).setHours(parseInt(endDateTime), 0, 0, 0))
-          : null,
-      receiverTin,
-    };
+    if (!receiverTin || !startDate) return;
 
     this.creatingTransferAgreement = true;
-    this.service.createAgreement(transfer).subscribe({
-      next: (transfer) => {
-        this.store.addTransfer(transfer);
-        this.creatingTransferAgreement = false;
-        this.creatingTransferAgreementFailed = false;
-        this.cd.detectChanges();
-        this.modal.close(true);
-      },
-      error: () => {
-        this.creatingTransferAgreement = false;
-        this.creatingTransferAgreementFailed = true;
-        this.cd.detectChanges();
-      },
-    });
+    this.service
+      .createAgreement({ receiverTin, base64EncodedWalletDepositEndpoint, startDate, endDate })
+      .subscribe({
+        next: (transfer) => {
+          this.store.addTransfer(transfer);
+          this.creatingTransferAgreement = false;
+          this.creatingTransferAgreementFailed = false;
+          this.cd.detectChanges();
+          this.modal.close(true);
+        },
+        error: () => {
+          this.creatingTransferAgreement = false;
+          this.creatingTransferAgreementFailed = true;
+          this.cd.detectChanges();
+        },
+      });
   }
 }

libs/eo/transfers/src/lib/eo-transfers-drawer.component.ts

@@ -147,7 +147,6 @@ export class EoTransfersDrawerComponent {
   }
 
   onClose() {
-    this.drawer.close();
     this.closed.emit();
   }
 }