[PM-21395] Vault Nudges Bugs (#14737)

* updates to empty vault and has items nudges

libs/vault/src/components/spotlight/spotlight.component.html

@@ -4,7 +4,13 @@
   <div class="tw-flex tw-justify-between tw-items-start tw-flex-grow">
     <div>
       <h2 bitTypography="h4" class="tw-font-semibold !tw-mb-1">{{ title }}</h2>
-      <p class="tw-text-main tw-mb-0" bitTypography="body2" [innerHTML]="subtitle"></p>
+      <p
+        *ngIf="subtitle"
+        class="tw-text-main tw-mb-0"
+        bitTypography="body2"
+        [innerHTML]="subtitle"
+      ></p>
+      <ng-content *ngIf="!subtitle"></ng-content>
     </div>
     <button
       type="button"

libs/vault/src/components/spotlight/spotlight.component.ts

@@ -14,7 +14,7 @@ export class SpotlightComponent {
   // The title of the component
   @Input({ required: true }) title: string | null = null;
   // The subtitle of the component
-  @Input({ required: true }) subtitle: string | null = null;
+  @Input() subtitle?: string | null = null;
   // The text to display on the button
   @Input() buttonText?: string;
   // Wheter the component can be dismissed, if true, the component will not show a close button