Window min size (#1151)

* set min widow size

* format document

* fix dialogs sizes

Author: Alberto Iannaccone

arduino-ide-extension/src/browser/dialogs/settings/settings-component.tsx

@@ -119,7 +119,7 @@ export class SettingsComponent extends React.Component<
             'Show files inside Sketches'
           )}
         </label>
-        <div className="flex-line">
+        <div className="column-container">
           <div className="column">
             <div className="flex-line">
               {nls.localize(

arduino-ide-extension/src/browser/dialogs/settings/settings-dialog.tsx

@@ -1,9 +1,12 @@
 import * as React from '@theia/core/shared/react';
-import { injectable, inject, postConstruct } from '@theia/core/shared/inversify';
+import {
+  injectable,
+  inject,
+  postConstruct,
+} from '@theia/core/shared/inversify';
 import { Widget } from '@theia/core/shared/@phosphor/widgets';
 import { Message } from '@theia/core/shared/@phosphor/messaging';
-import { DialogError, ReactWidget } from '@theia/core/lib/browser';
-import { AbstractDialog, DialogProps } from '@theia/core/lib/browser';
+import { DialogError, DialogProps, ReactWidget } from '@theia/core/lib/browser';
 import { Settings, SettingsService } from './settings';
 import { FileService } from '@theia/filesystem/lib/browser/file-service';
 import { WindowService } from '@theia/core/lib/browser/window/window-service';
@@ -12,6 +15,7 @@ import { nls } from '@theia/core/lib/common';
 import { SettingsComponent } from './settings-component';
 import { AsyncLocalizationProvider } from '@theia/core/lib/common/i18n/localization';
 import { AdditionalUrls } from '../../../common/protocol';
+import { AbstractDialog } from '../../theia/dialogs/dialogs';
 
 @injectable()
 export class SettingsWidget extends ReactWidget {
@@ -59,6 +63,7 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
     protected override readonly props: SettingsDialogProps
   ) {
     super(props);
+    this.node.classList.add('arduino-settings-dialog-container');
     this.contentNode.classList.add('arduino-settings-dialog');
     this.appendCloseButton(
       nls.localize('vscode/issueMainService/cancel', 'Cancel')
@@ -73,7 +78,9 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
     );
   }
 
-  protected override async isValid(settings: Promise<Settings>): Promise<DialogError> {
+  protected override async isValid(
+    settings: Promise<Settings>
+  ): Promise<DialogError> {
     const result = await this.settingsService.validate(settings);
     if (typeof result === 'string') {
       return result;

arduino-ide-extension/src/browser/style/dialogs.css

@@ -1,8 +1,15 @@
 .p-Widget.dialogOverlay .dialogBlock {
     border-radius: 3px;
-    padding: 0 28px;
     box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25);
-    min-height: 0px;
+    margin: 15px 20px;
+
+    /* 
+       padding (left + right) = 56px
+       margin (left + right) = 40px
+       total = padding + margin = 96px
+    */
+    max-width: calc(100% - 96px) !important;
+    padding: 0 28px;
 }
 
 .p-Widget.dialogOverlay .dialogBlock .dialogTitle {

arduino-ide-extension/src/browser/style/settings-dialog.css

@@ -1,10 +1,10 @@
-.arduino-settings-dialog {
-    width: 740px;
+.arduino-settings-dialog-container > .dialogBlock {
+    width: calc(100% - 96px);
+    max-width: 740px !important;
 }
 
 .arduino-settings-dialog .content {
     padding: 5px;
-    height: 300px;
 }
 
 .arduino-settings-dialog .flex-line {
@@ -26,8 +26,13 @@
     vertical-align: middle;
 }
 
+.arduino-settings-dialog .column-container {
+    display: flex;
+    gap: 20px;
+}
+
 .arduino-settings-dialog .stretch {
-    width: 100% !important;
+    flex: 1;
 }
 
 .arduino-settings-dialog .flex-line .theia-button.shrink {
@@ -50,14 +55,20 @@
 .additional-urls-dialog .link:hover {
     color: var(--theia-textLink-activeForeground);
 }
+
 .arduino-settings-dialog .react-tabs__tab-panel {
     padding-bottom: 25px;
 }
+
 .arduino-settings-dialog .react-tabs__tab-list {
     display: flex;
     justify-content: center;
 }
 
+.additional-urls-dialog textarea {
+    width: 100%;
+}
+
 .p-Widget.dialogOverlay .dialogBlock .dialogContent.additional-urls-dialog {
     display: block;
 }

arduino-ide-extension/src/electron-main/theia/electron-main-application.ts

@@ -30,14 +30,14 @@ import { TheiaBrowserWindowOptions } from '@theia/core/lib/electron-main/theia-e
 app.commandLine.appendSwitch('disable-http-cache');
 
 interface WorkspaceOptions {
-  file: string
-  x: number
-  y: number
-  width: number
-  height: number
-  isMaximized: boolean
-  isFullScreen: boolean
-  time: number
+  file: string;
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+  isMaximized: boolean;
+  isFullScreen: boolean;
+  time: number;
 }
 
 const WORKSPACES = 'workspaces';
@@ -147,7 +147,7 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
     if (os.isOSX) {
       app.on('open-file', async (event, uri) => {
         event.preventDefault();
-        if (uri.endsWith('.ino') && await fs.pathExists(uri)) {
+        if (uri.endsWith('.ino') && (await fs.pathExists(uri))) {
           this.openFilePromise.reject();
           await this.openSketch(dirname(uri));
         }
@@ -159,10 +159,12 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
   }
 
   protected async isValidSketchPath(uri: string): Promise<boolean | undefined> {
-    return typeof uri === 'string' && await fs.pathExists(uri);
+    return typeof uri === 'string' && (await fs.pathExists(uri));
   }
 
-  protected override async launch(params: ElectronMainExecutionParams): Promise<void> {
+  protected override async launch(
+    params: ElectronMainExecutionParams
+  ): Promise<void> {
     try {
       // When running on MacOS, we either have to wait until
       // 1. The `open-file` command has been received by the app, rejecting the promise
@@ -173,13 +175,14 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
       return;
     }
 
-    if (!os.isOSX && await this.launchFromArgs(params)) {
+    if (!os.isOSX && (await this.launchFromArgs(params))) {
       // Application has received a file in its arguments and will skip the default application launch
       return;
     }
 
     this.startup = true;
-    const workspaces: WorkspaceOptions[] | undefined = this.electronStore.get(WORKSPACES);
+    const workspaces: WorkspaceOptions[] | undefined =
+      this.electronStore.get(WORKSPACES);
     let useDefault = true;
     if (workspaces && workspaces.length > 0) {
       console.log(
@@ -198,12 +201,17 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
     }
   }
 
-  protected async launchFromArgs(params: ElectronMainExecutionParams): Promise<boolean> {
+  protected async launchFromArgs(
+    params: ElectronMainExecutionParams
+  ): Promise<boolean> {
     // Copy to prevent manipulation of original array
     const argCopy = [...params.argv];
     let uri: string | undefined;
     for (const possibleUri of argCopy) {
-      if (possibleUri.endsWith('.ino') && await this.isValidSketchPath(possibleUri)) {
+      if (
+        possibleUri.endsWith('.ino') &&
+        (await this.isValidSketchPath(possibleUri))
+      ) {
         uri = possibleUri;
         break;
       }
@@ -215,7 +223,9 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
     return false;
   }
 
-  protected async openSketch(workspace: WorkspaceOptions | string): Promise<BrowserWindow> {
+  protected async openSketch(
+    workspace: WorkspaceOptions | string
+  ): Promise<BrowserWindow> {
     const options = await this.getLastWindowOptions();
     let file: string;
     if (typeof workspace === 'object') {
@@ -229,19 +239,26 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
     } else {
       file = workspace;
     }
-    const [uri, electronWindow] = await Promise.all([this.createWindowUri(), this.createWindow(options)]);
+    const [uri, electronWindow] = await Promise.all([
+      this.createWindowUri(),
+      this.createWindow(options),
+    ]);
     electronWindow.loadURL(uri.withFragment(encodeURI(file)).toString(true));
     return electronWindow;
   }
 
-  protected override avoidOverlap(options: TheiaBrowserWindowOptions): TheiaBrowserWindowOptions {
+  protected override avoidOverlap(
+    options: TheiaBrowserWindowOptions
+  ): TheiaBrowserWindowOptions {
     if (this.startup) {
       return options;
     }
     return super.avoidOverlap(options);
   }
 
-  protected override getTitleBarStyle(config: FrontendApplicationConfig): 'native' | 'custom' {
+  protected override getTitleBarStyle(
+    config: FrontendApplicationConfig
+  ): 'native' | 'custom' {
     return 'native';
   }
 
@@ -255,8 +272,15 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
     });
   }
 
-  protected override async onSecondInstance(event: ElectronEvent, argv: string[], cwd: string): Promise<void> {
-    if (!os.isOSX && await this.launchFromArgs({ cwd, argv, secondInstance: true })) {
+  protected override async onSecondInstance(
+    event: ElectronEvent,
+    argv: string[],
+    cwd: string
+  ): Promise<void> {
+    if (
+      !os.isOSX &&
+      (await this.launchFromArgs({ cwd, argv, secondInstance: true }))
+    ) {
       // Application has received a file in its arguments
       return;
     }
@@ -268,7 +292,7 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
    *
    * @param options
    */
-   override async createWindow(
+  override async createWindow(
     asyncOptions: MaybePromise<TheiaBrowserWindowOptions> = this.getDefaultTheiaWindowOptions()
   ): Promise<BrowserWindow> {
     let options = await asyncOptions;
@@ -339,6 +363,9 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
       options.webPreferences = {};
     }
     options.webPreferences.v8CacheOptions = 'bypassHeatCheck'; // TODO: verify this. VS Code use this V8 option.
+    options.useContentSize = true;
+    options.minWidth = 680;
+    options.minHeight = 565;
     return options;
   }
 
@@ -456,8 +483,8 @@ export class ElectronMainApplication extends TheiaElectronMainApplication {
           isMaximized: window.isMaximized(),
           isFullScreen: window.isFullScreen(),
           file: workspaceUri.fsPath,
-          time: now
-        })
+          time: now,
+        });
       }
     });
   }