diff --git a/src/components/CommandPalette/CommandPaletteContext.tsx b/src/components/CommandPalette/CommandPaletteContext.tsx index a0472d0..4c45273 100644 --- a/src/components/CommandPalette/CommandPaletteContext.tsx +++ b/src/components/CommandPalette/CommandPaletteContext.tsx @@ -12,6 +12,12 @@ export interface ActionsContext { export const CommandPaletteContext = (props: { children: JSX.Element }) => { const { appService: { toggleThemeSwitcher }, + connectionsService: { + setActiveContentTab, + setActiveConnection, + addContentTab, + removeActiveContentTab, + }, } = useAppSelector(); const actionsContext: ActionsContext = { @@ -26,7 +32,6 @@ export const CommandPaletteContext = (props: { children: JSX.Element }) => { onMount(() => { document.onkeyup = function(e: KeyboardEvent) { - console.log(e.code, e.key, e.metaKey, e.ctrlKey, e.altKey, e.shiftKey); const number = e.altKey && e.code.startsWith("Digit") ? +e.code.replace("Digit", "") @@ -43,14 +48,21 @@ export const CommandPaletteContext = (props: { children: JSX.Element }) => { e.altKey ? "select-query-tab" : "select-connection-tab", number ); + } else if ((e.ctrlKey || e.metaKey) && e.code === "KeyT") { + if (e.shiftKey) { + removeActiveContentTab(); + } else { + addContentTab(); + } } }; commandPaletteEmitter.on("select-connection-tab", (val) => { - console.log({ val, actions: "select-connection-tab" }); + setActiveConnection(val - 1); }); + commandPaletteEmitter.on("select-query-tab", (val) => { - console.log({ val, actions: "select-connection-tab" }); + setActiveContentTab(val); }); }); diff --git a/src/components/Screens/Home/Connections/ConnectionsList/ConnectionItem/ActionsMenu.tsx b/src/components/Screens/Home/Connections/ConnectionsList/ConnectionItem/ActionsMenu.tsx index ef6cd33..65abaa7 100644 --- a/src/components/Screens/Home/Connections/ConnectionsList/ConnectionItem/ActionsMenu.tsx +++ b/src/components/Screens/Home/Connections/ConnectionsList/ConnectionItem/ActionsMenu.tsx @@ -19,14 +19,14 @@ const columnsToSchema = (columns: Record[]) => { } export const ActionsMenu = (props: { connection: ConnectionConfig }) => { - const { errorService: { addError }, connectionsService: { addTab } } = useAppSelector() + const { errorService: { addError }, connectionsService: { addConnectionTab } } = useAppSelector() const onConnect = async () => { try { await invoke('init_connection', { config: props.connection }) const { result } = await invoke('get_columns', { connId: props.connection.id }); const schema = columnsToSchema(result) - await addTab({ + await addConnectionTab ({ id: props.connection.id, label: props.connection.name, schema, diff --git a/src/components/Screens/Main.tsx b/src/components/Screens/Main.tsx index dca468e..ef05706 100644 --- a/src/components/Screens/Main.tsx +++ b/src/components/Screens/Main.tsx @@ -9,7 +9,7 @@ import { Home } from "./Home/Home"; export const Main = () => { const { connectionsService: { - removeTab, + removeConnectionTab, // clearStore, connectionStore, setConnectionStore, @@ -17,7 +17,7 @@ export const Main = () => { } = useAppSelector(); const closeTab = async (id: string) => { - await removeTab(id); + await removeConnectionTab(id); }; return ( diff --git a/src/services/ConnectionTabs.ts b/src/services/ConnectionTabs.ts index 99178b5..94a2c7e 100644 --- a/src/services/ConnectionTabs.ts +++ b/src/services/ConnectionTabs.ts @@ -26,7 +26,7 @@ export const newContentTab = (label: string, key: ContentComponentKeys) => { case ContentComponent.QueryTab: return { label, - data: { query: "", executed: false, results: [] }, + data: { query: "", executed: false, results: [] }, key, }; case ContentComponent.TableStructureTab: @@ -156,7 +156,7 @@ export const ConnectionTabsService = () => { await store.save(); }, 1000); - const addTab = async (tab: ConnectionTab) => { + const addConnectionTab = async (tab: ConnectionTab) => { if (connectionStore.tabs.find((t) => t.id === tab.id)) return; setConnectionStore("tabs", connectionStore.tabs.concat(tab)); setContentStore("tabs", [ @@ -167,7 +167,7 @@ export const ConnectionTabsService = () => { updateStore(); }; - const removeTab = async (id: string) => { + const removeConnectionTab = async (id: string) => { setConnectionStore( "tabs", connectionStore.tabs.filter((t) => t.id !== id) @@ -188,6 +188,43 @@ export const ConnectionTabsService = () => { return contentStore.tabs[contentStore.idx]; }; + const addContentTab = () => { + setContentStore("tabs", [ + ...contentStore.tabs, + newContentTab("Query", ContentComponent.QueryTab), + ]); + setContentStore("idx", contentStore.tabs.length - 1); + }; + + const removeActiveConnection = () => { + if (connectionStore.tabs.length === 1) return; + setConnectionStore( + "tabs", + connectionStore.tabs.filter((_, i) => i !== connectionStore.idx) + ); + }; + + const removeActiveContentTab = () => { + if (contentStore.tabs.length === 1) return; + setContentStore( + "tabs", + contentStore.tabs.filter((_, i) => i !== contentStore.idx) + ); + setContentStore("idx", contentStore.tabs.length - 1); + }; + + const setActiveConnection = (i: number) => { + if (i <= connectionStore.tabs.length) { + setConnectionStore("idx", i); + } + }; + + const setActiveContentTab = (i: number) => { + if (i <= contentStore.tabs.length) { + setContentStore("idx", i - 1); + } + }; + const setActiveContentTableStructureTabData = ( data: TableStructureContentTabData ) => { @@ -248,8 +285,8 @@ export const ConnectionTabsService = () => { setConnectionStore, contentStore, setContentStore, - addTab, - removeTab, + addConnectionTab, + removeConnectionTab, clearStore, getActiveConnection, getActiveContentTab, @@ -258,5 +295,10 @@ export const ConnectionTabsService = () => { resetActiveContentQueryTabMessage, updateStore, setActiveContentTableStructureTabData, + setActiveContentTab, + setActiveConnection, + removeActiveContentTab, + removeActiveConnection, + addContentTab, }; };