[GM3Restyling] Update MessageDialog

Screenshot: https://imgur.com/a/ZjGYPIz

Bug: 325442935
Change-Id: I39da47aea2e8bbd07113a9249f4fc630756f4397
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6257993
Reviewed-by: Kim-Anh Tran <[email protected]>
Commit-Queue: Kateryna Prokopenko <[email protected]>
Auto-Submit: Kateryna Prokopenko <[email protected]>

Author: Kateryna Prokopenko

front_end/panels/profiler/ProfilesPanel.ts

@@ -61,11 +61,15 @@ const UIStrings = {
    *@description Text in Profiles Panel of a profiler tool
    */
   cantLoadProfileWhileAnother: 'Can’t load profile while another profile is being recorded.',
+  /**
+   *@description Text in Profiles Panel of a profiler tool
+   */
+  profileLoadingFailed: 'Profile loading failed',
   /**
    *@description Text in Profiles Panel of a profiler tool
    *@example {cannot open file} PH1
    */
-  profileLoadingFailedS: 'Profile loading failed: {PH1}.',
+  failReason: 'Reason: {PH1}.',
   /**
    *@description Text in Profiles Panel of a profiler tool
    *@example {2} PH1
@@ -230,7 +234,8 @@ export class ProfilesPanel extends UI.Panel.PanelWithSidebar implements DataDisp
     const error = await profileType.loadFromFile(file);
     if (error && 'message' in error) {
       void UI.UIUtils.MessageDialog.show(
-          i18nString(UIStrings.profileLoadingFailedS, {PH1: error.message}), undefined, 'profile-loading-failed');
+          i18nString(UIStrings.profileLoadingFailed), i18nString(UIStrings.failReason, {PH1: error.message}), undefined,
+          'profile-loading-failed');
     }
   }
 

front_end/ui/legacy/UIUtils.ts

@@ -1619,7 +1619,7 @@ export function createFileSelectorElement(callback: (arg0: File) => void, accept
 export const MaxLengthForDisplayedURLs = 150;
 
 export class MessageDialog {
-  static async show(message: string, where?: Element|Document, jslogContext?: string): Promise<void> {
+  static async show(header: string, message: string, where?: Element|Document, jslogContext?: string): Promise<void> {
     const dialog = new Dialog(jslogContext);
     dialog.setSizeBehavior(SizeBehavior.MEASURE_CONTENT);
     dialog.setDimmed(true);
@@ -1628,6 +1628,7 @@ export class MessageDialog {
     await new Promise(resolve => {
       const okButton = createTextButton(
           i18nString(UIStrings.ok), resolve, {jslogContext: 'confirm', variant: Buttons.Button.Variant.PRIMARY});
+      content.createChild('span', 'header').textContent = header;
       content.createChild('div', 'message').createChild('span').textContent = message;
       content.createChild('div', 'button').appendChild(okButton);
       dialog.setOutsideClickCallback(event => {