Show milliseconds for times in protocol

Author: g3force

frontend/src/components/protocol/ProtocolItem.vue

@@ -16,7 +16,10 @@ const props = defineProps<{
 const control = inject<ControlApi>('control-api')
 
 const matchTime = computed(() => {
-  return formatDurationJson(props.protocolEntry.matchTimeElapsed!)
+  return formatDurationJson(props.protocolEntry.matchTimeElapsed!, {ms: true})
+})
+const stageTime = computed(() => {
+  return formatDurationJson(props.protocolEntry.stageTimeElapsed!, {ms: true})
 })
 
 const origin = computed(() => {
@@ -73,7 +76,7 @@ function revert() {
               <span v-if="hasGameEventOrigins">)</span>
             </q-item-label>
             <q-item-label caption lines="1">
-              {{ matchTime }}
+              {{ stageTime }} ({{ matchTime }})
             </q-item-label>
           </q-item-section>
         </template>

frontend/src/helpers/index.ts

@@ -120,10 +120,10 @@ export const getRemainingStages = function (fromStage: Referee_StageJson): Refer
   return stages.slice(idx)
 }
 
-export const formatDurationJson = function (duration: DurationJson): string {
+export const formatDurationJson = function (duration: DurationJson, options: { ms: boolean } = {ms: false}): string {
   const dur = fromJson(DurationSchema, duration)
   const milliseconds = Number(dur.seconds) * 1000 + dur.nanos / 1000000
-  return formatDuration(milliseconds)
+  return formatDuration(milliseconds, options)
 }
 
 export const durationSeconds = function (duration: DurationJson): number {