this repo has no description
fix: calendar ui view
+27
-17
+27
-17
mast-react-vite/src/components/ui/task.tsx
+27
-17
mast-react-vite/src/components/ui/task.tsx
···
6
6
import { TaskDetailView } from "@/components/ui/task-detail-view";
7
7
import { useIsMobile } from "@/hooks/use-mobile";
8
8
import { motion, animate, AnimatePresence } from "motion/react";
9
-
import { Flag } from "lucide-react";
9
+
import { Flag, Calendar } from "lucide-react";
10
10
11
11
interface TaskProps {
12
12
selected?: boolean;
···
64
64
const hasPreviewPriority = hasPreview && data.preview.priority !== undefined;
65
65
const displayPriority = hasPreviewPriority ? data.preview.priority : data.priority;
66
66
const isPreviewPriority = hasPreviewPriority && data.priority !== data.preview.priority;
67
+
68
+
// Handle due date display with preview
69
+
const hasPreviewDue = hasPreview && data.preview.due !== undefined;
70
+
const displayDue = hasPreviewDue ? data.preview.due : data.due;
71
+
const isPreviewDue = hasPreviewDue && data.due !== data.preview.due;
67
72
68
73
const getStateStyles = (status) => {
69
74
switch (status) {
···
188
193
<div className="flex-1 min-w-0">
189
194
{/* Priority flag icon in top right */}
190
195
{displayPriority && (
191
-
<div className={`absolute top-0 right-0 ${data.completed === 2 || isPreviewPriority ? 'text-yellow-600' : 'text-red-500'}`} title="Priority task">
192
-
<Flag className="w-5 h-5" fill="currentColor" />
196
+
<div className={`absolute -top-1 -right-1 ${data.completed === 2 || isPreviewPriority ? 'text-yellow-600' : 'text-red-500'}`} title="Priority task">
197
+
<Flag className="w-4 h-4" fill="currentColor" />
193
198
</div>
194
199
)}
195
200
{!displayPriority && (
196
-
<div className={`absolute top-0 right-0 ${data.completed === 2 || isPreviewPriority ? 'text-yellow-600' : 'text-gray-300'}`} title="Normal priority">
197
-
<Flag className="w-5 h-5" />
201
+
<div className={`absolute -top-1 -right-1 ${data.completed === 2 || isPreviewPriority ? 'text-yellow-600' : 'text-gray-300'}`} title="Normal priority">
202
+
<Flag className="w-4 h-4" />
203
+
</div>
204
+
)}
205
+
206
+
{/* Display due date in bottom right */}
207
+
{(data.due || (hasPreview && data.preview.due)) && (
208
+
<div className={`absolute ${displayProject ? 'bottom-0' : 'top-6'} right-0 text-xs flex items-center gap-1 border rounded px-1 py-0.5 ${
209
+
data.completed === 2 || isPreviewDue
210
+
? 'text-yellow-600 border-yellow-400 bg-yellow-100'
211
+
: 'text-muted-foreground border-gray-300'
212
+
}`}>
213
+
<Calendar className="w-3.5 h-3.5" />
214
+
<span>{displayDue}</span>
198
215
</div>
199
216
)}
200
217
<div className="flex items-center gap-1 relative ml-[-0.5rem]">
···
214
231
{displayDescription}
215
232
</p>
216
233
<div className="-mt-2.5">
217
-
<TagList
218
-
tags={tagList}
219
-
previewTags={previewTags}
220
-
status={data.completed}
221
-
/>
234
+
<TagList
235
+
tags={tagList}
236
+
previewTags={previewTags}
237
+
status={data.completed}
238
+
/>
222
239
</div>
223
-
{/* Display due date if it exists (either from original data or preview) */}
224
-
{(data.due || (hasPreview && data.preview.due)) && (
225
-
<div className="text-xs text-muted-foreground flex items-center gap-1">
226
-
<span>@</span>
227
-
<span>{hasPreview && data.preview.due ? data.preview.due : data.due}</span>
228
-
</div>
229
-
)}
230
240
</div>
231
241
</div>
232
242
</div>