diff --git a/projects/canopy-test-app/src/app/app.component.html b/projects/canopy-test-app/src/app/app.component.html
index 1a2f22ce6..9c16c3692 100644
--- a/projects/canopy-test-app/src/app/app.component.html
+++ b/projects/canopy-test-app/src/app/app.component.html
@@ -563,20 +563,20 @@ <h3>Carousel item 3</h3>
               <button lg-button type="submit" variant="primary-dark">Submit</button>
             </form>
 
-<!--            <lg-separator></lg-separator>-->
-<!--            <lg-heading level="3">Modal</lg-heading>-->
-
-<!--            <button lgModalTrigger="modal" lg-button type="button" variant="secondary-dark">Open modal</button>-->
-<!--            <lg-modal id="modal">-->
-<!--              <lg-modal-header [headingLevel]="3">Lorem ipsum</lg-modal-header>-->
-<!--              <lg-modal-body>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</lg-modal-body>-->
-<!--              <lg-modal-footer>-->
-<!--                <lg-button-group>-->
-<!--                  <button lg-button lgMarginBottom="none" variant="primary-dark" type="button">Primary CTA</button>-->
-<!--                  <button lg-button lgMarginBottom="none" variant="secondary-dark" type="button">Cancel</button>-->
-<!--                </lg-button-group>-->
-<!--              </lg-modal-footer>-->
-<!--            </lg-modal>-->
+            <lg-separator></lg-separator>
+            <lg-heading level="3">Modal</lg-heading>
+
+            <button lgModalTrigger="modal" lg-button type="button" variant="secondary-dark">Open modal</button>
+            <lg-modal id="modal">
+              <lg-modal-header [headingLevel]="3">Lorem ipsum</lg-modal-header>
+              <lg-modal-body>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</lg-modal-body>
+              <lg-modal-footer>
+                <lg-button-group>
+                  <button lg-button lgMarginBottom="none" variant="primary-dark" type="button">Primary CTA</button>
+                  <button lg-button lgMarginBottom="none" variant="secondary-dark" type="button">Cancel</button>
+                </lg-button-group>
+              </lg-modal-footer>
+            </lg-modal>
 
             <lg-separator></lg-separator>
             <lg-heading level="3">List with Icons</lg-heading>
diff --git a/projects/canopy-test-app/src/app/app.component.ts b/projects/canopy-test-app/src/app/app.component.ts
index c57d5509a..51529b8d1 100644
--- a/projects/canopy-test-app/src/app/app.component.ts
+++ b/projects/canopy-test-app/src/app/app.component.ts
@@ -6,6 +6,13 @@ import {
 } from '@angular/forms';
 import { NgForOf, NgIf } from '@angular/common';
 import { RouterLink, RouterOutlet } from '@angular/router';
+import {
+  LgModalBodyComponent,
+  LgModalComponent,
+  LgModalFooterComponent,
+  LgModalHeaderComponent,
+  LgModalTriggerDirective,
+} from 'canopy';
 
 import { LgPageComponent } from '../../../canopy/src/lib/page';
 import { LgHeaderComponent, LgHeaderLogoComponent } from '../../../canopy/src/lib/header';
@@ -294,6 +301,11 @@ import {
     RouterOutlet,
     NgForOf,
     NgIf,
+    LgModalComponent,
+    LgModalTriggerDirective,
+    LgModalHeaderComponent,
+    LgModalBodyComponent,
+    LgModalFooterComponent,
   ],
 })
 export class AppComponent {