diff --git a/src/components/EntityGrid.vue b/src/components/EntityGrid.vue
index 2aa7bd0d..de7d6a12 100644
--- a/src/components/EntityGrid.vue
+++ b/src/components/EntityGrid.vue
@@ -13,7 +13,7 @@ projects, and special entities with selection. * * @author Matthew Raymer */
@keydown.enter="performSearch"
/>
-
+
+
+
+
+
+ Recently Added
+
+
+
+
+
+
+
+ Everyone Else
+
+
+
+
+
+
+
+
+
@@ -257,6 +301,35 @@ export default class EntityGrid extends Vue {
return this.entities.slice(0, maxDisplay);
}
+ /**
+ * Get the 3 most recently added contacts (when showing contacts and not searching)
+ */
+ get recentContacts(): Contact[] {
+ if (this.entityType !== "people" || this.searchTerm.trim()) {
+ return [];
+ }
+ // Entities are already sorted by date added (newest first)
+ return (this.entities as Contact[]).slice(0, 3);
+ }
+
+ /**
+ * Get the remaining contacts sorted alphabetically (when showing contacts and not searching)
+ */
+ get alphabeticalContacts(): Contact[] {
+ if (this.entityType !== "people" || this.searchTerm.trim()) {
+ return [];
+ }
+ // Skip the first 3 (recent contacts) and sort the rest alphabetically
+ // Create a copy to avoid mutating the original array
+ const remaining = (this.entities as Contact[]).slice(3);
+ return [...remaining].sort((a: Contact, b: Contact) => {
+ // Sort alphabetically by name, falling back to DID if name is missing
+ const nameA = (a.name || a.did).toLowerCase();
+ const nameB = (b.name || b.did).toLowerCase();
+ return nameA.localeCompare(nameB);
+ });
+ }
+
/**
* Computed empty state message based on entity type
*/