dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-19 08:26:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

query - saving to local storage

Browse Source
This commit is contained in:
Jan Prochazka
2020-04-04 21:22:30 +02:00
parent 93cacafa4b
commit 3df4e9b7dc
6 changed files with 60 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
packages/web/src/tabs/QueryTab.js
View File

@@ -1,23 +1,47 @@
import React from 'react';
import ReactDOM from 'react-dom';
import _ from 'lodash';
import engines from '@dbgate/engines';
import useTableInfo from '../utility/useTableInfo';
import useConnectionInfo from '../utility/useConnectionInfo';
import SqlEditor from '../sqleditor/SqlEditor';
import { useUpdateDatabaseForTab } from '../utility/globalState';
import QueryToolbar from '../query/QueryToolbar';
export default function QueryTab({ conid, database, schemaName, pureName, tabVisible }) {
const [queryText, setQueryText] = React.useState('');
// const tableInfo = useTableInfo({ conid, database, schemaName, pureName });
// const connnection = useConnectionInfo(conid);
// if (!connnection || !tableInfo) return null;
// // console.log(tableInfo);
export default function QueryTab({ tabid, conid, database, tabVisible, toolbarPortalRef }) {
const localStorageKey = `sql_${tabid}`;
const [queryText, setQueryText] = React.useState(() => localStorage.getItem(localStorageKey) || '');
const queryTextRef = React.useRef(queryText);
// const driver = engines(connnection.engine);
// const dmp = driver.createDumper();
// if (tableInfo) dmp.createTable(tableInfo);
const saveToStorage = React.useCallback(() => localStorage.setItem(localStorageKey, queryTextRef.current), [
localStorageKey,
queryTextRef,
]);
const saveToStorageDebounced = React.useMemo(() => _.debounce(saveToStorage, 5000), [saveToStorage]);
React.useEffect(() => {
window.addEventListener('beforeunload', saveToStorage);
return () => {
window.removeEventListener('beforeunload', saveToStorage);
};
}, []);
useUpdateDatabaseForTab(tabVisible, conid, database);
const handleChange = text => {
if (text != null) queryTextRef.current = text;
setQueryText(text);
saveToStorageDebounced();
};
return <SqlEditor value={queryText} onChange={handleChange} tabVisible={tabVisible} />;
return (
<>
<SqlEditor value={queryText} onChange={handleChange} tabVisible={tabVisible} />
{toolbarPortalRef &&
toolbarPortalRef.current &&
tabVisible &&
ReactDOM.createPortal(<QueryToolbar />, toolbarPortalRef.current)}
</>
);
}