Fix display of private objects sometimes

src-ui/cypress/e2e/settings/settings.cy.ts

@@ -56,8 +56,6 @@ describe('settings', () => {
             'GET',
             'http://localhost:8000/api/mail_accounts/*',
             (req) => {
-              console.log(req, this.newMailAccounts)
-
               let response = { ...mailAccountsJson }
               if (this.newMailAccounts.length) {
                 response.results = response.results.concat(this.newMailAccounts)
@@ -142,7 +140,7 @@ describe('settings', () => {
     cy.get('app-saved-view-widget').contains('Inbox').should('not.exist')
   })
 
-  it('should show a list of mail accounts & rules & support creation', () => {
+  it('should show a list of mail accounts & support creation', () => {
     cy.contains('a', 'Mail').click()
     cy.get('app-settings .tab-content ul li').its('length').should('eq', 5) // 2 headers, 2 accounts, 1 rule
     cy.contains('button', 'Add Account').click()
@@ -162,6 +160,13 @@ describe('settings', () => {
       .wait('@getAccounts')
     cy.contains('Saved account')
 
+    cy.get('app-settings .tab-content ul li').its('length').should('eq', 6)
+  })
+
+  it('should show a list of mail rules & support creation', () => {
+    cy.contains('a', 'Mail').click()
+    cy.get('app-settings .tab-content ul li').its('length').should('eq', 5) // 2 headers, 2 accounts, 1 rule
+
     cy.wait(1000)
     cy.contains('button', 'Add Rule').click()
     cy.contains('Create new mail rule')
@@ -177,6 +182,6 @@ describe('settings', () => {
       .wait('@getRules')
     cy.contains('Saved rule').wait(1000)
 
-    cy.get('app-settings .tab-content ul li').its('length').should('eq', 7)
+    cy.get('app-settings .tab-content ul li').its('length').should('eq', 6)
   })
 })

src-ui/src/app/components/common/input/select/select.component.ts

@@ -27,21 +27,31 @@ export class SelectComponent extends AbstractInputComponent<number> {
   }
 
   _items: any[]
+  privateItems: any[] = []
 
   @Input()
   set items(items) {
-    if (this.value && items.find((i) => i.id === this.value) === undefined) {
+    this._items = items
-      items.push({
+    if (this.value) this.checkForPrivateItem(this.value)
-        id: this.value,
+  }
+
+  writeValue(newValue: any): void {
+    if (newValue && this._items) this.checkForPrivateItem(newValue)
+    super.writeValue(newValue)
+  }
+
+  checkForPrivateItem(value) {
+    if (this._items.find((i) => i.id === value) === undefined) {
+      this.privateItems.push({
+        id: value,
         name: $localize`Private`,
         private: true,
       })
     }
-    this._items = items
   }
 
   get items(): any[] {
-    return this._items
+    return this._items?.concat(this.privateItems)
   }
 
   @Input()