feat(QueryEditor): save current query in session storage

Author: artemmufazalov

src/store/reducers/query/query.ts

@@ -5,8 +5,13 @@ import {settingsManager} from '../../../services/settings';
 import {TracingLevelNumber} from '../../../types/api/query';
 import type {QueryAction, QueryRequestParams, QuerySettings} from '../../../types/store/query';
 import type {StreamDataChunk} from '../../../types/store/streaming';
-import {QUERIES_HISTORY_KEY} from '../../../utils/constants';
+import {
+    QUERIES_HISTORY_KEY,
+    QUERY_EDITOR_CURRENT_QUERY_KEY,
+    QUERY_EDITOR_DIRTY_KEY,
+} from '../../../utils/constants';
 import {isQueryErrorResponse} from '../../../utils/query';
+import {loadFromSessionStorage, saveToSessionStorage} from '../../../utils/sessionStorage';
 import {isNumeric} from '../../../utils/utils';
 import type {RootState} from '../../defaultStore';
 import {api} from '../api';
@@ -29,9 +34,14 @@ const queriesHistoryInitial = settingsManager.readUserSettingsValue(
 
 const sliceLimit = queriesHistoryInitial.length - MAXIMUM_QUERIES_IN_HISTORY;
 
+const rawQuery = loadFromSessionStorage(QUERY_EDITOR_CURRENT_QUERY_KEY);
+const input = rawQuery ? String(rawQuery) : '';
+
+const isDirty = Boolean(loadFromSessionStorage(QUERY_EDITOR_DIRTY_KEY));
+
 const initialState: QueryState = {
-    input: '',
-    isDirty: false,
+    input,
+    isDirty,
     history: {
         queries: queriesHistoryInitial
             .slice(sliceLimit < 0 ? 0 : sliceLimit)
@@ -50,9 +60,11 @@ const slice = createSlice({
     reducers: {
         changeUserInput: (state, action: PayloadAction<{input: string}>) => {
             state.input = action.payload.input;
+            saveToSessionStorage(QUERY_EDITOR_CURRENT_QUERY_KEY, action.payload.input);
         },
         setIsDirty: (state, action: PayloadAction<boolean>) => {
             state.isDirty = action.payload;
+            saveToSessionStorage(QUERY_EDITOR_DIRTY_KEY, action.payload);
         },
         setQueryResult: (state, action: PayloadAction<QueryResult | undefined>) => {
             state.result = action.payload;

src/utils/constants.ts

@@ -116,6 +116,10 @@ export const INVERTED_DISKS_KEY = SETTING_KEYS.INVERTED_DISKS;
 export const SAVED_QUERIES_KEY = SETTING_KEYS.SAVED_QUERIES;
 export const ASIDE_HEADER_COMPACT_KEY = SETTING_KEYS.ASIDE_HEADER_COMPACT;
 export const QUERIES_HISTORY_KEY = 'queries_history';
+
+export const QUERY_EDITOR_CURRENT_QUERY_KEY = 'query_editor_current_query';
+export const QUERY_EDITOR_DIRTY_KEY = 'query_editor_dirty';
+
 export const BINARY_DATA_IN_PLAIN_TEXT_DISPLAY = SETTING_KEYS.BINARY_DATA_IN_PLAIN_TEXT_DISPLAY;
 export const AUTO_REFRESH_INTERVAL = SETTING_KEYS.AUTO_REFRESH_INTERVAL;
 

src/utils/index.ts

@@ -17,3 +17,24 @@ export function normalizePathSlashes(path: string) {
     // (?<!:) - negative lookbehind - ignore parts that start with :
     return path.replaceAll(/(?<!:)\/\/+/g, '/');
 }
+
+export function saveToSessionStorage(key: string, value: unknown): void {
+    try {
+        sessionStorage.setItem(key, JSON.stringify(value));
+    } catch (error) {
+        console.warn('Failed to save to session storage:', error);
+    }
+}
+
+export function loadFromSessionStorage(key: string): unknown {
+    try {
+        const stored = sessionStorage.getItem(key);
+        if (!stored) {
+            return null;
+        }
+        return JSON.parse(stored);
+    } catch (error) {
+        console.warn('Failed to load from session storage:', error);
+        return null;
+    }
+}