(feat) Add daily cap to Boost Campaign creator and view - #2385

src/app/modules/boost/campaigns/campaigns.type.ts

@@ -20,6 +20,7 @@ export type Campaign = {
   end: number;
   budget: number;
   budget_type: CampaignBudgetType;
+  daily_cap: number;
 
   // Engine
   urn?: string;
@@ -31,6 +32,7 @@ export type Campaign = {
   original_campaign?: Campaign;
 
   // Read Only
+  today_impressions?: number;
   impressions?: number;
   impressions_met?: number;
   created_timestamp?: number;

src/app/modules/boost/campaigns/creator/creator.component.html

@@ -179,29 +179,29 @@
       </div>
     </div>
 
-    <div class="m-form--field">
-      <label class="m-form--field-label" for="boost-creator__budget">
-        <span i18n>Budget</span>
-        <m-tooltip icon="help" i18n
-          >Set the token budget for this campaign (1 Token = 1000
-          Impressions)</m-tooltip
-        >
-      </label>
+    <div class="m-form--fieldset">
+      <div class="m-form--field">
+        <label class="m-form--field-label" for="boost-creator__budget">
+          <span i18n>Budget</span>
+          <m-tooltip icon="help" i18n
+            >Set the token budget for this campaign (1 Token = 1000
+            Impressions)</m-tooltip
+          >
+        </label>
 
-      <div class="m-form--composite-input">
-        <input
-          id="boost-creator__budget"
-          type="number"
-          name="budget"
-          [ngModel]="campaign.budget"
-          (ngModelChange)="campaign.budget = $event; triggerPreview()"
-        />
+        <div class="m-form--composite-input">
+          <input
+            id="boost-creator__budget"
+            type="number"
+            name="budget"
+            [ngModel]="campaign.budget"
+            (ngModelChange)="campaign.budget = $event; triggerPreview()"
+          />
 
-        <span>TOKENS</span>
+          <span>TOKENS</span>
+        </div>
       </div>
-    </div>
 
-    <div class="m-form--fieldset">
       <div class="m-form--field">
         <label class="m-form--field-label">
           <span i18n>Impressions</span>
@@ -219,7 +219,8 @@
             </m-tooltip>
           </span>
         </div>
-
+      </div>
+      <div class="m-form--field">
         <label class="m-form--field-label">
           <span i18n>Avg Per Day</span>
           <m-tooltip icon="help" i18n
@@ -232,6 +233,29 @@
       </div>
     </div>
 
+    <div class="m-form--fieldset">
+      <div class="m-form--field">
+        <label class="m-form--field-label" for="boost-creator__budget">
+          <span i18n>Daily Cap</span>
+          <m-tooltip icon="help" i18n
+            >Set the maximum daily impressions</m-tooltip
+          >
+        </label>
+
+        <div class="m-form--composite-input">
+          <input
+            id="boost-creator__cap"
+            type="number"
+            name="cap"
+            [ngModel]="campaign.daily_cap"
+            (ngModelChange)="campaign.daily_cap = $event"
+          />
+
+          <span>Impressions</span>
+        </div>
+      </div>
+    </div>
+
     <div class="m-form--field">
       <button
         type="submit"

src/app/modules/boost/campaigns/creator/creator.component.ts

@@ -142,6 +142,7 @@ export class BoostCampaignsCreatorComponent implements OnInit, OnDestroy {
       start: start.getTime(),
       end: start.getTime() + 5 * 24 * 60 * 60 * 1000,
       impressions: 0,
+      daily_cap: 0,
     };
 
     this.currentError = '';

src/app/modules/boost/campaigns/list/list.component.html

@@ -32,7 +32,11 @@
             <m-tooltip icon="help" i18n>TBD</m-tooltip>
           </th>
           <th class="m-table--numeric-cell">
-            <span i18n>Impressions</span>
+            <span i18n>Total Impressions</span>
+            <m-tooltip icon="help" i18n>TBD</m-tooltip>
+          </th>
+          <th class="m-table--numeric-cell">
+            <span i18n>Daily Impressions</span>
             <m-tooltip icon="help" i18n>TBD</m-tooltip>
           </th>
           <th>
@@ -57,7 +61,14 @@
             {{ campaign.budget | number }} TK
           </td>
           <td class="m-table--numeric-cell">
-            {{ campaign.impressions | number }}
+            {{ campaign.impressions_met | number }}/{{
+              campaign.impressions | number
+            }}
+          </td>
+          <td class="m-table--numeric-cell">
+            {{ campaign.today_impressions | number }}/{{
+              campaign.daily_cap | number
+            }}
           </td>
           <td>
             <ng-container *ngIf="campaign.end > 0; else noEndTime"

src/app/modules/boost/campaigns/view/view.component.html

@@ -121,14 +121,27 @@
       </div>
     </div>
 
-    <div class="m-form--field">
-      <div class="m-form--field-label">
-        <span i18n>Budget</span>
-        <m-tooltip icon="help" i18n>TBD</m-tooltip>
+    <div class="m-form--fieldset">
+      <div class="m-form--field">
+        <div class="m-form--field-label">
+          <span i18n>Budget</span>
+          <m-tooltip icon="help" i18n>TBD</m-tooltip>
+        </div>
+
+        <div class="m-form--read-only-value">
+          <span i18n>{{ campaign.budget | number }} Tokens</span>
+        </div>
       </div>
 
-      <div class="m-form--read-only-value">
-        <span i18n>{{ campaign.budget | number }} TOKENS</span>
+      <div class="m-form--field">
+        <div class="m-form--field-label">
+          <span i18n>Daily Cap</span>
+          <m-tooltip icon="help" i18n>TBD</m-tooltip>
+        </div>
+
+        <div class="m-form--read-only-value">
+          <span i18n>{{ campaign.daily_cap | number }} Views</span>
+        </div>
       </div>
     </div>