From b7d11d3130d4712b5c145061301c283938c47a4f Mon Sep 17 00:00:00 2001 From: Dimitri Mitropoulos Date: Tue, 31 Aug 2021 00:31:08 -0400 Subject: [PATCH] fixes "Hide menu bar" setting (#3961) Co-authored-by: Opender Singh Co-authored-by: James Gatz --- .../app/common/electron-helpers.ts | 13 ++ packages/insomnia-app/app/models/request.ts | 2 +- packages/insomnia-app/app/models/settings.ts | 2 +- .../modals/request-settings-modal.tsx | 4 +- .../components/settings/boolean-setting.tsx | 53 +++++ .../app/ui/components/settings/general.tsx | 181 +++++++++--------- .../app/ui/containers/app-hooks.tsx | 2 + .../app/ui/hooks/settings-hooks.ts | 13 ++ 8 files changed, 177 insertions(+), 93 deletions(-) create mode 100644 packages/insomnia-app/app/ui/components/settings/boolean-setting.tsx create mode 100644 packages/insomnia-app/app/ui/hooks/settings-hooks.ts diff --git a/packages/insomnia-app/app/common/electron-helpers.ts b/packages/insomnia-app/app/common/electron-helpers.ts index 5fef0551d..a1afabd18 100644 --- a/packages/insomnia-app/app/common/electron-helpers.ts +++ b/packages/insomnia-app/app/common/electron-helpers.ts @@ -59,3 +59,16 @@ export function restartApp() { app.relaunch(); app.exit(); } + +export const setMenuBarVisibility = (visible: boolean) => { + const { BrowserWindow } = electron.remote || electron; + BrowserWindow.getAllWindows() + .forEach(window => { + // the `setMenuBarVisibility` signature uses `visible` semantics + window.setMenuBarVisibility(visible); + + // the `setAutoHideMenu` signature uses `hide` semantics + const hide = !visible; + window.setAutoHideMenuBar(hide); + }); +}; diff --git a/packages/insomnia-app/app/models/request.ts b/packages/insomnia-app/app/models/request.ts index 699cd7345..6c51c79a9 100644 --- a/packages/insomnia-app/app/models/request.ts +++ b/packages/insomnia-app/app/models/request.ts @@ -73,7 +73,7 @@ export interface RequestBody { params?: RequestBodyParameter[]; } -interface BaseRequest { +export interface BaseRequest { url: string; name: string; description: string; diff --git a/packages/insomnia-app/app/models/settings.ts b/packages/insomnia-app/app/models/settings.ts index 92b85f911..9d9851a44 100644 --- a/packages/insomnia-app/app/models/settings.ts +++ b/packages/insomnia-app/app/models/settings.ts @@ -16,7 +16,7 @@ export interface PluginConfig { export type PluginConfigMap = Record; -interface BaseSettings { +export interface BaseSettings { autoHideMenuBar: boolean; autocompleteDelay: number; deviceId: string | null; diff --git a/packages/insomnia-app/app/ui/components/modals/request-settings-modal.tsx b/packages/insomnia-app/app/ui/components/modals/request-settings-modal.tsx index 5dd7834b9..0556f0a7e 100644 --- a/packages/insomnia-app/app/ui/components/modals/request-settings-modal.tsx +++ b/packages/insomnia-app/app/ui/components/modals/request-settings-modal.tsx @@ -7,7 +7,7 @@ import { HandleGetRenderContext, HandleRender } from '../../../common/render'; import * as models from '../../../models'; import { GrpcRequest, isGrpcRequest } from '../../../models/grpc-request'; import * as requestOperations from '../../../models/helpers/request-operations'; -import type { Request } from '../../../models/request'; +import type { BaseRequest, Request } from '../../../models/request'; import { isWorkspace, Workspace } from '../../../models/workspace'; import DebouncedInput from '../base/debounced-input'; import Modal from '../base/modal'; @@ -232,7 +232,7 @@ class RequestSettingsModal extends PureComponent { this.modal?.hide(); } - renderCheckboxInput(setting: string) { + renderCheckboxInput(setting: keyof BaseRequest) { const { request } = this.state; if (!request) { diff --git a/packages/insomnia-app/app/ui/components/settings/boolean-setting.tsx b/packages/insomnia-app/app/ui/components/settings/boolean-setting.tsx new file mode 100644 index 000000000..aac15347d --- /dev/null +++ b/packages/insomnia-app/app/ui/components/settings/boolean-setting.tsx @@ -0,0 +1,53 @@ +import React, { ChangeEvent, FC, useCallback } from 'react'; +import { useSelector } from 'react-redux'; + +import * as models from '../../../models/index'; +import { BaseSettings } from '../../../models/settings'; +import { selectSettings } from '../../redux/selectors'; +import HelpTooltip from '../help-tooltip'; +import Tooltip from '../tooltip'; + +export const BooleanSetting: FC<{ + label: string; + setting: keyof BaseSettings; + help?: string; + forceRestart?: boolean; +}> = ({ + label, + setting, + help, + forceRestart, +}) => { + const settings = useSelector(selectSettings); + + if (!settings.hasOwnProperty(setting)) { + throw new Error(`Invalid boolean setting name ${setting}`); + } + + const onChange = useCallback(async (event: ChangeEvent) => { + const { checked } = event.currentTarget; + await models.settings.patch({ + [setting]: checked, + }); + }, [setting]); + + return ( +
+ +
+ ); +}; diff --git a/packages/insomnia-app/app/ui/components/settings/general.tsx b/packages/insomnia-app/app/ui/components/settings/general.tsx index b47bafd5e..7c2ec66f4 100644 --- a/packages/insomnia-app/app/ui/components/settings/general.tsx +++ b/packages/insomnia-app/app/ui/components/settings/general.tsx @@ -34,7 +34,7 @@ import * as globalActions from '../../redux/modules/global'; import Link from '../base/link'; import CheckForUpdatesButton from '../check-for-updates-button'; import HelpTooltip from '../help-tooltip'; -import Tooltip from '../tooltip'; +import { BooleanSetting } from './boolean-setting'; // Font family regex to match certain monospace fonts that don't get // recognized as monospace @@ -109,11 +109,6 @@ class General extends PureComponent { restartApp(); } - async _handleFontSizeChange(el: React.SyntheticEvent) { - const settings = await this._handleUpdateSetting(el); - setFont(settings); - } - async _handleFontChange(el: React.SyntheticEvent) { const settings = await this._handleUpdateSetting(el); setFont(settings); @@ -158,30 +153,6 @@ class General extends PureComponent { ); } - renderBooleanSetting(label: string, name: string, help?: string, forceRestart?: boolean) { - const { settings } = this.props; - - if (!settings.hasOwnProperty(name)) { - throw new Error(`Invalid boolean setting name ${name}`); - } - - const onChange = forceRestart ? this._handleUpdateSettingAndRestart : this._handleUpdateSetting; - return ( -
- -
- ); - } - renderTextSetting(label: string, name: string, help: string, props: Record) { const { settings } = this.props; @@ -217,17 +188,31 @@ class General extends PureComponent {
- {this.renderBooleanSetting('Use bulk header editor', 'useBulkHeaderEditor', '')} - {this.renderBooleanSetting( - 'Vertical request/response layout', - 'forceVerticalLayout', - '', - )} + +
- {this.renderBooleanSetting('Reveal passwords', 'showPasswords', '')} - {!isMac() && this.renderBooleanSetting('Hide menu bar', 'autoHideMenuBar', '', true)} - {this.renderBooleanSetting('Raw template syntax', 'nunjucksPowerUserMode', '', true)} + + {!isMac() && ( + + )} +
@@ -266,10 +251,19 @@ class General extends PureComponent {
- {this.renderBooleanSetting('Indent with tabs', 'editorIndentWithTabs', '')} - {this.renderBooleanSetting('Wrap text editor lines', 'editorLineWrapping', '')} + +
-
{this.renderBooleanSetting('Font ligatures', 'fontVariantLigatures', '')}
+
@@ -300,7 +294,7 @@ class General extends PureComponent { {this.renderNumberSetting('Interface Font Size (px)', 'fontSize', '', { min: MIN_INTERFACE_FONT_SIZE, max: MAX_INTERFACE_FONT_SIZE, - onBlur: this._handleFontSizeChange, + onBlur: this._handleFontChange, })}
@@ -371,23 +365,29 @@ class General extends PureComponent {
- {this.renderBooleanSetting('Validate certificates', 'validateSSL', '')} - {this.renderBooleanSetting('Follow redirects', 'followRedirects', '')} - {this.renderBooleanSetting( - 'Filter responses by environment', - 'filterResponsesByEnv', - 'Only show responses that were sent under the currently-active environment. This ' + - 'adds additional separation when working with Development, Staging, Production ' + - 'environments, for example.', - )} + + +
- {this.renderBooleanSetting('Disable JS in HTML preview', 'disableHtmlPreviewJs', '')} - {this.renderBooleanSetting( - 'Disable Links in response viewer', - 'disableResponsePreviewLinks', - '', - )} + +
@@ -454,11 +454,11 @@ class General extends PureComponent {

Security

- {this.renderBooleanSetting( - 'Clear OAuth 2 session on start', - 'clearOAuth2SessionOnRestart', - 'Clears the session of the OAuth2 popup window every time Insomnia is launched', - )} +
- {this.renderBooleanSetting( - 'Automatically download and install updates', - 'updateAutomatically', - 'If disabled, you will receive a notification when a new update is available', - )} +