simpler fix

site/content/examples/20-7guis/05-7guis-crud/App.svelte

@@ -2,18 +2,9 @@
 
 <script>
 	let people = [
-		{
+		{ first: 'Hans', last: 'Emil' },
-			first: 'Hans',
+		{ first: 'Max', last: 'Mustermann' },
-			last: 'Emil'
+		{ first: 'Roman', last: 'Tisch' }
-		},
-		{
-			first: 'Max',
-			last: 'Mustermann'
-		},
-		{
-			first: 'Roman',
-			last: 'Tisch'
-		}
 	];
 
 	let prefix = '';
@@ -22,18 +13,13 @@
 	let i = 0;
 
 	$: filteredPeople = prefix
-		? people.map(person => {
+		? people.filter(person => {
 			const name = `${person.last}, ${person.first}`;
-			return { matched: name.toLowerCase().startsWith(prefix.toLowerCase()), person: person };
+			return name.toLowerCase().startsWith(prefix.toLowerCase());
 		})
-		: people.map(person => Object({ matched: true, person: person }));
+		: people;
 
-	$: if (!filteredPeople[i].matched) {
+	$: selected = filteredPeople[i];
-		let newIndex = filteredPeople.findIndex(person => person.matched);
-		if (newIndex >= 0) i = newIndex;
-	}
-
-	$: selected = filteredPeople[i].person;
 
 	$: reset_inputs(selected);
 
@@ -44,7 +30,9 @@
 	}
 
 	function update() {
-		people[i] = { first, last };
+		selected.first = first;
+		selected.last = last;
+		people = people;
 	}
 
 	function remove() {
@@ -87,10 +75,8 @@
 <input placeholder="filter prefix" bind:value={prefix}>
 
 <select bind:value={i} size={5}>
-	{#each filteredPeople as { matched, person }, i}
+	{#each filteredPeople as person, i}
-		{#if matched}
 		<option value={i}>{person.last}, {person.first}</option>
-		{/if}
 	{/each}
 </select>