Update flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.html

flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.html

@@ -62,7 +62,10 @@
           </mat-form-field>
         </div>
 
-        <mat-form-field appearance="outline" class="full-width">
+        <mat-form-field appearance="outline" 
+                        class="full-width" 
+                        [class.json-valid]="validateJSON('body_template')"
+                        [class.json-invalid]="!validateJSON('body_template') && form.get('body_template')?.value">
           <mat-label>Body Template</mat-label>
           <textarea matInput 
                     [formControl]="$any(form.get('body_template'))" 
@@ -385,7 +388,10 @@
               }
             </mat-form-field>
 
-            <mat-form-field appearance="outline" class="full-width">
+            <mat-form-field appearance="outline" 
+                            class="full-width"
+                            [class.json-valid]="validateJSON('auth.token_request_body')"
+                            [class.json-invalid]="!validateJSON('auth.token_request_body') && form.get('auth.token_request_body')?.value">
               <mat-label>Token Request Body</mat-label>
               <textarea matInput 
                         formControlName="token_request_body" 
@@ -431,7 +437,10 @@
               <mat-hint>URL to refresh expired token</mat-hint>
             </mat-form-field>
 
-            <mat-form-field appearance="outline" class="full-width">
+            <mat-form-field appearance="outline" 
+                            class="full-width"
+                            [class.json-valid]="validateJSON('auth.token_refresh_body')"
+                            [class.json-invalid]="!validateJSON('auth.token_refresh_body') && form.get('auth.token_refresh_body')?.value">
               <mat-label>Refresh Request Body</mat-label>
               <textarea matInput 
                         formControlName="token_refresh_body"