fix: primeng components (#80)

Author: kshitij-k-osmosys

apps/portal/src/app/features/transcript-analyzer/transcript-analyzer.component.html

@@ -1,6 +1,6 @@
 <div class="main flex justify-content-center mt-5">
   <div class="transcript-analyzer mt-3 p-6 border-round-xl">
-    <p-fileUpload
+    <p-fileupload
       name="file"
       [url]="''"
       accept=".vtt,.txt"
@@ -12,13 +12,21 @@
       [showUploadButton]="false"
       chooseLabel="{{ 'TRANSCRIPT.BUTTONS.CHOOSE' | translate }}"
       styleClass="mb-2 text-center"
-    ></p-fileUpload>
-    <p-messages severity="info" styleClass="mb-5">
-      <ng-template pTemplate class="flex justify-content-between">
-        <div>{{ 'TRANSCRIPT.UPLOAD_INFO.ACCEPTED_FILE' | translate }}</div>
-        <div class="ml-5">{{ 'TRANSCRIPT.UPLOAD_INFO.MAX_FILE_SIZE' | translate }}</div>
-      </ng-template>
-    </p-messages>
+    ></p-fileupload>
+    <div class="flex flex-column align-items-center mt-3 mb-3">
+      <p-message
+        severity="info"
+        variant="simple"
+        styleClass="text-center"
+        [text]="'TRANSCRIPT.UPLOAD_INFO.ACCEPTED_FILE' | translate"
+      ></p-message>
+      <p-message
+        severity="info"
+        variant="simple"
+        styleClass="text-center"
+        [text]="'TRANSCRIPT.UPLOAD_INFO.MAX_FILE_SIZE' | translate"
+      ></p-message>
+    </div>
     <div class="flex flex-column align-items-center mt-3 mb-3">
       <p-button (click)="summarizeTranscript()" [disabled]="!selectedFile" severity="success">{{
         'TRANSCRIPT.BUTTONS.SUMMARIZE' | translate

apps/portal/src/app/features/transcript-analyzer/transcript-analyzer.component.scss

@@ -12,6 +12,12 @@ body {
     }
   }
 
+  .p-fileupload-header {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
   .p-fileupload-content {
     padding: 32px;
   }

apps/portal/src/app/primeng.module.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { InputTextModule } from 'primeng/inputtext';
 import { ButtonModule } from 'primeng/button';
-import { MessagesModule } from 'primeng/messages';
+import { MessageModule } from 'primeng/message';
 import { ToastModule } from 'primeng/toast';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
 import { FileUploadModule } from 'primeng/fileupload';
@@ -11,7 +11,7 @@ import { TableModule } from 'primeng/table';
 const modules = [
   InputTextModule,
   ButtonModule,
-  MessagesModule,
+  MessageModule,
   ToastModule,
   ProgressSpinnerModule,
   FileUploadModule,