SwiftUI adding to list moves all rows down problem - swift

Question

I have a main list where I have 3 sections. Third section has a list of character names that can be pinned and when pinned are added to the first two sections. However, as they are pinned the rows move down. This is a serious design flaw and can result in annoyance from the user, I can only think of using a navigation link to display on another page instead. Any other way to display it on the same page without annoying the users? As seen on the images the rows have moved below so the user has to pay enough attention and not click on the incorrect row as all rows move below, instead would it possible to keep the row in same location but move the scroll view upwards, as seen on the image below.
import SwiftUI
struct TestingListView: View {
let names = ["Ashton", "Noah", "Ben", "Theo", "Ferzardo"]
#StateObject var pinned = Pinned()
var body: some View {
NavigationView {
List {
let peopleNames = getNames(names: pinned.person)
Section(header: Text("Pinned Characters")) {
if pinned.person.count == 0 {
Text("Pin your favourite characters here")
}
ForEach(pinned.person) { thePerson in
Text(thePerson.name)
}.onDelete(perform: remove)
}
Section(header: Text("Checking pins")) {
ForEach(peopleNames, id: \.self) { pNames in
Text(pNames)
}.onDelete(perform: remove)
}
Section(header: Text("Names")) {
ForEach(names, id: \.self) { name in
let isPinned = peopleNames.contains(name)
HStack {
Text(name)
Spacer()
Image(systemName: isPinned ? "pin.fill" : "pin")
.padding([.leading, .trailing], 20)
.foregroundColor(.red)
.onTapGesture {
if !isPinned {
let data = PinnedPerson(name: name, device: "Xbox")
withAnimation(.spring()) {
pinned.person.append(data)
}
}
else {
let index = peopleNames.firstIndex(of: name)!
withAnimation(.spring()) {
pinned.person.remove(at: index)
}
}
}
}
}
}//end of section
}//.listStyle(SidebarListStyle())//list end
.navigationBarTitle("Characters")
}
}
func remove(at offsets: IndexSet) {
pinned.person.remove(atOffsets: offsets)
}
func getNames(names: [PinnedPerson]) -> [String] {
var peopleNames = [String]()
let count = names.count
for i in (0..<count) {
peopleNames.append("\(names[i].name)")
}
if names.count == 0 {
peopleNames.append("Hi")
}
return peopleNames
}
}
struct TestingListView_Previews: PreviewProvider {
static var previews: some View {
TestingListView()
}
}
struct PinnedPerson: Identifiable, Codable {
var id = UUID()
let name: String
let device: String
}
class Pinned: ObservableObject {
#Published var person = [PinnedPerson]() {
didSet {
let encoder = JSONEncoder()
if let encoded = try? encoder.encode(person) {
UserDefaults.standard.setValue(encoded, forKey: "Person")
}
}
}
init() {
if let data = UserDefaults.standard.data(forKey: "Person") {
let decoder = JSONDecoder()
if let decoded = try? decoder.decode([PinnedPerson].self, from: data) {
self.person = decoded
return
}
}
self.person = []
}
}