opensource/sqlchat
1
0
Fork 0
mirror of https://github.com/sqlchat/sqlchat.git synced 2025-09-27 10:06:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: support schema select (#112)

Browse Source
This commit is contained in:
CorrectRoadH
2023-05-31 14:04:10 +08:00
committed by GitHub
parent 1a57c6a899
commit 00022e6bb7
13 changed files with 157 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/ConnectionSidebar.tsx
View File

@ -2,7 +2,7 @@ import { Drawer } from "@mui/material";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useConnectionStore, useConversationStore, useLayoutStore, ResponsiveWidth, useSettingStore } from "@/store";
import { Table } from "@/types";
import { Engine, Table, Schema } from "@/types";
import useLoading from "@/hooks/useLoading";
import Select from "./kit/Select";
import Icon from "./Icon";
@ -26,11 +26,21 @@ const ConnectionSidebar = () => {
const currentConnectionCtx = connectionStore.currentConnectionCtx;
const databaseList = connectionStore.databaseList.filter((database) => database.connectionId === currentConnectionCtx?.connection.id);
const [tableList, updateTableList] = useState<Table[]>([]);
const [schemaList, updateSchemaList] = useState<Schema[]>([]);
const [hasSchemaProperty, updateHasSchemaProperty] = useState<boolean>(false);
const selectedTablesName: string[] =
conversationStore.getConversationById(conversationStore.currentConversationId)?.selectedTablesName || [];
const selectedSchemaName: string =
conversationStore.getConversationById(conversationStore.currentConversationId)?.selectedSchemaName || "";
const tableSchemaLoadingState = useLoading();
const currentConversation = conversationStore.getConversationById(conversationStore.currentConversationId);
useEffect(() => {
updateHasSchemaProperty(
currentConnectionCtx?.connection.engineType === Engine.PostgreSQL || currentConnectionCtx?.connection.engineType === Engine.MSSQL
);
}, [currentConnectionCtx?.connection]);
useEffect(() => {
const handleWindowResize = () => {
if (window.innerWidth < ResponsiveWidth.sm) {
@ -71,14 +81,26 @@ const ConnectionSidebar = () => {
}, [currentConnectionCtx?.connection]);
useEffect(() => {
const tableList =
const schemaList =
connectionStore.databaseList.find(
(database) =>
database.connectionId === currentConnectionCtx?.connection.id && database.name === currentConnectionCtx?.database?.name
)?.tableList || [];
)?.schemaList || [];
updateSchemaList(schemaList);
// need to create a conversation. otherwise updateSelectedSchemaName will failed.
createConversation();
if (hasSchemaProperty) {
conversationStore.updateSelectedSchemaName(schemaList[0]?.name || "");
} else {
conversationStore.updateSelectedSchemaName("");
}
}, [connectionStore, hasSchemaProperty, currentConnectionCtx, schemaList]);
useEffect(() => {
const tableList = schemaList.find((schema) => schema.name === selectedSchemaName)?.tables || [];
updateTableList(tableList);
}, [connectionStore, currentConnectionCtx]);
}, [selectedSchemaName, selectedTablesName, schemaList]);
const handleDatabaseNameSelect = async (databaseName: string) => {
if (!currentConnectionCtx?.connection) {
@ -113,19 +135,23 @@ const ConnectionSidebar = () => {
};
const handleTableNameSelect = async (selectedTablesName: string[]) => {
createConversation();
conversationStore.updateSelectedTablesName(selectedTablesName);
};
const handleAllSelect = async () => {
createConversation();
conversationStore.updateSelectedTablesName(tableList.map((table) => table.name));
};
const handleEmptySelect = async () => {
createConversation();
conversationStore.updateSelectedTablesName([]);
};
const handleSchemaNameSelect = async (schemaName: string) => {
// need to empty selectedTablesName when schemaName changed. because selectedTablesName may not exist in new schema.
conversationStore.updateSelectedTablesName([]);
conversationStore.updateSelectedSchemaName(schemaName);
};
return (
<>
<Drawer
@ -169,6 +195,20 @@ const ConnectionSidebar = () => {
/>
</div>
)}
{hasSchemaProperty && schemaList.length > 0 && (
<Select
className="w-full px-4 py-3 !text-base"
value={selectedSchemaName}
itemList={schemaList.map((schema) => {
return {
label: schema.name,
value: schema.name,
};
})}
onValueChange={(schema) => handleSchemaNameSelect(schema)}
placeholder={t("connection.select-schema") || ""}
/>
)}
{currentConnectionCtx &&
(tableSchemaLoadingState.isLoading ? (
<div className="w-full h-12 flex flex-row justify-start items-center px-4 sticky top-0 border z-1 mb-4 mt-2 rounded-lg text-sm text-gray-600 dark:text-gray-400">

8
src/components/ConversationView/index.tsx
View File

@ -150,17 +150,17 @@ const ConversationView = () => {
if (connectionStore.currentConnectionCtx?.database) {
let schema = "";
try {
const tables = await connectionStore.getOrFetchDatabaseSchema(connectionStore.currentConnectionCtx?.database);
const schemaList = await connectionStore.getOrFetchDatabaseSchema(connectionStore.currentConnectionCtx?.database);
// Empty table name(such as []) denote all table. [] and `undefined` both are false in `if`
const tableList: string[] = [];
const selectedSchema = schemaList.find((schema) => schema.name == (currentConversation.selectedSchemaName || ""));
if (currentConversation.selectedTablesName) {
currentConversation.selectedTablesName.forEach((tableName: string) => {
const table = tables.find((table) => table.name === tableName);
const table = selectedSchema?.tables.find((table) => table.name == tableName);
tableList.push(table!.structure);
});
} else {
for (const table of tables) {
for (const table of selectedSchema?.tables || []) {
tableList.push(table!.structure);
}
}