@@ -7,6 +7,8 @@ import { computed } from 'vue';
7
7
import { useCurrentTimeEntryStore } from ' @/utils/useCurrentTimeEntry' ;
8
8
import { getDayJsInstance } from ' @/packages/ui/src/utils/time' ;
9
9
import type { TimeEntry } from " @/packages/api/src" ;
10
+ import { useTasksStore } from " @/utils/useTasks" ;
11
+ import { ChevronRightIcon } from " @heroicons/vue/16/solid" ;
10
12
11
13
const props = defineProps <{
12
14
timeEntry: TimeEntry
@@ -18,6 +20,12 @@ const project = computed(() => {
18
20
return projects .value .find ((project ) => project .id === props .timeEntry .project_id );
19
21
});
20
22
23
+ const {tasks} = storeToRefs (useTasksStore ());
24
+
25
+ const task = computed (() => {
26
+ return tasks .value .find ((task ) => task .id === props .timeEntry .task_id );
27
+ });
28
+
21
29
const { currentTimeEntry } = storeToRefs (useCurrentTimeEntryStore ());
22
30
const { setActiveState } = useCurrentTimeEntryStore ();
23
31
@@ -46,8 +54,24 @@ async function startTaskTimer() {
46
54
<span v-else class =" text-text-tertiary" >No description</span >
47
55
</p >
48
56
<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 >
51
75
</div >
52
76
<div class =" flex items-center justify-center" >
53
77
<TimeTrackerStartStop
0 commit comments