@@ -7,6 +7,8 @@ import { computed } from 'vue';
77import { useCurrentTimeEntryStore } from ' @/utils/useCurrentTimeEntry' ;
88import { getDayJsInstance } from ' @/packages/ui/src/utils/time' ;
99import type { TimeEntry } from " @/packages/api/src" ;
10+ import { useTasksStore } from " @/utils/useTasks" ;
11+ import { ChevronRightIcon } from " @heroicons/vue/16/solid" ;
1012
1113const props = defineProps <{
1214 timeEntry: TimeEntry
@@ -18,6 +20,12 @@ const project = computed(() => {
1820 return projects .value .find ((project ) => project .id === props .timeEntry .project_id );
1921});
2022
23+ const {tasks} = storeToRefs (useTasksStore ());
24+
25+ const task = computed (() => {
26+ return tasks .value .find ((task ) => task .id === props .timeEntry .task_id );
27+ });
28+
2129const { currentTimeEntry } = storeToRefs (useCurrentTimeEntryStore ());
2230const { setActiveState } = useCurrentTimeEntryStore ();
2331
@@ -46,8 +54,24 @@ async function startTaskTimer() {
4654 <span v-else class =" text-text-tertiary" >No description</span >
4755 </p >
4856 <ProjectBadge
49- :name =" project?.name ?? 'No Project'"
50- :color =" project?.color" ></ProjectBadge >
57+ size =" base"
58+ :color =" project?.color" >
59+
60+ <div class =" flex items-center lg:space-x-0.5 min-w-0" >
61+ <span class =" whitespace-nowrap " >
62+ {{ project?.name ?? 'No Project' }}
63+ </span >
64+ <ChevronRightIcon
65+ v-if =" task"
66+ class =" w-4 text-muted shrink-0" ></ChevronRightIcon >
67+ <div
68+ v-if =" task"
69+ class =" min-w-0 shrink truncate" >
70+ {{ task.name }}
71+ </div >
72+ </div >
73+
74+ </ProjectBadge >
5175 </div >
5276 <div class =" flex items-center justify-center" >
5377 <TimeTrackerStartStop
0 commit comments