diff --git a/apps/zui/src/components/zed-editor-handler.ts b/apps/zui/src/components/zed-editor-handler.ts index 5bdb145cf0..b4f3af9725 100644 --- a/apps/zui/src/components/zed-editor-handler.ts +++ b/apps/zui/src/components/zed-editor-handler.ts @@ -1,5 +1,14 @@ export class ZedEditorHandler { - constructor(public monaco, public editor) {} + public monaco + public editor + public props + + onMount(editor, monaco) { + this.editor = editor + this.monaco = monaco + if (this.props.autoFocus) editor.focus() + this.setErrors(this.props.markers) + } focus() { if (!this.mounted) return diff --git a/apps/zui/src/components/zed-editor.tsx b/apps/zui/src/components/zed-editor.tsx index 2e74a9beba..f05e53c910 100644 --- a/apps/zui/src/components/zed-editor.tsx +++ b/apps/zui/src/components/zed-editor.tsx @@ -1,5 +1,5 @@ -import {Editor, useMonaco} from "@monaco-editor/react" -import {useEffect, useMemo, useRef} from "react" +import {Editor} from "@monaco-editor/react" +import {useEffect, useRef} from "react" import {useSelector} from "react-redux" import {cmdOrCtrl} from "src/app/core/utils/keyboard" import Config from "src/js/state/Config" @@ -34,23 +34,19 @@ export function ZedEditor(props: { autoFocus?: boolean markers?: Marker[] }) { - const ref = useRef() const {isDark} = useColorScheme() - const monaco = useMonaco() - const handler = useMemo( - () => new ZedEditorHandler(monaco, ref.current), - [monaco, ref.current] - ) + const handler = useRef(new ZedEditorHandler()).current + + handler.props = props - useEffect(() => handler.focus(), [props.path, props.value, handler]) - useEffect(() => handler.setErrors(props.markers), [props.markers, handler]) + useEffect(() => handler.setErrors(props.markers), [props.markers]) return ( (ref.current = editor)} + onMount={handler.onMount.bind(handler)} path={props.path} theme={isDark ? "vs-dark" : "vs-light"} value={props.value} diff --git a/apps/zui/src/domain/session/handlers/navigation.ts b/apps/zui/src/domain/session/handlers/navigation.ts index 9156e3afc8..217bea1da9 100644 --- a/apps/zui/src/domain/session/handlers/navigation.ts +++ b/apps/zui/src/domain/session/handlers/navigation.ts @@ -61,3 +61,8 @@ export const openVirusTotal = createHandler( } } ) + +export const focusEditor = createHandler("session.focusEditor", () => { + // @ts-ignore If we split tabs, or have more than one editor, rethink this + document.querySelector("[data-testid=main-editor] textarea")?.focus() +}) diff --git a/apps/zui/src/domain/session/messages.ts b/apps/zui/src/domain/session/messages.ts index 24d5cbc185..38004dd41a 100644 --- a/apps/zui/src/domain/session/messages.ts +++ b/apps/zui/src/domain/session/messages.ts @@ -20,4 +20,5 @@ export type SessionHandlers = { "session.showWhoIs": typeof handlers.showWhoIs "session.openVirusTotal": typeof handlers.openVirusTotal "session.showValueDetails": typeof handlers.showValueDetails + "session.focusEditor": typeof handlers.focusEditor } diff --git a/apps/zui/src/electron/windows/search/app-menu.ts b/apps/zui/src/electron/windows/search/app-menu.ts index de1503538c..29d460c5ab 100644 --- a/apps/zui/src/electron/windows/search/app-menu.ts +++ b/apps/zui/src/electron/windows/search/app-menu.ts @@ -201,9 +201,9 @@ export function compileTemplate( click: () => window.send("clearPins"), }, { - label: "Focus Search Bar", + label: "Focus Editor", accelerator: "CmdOrCtrl+L", - click: () => window.send("focusSearchBar"), + click: () => sendToFocusedWindow("session.focusEditor"), }, __, { diff --git a/apps/zui/src/js/state/Histogram/reducer.ts b/apps/zui/src/js/state/Histogram/reducer.ts index bdb474cf6a..1f4b0c1875 100644 --- a/apps/zui/src/js/state/Histogram/reducer.ts +++ b/apps/zui/src/js/state/Histogram/reducer.ts @@ -9,11 +9,13 @@ const slice = createSlice({ range: null as null | DateTuple, nullXCount: 0, missingXCount: 0, + canRender: true, }, reducers: { init(s) { s.nullXCount = 0 s.missingXCount = 0 + s.canRender = true }, setRange(s, a: PayloadAction) { s.range = a.payload @@ -27,6 +29,9 @@ const slice = createSlice({ setMissingXCount(s, a: PayloadAction) { s.missingXCount = a.payload }, + setCanRender(s, a: PayloadAction) { + s.canRender = a.payload + }, }, }) diff --git a/apps/zui/src/js/state/Histogram/selectors.ts b/apps/zui/src/js/state/Histogram/selectors.ts index 7c24683ebb..662a22bebe 100644 --- a/apps/zui/src/js/state/Histogram/selectors.ts +++ b/apps/zui/src/js/state/Histogram/selectors.ts @@ -8,7 +8,7 @@ export const getRange = activeTabSelect((t) => t.histogram.range) export const getInterval = activeTabSelect((t) => t.histogram.interval) export const getNullXCount = activeTabSelect((t) => t.histogram.nullXCount) - +export const getCanRender = activeTabSelect((t) => t.histogram.canRender) export const getMissingXCount = activeTabSelect( (t) => t.histogram.missingXCount ) diff --git a/apps/zui/src/views/histogram-pane/index.tsx b/apps/zui/src/views/histogram-pane/index.tsx index de8db66cd6..67e3ed3940 100644 --- a/apps/zui/src/views/histogram-pane/index.tsx +++ b/apps/zui/src/views/histogram-pane/index.tsx @@ -4,6 +4,7 @@ import Layout from "src/js/state/Layout" import {SettingsButton} from "./settings-button" import {useParentSize} from "src/util/hooks/use-parent-size" import {Histogram} from "./histogram" +import HistogramState from "src/js/state/Histogram" import {Toolbar} from "src/components/toolbar" import {Title} from "./title" import {Resizer} from "./resizer" @@ -15,8 +16,9 @@ export function HistogramPane() { const show = useSelector(Layout.getShowHistogram) const chartHeight = useSelector(Layout.getChartHeight) const parseError = useSelector(QueryInfo.getParseError) + const canRender = useSelector(HistogramState.getCanRender) const ref = useRef() - if (!show || parseError) return null + if (!show || !canRender || parseError) return null return (
PoolSettings.findWithDefaults(s, poolId) ) + function getPinRange() { const rangePin = version.pins.find( (pin: QueryPin) => @@ -77,6 +78,13 @@ export const runHistogramQuery = createHandler( //setup dispatch(Results.init({id, tabId, key, query: ""})) dispatch(Histogram.init()) + + // Check if there is a pool + if (!poolId) { + dispatch(Histogram.setCanRender(false)) + return + } + // run const range = getPinRange() || (await getPoolRange()) if (!range) diff --git a/apps/zui/src/views/session-page/editor.tsx b/apps/zui/src/views/session-page/editor.tsx index 718f68aadc..8f4664f139 100644 --- a/apps/zui/src/views/session-page/editor.tsx +++ b/apps/zui/src/views/session-page/editor.tsx @@ -27,6 +27,7 @@ export function Editor() { path={tabId} testId="main-editor" markers={markers} + autoFocus />