refactor(demo): Convert checkout to standalone

apps/demo/src/app/app-routing.module.ts

@@ -35,11 +35,11 @@ export const appRoutes: Routes = [
       },
       {
         path: 'category',
-        loadChildren: () => import('./category/category.routes').then(m => m.demoCategoryRoutes),
+        loadChildren: () => import('./category/category.routes').then(r => r.demoCategoryRoutes),
       },
       {
         path: 'checkout',
-        loadChildren: () => import('./checkout/checkout.module').then(m => m.CheckoutModule),
+        loadChildren: () => import('./checkout/checkout.routes').then(r => r.demoCheckoutRoutes),
       },
       { path: '404', component: NotFoundComponent },
       {

apps/demo/src/app/checkout/checkout-state.provider.ts

@@ -0,0 +1,7 @@
+import { importProvidersFrom } from '@angular/core';
+import { EffectsModule } from '@ngrx/effects';
+
+import { CheckoutEffects } from './effects/checkout.effects';
+
+export const provideDemoCheckoutState = () =>
+  importProvidersFrom(EffectsModule.forFeature([CheckoutEffects]));

apps/demo/src/app/checkout/checkout-routing.module.ts → apps/demo/src/app/checkout/checkout.routes.ts

@@ -1,29 +1,33 @@
 import {
-  NgModule,
+  importProvidersFrom,
   inject,
 } from '@angular/core';
 import {
   ActivatedRouteSnapshot,
-  RouterModule,
-  RouterStateSnapshot,
   Routes,
+  RouterStateSnapshot,
 } from '@angular/router';
 
 import {
   DaffCartInStockItemsGuard,
   DaffCartItemsGuard,
-  DaffCartRoutingModule,
   DaffResolveCartGuard,
+  DaffCartRoutingModule,
 } from '@daffodil/cart/routing';
 import { daffRouterComposeGuards } from '@daffodil/router';
 
+import { provideDemoCheckoutState } from './checkout-state.provider';
 import { DemoCheckoutViewComponent } from './pages/checkout-view/checkout-view.component';
 import { ThankYouViewComponent } from '../thank-you/pages/thank-you-view.component';
 
-const routes: Routes = [
+export const demoCheckoutRoutes: Routes = [
   {
     path: '',
     pathMatch: 'full',
+    providers: [
+      provideDemoCheckoutState(),
+      importProvidersFrom(DaffCartRoutingModule),
+    ],
     children: [
       { path: '', component: DemoCheckoutViewComponent },
       { path: 'thank-you', component: ThankYouViewComponent },
@@ -44,14 +48,3 @@ const routes: Routes = [
     ],
   },
 ];
-
-@NgModule({
-  imports: [
-    RouterModule.forChild(routes),
-    DaffCartRoutingModule,
-  ],
-  exports: [
-    RouterModule,
-  ],
-})
-export class CheckoutRoutingModule { }

apps/demo/src/app/checkout/components/payment/payment-form/payment-form.component.ts

@@ -13,7 +13,7 @@ import {
 import { DaffAuthorizeNetCreditCard } from '@daffodil/authorizenet';
 import { DaffCartAddress } from '@daffodil/cart';
 import { DaffButtonComponent } from '@daffodil/design/button';
-import { DaffCheckboxModule } from '@daffodil/design/checkbox';
+import { DAFF_CHECKBOX_COMPONENTS } from '@daffodil/design/checkbox';
 import { DaffInputComponent } from '@daffodil/design/input';
 
 import { DemoGeographyAddressSummaryComponent } from '../../../../geography/components/address-summary/address-summary.component';
@@ -32,7 +32,7 @@ import { PaymentInfoFormFactory } from '../payment-info-form/factories/payment-i
     DaffInputComponent,
     DemoCheckoutPaymentInfoFormComponent,
     DaffButtonComponent,
-    DaffCheckboxModule,
+    DAFF_CHECKBOX_COMPONENTS,
     DemoCheckoutAddressFormComponent,
     DemoGeographyAddressSummaryComponent,
   ],

apps/demo/src/app/checkout/components/payment/payment-summary/payment-summary.component.ts

@@ -11,7 +11,6 @@ import { DaffAuthorizeNetCreditCard } from '@daffodil/authorizenet';
   selector: 'demo-checkout-payment-summary',
   templateUrl: './payment-summary.component.html',
   styleUrls: ['./payment-summary.component.scss'],
-  standalone: true,
 })
 export class DemoCheckoutPaymentSummaryComponent {
   @Input() paymentInfo: DaffAuthorizeNetCreditCard;

apps/demo/src/app/checkout/components/place-order/place-order.component.spec.ts

@@ -22,23 +22,20 @@ import { PlaceOrderComponent } from './place-order.component';
 describe('PlaceOrderComponent', () => {
   let fixture: ComponentFixture<PlaceOrderComponent>;
   let component: PlaceOrderComponent;
-  const stubEnablePlaceOrderButton = true;
   let store: MockStore<any>;
   let cartFactory: DaffCartFactory;
   let stubCart: DaffCart;
   let cartFacade: MockDaffCartFacade;
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [
+      imports: [
+        DaffCartStateTestingModule,
         PlaceOrderComponent,
       ],
       providers: [
         provideMockStore({}),
       ],
-      imports: [
-        DaffCartStateTestingModule,
-      ],
     })
       .compileComponents();
   }));

apps/demo/src/app/checkout/components/place-order/place-order.component.ts

@@ -1,3 +1,4 @@
+import { AsyncPipe } from '@angular/common';
 import {
   Component,
   OnInit,
@@ -9,12 +10,16 @@ import {
   DaffCartFacade,
   DaffCartPlaceOrder,
 } from '@daffodil/cart/state';
+import { DaffButtonComponent } from '@daffodil/design/button';
 
 @Component({
   selector: 'demo-place-order',
   templateUrl: './place-order.component.html',
   styleUrls: ['./place-order.component.scss'],
-  standalone: false,
+  imports: [
+    DaffButtonComponent,
+    AsyncPipe,
+  ],
 })
 export class PlaceOrderComponent implements OnInit {
   enablePlaceOrderButton$: Observable<boolean>;

apps/demo/src/app/checkout/components/shipping-address/form/shipping-address-form.component.ts

@@ -7,7 +7,7 @@ import {
 } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
 
-import { DaffButtonComponent } from '@daffodil/design/button';
+import { DAFF_BASIC_BUTTON_COMPONENTS } from '@daffodil/design/button';
 import { DaffPersonalAddress } from '@daffodil/geography';
 
 import { DemoCheckoutAddressFormComponent } from '../../forms/address/components/address-form/address-form.component';
@@ -24,7 +24,7 @@ import {
   imports: [
     DemoCheckoutAddressFormComponent,
     ReactiveFormsModule,
-    DaffButtonComponent,
+    DAFF_BASIC_BUTTON_COMPONENTS,
   ],
 })
 export class DemoCheckoutShippingAddressFormComponent implements OnInit {

apps/demo/src/app/checkout/components/shipping/shipping-form/shipping-form.component.ts

@@ -8,7 +8,7 @@ import {
 import { ReactiveFormsModule } from '@angular/forms';
 
 import { DaffCartShippingRate } from '@daffodil/cart';
-import { DaffButtonComponent } from '@daffodil/design/button';
+import { DAFF_BASIC_BUTTON_COMPONENTS } from '@daffodil/design/button';
 
 import { DemoCheckoutAddressFormComponent } from '../../forms/address/components/address-form/address-form.component';
 import { DemoCheckoutShippingOptionsComponent } from '../shipping-options/components/shipping-options/shipping-options.component';
@@ -26,7 +26,7 @@ import {
     DemoCheckoutAddressFormComponent,
     DemoCheckoutShippingOptionsComponent,
     ReactiveFormsModule,
-    DaffButtonComponent,
+    DAFF_BASIC_BUTTON_COMPONENTS,
   ],
 })
 export class DemoCheckoutShippingFormComponent implements OnInit {

apps/demo/src/app/checkout/components/shipping/shipping-summary/shipping-summary.component.ts

@@ -11,7 +11,6 @@ import { DaffCartShippingRate } from '@daffodil/cart';
   selector: 'demo-checkout-shipping-summary',
   templateUrl: './shipping-summary.component.html',
   styleUrls: ['./shipping-summary.component.scss'],
-  standalone: true,
 })
 export class DemoCheckoutShippingSummaryComponent {
   @Input() selectedShippingOption: DaffCartShippingRate;

apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.ts

@@ -33,7 +33,7 @@ import { DemoCheckoutBillingFormGroup } from '../../components/payment/models/pa
 import { DemoCheckoutPaymentFormComponent } from '../../components/payment/payment-form/payment-form.component';
 import { demoCheckoutPaymentInfoRequestDataTransform } from '../../components/payment/payment-info-form/transforms/request-data';
 import { DemoCheckoutPaymentSummaryComponent } from '../../components/payment/payment-summary/payment-summary.component';
-import { PlaceOrderModule } from '../../components/place-order/place-order.module';
+import { PlaceOrderComponent } from '../../components/place-order/place-order.component';
 import { DemoCheckoutShippingFormComponent } from '../../components/shipping/shipping-form/shipping-form.component';
 import { DemoCheckoutShippingSummaryComponent } from '../../components/shipping/shipping-summary/shipping-summary.component';
 import { DemoCheckoutShippingAddressFormComponent } from '../../components/shipping-address/form/shipping-address-form.component';
@@ -58,7 +58,7 @@ import {
     DemoCheckoutPaymentFormComponent,
     DemoCheckoutBillingAddressSummaryComponent,
     DemoCheckoutPaymentSummaryComponent,
-    PlaceOrderModule,
+    PlaceOrderComponent,
     CartSummaryWrapperComponent,
   ],
 })