feat(junior): add buble for started mission

1024pix · Aug 7, 2024 · c51dce8 · c51dce8
1 parent 78f6f1b
commit c51dce8
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 10 deletions.
diff --git a/junior/app/components/mission-card/mission-card.gjs b/junior/app/components/mission-card/mission-card.gjs
@@ -1,13 +1,16 @@
 import MissionCardBackGround from './mission-card-background';
-
 <template>
   <div class="mission-card__container">
     {{#if @missionLabelStatus}}
       <div class="status">
-
         <p>{{@missionLabelStatus}}</p>
       </div>
     {{/if}}
+    {{#if @displayStartedIcon}}
+      <div class="started-icon">
+        <img src="/images/mission/icon/started-icon.svg" alt="" />
+      </div>
+    {{/if}}
 
     <div class="mission-icon">
       <img src="/images/mission/icon/area-code-{{@areaCode}}.svg" alt="" />

diff --git a/junior/app/controllers/identified/missions/list.js b/junior/app/controllers/identified/missions/list.js
@@ -14,12 +14,12 @@ export default class List extends Controller {
   }
 
   @action
-  _hasMissionStarted(missionId) {
+  hasMissionStarted(missionId) {
     return this.model.organizationLearner.startedMissionIds?.includes(missionId);
   }
 
   _getStatus(missionId) {
-    return this._hasMissionStarted(missionId) ? 'started' : 'to-start';
+    return this.hasMissionStarted(missionId) ? 'started' : 'to-start';
   }
 
   @action

diff --git a/junior/app/styles/components/mission-card/card.scss b/junior/app/styles/components/mission-card/card.scss
@@ -75,13 +75,13 @@
       }
     }
 
+    .started-icon{
+      position: absolute;
+      top: -32px;
+      left: 164px;
+    }
+
     .mission-card-bottom {
-      //display: flex;
-      //flex-direction: column;
-      //align-content: center;
-      //align-self: center;
-      //justify-content: center;
-      ////width: 200px;
       margin-top: var(--pix-spacing-2x);
 
       .mission-name {

diff --git a/junior/app/templates/identified/missions/list.hbs b/junior/app/templates/identified/missions/list.hbs
@@ -26,6 +26,7 @@
             @missionButtonLabel={{this.getMissionButtonLabel mission.id}}
             @title={{mission.name}}
             @areaCode={{mission.areaCode}}
+            @displayStartedIcon={{this.hasMissionStarted mission.id}}
           />
         {{/if}}
       </PixButton>

diff --git a/junior/public/images/mission/icon/started-icon.svg b/junior/public/images/mission/icon/started-icon.svg