Client - display HA record icon depending on user preferences

fittrackee_client/src/components/Dashboard/UserCalendar/CalendarCells.vue

@@ -14,6 +14,7 @@
         <CalendarWorkouts
           :workouts="filterWorkouts(day, workouts)"
           :sports="sports"
+          :displayHARecord="displayHARecord"
         />
         <div class="calendar-cell-day">
           {{ format(day, 'd') }}
@@ -34,6 +35,7 @@
 
   interface Props {
     currentDay: Date
+    displayHARecord: boolean
     endDate: Date
     sports: ISport[]
     startDate: Date
@@ -45,6 +47,7 @@
 
   const {
     currentDay,
+    displayHARecord,
     endDate,
     sports,
     startDate,

fittrackee_client/src/components/Dashboard/UserCalendar/CalendarWorkout.vue

@@ -16,9 +16,11 @@
         class="fa fa-trophy custom-fa-small"
         aria-hidden="true"
         :title="
-          workout.records.map(
+          workout.records
-            (record) => ` ${$t(`workouts.RECORD_${record.record_type}`)}`
+            .filter((record) =>
+              displayHARecord ? true : record.record_type !== 'HA'
             )
+            .map((record) => ` ${$t(`workouts.RECORD_${record.record_type}`)}`)
         "
       />
     </sup>
@@ -30,13 +32,14 @@
 
   import { IWorkout } from '@/types/workouts'
   interface Props {
+    displayHARecord: boolean
     workout: IWorkout
     sportLabel: string
     sportColor: string | null
   }
   const props = defineProps<Props>()
 
-  const { workout, sportLabel, sportColor } = toRefs(props)
+  const { displayHARecord, workout, sportLabel, sportColor } = toRefs(props)
 </script>
 
 <style lang="scss">

fittrackee_client/src/components/Dashboard/UserCalendar/CalendarWorkouts.vue

@@ -8,6 +8,7 @@
         <CalendarWorkout
           v-for="(workout, index) in workouts.slice(0, displayedWorkoutCount)"
           :key="index"
+          :displayHARecord="displayHARecord"
           :workout="workout"
           :sportLabel="getSportLabel(workout, sports)"
           :sportColor="getSportColor(workout, sports)"
@@ -46,12 +47,13 @@
   import { getDonutDatasets } from '@/utils/workouts'
 
   interface Props {
+    displayHARecord: boolean
     workouts: IWorkout[]
     sports: ISport[]
   }
   const props = defineProps<Props>()
 
-  const { workouts, sports } = toRefs(props)
+  const { displayHARecord, workouts, sports } = toRefs(props)
   const chartDatasets = computed(() => getDonutDatasets(props.workouts))
   const colors = computed(() => sportIdColors(props.sports))
   const displayedWorkoutCount = 6

fittrackee_client/src/components/Dashboard/UserCalendar/index.vue

@@ -13,6 +13,7 @@
       />
       <CalendarCells
         :currentDay="day"
+        :displayHARecord="user.display_ascent"
         :end-date="calendarDates.end"
         :sports="sports"
         :start-date="calendarDates.start"

fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutData.vue

@@ -85,7 +85,12 @@
         :strong="true"
         :useImperialUnits="useImperialUnits"
       />
-      <WorkoutRecord :workoutObject="workoutObject" recordType="HA" /><br />
+      <WorkoutRecord
+        v-if="displayHARecord"
+        :workoutObject="workoutObject"
+        recordType="HA"
+      />
+      <br />
       <span class="label"> {{ $t('workouts.DESCENT') }} </span>:
       <Distance
         :distance="workoutObject.descent"
@@ -111,10 +116,11 @@
   interface Props {
     workoutObject: IWorkoutObject
     useImperialUnits: boolean
+    displayHARecord: boolean
   }
   const props = defineProps<Props>()
 
-  const { workoutObject, useImperialUnits } = toRefs(props)
+  const { displayHARecord, workoutObject, useImperialUnits } = toRefs(props)
   const withPause = computed(
     () =>
       props.workoutObject.pauses !== '0:00:00' &&

fittrackee_client/src/components/Workout/WorkoutDetail/index.vue

@@ -23,6 +23,7 @@
         <WorkoutData
           :workoutObject="workoutObject"
           :useImperialUnits="authUser.imperial_units"
+          :displayHARecord="authUser.display_ascent"
         />
       </template>
     </Card>