Adds features data (free boolean) to manifold-plan-selector custom event

Update changelog
manifoldco · Nov 19, 2019 · 8b3f93c · 8b3f93c
1 parent 8375bb5
commit 8b3f93c
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,10 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ### Added
 
+- Free features data to plan selector custom event. (#743)
+
+### Added
+
 - Added `metrics` property to `<manifold-connection>` to opt-in for metric collection (#724)
 - Added performance monitoring of GraphQL endpoints (#726)
 - Added performance monitoring of oauth token handshake (#730)

diff --git a/docs/docs/components/manifold-plan-selector.md b/docs/docs/components/manifold-plan-selector.md
@@ -47,17 +47,17 @@ document.addEventListener('manifold-planSelector-change', ({ detail }) => {
 //   planName: 'NVIDIA 1080TI',
 //   productLabel: 'zerosix',
 //   features: {
-//     // …
+//     free: false
 //   },
 // }
 ```
 
 The following events are emitted:
 
-| Event Name                     | Description                                                                                                                | Data                                                                                     |
-| :----------------------------- | :------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------- |
-| `manifold-planSelector-change` | Fires whenever a user makes a change.                                                                                      | `planID`, `planLabel`, `planName`, `productId`, `productLabel`, `regionId`, `regionName` |
-| `manifold-planSelector-load`   | Identical to `-update` above, but this fires once on DOM mount to set the initial state (i.e. user hasn’t interacted yet). | `planID`, `planLabel`, `planName`, `productId`, `productLabel`, `regionId`, `regionName` |
+| Event Name                     | Description                                                                                                                | Data                                                                                                 |
+| :----------------------------- | :------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------- |
+| `manifold-planSelector-change` | Fires whenever a user makes a change.                                                                                      | `planID`, `planLabel`, `planName`, `productId`, `productLabel`, `regionId`, `regionName`, `features` |
+| `manifold-planSelector-load`   | Identical to `-update` above, but this fires once on DOM mount to set the initial state (i.e. user hasn’t interacted yet). | `planID`, `planLabel`, `planName`, `productId`, `productLabel`, `regionId`, `regionName`, `features` |
 
 ## Free plans only
 

diff --git a/src/components/manifold-plan-details/manifold-plan-details.tsx b/src/components/manifold-plan-details/manifold-plan-details.tsx
@@ -18,6 +18,9 @@ interface EventDetail {
   productLabel: string | undefined;
   regionId?: string;
   regionName?: string;
+  feature?: {
+    free: boolean;
+  };
 }
 
 @Component({
@@ -48,6 +51,9 @@ export class ManifoldPlanDetails {
       productLabel: this.product && this.product.label,
       regionId: defaultRegion && defaultRegion.id,
       regionName: defaultRegion && defaultRegion.displayName,
+      feature: {
+        free: newPlan.free,
+      },
     };
 
     if (!oldPlan) {
@@ -83,6 +89,9 @@ export class ManifoldPlanDetails {
         productLabel: this.product && this.product.label,
         regionId: defaultRegion && defaultRegion.id,
         regionName: defaultRegion && defaultRegion.displayName,
+        feature: {
+          free: this.plan.free,
+        },
       };
       this.planLoad.emit(detail);
       // reset features
@@ -103,6 +112,9 @@ export class ManifoldPlanDetails {
         productLabel: this.product.label,
         regionId: defaultRegion && defaultRegion.id,
         regionName: defaultRegion && defaultRegion.displayName,
+        feature: {
+          free: this.plan.free,
+        },
       };
       this.planUpdate.emit(detail);
     }
@@ -123,6 +135,9 @@ export class ManifoldPlanDetails {
         productLabel: this.product.label,
         regionId: e.detail.value,
         regionName: defaultRegion && defaultRegion.displayName,
+        feature: {
+          free: this.plan.free,
+        },
       };
       this.planUpdate.emit(detail);
     }