feat: introduce VersionWelcomeDialog

Show donate dialog after the first time a first IDE version is loaded

arduino-ide-extension/src/browser/dialogs/version-welcome-dialog.tsx

@@ -0,0 +1,104 @@
+import React from '@theia/core/shared/react';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
+import { ReactDialog } from '../theia/dialogs/dialogs';
+import { nls } from '@theia/core';
+import { DialogProps } from '@theia/core/lib/browser';
+import { WindowService } from '@theia/core/lib/browser/window/window-service';
+import { AppService } from '../app-service';
+
+@injectable()
+export class VersionWelcomeDialogProps extends DialogProps {}
+
+@injectable()
+export class VersionWelcomeDialog extends ReactDialog<void> {
+  @inject(AppService)
+  private readonly appService: AppService;
+
+  @inject(WindowService)
+  private readonly windowService: WindowService;
+
+  constructor(
+    @inject(VersionWelcomeDialogProps)
+    protected override readonly props: VersionWelcomeDialogProps
+  ) {
+    super({
+      title: nls.localize(
+        'arduino/versionWelcome/title',
+        'Welcome to a new version of the Arduino IDE!'
+      ),
+    });
+    this.node.id = 'version-welcome-dialog-container';
+    this.contentNode.classList.add('version-welcome-dialog');
+  }
+
+  protected render(): React.ReactNode {
+    return (
+      <div>
+        <p>
+          {nls.localize(
+            'arduino/versionWelcome/donateMessage',
+            'Arduino is committed to keeping software free and open-source for everyone. Your donation helps us develop new features, improve libraries, and support millions of users worldwide.'
+          )}
+        </p>
+        <p className="bold">
+          {nls.localize(
+            'arduino/versionWelcome/donateMessage2',
+            'Please consider supporting our work on the free open source Arduino IDE.'
+          )}
+        </p>
+      </div>
+    );
+  }
+
+  override get value(): void {
+    return;
+  }
+
+  private appendButtons(): void {
+    const cancelButton = this.createButton(
+      nls.localize('arduino/versionWelcome/cancelButton', 'Maybe later')
+    );
+    cancelButton.classList.add('secondary');
+    cancelButton.classList.add('cancel-button');
+    this.addAction(cancelButton, this.close.bind(this), 'click');
+    this.controlPanel.appendChild(cancelButton);
+
+    const donateButton = this.createButton(
+      nls.localize('arduino/versionWelcome/donateButton', 'Donate now')
+    );
+    this.addAction(donateButton, this.onDonateButtonClick.bind(this), 'click');
+    this.controlPanel.appendChild(donateButton);
+    donateButton.focus();
+  }
+
+  private onDonateButtonClick(): void {
+    this.openDonationPage();
+    this.close();
+  }
+
+  private readonly openDonationPage = () => {
+    const url = 'https://www.arduino.cc/en/donate';
+    this.windowService.openNewWindow(url, { external: true });
+  };
+
+  private async updateTitleVersion(): Promise<void> {
+    const appInfo = await this.appService.info();
+    const { appVersion } = appInfo;
+
+    if (appVersion) {
+      this.titleNode.innerHTML = nls.localize(
+        'arduino/versionWelcome/titleWithVersion',
+        'Welcome to the new Arduino IDE {0}!',
+        appVersion
+      );
+    }
+  }
+
+  protected override onAfterAttach(msg: Message): void {
+    this.update();
+    this.appendButtons();
+    this.updateTitleVersion();
+    super.onAfterAttach(msg);
+  }
+}