showMarkerDetailsSheet function

void showMarkerDetailsSheet(
  1. BuildContext context,
  2. MarkerData marker, {
  3. VoidCallback? onDelete,
})

Shows detailed information about a marker in a bottom sheet.

Implementation

void showMarkerDetailsSheet(
  BuildContext context,
  MarkerData marker, {
  VoidCallback? onDelete,
}) {
  // Use marker's custom color for UI elements.
  final markerColor = marker.color;

  showModalBottomSheet(
    context: context,
    shape: const RoundedRectangleBorder(
      borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
    ),
    builder: (sheetContext) => Padding(
      padding: const EdgeInsets.all(20.0),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Container(
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: marker.isSaving
                      ? Colors.orange.shade50
                      : markerColor.withValues(alpha: 0.1),
                  borderRadius: BorderRadius.circular(12),
                ),
                child: marker.isSaving
                    ? SizedBox(
                        width: 28,
                        height: 28,
                        child: CircularProgressIndicator(
                          strokeWidth: 3,
                          color: Colors.orange.shade600,
                        ),
                      )
                    : Icon(Icons.place, color: markerColor, size: 28),
              ),
              const SizedBox(width: 16),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      marker.title,
                      style: const TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                      ),
                      maxLines: 3,
                      overflow: TextOverflow.ellipsis,
                    ),
                    if (marker.isSaving)
                      Text(
                        'Saving...',
                        style: TextStyle(
                          fontSize: 12,
                          color: Colors.orange.shade600,
                        ),
                      )
                    else if (marker.isLocal)
                      Text(
                        'Example Location',
                        style: TextStyle(fontSize: 12, color: markerColor),
                      )
                    else
                      Text(
                        'Your Saved Place',
                        style: TextStyle(fontSize: 12, color: markerColor),
                      ),
                  ],
                ),
              ),
              IconButton(
                icon: const Icon(Icons.cloud_outlined),
                onPressed: () {
                  showWeatherDialog(
                    context: sheetContext,
                    latitude: marker.position.latitude,
                    longitude: marker.position.longitude,
                    address: marker.address,
                  );
                },
                tooltip: 'View Weather',
              ),
              IconButton(
                icon: const Icon(Icons.close),
                onPressed: () => Navigator.pop(sheetContext),
              ),
            ],
          ),
          const SizedBox(height: 16),
          const Divider(),
          const SizedBox(height: 12),

          if (marker.description.isNotEmpty) ...[
            Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Icon(Icons.notes, size: 20, color: Colors.grey.shade600),
                const SizedBox(width: 12),
                Expanded(
                  child: Text(
                    marker.description,
                    style: const TextStyle(fontSize: 14),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 12),
          ],

          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Icon(
                Icons.home_outlined,
                size: 20,
                color: marker.isSaving ? Colors.orange.shade600 : markerColor,
              ),
              const SizedBox(width: 12),
              Expanded(
                child: Text(
                  marker.address ?? 'Address not available',
                  style: TextStyle(
                    fontSize: 14,
                    color: marker.isSaving
                        ? Colors.orange.shade600
                        : marker.address != null
                        ? markerColor
                        : Colors.grey.shade500,
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 12),

          Row(
            children: [
              Icon(Icons.location_on, size: 20, color: Colors.grey.shade600),
              const SizedBox(width: 12),
              Text(
                marker.coordinates,
                style: TextStyle(fontSize: 14, color: Colors.grey.shade700),
              ),
            ],
          ),

          // Delete button for user's saved places only.
          if (!marker.isLocal && !marker.isSaving && onDelete != null) ...[
            const SizedBox(height: 20),
            const Divider(),
            const SizedBox(height: 12),
            SizedBox(
              width: double.infinity,
              child: ElevatedButton.icon(
                onPressed: () {
                  Navigator.pop(sheetContext);
                  onDelete();
                },
                icon: const Icon(Icons.delete_outline),
                label: const Text('Delete This Place'),
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.red,
                  foregroundColor: Colors.white,
                  padding: const EdgeInsets.symmetric(vertical: 12),
                ),
              ),
            ),
          ],
          const SizedBox(height: 12),
        ],
      ),
    ),
  );
}