Feature/improve close and save buttons of various dialogs (#5360)

* Improve close and save buttons

* Update changelog

CHANGELOG.md

@@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Moved the chart of the account detail dialog from experimental to general availability
 - Improved the dynamic numerical precision for various values in the account detail dialog
+- Improved the usability of the _Cancel_ / _Close_ and _Save_ buttons in various dialogs
 - Extended the accounts endpoint by dividend and interest
 - Refactored the portfolio performance component to standalone
 - Improved the language localization for Portuguese (`pt`)

apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html

@@ -549,7 +549,13 @@
         <ng-container i18n>Data Gathering</ng-container>
       </mat-checkbox>
     </div>
-    <button i18n mat-button type="button" (click)="onClose()">Cancel</button>
+    <button mat-button type="button" (click)="onClose()">
+      @if (assetProfileForm.dirty) {
+        <ng-container i18n>Cancel</ng-container>
+      } @else {
+        <ng-container i18n>Close</ng-container>
+      }
+    </button>
     <button
       color="primary"
       mat-flat-button

apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html

@@ -39,12 +39,18 @@
     </div>
   </div>
   <div class="justify-content-end" mat-dialog-actions>
-    <button i18n mat-button type="button" (click)="onCancel()">Cancel</button>
+    <button mat-button type="button" (click)="onCancel()">
+      @if (platformForm.dirty) {
+        <ng-container i18n>Cancel</ng-container>
+      } @else {
+        <ng-container i18n>Close</ng-container>
+      }
+    </button>
     <button
       color="primary"
       mat-flat-button
       type="submit"
-      [disabled]="!platformForm.valid"
+      [disabled]="!(platformForm.dirty && platformForm.valid)"
     >
       <ng-container i18n>Save</ng-container>
     </button>

apps/client/src/app/components/admin-tag/create-or-update-tag-dialog/create-or-update-tag-dialog.html

@@ -22,12 +22,18 @@
     </div>
   </div>
   <div class="justify-content-end" mat-dialog-actions>
-    <button i18n mat-button type="button" (click)="onCancel()">Cancel</button>
+    <button mat-button type="button" (click)="onCancel()">
+      @if (tagForm.dirty) {
+        <ng-container i18n>Cancel</ng-container>
+      } @else {
+        <ng-container i18n>Close</ng-container>
+      }
+    </button>
     <button
       color="primary"
       mat-flat-button
       type="submit"
-      [disabled]="!tagForm.valid"
+      [disabled]="!(tagForm.dirty && tagForm.valid)"
     >
       <ng-container i18n>Save</ng-container>
     </button>

apps/client/src/app/components/user-account-access/create-or-update-access-dialog/create-or-update-access-dialog.html

@@ -55,12 +55,18 @@
     }
   </div>
   <div class="justify-content-end" mat-dialog-actions>
-    <button i18n mat-button type="button" (click)="onCancel()">Cancel</button>
+    <button mat-button type="button" (click)="onCancel()">
+      @if (accessForm.dirty) {
+        <ng-container i18n>Cancel</ng-container>
+      } @else {
+        <ng-container i18n>Close</ng-container>
+      }
+    </button>
     <button
       color="primary"
       mat-flat-button
       type="submit"
-      [disabled]="!accessForm.valid"
+      [disabled]="!(accessForm.dirty && accessForm.valid)"
     >
       <ng-container i18n>Save</ng-container>
     </button>

apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html

@@ -100,12 +100,18 @@
     }
   </div>
   <div class="justify-content-end" mat-dialog-actions>
-    <button i18n mat-button type="button" (click)="onCancel()">Cancel</button>
+    <button mat-button type="button" (click)="onCancel()">
+      @if (accountForm.dirty) {
+        <ng-container i18n>Cancel</ng-container>
+      } @else {
+        <ng-container i18n>Close</ng-container>
+      }
+    </button>
     <button
       color="primary"
       mat-flat-button
       type="submit"
-      [disabled]="!accountForm.valid"
+      [disabled]="!(accountForm.dirty && accountForm.valid)"
     >
       <ng-container i18n>Save</ng-container>
     </button>

apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html

@@ -335,12 +335,18 @@
       [value]="total"
     />
     <div>
-      <button i18n mat-button type="button" (click)="onCancel()">Cancel</button>
+      <button mat-button type="button" (click)="onCancel()">
+        @if (activityForm.dirty) {
+          <ng-container i18n>Cancel</ng-container>
+        } @else {
+          <ng-container i18n>Close</ng-container>
+        }
+      </button>
       <button
         color="primary"
         mat-flat-button
         type="submit"
-        [disabled]="!activityForm.valid"
+        [disabled]="!(activityForm.dirty && activityForm.valid)"
       >
         <ng-container i18n>Save</ng-container>
       </button>