Skip to content

Commit

Permalink
[Console] Refactor Console settings toggles to follow best practices (e…
Browse files Browse the repository at this point in the history 
…lastic#140902)

* Refactor settings modal labels

* Fix checks

* Update related test case

* Migrate old settings to new ones

* Refactor migrate fn to be more generic

Co-authored-by: Muhammad Ibragimov <[email protected]>
Co-authored-by: Kibana Machine <[email protected]>
  • Loading branch information
@mibragimov @kibanamachine @WafaaNasr
3 people authored and WafaaNasr committed Oct 11, 2022
1 parent caa43c4 commit ff12283
Show file tree
Hide file tree
Showing 8 changed files with 63 additions and 47 deletions.
28 changes: 14 additions & 14 deletions src/plugins/console/public/application/components/settings_modal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,9 +77,9 @@ export const DevToolsSettingsModal = (props: DevToolsSettingsModalProps) => {
const [polling, setPolling] = useState(props.settings.polling);
const [pollInterval, setPollInterval] = useState(props.settings.pollInterval);
const [tripleQuotes, setTripleQuotes] = useState(props.settings.tripleQuotes);
const [isHistoryDisabled, setIsHistoryDisabled] = useState(props.settings.isHistoryDisabled);
const [isKeyboardShortcutsDisabled, setIsKeyboardShortcutsDisabled] = useState(
props.settings.isKeyboardShortcutsDisabled
const [isHistoryEnabled, setIsHistoryEnabled] = useState(props.settings.isHistoryEnabled);
const [isKeyboardShortcutsEnabled, setIsKeyboardShortcutsEnabled] = useState(
props.settings.isKeyboardShortcutsEnabled
);

const autoCompleteCheckboxes = [
Expand Down Expand Up @@ -140,8 +140,8 @@ export const DevToolsSettingsModal = (props: DevToolsSettingsModalProps) => {
polling,
pollInterval,
tripleQuotes,
isHistoryDisabled,
isKeyboardShortcutsDisabled,
isHistoryEnabled,
isKeyboardShortcutsEnabled,
});
}

Expand All @@ -153,17 +153,17 @@ export const DevToolsSettingsModal = (props: DevToolsSettingsModalProps) => {
}, []);

const toggleKeyboardShortcuts = useCallback(
(isDisabled: boolean) => {
(isEnabled: boolean) => {
if (props.editorInstance) {
unregisterCommands(props.editorInstance);
setIsKeyboardShortcutsDisabled(isDisabled);
setIsKeyboardShortcutsEnabled(isEnabled);
}
},
[props.editorInstance]
);

const toggleSavingToHistory = useCallback(
(isDisabled: boolean) => setIsHistoryDisabled(isDisabled),
(isEnabled: boolean) => setIsHistoryEnabled(isEnabled),
[]
);

Expand Down Expand Up @@ -289,11 +289,11 @@ export const DevToolsSettingsModal = (props: DevToolsSettingsModalProps) => {
}
>
<EuiSwitch
checked={isHistoryDisabled}
checked={isHistoryEnabled}
label={
<FormattedMessage
defaultMessage="Disable saving requests to history"
id="console.settingsPage.savingRequestsToHistoryMessage"
defaultMessage="Save requests to history"
id="console.settingsPage.saveRequestsToHistoryLabel"
/>
}
onChange={(e) => toggleSavingToHistory(e.target.checked)}
Expand All @@ -309,11 +309,11 @@ export const DevToolsSettingsModal = (props: DevToolsSettingsModalProps) => {
}
>
<EuiSwitch
checked={isKeyboardShortcutsDisabled}
checked={isKeyboardShortcutsEnabled}
label={
<FormattedMessage
defaultMessage="Disable keyboard shortcuts"
id="console.settingsPage.disableKeyboardShortcutsMessage"
defaultMessage="Enable keyboard shortcuts"
id="console.settingsPage.enableKeyboardShortcutsLabel"
/>
}
onChange={(e) => toggleKeyboardShortcuts(e.target.checked)}
Expand Down
4 changes: 2 additions & 2 deletions src/plugins/console/public/application/containers/editor/legacy/console_editor/editor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -259,8 +259,8 @@ function EditorUI({ initialTextValue, setEditorInstance }: EditorProps) {
}, [settings]);

useEffect(() => {
const { isKeyboardShortcutsDisabled } = settings;
if (!isKeyboardShortcutsDisabled) {
const { isKeyboardShortcutsEnabled } = settings;
if (isKeyboardShortcutsEnabled) {
registerCommands({
senseEditor: editorInstanceRef.current!,
sendCurrentRequest,
Expand Down
4 changes: 3 additions & 1 deletion ...nsole/public/application/hooks/use_send_current_request/use_send_current_request.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,9 @@ describe('useSendCurrentRequest', () => {
(sendRequest as jest.Mock).mockReturnValue(
[{ request: {} }, { request: {} }] /* two responses to save history */
);
(mockContextValue.services.settings.toJSON as jest.Mock).mockReturnValue({});
(mockContextValue.services.settings.toJSON as jest.Mock).mockReturnValue({
isHistoryEnabled: true,
});
(mockContextValue.services.history.addToHistory as jest.Mock).mockImplementation(() => {
// Mock throwing
throw new Error('cannot save!');
Expand Down
6 changes: 3 additions & 3 deletions ...ins/console/public/application/hooks/use_send_current_request/use_send_current_request.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,9 +52,9 @@ export const useSendCurrentRequest = () => {
const results = await sendRequest({ http, requests });

let saveToHistoryError: undefined | Error;
const { isHistoryDisabled } = settings.toJSON();
const { isHistoryEnabled } = settings.toJSON();

if (!isHistoryDisabled) {
if (isHistoryEnabled) {
results.forEach(({ request: { path, method, data } }) => {
try {
history.addToHistory(path, method, data);
Expand Down Expand Up @@ -84,7 +84,7 @@ export const useSendCurrentRequest = () => {
notifications.toasts.remove(toast);
},
onDisableSavingToHistory: () => {
settings.setIsHistoryDisabled(true);
settings.setIsHistoryEnabled(false);
notifications.toasts.remove(toast);
},
}),
Expand Down
62 changes: 41 additions & 21 deletions src/plugins/console/public/services/settings.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@ export const DEFAULT_SETTINGS = Object.freeze({
tripleQuotes: true,
wrapMode: true,
autocomplete: Object.freeze({ fields: true, indices: true, templates: true, dataStreams: true }),
isHistoryDisabled: false,
isKeyboardShortcutsDisabled: false,
isHistoryEnabled: true,
isKeyboardShortcutsEnabled: true,
});

export interface DevToolsSettings {
Expand All @@ -31,8 +31,8 @@ export interface DevToolsSettings {
polling: boolean;
pollInterval: number;
tripleQuotes: boolean;
isHistoryDisabled: boolean;
isKeyboardShortcutsDisabled: boolean;
isHistoryEnabled: boolean;
isKeyboardShortcutsEnabled: boolean;
}

enum SettingKeys {
Expand All @@ -42,12 +42,32 @@ enum SettingKeys {
AUTOCOMPLETE_SETTINGS = 'autocomplete_settings',
CONSOLE_POLLING = 'console_polling',
POLL_INTERVAL = 'poll_interval',
IS_HISTORY_DISABLED = 'is_history_disabled',
IS_KEYBOARD_SHORTCUTS_DISABLED = 'is_keyboard_shortcuts_disabled',
IS_HISTORY_ENABLED = 'is_history_enabled',
IS_KEYBOARD_SHORTCUTS_ENABLED = 'is_keyboard_shortcuts_enabled',
}

export class Settings {
constructor(private readonly storage: Storage) {}
constructor(private readonly storage: Storage) {
// Migration from old settings to new ones
this.addMigrationRule('is_history_disabled', SettingKeys.IS_HISTORY_ENABLED, (value: any) => {
return !value;
});
this.addMigrationRule(
'is_keyboard_shortcuts_disabled',
SettingKeys.IS_KEYBOARD_SHORTCUTS_ENABLED,
(value: any) => {
return !value;
}
);
}

private addMigrationRule(previousKey: string, newKey: string, migration: (value: any) => any) {
const value = this.storage.get(previousKey);
if (value !== undefined) {
this.storage.set(newKey, migration(value));
this.storage.delete(previousKey);
}
}

getFontSize() {
return this.storage.get(SettingKeys.FONT_SIZE, DEFAULT_SETTINGS.fontSize);
Expand Down Expand Up @@ -94,13 +114,13 @@ export class Settings {
return true;
}

setIsHistoryDisabled(isDisabled: boolean) {
this.storage.set(SettingKeys.IS_HISTORY_DISABLED, isDisabled);
setIsHistoryEnabled(isEnabled: boolean) {
this.storage.set(SettingKeys.IS_HISTORY_ENABLED, isEnabled);
return true;
}

getIsHistoryDisabled() {
return this.storage.get(SettingKeys.IS_HISTORY_DISABLED, DEFAULT_SETTINGS.isHistoryDisabled);
getIsHistoryEnabled() {
return this.storage.get(SettingKeys.IS_HISTORY_ENABLED, DEFAULT_SETTINGS.isHistoryEnabled);
}

setPollInterval(interval: number) {
Expand All @@ -111,15 +131,15 @@ export class Settings {
return this.storage.get(SettingKeys.POLL_INTERVAL, DEFAULT_SETTINGS.pollInterval);
}

setIsKeyboardShortcutsDisabled(disable: boolean) {
this.storage.set(SettingKeys.IS_KEYBOARD_SHORTCUTS_DISABLED, disable);
setIsKeyboardShortcutsEnabled(isEnabled: boolean) {
this.storage.set(SettingKeys.IS_KEYBOARD_SHORTCUTS_ENABLED, isEnabled);
return true;
}

getIsKeyboardShortcutsDisabled() {
return this.storage.get(
SettingKeys.IS_KEYBOARD_SHORTCUTS_DISABLED,
DEFAULT_SETTINGS.isKeyboardShortcutsDisabled
SettingKeys.IS_KEYBOARD_SHORTCUTS_ENABLED,
DEFAULT_SETTINGS.isKeyboardShortcutsEnabled
);
}

Expand All @@ -131,8 +151,8 @@ export class Settings {
fontSize: parseFloat(this.getFontSize()),
polling: Boolean(this.getPolling()),
pollInterval: this.getPollInterval(),
isHistoryDisabled: Boolean(this.getIsHistoryDisabled()),
isKeyboardShortcutsDisabled: Boolean(this.getIsKeyboardShortcutsDisabled()),
isHistoryEnabled: Boolean(this.getIsHistoryEnabled()),
isKeyboardShortcutsEnabled: Boolean(this.getIsKeyboardShortcutsDisabled()),
};
}

Expand All @@ -143,17 +163,17 @@ export class Settings {
autocomplete,
polling,
pollInterval,
isHistoryDisabled,
isKeyboardShortcutsDisabled,
isHistoryEnabled,
isKeyboardShortcutsEnabled,
}: DevToolsSettings) {
this.setFontSize(fontSize);
this.setWrapMode(wrapMode);
this.setTripleQuotes(tripleQuotes);
this.setAutocomplete(autocomplete);
this.setPolling(polling);
this.setPollInterval(pollInterval);
this.setIsHistoryDisabled(isHistoryDisabled);
this.setIsKeyboardShortcutsDisabled(isKeyboardShortcutsDisabled);
this.setIsHistoryEnabled(isHistoryEnabled);
this.setIsKeyboardShortcutsEnabled(isKeyboardShortcutsEnabled);
}
}

Expand Down
2 changes: 0 additions & 2 deletions x-pack/plugins/translations/translations/fr-FR.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,6 @@
"console.settingsPage.autocompleteLabel": "Saisie semi-automatique",
"console.settingsPage.cancelButtonLabel": "Annuler",
"console.settingsPage.dataStreamsLabelText": "Flux de données",
"console.settingsPage.disableKeyboardShortcutsMessage": "Désactiver les raccourcis clavier",
"console.settingsPage.fieldsLabelText": "Champs",
"console.settingsPage.fontSizeLabel": "Taille de la police",
"console.settingsPage.historyLabel": "Historique",
Expand All @@ -274,7 +273,6 @@
"console.settingsPage.refreshInterval.everyHourTimeInterval": "Toutes les heures",
"console.settingsPage.refreshInterval.onceTimeInterval": "Une fois, au chargement de la console",
"console.settingsPage.saveButtonLabel": "Enregistrer",
"console.settingsPage.savingRequestsToHistoryMessage": "Désactiver l'enregistrement des requêtes dans l'historique",
"console.settingsPage.templatesLabelText": "Modèles",
"console.settingsPage.tripleQuotesMessage": "Utiliser des guillemets triples dans le volet de sortie",
"console.settingsPage.wrapLongLinesLabelText": "Formater les longues lignes",
Expand Down
2 changes: 0 additions & 2 deletions x-pack/plugins/translations/translations/ja-JP.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,6 @@
"console.settingsPage.autocompleteLabel": "自動入力",
"console.settingsPage.cancelButtonLabel": "キャンセル",
"console.settingsPage.dataStreamsLabelText": "データストリーム",
"console.settingsPage.disableKeyboardShortcutsMessage": "キーボードショートカットを無効にする",
"console.settingsPage.fieldsLabelText": "フィールド",
"console.settingsPage.fontSizeLabel": "フォントサイズ",
"console.settingsPage.historyLabel": "履歴",
Expand All @@ -274,7 +273,6 @@
"console.settingsPage.refreshInterval.everyHourTimeInterval": "毎時",
"console.settingsPage.refreshInterval.onceTimeInterval": "コンソールの読み込み時に1回",
"console.settingsPage.saveButtonLabel": "保存",
"console.settingsPage.savingRequestsToHistoryMessage": "履歴へのリクエストの保存を無効にしてください",
"console.settingsPage.templatesLabelText": "テンプレート",
"console.settingsPage.tripleQuotesMessage": "出力ウィンドウでは三重引用符を使用してください",
"console.settingsPage.wrapLongLinesLabelText": "長い行を改行",
Expand Down
2 changes: 0 additions & 2 deletions x-pack/plugins/translations/translations/zh-CN.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,6 @@
"console.settingsPage.autocompleteLabel": "自动完成",
"console.settingsPage.cancelButtonLabel": "取消",
"console.settingsPage.dataStreamsLabelText": "数据流",
"console.settingsPage.disableKeyboardShortcutsMessage": "禁用键盘快捷键",
"console.settingsPage.fieldsLabelText": "字段",
"console.settingsPage.fontSizeLabel": "字体大小",
"console.settingsPage.historyLabel": "历史记录",
Expand All @@ -274,7 +273,6 @@
"console.settingsPage.refreshInterval.everyHourTimeInterval": "每小时",
"console.settingsPage.refreshInterval.onceTimeInterval": "一次，控制台加载时",
"console.settingsPage.saveButtonLabel": "保存",
"console.settingsPage.savingRequestsToHistoryMessage": "禁止将请求保存到历史记录",
"console.settingsPage.templatesLabelText": "模板",
"console.settingsPage.tripleQuotesMessage": "在输出窗格中使用三重引号",
"console.settingsPage.wrapLongLinesLabelText": "长行换行",
Expand Down

0 comments on commit ff12283

Please sign in to comment.