Handle "private" tags, doctypes, correspondents

src-ui/messages.xlf

@@ -1824,7 +1824,7 @@
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/common/input/select/select.component.html</context>
-          <context context-type="linenumber">31</context>
+          <context context-type="linenumber">32</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/common/input/tags/tags.component.html</context>
@@ -1963,10 +1963,25 @@
         <source>Add item</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/components/common/input/select/select.component.html</context>
-          <context context-type="linenumber">11</context>
+          <context context-type="linenumber">12</context>
         </context-group>
         <note priority="1" from="description">Used for both types, correspondents, storage paths</note>
       </trans-unit>
+      <trans-unit id="3686284950598311784" datatype="html">
+        <source>Private</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/components/common/input/select/select.component.ts</context>
+          <context context-type="linenumber">36</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/components/common/tag/tag.component.html</context>
+          <context context-type="linenumber">7</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/components/common/tag/tag.component.html</context>
+          <context context-type="linenumber">8</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="6560126119609945418" datatype="html">
         <source>Add tag</source>
         <context-group purpose="location">

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

@@ -5,6 +5,7 @@
         [disabled]="disabled"
         [style.color]="textColor"
         [style.background]="backgroundColor"
+        [class.private]="isPrivate"
         [clearable]="allowNull"
         [items]="items"
         [addTag]="allowCreateNew && addItemRef"

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

@@ -12,3 +12,8 @@
         }
     }
 }
+
+::ng-deep .private .ng-value-container {
+    font-style: italic;
+    opacity: .75;
+}

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

@@ -26,8 +26,23 @@ export class SelectComponent extends AbstractInputComponent<number> {
     this.addItemRef = this.addItem.bind(this)
   }
 
+  _items: any[]
+
   @Input()
-  items: any[]
+  set items(items) {
+    if (this.value && items.find((i) => i.id === this.value) === undefined) {
+      items.push({
+        id: this.value,
+        name: $localize`Private`,
+        private: true,
+      })
+    }
+    this._items = items
+  }
+
+  get items(): any[] {
+    return this._items
+  }
 
   @Input()
   textColor: any
@@ -61,6 +76,10 @@ export class SelectComponent extends AbstractInputComponent<number> {
     return this.createNew.observers.length > 0
   }
 
+  get isPrivate(): boolean {
+    return this.items.find((i) => i.id === this.value)?.private
+  }
+
   getSuggestions() {
     if (this.suggestions && this.items) {
       return this.suggestions

src-ui/src/app/components/common/tag/tag.component.html

@@ -1,2 +1,9 @@
-<span *ngIf="!clickable" class="badge" [style.background]="tag.color" [style.color]="tag.text_color">{{tag.name}}</span>
+<ng-container *ngIf="tag !== undefined; else privateTag" >
-<a [title]="linkTitle" *ngIf="clickable" class="badge" [style.background]="tag.color" [style.color]="tag.text_color">{{tag.name}}</a>
+    <span *ngIf="!clickable" class="badge" [style.background]="tag.color" [style.color]="tag.text_color">{{tag.name}}</span>
+    <a [title]="linkTitle" *ngIf="clickable" class="badge" [style.background]="tag.color" [style.color]="tag.text_color">{{tag.name}}</a>
+</ng-container>
+
+<ng-template #privateTag>
+    <span *ngIf="!clickable" class="badge private" i18n>Private</span>
+    <a [title]="linkTitle" *ngIf="clickable" class="badge private" i18n>Private</a>
+</ng-template>

src-ui/src/app/components/common/tag/tag.component.scss

@@ -4,3 +4,10 @@ a {
     word-break: break-word;
     text-align: end;
 }
+
+.private {
+    background-color: #000000;
+    color: #ffffff;
+    opacity: .5;
+    font-style: italic;
+}