fix(status-badge): update status badge

Author: nsemets

src/app/shared/components/status-badge/status-badge.component.html

@@ -1,3 +1,3 @@
-@if (label) {
-  <p-tag class="font-bold" [value]="label | translate" [severity]="severity"></p-tag>
+@if (label()) {
+  <p-tag class="font-bold" [value]="label() | translate" [severity]="severity()"></p-tag>
 }

src/app/shared/components/status-badge/status-badge.component.ts

@@ -2,11 +2,10 @@ import { TranslatePipe } from '@ngx-translate/core';
 
 import { Tag } from 'primeng/tag';
 
-import { ChangeDetectionStrategy, Component, input } from '@angular/core';
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 
 import { RegistryStatusMap } from '@osf/shared/constants/registration-statuses';
 import { RegistryStatus } from '@osf/shared/enums/registry-status.enum';
-import { TagSeverityType } from '@osf/shared/models/severity.type';
 
 @Component({
   selector: 'osf-status-badge',
@@ -18,11 +17,6 @@ import { TagSeverityType } from '@osf/shared/models/severity.type';
 export class StatusBadgeComponent {
   status = input.required<RegistryStatus>();
 
-  get label(): string {
-    return RegistryStatusMap[this.status()]?.label ?? 'Unknown';
-  }
-
-  get severity(): TagSeverityType | null {
-    return RegistryStatusMap[this.status()]?.severity ?? null;
-  }
+  label = computed(() => RegistryStatusMap[this.status()]?.label ?? 'resourceCard.type.null');
+  severity = computed(() => RegistryStatusMap[this.status()]?.severity ?? null);
 }