fix: open 'Terms & Conditions' and 'Privacy Policy' in new tab instea…

…d of in a dialog (#84)
intershop · Jan 17, 2020 · 312c43d · 312c43d
1 parent a5f49fb
commit 312c43d
Show file tree

Hide file tree

Showing 14 changed files with 63 additions and 80 deletions.
diff --git a/src/app/pages/checkout-address/checkout-address/checkout-address.component.html b/src/app/pages/checkout-address/checkout-address/checkout-address.component.html
@@ -45,11 +45,11 @@ <h2>{{ 'checkout.order_details.heading' | translate }}</h2>
       </button>
     </div>
     <!-- Privacy policy link -->
-    <ish-modal-dialog-link
-      linkText="checkout.widget.security_privacy_policy.link"
-      [options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
-    >
-      <ish-content-include includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"></ish-content-include>
-    </ish-modal-dialog-link>
+    <span
+      [ishServerHtml]="
+        'checkout.widget.security_privacy_policy.link'
+          | translate: { '0': 'route://page/systempage.privacyPolicy.pagelet2-Page' }
+      "
+    ></span>
   </div>
 </div>
diff --git a/src/app/pages/checkout-address/checkout-address/checkout-address.component.spec.ts b/src/app/pages/checkout-address/checkout-address/checkout-address.component.spec.ts
@@ -4,8 +4,9 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { RouterTestingModule } from '@angular/router/testing';
 import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
-import { MockComponent } from 'ng-mocks';
+import { MockComponent, MockDirective } from 'ng-mocks';
 
+import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
 import { HttpError } from 'ish-core/models/http-error/http-error.model';
 import { BasketMockData } from 'ish-core/utils/dev/basket-mock-data';
 import { ContentIncludeComponent } from 'ish-shared/cms/components/content-include/content-include.component';
@@ -40,6 +41,7 @@ describe('Checkout Address Component', () => {
         MockComponent(ContentIncludeComponent),
         MockComponent(ErrorMessageComponent),
         MockComponent(ModalDialogLinkComponent),
+        MockDirective(ServerHtmlDirective),
       ],
       imports: [
         NgbCollapseModule,

diff --git a/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.html b/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.html
@@ -154,11 +154,11 @@ <h2>{{ 'checkout.order_details.heading' | translate }}</h2>
       </button>
     </div>
     <!-- Privacy policy link -->
-    <ish-modal-dialog-link
-      linkText="checkout.widget.security_privacy_policy.link"
-      [options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
-    >
-      <ish-content-include includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"></ish-content-include>
-    </ish-modal-dialog-link>
+    <span
+      [ishServerHtml]="
+        'checkout.widget.security_privacy_policy.link'
+          | translate: { '0': 'route://page/systempage.privacyPolicy.pagelet2-Page' }
+      "
+    ></span>
   </div>
 </div>
diff --git a/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.spec.ts b/src/app/pages/checkout-payment/checkout-payment/checkout-payment.component.spec.ts
@@ -5,8 +5,9 @@ import { RouterTestingModule } from '@angular/router/testing';
 import { NgbCollapse } from '@ng-bootstrap/ng-bootstrap';
 import { FormlyForm } from '@ngx-formly/core';
 import { TranslateModule } from '@ngx-translate/core';
-import { MockComponent, MockPipe } from 'ng-mocks';
+import { MockComponent, MockDirective, MockPipe } from 'ng-mocks';
 
+import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
 import { HttpError } from 'ish-core/models/http-error/http-error.model';
 import { PricePipe } from 'ish-core/models/price/price.pipe';
 import { BasketMockData } from 'ish-core/utils/dev/basket-mock-data';
@@ -48,6 +49,7 @@ describe('Checkout Payment Component', () => {
         MockComponent(ModalDialogLinkComponent),
         MockComponent(NgbCollapse),
         MockComponent(PaymentConcardisCreditcardComponent),
+        MockDirective(ServerHtmlDirective),
         MockPipe(PricePipe),
       ],
       imports: [

diff --git a/src/app/pages/checkout-review/checkout-review/checkout-review.component.html b/src/app/pages/checkout-review/checkout-review/checkout-review.component.html
@@ -94,13 +94,11 @@ <h2>{{ 'checkout.order_details.heading' | translate }}</h2>
           controlName="termsAndConditions"
           [errorMessages]="{ pattern: 'checkout.tac.error.tip' }"
         >
-          <span>{{ 'checkout.tac' | translate }}&nbsp;</span>
-          <ish-modal-dialog-link
-            linkText="checkout.tac.link"
-            [options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
-          >
-            <ish-content-include includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"></ish-content-include>
-          </ish-modal-dialog-link>
+          <span
+            [ishServerHtml]="
+              'checkout.tac.text' | translate: { '0': '/page/systempage.termsAndConditions.pagelet2-Page' }
+            "
+          ></span>
         </ish-checkbox>
       </form>
 

diff --git a/src/app/pages/checkout-review/checkout-review/checkout-review.component.spec.ts b/src/app/pages/checkout-review/checkout-review/checkout-review.component.spec.ts
@@ -2,9 +2,10 @@ import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { ReactiveFormsModule } from '@angular/forms';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { TranslateModule } from '@ngx-translate/core';
-import { MockComponent } from 'ng-mocks';
+import { MockComponent, MockDirective } from 'ng-mocks';
 import { spy, verify } from 'ts-mockito';
 
+import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
 import { HttpError } from 'ish-core/models/http-error/http-error.model';
 import { BasketMockData } from 'ish-core/utils/dev/basket-mock-data';
 import { ContentIncludeComponent } from 'ish-shared/cms/components/content-include/content-include.component';
@@ -38,6 +39,7 @@ describe('Checkout Review Component', () => {
         MockComponent(InfoBoxComponent),
         MockComponent(LineItemListComponent),
         MockComponent(ModalDialogLinkComponent),
+        MockDirective(ServerHtmlDirective),
       ],
       imports: [ReactiveFormsModule, TranslateModule.forRoot()],
     }).compileComponents();

diff --git a/src/app/pages/checkout-shipping/checkout-shipping/checkout-shipping.component.html b/src/app/pages/checkout-shipping/checkout-shipping/checkout-shipping.component.html
@@ -76,11 +76,11 @@ <h2>{{ 'checkout.order_details.heading' | translate }}</h2>
       </button>
     </div>
     <!-- Privacy policy link -->
-    <ish-modal-dialog-link
-      linkText="checkout.widget.security_privacy_policy.link"
-      [options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
-    >
-      <ish-content-include includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"></ish-content-include>
-    </ish-modal-dialog-link>
+    <span
+      [ishServerHtml]="
+        'checkout.widget.security_privacy_policy.link'
+          | translate: { '0': 'route://page/systempage.privacyPolicy.pagelet2-Page' }
+      "
+    ></span>
   </div>
 </div>
diff --git a/src/app/pages/checkout-shipping/checkout-shipping/checkout-shipping.component.spec.ts b/src/app/pages/checkout-shipping/checkout-shipping/checkout-shipping.component.spec.ts
@@ -5,8 +5,9 @@ import { RouterTestingModule } from '@angular/router/testing';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { NgbPopover } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
-import { MockComponent, MockPipe } from 'ng-mocks';
+import { MockComponent, MockDirective, MockPipe } from 'ng-mocks';
 
+import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
 import { HttpError } from 'ish-core/models/http-error/http-error.model';
 import { PricePipe } from 'ish-core/models/price/price.pipe';
 import { BasketMockData } from 'ish-core/utils/dev/basket-mock-data';
@@ -42,6 +43,7 @@ describe('Checkout Shipping Component', () => {
         MockComponent(FaIconComponent),
         MockComponent(ModalDialogLinkComponent),
         MockComponent(NgbPopover),
+        MockDirective(ServerHtmlDirective),
         MockPipe(PricePipe),
       ],
       imports: [

diff --git a/src/app/pages/registration/registration-form/registration-form.component.html b/src/app/pages/registration/registration-form/registration-form.component.html
@@ -60,26 +60,15 @@ <h2>
                 [errorMessages]="{ pattern: 'registration.tac.error.tip' }"
               >
                 <span
-                  [ishServerHtml]="'registration.tac_privacy_policy.label' | translate"
-                  [callbacks]="{
-                    callbackTAC: showModalDialog(modalDialogTAC),
-                    callbackPP: showModalDialog(modalDialogPP)
-                  }"
+                  [ishServerHtml]="
+                    'registration.tac_privacy_policy.text'
+                      | translate
+                        : {
+                            '0': '/page/systempage.termsAndConditions.pagelet2-Page',
+                            '1': '/page/systempage.privacyPolicy.pagelet2-Page'
+                          }
+                  "
                 ></span>
-
-                <!-- modal terms and conditions -->
-                <ish-modal-dialog #modalDialogTAC [options]="{ size: 'lg' }">
-                  <ish-content-include
-                    includeId="systeminclude.dialog.termsAndConditions.pagelet2-Include"
-                  ></ish-content-include>
-                </ish-modal-dialog>
-
-                <!-- modal privacyPolicy -->
-                <ish-modal-dialog #modalDialogPP [options]="{ size: 'lg' }">
-                  <ish-content-include
-                    includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"
-                  ></ish-content-include>
-                </ish-modal-dialog>
               </ish-checkbox>
             </div>
           </div>

diff --git a/src/app/pages/registration/registration-form/registration-form.component.spec.ts b/src/app/pages/registration/registration-form/registration-form.component.spec.ts
@@ -2,7 +2,7 @@ import { SimpleChange } from '@angular/core';
 import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { TranslateModule } from '@ngx-translate/core';
-import { MockComponent } from 'ng-mocks';
+import { MockComponent, MockDirective } from 'ng-mocks';
 import { anything, instance, mock, spy, verify, when } from 'ts-mockito';
 
 import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
@@ -45,7 +45,7 @@ describe('Registration Form Component', () => {
         MockComponent(ModalDialogComponent),
         MockComponent(RegistrationCompanyFormComponent),
         MockComponent(RegistrationCredentialsFormComponent),
-        MockComponent(ServerHtmlDirective),
+        MockDirective(ServerHtmlDirective),
         RegistrationFormComponent,
       ],
       providers: [{ provide: AddressFormFactoryProvider, useFactory: () => instance(addressFormFactoryProviderMock) }],

diff --git a/src/app/pages/registration/registration-form/registration-form.component.ts b/src/app/pages/registration/registration-form/registration-form.component.ts
@@ -158,10 +158,4 @@ export class RegistrationFormComponent implements OnInit, OnChanges {
   get formDisabled() {
     return this.form.invalid && this.submitted;
   }
-
-  showModalDialog(dialog) {
-    return () => {
-      dialog.show();
-    };
-  }
 }