-
-
+
+ {/* Printer selection */}
+
+
+
+
+ {printers.map(p => (
+
+ ))}
+ {selectedPrinters.size === 0 && (
+ Select at least one printer
+ )} +
+
+
@@ -674,6 +742,10 @@ function SettingsSection({
);
}
+ const assignedPrinters = getAssignedPrinters(type.id);
+ const unassignedPrinters = getUnassignedPrinters(type.id);
+ const isExpanded = expandedType === type.id;
+
return (
@@ -692,6 +764,19 @@ function SettingsSection({
{formatIntervalLabel(type.default_interval_hours, intervalType)}
+
+ )}
);
})}
@@ -850,17 +977,8 @@ export function MaintenancePage() {
},
});
- const addTypeMutation = useMutation({
- mutationFn: api.createMaintenanceType,
- onSuccess: () => {
- queryClient.invalidateQueries({ queryKey: ['maintenanceTypes'] });
- queryClient.invalidateQueries({ queryKey: ['maintenanceOverview'] });
- showToast('Maintenance type added');
- },
- onError: (error: Error) => {
- showToast(error.message, 'error');
- },
- });
+ // addTypeMutation removed - we now handle type creation with printer assignment
+ // directly in onAddType callback
const updateTypeMutation = useMutation({
mutationFn: ({ id, data }: { id: number; data: Partial<{ name: string; default_interval_hours: number; interval_type: 'hours' | 'days'; icon: string }> }) =>
@@ -900,6 +1018,29 @@ export function MaintenancePage() {
},
});
+ const assignTypeMutation = useMutation({
+ mutationFn: ({ printerId, typeId }: { printerId: number; typeId: number }) =>
+ api.assignMaintenanceType(printerId, typeId),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['maintenanceOverview'] });
+ showToast('Printer assigned');
+ },
+ onError: (error: Error) => {
+ showToast(error.message, 'error');
+ },
+ });
+
+ const removeItemMutation = useMutation({
+ mutationFn: api.removeMaintenanceItem,
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['maintenanceOverview'] });
+ showToast('Printer removed');
+ },
+ onError: (error: Error) => {
+ showToast(error.message, 'error');
+ },
+ });
+
const handlePerform = (id: number) => {
performMutation.mutate({ id });
};
@@ -1002,9 +1143,21 @@ export function MaintenancePage() {
onUpdateInterval={(id, data) =>
updateMutation.mutate({ id, data })
}
- onAddType={(data) => addTypeMutation.mutate(data)}
+ onAddType={async (data, printerIds) => {
+ // Create the type first, then assign to selected printers
+ const newType = await api.createMaintenanceType(data);
+ // Assign to each selected printer
+ for (const printerId of printerIds) {
+ await api.assignMaintenanceType(printerId, newType.id);
+ }
+ queryClient.invalidateQueries({ queryKey: ['maintenanceTypes'] });
+ queryClient.invalidateQueries({ queryKey: ['maintenanceOverview'] });
+ showToast('Maintenance type added');
+ }}
onUpdateType={(id, data) => updateTypeMutation.mutate({ id, data })}
onDeleteType={(id) => deleteTypeMutation.mutate(id)}
+ onAssignType={(printerId, typeId) => assignTypeMutation.mutate({ printerId, typeId })}
+ onRemoveItem={(itemId) => removeItemMutation.mutate(itemId)}
/>
)}
diff --git a/frontend/src/pages/PrintersPage.tsx b/frontend/src/pages/PrintersPage.tsx
index 540751f21..b859d8806 100644
--- a/frontend/src/pages/PrintersPage.tsx
+++ b/frontend/src/pages/PrintersPage.tsx
@@ -596,6 +596,7 @@ function PrinterCard({
const navigate = useNavigate();
const [showMenu, setShowMenu] = useState(false);
const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
+ const [deleteArchives, setDeleteArchives] = useState(true);
const [showEditModal, setShowEditModal] = useState(false);
const [showFileManager, setShowFileManager] = useState(false);
const [showMQTTDebug, setShowMQTTDebug] = useState(false);
@@ -685,9 +686,11 @@ function PrinterCard({
const shouldHide = hideIfDisconnected && isConnected === false;
const deleteMutation = useMutation({
- mutationFn: () => api.deletePrinter(printer.id),
+ mutationFn: (options: { deleteArchives: boolean }) =>
+ api.deletePrinter(printer.id, options.deleteArchives),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['printers'] });
+ queryClient.invalidateQueries({ queryKey: ['archives'] });
},
});
@@ -919,17 +922,64 @@ function PrinterCard({
{/* Delete Confirmation */}
{showDeleteConfirm && (
- Assigned to printers:
+ {assignedPrinters.length === 0 ? ( +No printers assigned
+ ) : ( +
+ {assignedPrinters.map(p => (
+
+ {p.printerName}
+
+
+ ))}
+
+ )}
+ {unassignedPrinters.length > 0 && (
+
+ Add:
+ {unassignedPrinters.map(p => (
+
+ ))}
+
+ )}
+
+
+
+
+
+
)}
{/* Status */}
@@ -1039,11 +1089,10 @@ function PrinterCard({
{/* Temperatures */}
{status.temperatures && viewMode === 'expanded' && (() => {
- // Determine heater states (target > 30°C means heater is actively set)
- const nozzleHeating = (status.temperatures.nozzle_target || 0) > 30 ||
- (status.temperatures.nozzle_2_target || 0) > 30;
- const bedHeating = (status.temperatures.bed_target || 0) > 30;
- const chamberHeating = (status.temperatures.chamber_target || 0) > 30;
+ // Use actual heater states from MQTT stream
+ const nozzleHeating = status.temperatures.nozzle_heating || status.temperatures.nozzle_2_heating || false;
+ const bedHeating = status.temperatures.bed_heating || false;
+ const chamberHeating = status.temperatures.chamber_heating || false;
return (
+
+
+
+
+
+
+ Delete Printer
++ Are you sure you want to delete "{printer.name}"? This will remove all connection settings. +
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/pages/ProjectDetailPage.tsx b/frontend/src/pages/ProjectDetailPage.tsx
new file mode 100644
index 000000000..d9b578fa6
--- /dev/null
+++ b/frontend/src/pages/ProjectDetailPage.tsx
@@ -0,0 +1,1016 @@
+import { useState, useRef } from 'react';
+import { useParams, useNavigate, Link } from 'react-router-dom';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+ ArrowLeft,
+ Edit3,
+ Loader2,
+ Package,
+ Clock,
+ CheckCircle,
+ XCircle,
+ ListTodo,
+ Printer,
+ ChevronRight,
+ FileText,
+ Tag,
+ Calendar,
+ AlertTriangle,
+ Save,
+ X,
+ Paperclip,
+ Upload,
+ Download,
+ Trash2,
+ File,
+ DollarSign,
+ ClipboardList,
+ Plus,
+ History,
+ FolderTree,
+ Copy,
+ Layers,
+} from 'lucide-react';
+import { api } from '../api/client';
+import type { Archive, ProjectUpdate, BOMItem, BOMItemCreate } from '../api/client';
+import { Card, CardContent } from '../components/Card';
+import { Button } from '../components/Button';
+import { useToast } from '../contexts/ToastContext';
+import { RichTextEditor } from '../components/RichTextEditor';
+
+// Project edit modal (reused from ProjectsPage)
+import { ProjectModal } from './ProjectsPage';
+
+function formatDuration(hours: number): string {
+ if (hours < 1) {
+ return `${Math.round(hours * 60)}m`;
+ }
+ const h = Math.floor(hours);
+ const m = Math.round((hours - h) * 60);
+ return m > 0 ? `${h}h ${m}m` : `${h}h`;
+}
+
+function formatFilament(grams: number): string {
+ if (grams >= 1000) {
+ return `${(grams / 1000).toFixed(2)}kg`;
+ }
+ return `${Math.round(grams)}g`;
+}
+
+function StatusBadge({ status }: { status: string }) {
+ const colors = {
+ active: 'bg-bambu-green/20 text-bambu-green',
+ completed: 'bg-blue-500/20 text-blue-400',
+ archived: 'bg-bambu-gray/20 text-bambu-gray',
+ };
+ const color = colors[status as keyof typeof colors] || colors.active;
+
+ return (
+
+ {status.charAt(0).toUpperCase() + status.slice(1)}
+
+ );
+}
+
+function StatCard({
+ icon: Icon,
+ label,
+ value,
+ subValue,
+ color = 'text-bambu-gray',
+}: {
+ icon: React.ElementType;
+ label: string;
+ value: string | number;
+ subValue?: string;
+ color?: string;
+}) {
+ return (
+
+
+
+
+ );
+}
+
+function ArchiveGrid({ archives }: { archives: Archive[] }) {
+ if (archives.length === 0) {
+ return (
+ (null);
+
+ const projectId = parseInt(id || '0', 10);
+
+ const { data: project, isLoading: projectLoading, error: projectError } = useQuery({
+ queryKey: ['project', projectId],
+ queryFn: () => api.getProject(projectId),
+ enabled: projectId > 0,
+ });
+
+ const { data: archives, isLoading: archivesLoading } = useQuery({
+ queryKey: ['project-archives', projectId],
+ queryFn: () => api.getProjectArchives(projectId),
+ enabled: projectId > 0,
+ });
+
+ const { data: bomItems, isLoading: bomLoading } = useQuery({
+ queryKey: ['project-bom', projectId],
+ queryFn: () => api.getProjectBOM(projectId),
+ enabled: projectId > 0,
+ });
+
+ const { data: timeline, isLoading: timelineLoading } = useQuery({
+ queryKey: ['project-timeline', projectId],
+ queryFn: () => api.getProjectTimeline(projectId, 20),
+ enabled: projectId > 0,
+ });
+
+ const updateMutation = useMutation({
+ mutationFn: (data: ProjectUpdate) => api.updateProject(projectId, data),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ queryClient.invalidateQueries({ queryKey: ['projects'] });
+ setShowEditModal(false);
+ setEditingNotes(false);
+ showToast('Project updated', 'success');
+ },
+ onError: (error: Error) => {
+ showToast(error.message, 'error');
+ },
+ });
+
+ const handleStartEditNotes = () => {
+ setNotesContent(project?.notes || '');
+ setEditingNotes(true);
+ };
+
+ const handleSaveNotes = () => {
+ updateMutation.mutate({ notes: notesContent });
+ };
+
+ const handleCancelNotes = () => {
+ setEditingNotes(false);
+ setNotesContent('');
+ };
+
+ const handleFileSelect = async (e: React.ChangeEvent) => {
+ const file = e.target.files?.[0];
+ if (!file) return;
+
+ setUploadingAttachment(true);
+ try {
+ await api.uploadProjectAttachment(projectId, file);
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ showToast('Attachment uploaded', 'success');
+ } catch (error) {
+ showToast((error as Error).message, 'error');
+ } finally {
+ setUploadingAttachment(false);
+ if (fileInputRef.current) {
+ fileInputRef.current.value = '';
+ }
+ }
+ };
+
+ const handleDeleteAttachment = async (filename: string) => {
+ if (!confirm('Delete this attachment?')) return;
+
+ try {
+ await api.deleteProjectAttachment(projectId, filename);
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ showToast('Attachment deleted', 'success');
+ } catch (error) {
+ showToast((error as Error).message, 'error');
+ }
+ };
+
+ const formatFileSize = (bytes: number): string => {
+ if (bytes < 1024) return `${bytes} B`;
+ if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+ return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+ };
+
+ // BOM handlers
+ const [newBomName, setNewBomName] = useState('');
+ const [newBomQty, setNewBomQty] = useState(1);
+
+ const createBomMutation = useMutation({
+ mutationFn: (data: BOMItemCreate) => api.createBOMItem(projectId, data),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['project-bom', projectId] });
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ setNewBomName('');
+ setNewBomQty(1);
+ showToast('BOM item added', 'success');
+ },
+ onError: (error: Error) => showToast(error.message, 'error'),
+ });
+
+ const updateBomMutation = useMutation({
+ mutationFn: ({ itemId, data }: { itemId: number; data: { quantity_printed: number } }) =>
+ api.updateBOMItem(projectId, itemId, data),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['project-bom', projectId] });
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ },
+ onError: (error: Error) => showToast(error.message, 'error'),
+ });
+
+ const deleteBomMutation = useMutation({
+ mutationFn: (itemId: number) => api.deleteBOMItem(projectId, itemId),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['project-bom', projectId] });
+ queryClient.invalidateQueries({ queryKey: ['project', projectId] });
+ showToast('BOM item deleted', 'success');
+ },
+ onError: (error: Error) => showToast(error.message, 'error'),
+ });
+
+ const handleAddBomItem = (e: React.FormEvent) => {
+ e.preventDefault();
+ if (!newBomName.trim()) return;
+ createBomMutation.mutate({ name: newBomName.trim(), quantity_needed: newBomQty });
+ };
+
+ const handleIncrementPrinted = (item: BOMItem) => {
+ updateBomMutation.mutate({
+ itemId: item.id,
+ data: { quantity_printed: item.quantity_printed + 1 },
+ });
+ };
+
+ const handleDeleteBomItem = (itemId: number) => {
+ if (confirm('Delete this BOM item?')) {
+ deleteBomMutation.mutate(itemId);
+ }
+ };
+
+ // Template handlers
+ const createTemplateMutation = useMutation({
+ mutationFn: () => api.createTemplateFromProject(projectId),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: ['projects'] });
+ showToast('Template created', 'success');
+ },
+ onError: (error: Error) => showToast(error.message, 'error'),
+ });
+
+ const formatTimelineDate = (timestamp: string) => {
+ const date = new Date(timestamp);
+ return date.toLocaleDateString(undefined, {
+ month: 'short',
+ day: 'numeric',
+ hour: '2-digit',
+ minute: '2-digit',
+ });
+ };
+
+ if (projectLoading) {
+ return (
+
+
+
+
+
+
+ {label}
+{value}
+ {subValue &&{subValue}
} +
+
+ );
+ }
+
+ return (
+ No prints in this project yet
+
+ {archives.map((archive) => (
+
+ {archive.thumbnail_path ? (
+ 
+ ) : (
+
+ );
+}
+
+function PriorityBadge({ priority }: { priority: string }) {
+ const config = {
+ low: { color: 'bg-gray-500/20 text-gray-400', label: 'Low' },
+ normal: { color: 'bg-blue-500/20 text-blue-400', label: 'Normal' },
+ high: { color: 'bg-orange-500/20 text-orange-400', label: 'High' },
+ urgent: { color: 'bg-red-500/20 text-red-400', label: 'Urgent' },
+ };
+ const { color, label } = config[priority as keyof typeof config] || config.normal;
+
+ return (
+
+ {priority === 'urgent' &&
+
+ )}
+
+ {/* Status overlay */}
+ {archive.status === 'failed' && (
+
+
+ )}
+ {archive.status === 'completed' && (
+
+
+ )}
+
+ {/* Name overlay on hover */}
+
+
+
+ ))}
+ {archive.print_name || 'Unknown'}
+
+
+ );
+ }
+
+ if (projectError || !project) {
+ return (
+
+
+ );
+ }
+
+ const stats = project.stats;
+ const progressPercent = stats?.progress_percent ?? 0;
+ const successRate = stats && stats.total_archives > 0
+ ? ((stats.completed_prints / stats.total_archives) * 100).toFixed(0)
+ : null;
+
+ return (
+ + {projectError ? `Error: ${(projectError as Error).message}` : 'Project not found'} +
+ +
+ {/* Breadcrumb */}
+
+
+
+ {/* Tags */}
+
+
+ Projects
+
+
+
+ {/* Header */}
+
+
+
+ {/* Progress bar (if target set) */}
+ {project.target_count && (
+
+
+
+
+
+
+
+
+
+ {project.name}
+ {project.description && ( +{project.description}
+ )} +
+ Progress
+
+ {stats?.completed_prints || 0} / {project.target_count} prints
+
+
+
+
+
+
+
+
+
+ )}
+
+ {/* Sub-projects */}
+ {project.children && project.children.length > 0 && (
+
+
+
+
+
+
+ )}
+
+ {/* Parent project link */}
+ {project.parent_id && project.parent_name && (
+
+
+
+
+
+ {/* Attachments section */}
+
+
+
+
+
+ {/* BOM Section */}
+
+
+
+
+
+ {/* Timeline Section */}
+
+
+
+
+
+ {/* Template action */}
+ {!project.is_template && (
+
+
+
+
+ )}
+
+ {/* Archives section */}
+ setShowEditModal(false)}
+ onSave={(data) => updateMutation.mutate(data as ProjectUpdate)}
+ isLoading={updateMutation.isPending}
+ />
+ )}
+
+ );
+}
diff --git a/frontend/src/pages/ProjectsPage.tsx b/frontend/src/pages/ProjectsPage.tsx
index 9d7161709..4f487d2bc 100644
--- a/frontend/src/pages/ProjectsPage.tsx
+++ b/frontend/src/pages/ProjectsPage.tsx
@@ -1,4 +1,5 @@
import { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import {
FolderKanban,
@@ -9,10 +10,14 @@ import {
Archive,
ListTodo,
Package,
+ Clock,
+ CheckCircle2,
+ AlertTriangle,
+ ChevronRight,
+ MoreVertical,
} from 'lucide-react';
import { api } from '../api/client';
import type { ProjectListItem, ProjectCreate, ProjectUpdate } from '../api/client';
-import { Card, CardContent } from '../components/Card';
import { Button } from '../components/Button';
import { ConfirmModal } from '../components/ConfirmModal';
import { useToast } from '../contexts/ToastContext';
@@ -36,12 +41,15 @@ interface ProjectModalProps {
isLoading: boolean;
}
-function ProjectModal({ project, onClose, onSave, isLoading }: ProjectModalProps) {
+export function ProjectModal({ project, onClose, onSave, isLoading }: ProjectModalProps) {
const [name, setName] = useState(project?.name || '');
const [description, setDescription] = useState(project?.description || '');
const [color, setColor] = useState(project?.color || PROJECT_COLORS[0]);
const [targetCount, setTargetCount] = useState(project?.target_count?.toString() || '');
const [status, setStatus] = useState(project?.status || 'active');
+ const [tags, setTags] = useState((project as ProjectListItem & { tags?: string })?.tags || '');
+ const [dueDate, setDueDate] = useState((project as ProjectListItem & { due_date?: string })?.due_date?.split('T')[0] || '');
+ const [priority, setPriority] = useState((project as ProjectListItem & { priority?: string })?.priority || 'normal');
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
@@ -50,6 +58,9 @@ function ProjectModal({ project, onClose, onSave, isLoading }: ProjectModalProps
description: description.trim() || undefined,
color,
target_count: targetCount ? parseInt(targetCount, 10) : undefined,
+ tags: tags.trim() || undefined,
+ due_date: dueDate || undefined,
+ priority,
...(project && { status }),
});
};
@@ -124,6 +135,50 @@ function ProjectModal({ project, onClose, onSave, isLoading }: ProjectModalProps
/>
= 100 ? '#22c55e' : project.color || '#6b7280',
+ }}
+ />
+
+
+
+ {progressPercent.toFixed(0)}% complete
+
+ {project.target_count - (stats?.completed_prints || 0) > 0 && (
+
+ {project.target_count - (stats?.completed_prints || 0)} remaining
+
+ )}
+
+
+
+ )}
+
+ {/* Stats grid */}
+ {stats && (
+
+ 0 ? `${stats.failed_prints} failed` : undefined}
+ color="text-blue-400"
+ />
+
+ )}
+
+ {/* Cost tracking */}
+ {stats && (stats.estimated_cost > 0 || project.budget) && (
+
+
+
+
+
+
+ {stats.total_energy_kwh > 0 && (
+ Filament Cost
++ ${stats.estimated_cost.toFixed(2)} +
+
+
+ )}
+ {project.budget && (
+ <>
+ Energy
++ {stats.total_energy_kwh.toFixed(2)} kWh + {stats.total_energy_cost > 0 && ( + + (${stats.total_energy_cost.toFixed(2)}) + + )} +
+
+
+ Budget
+${project.budget.toFixed(2)}
+
+
+
+ )}
+ Remaining
+= 0 ? 'text-bambu-green' : 'text-red-400'}`}> + ${(project.budget - stats.estimated_cost).toFixed(2)} +
+
+
+
+ {project.children.map((child) => (
+
+
+
+
+ {child.name}
+
+ {child.status}
+
+
+ {child.progress_percent !== null && (
+
+ {child.progress_percent.toFixed(0)}%
+
+ )}
+
+ ))}
+
+
+ )}
+
+ {/* Meta info row - Tags, Due Date, Priority */}
+ {(project.tags || project.due_date || project.priority !== 'normal') && (
+
+ {/* Priority */}
+ {project.priority && project.priority !== 'normal' && (
+
+ )}
+
+ {/* Notes section */}
+
+ Priority:
+
+ )}
+
+ {/* Due Date */}
+ {project.due_date && (
+
+
+ )}
+
+ {/* Tags */}
+ {project.tags && (
+
+
+ )}
+
+ {project.tags.split(',').map((tag, index) => (
+
+ {tag.trim()}
+
+ ))}
+
+
+
+
+ {!editingNotes ? (
+
+ ) : (
+
+
+ {editingNotes ? (
+
+
+ {!editingNotes ? (
+
+ ) : (
+
+
+
+
+ )}
+ + No notes yet. Click Edit to add notes. +
+ )} +
+
+
+
+
+ {project.attachments && project.attachments.length > 0 ? (
+
+
+
+
+
+
+
+ {project.attachments.map((attachment) => (
+
+ ) : (
+
+
+ ))}
+
+
+
+
+ + {attachment.original_name} +
++ {formatFileSize(attachment.size)} +
+
+
+
+ + No attachments. Upload STL files, reference images, or other documents. +
+ )} +
+
+
+
+
+ {/* Add BOM item form */}
+
+
+ {bomLoading ? (
+
+
+
+
+ ) : bomItems && bomItems.length > 0 ? (
+
+ {bomItems.map((item) => (
+
+ ) : (
+
+
+ ))}
+
+
+
+
+
+ + {item.name} +
++ {item.quantity_printed} / {item.quantity_needed} printed +
+
+
+
+
+ + No parts in the bill of materials. Add parts to track what needs to be printed. +
+ )} +
+
+
+
+
+ {timelineLoading ? (
+
+
+
+
+ ) : timeline && timeline.length > 0 ? (
+
+ {timeline.slice(0, 10).map((event, index) => (
+
+ ) : (
+
+
+ ))}
+
+ {event.event_type === 'print_completed' &&
+
+
+ {event.title}
+ {event.description && ( +{event.description}
+ )} +{formatTimelineDate(event.timestamp)}
++ No activity yet. +
+ )} +
+
+
+ )}
+
+ {/* Queue section */}
+ {stats && (stats.queued_prints > 0 || stats.in_progress_prints > 0) && (
+
+
+
+
+ View all
+
+
+
+
+
+ View all
+
+
+ {stats.in_progress_prints > 0 && (
+
+ {stats.in_progress_prints} printing
+
+ )}
+ {stats.queued_prints > 0 && (
+
+ {stats.queued_prints} queued
+
+ )}
+
+
+
+
+ {/* Edit Modal */}
+ {showEditModal && (
+
+
+
+
+ {archivesLoading ? (
+
+
+
+
+ ) : (
+
+
+ setTags(e.target.value)}
+ className="w-full bg-bambu-dark border border-bambu-dark-tertiary rounded px-3 py-2 text-white placeholder-bambu-gray focus:outline-none focus:border-bambu-green"
+ placeholder="e.g., voron, functional, gift"
+ />
+
+
+ {/* Due Date and Priority in a row */}
+
+
+
{project && (
+
+ setDueDate(e.target.value)}
+ className="w-full bg-bambu-dark border border-bambu-dark-tertiary rounded px-3 py-2 text-white focus:outline-none focus:border-bambu-green"
+ />
+
+
+
+
+
+