I am trying to build a Rust app with an egui interface that loads a JSON file, put it in a sortable table. It is a simple CRUD app that let you edit the JSON.

I have 7 colums of which 5 are sortable and that works fine. Only the last two columns containing the edit button and delete button, doesn't change order with the other column, and stay in the same order as how it was loaded from JSON.

What am I missing here?

// Sort waypoints based on sort criteria
        if let Some(column_index) = self.sort_column {
            filtered_waypoints.sort_by(|a, b| {
                // Determine sorting direction
                let compare_result = match column_index {
                    0 => a
                        .lat
                        .partial_cmp(&b.lat)
                        .unwrap_or(std::cmp::Ordering::Equal),
                    1 => a
                        .lon
                        .partial_cmp(&b.lon)
                        .unwrap_or(std::cmp::Ordering::Equal),
                    2 => a.name.cmp(&b.name),
                    3 => a.location.cmp(&b.location),
                    4 => a.category.cmp(&b.category),
                    _ => std::cmp::Ordering::Equal,
                };

                // Apply sorting direction
                if self.sort_ascending {
                    compare_result
                } else {
                    compare_result.reverse()
                }
            });
        }
        // Display the waypoints in a table

        egui::ScrollArea::vertical()
            .max_height(200.0)
            .show(ui, |ui| {
                egui_extras::TableBuilder::new(ui)
                    .column(Column::auto_with_initial_suggestion(100.0)) // Lat column
                    .column(Column::auto_with_initial_suggestion(90.0)) // Lon column
                    .column(Column::auto_with_initial_suggestion(150.0)) // Name column
                    .column(Column::auto_with_initial_suggestion(150.0)) // Location column
                    .column(Column::auto_with_initial_suggestion(150.0)) // Category column
                    .column(Column::auto_with_initial_suggestion(35.0)) // Edit column
                    .column(Column::auto_with_initial_suggestion(55.0)) // Delete column
                    .resizable(true)
                    .striped(true)
                    .header(20.0, |mut row| {
                        row.col(|ui| {
                            ui.heading("Latitude");
                            self.sortable_header(ui, "Sort ", 0);
                        });
                        row.col(|ui| {
                            ui.heading("Longitude");
                            self.sortable_header(ui, "Sort ", 1);
                        });
                        row.col(|ui| {
                            ui.heading("Name");
                            self.sortable_header(ui, "Sort ", 2);
                        });
                        row.col(|ui| {
                            ui.heading("Location");
                            self.sortable_header(ui, "Sort ", 3);
                        });
                        row.col(|ui| {
                            ui.heading("Category");
                            self.sortable_header(ui, "Sort ", 4);
                        });
                        row.col(|ui| {
                            ui.heading("Edit");
                            //self.sortable_header(ui, "Sort ", 5);
                        });
                        row.col(|ui| {
                            ui.heading("Delete");
                            //self.sortable_header(ui, "Sort ", 6);
                        });
                    })
                    .body(|mut body| {
                        // Iterate through filtered waypoints
                        for (index, waypoint) in filtered_waypoints.iter().enumerate() {
                            body.row(30.0, |mut row| {
                                row.col(|ui| {
                                    ui.label(format!("{:.6}", waypoint.lat));
                                });
                                row.col(|ui| {
                                    ui.label(format!("{:.6}", waypoint.lon));
                                });
                                row.col(|ui| {
                                    ui.label(&waypoint.name);
                                });
                                row.col(|ui| {
                                    ui.label(&waypoint.location);
                                });
                                row.col(|ui| {
                                    ui.label(&waypoint.category);
                                });

                                // Edit button
                                row.col(|ui| {
                                    if ui.button("Edit").clicked() {
                                        self.edit_waypoint(index);
                                    }
                                });

                                // Delete button
                                row.col(|ui| {
                                    if ui.button("Delete").clicked() {
                                        self.delete_waypoint(index);
                                    }
                                });
                            });
                        }
                    });
            });