opensource/sqlchat
1
0
Fork 0
mirror of https://github.com/sqlchat/sqlchat.git synced 2025-07-28 17:53:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: dynamic import query drawer

Browse Source
This commit is contained in:
steven
2023-03-28 17:15:51 +08:00
parent 55a2f99e2d
commit 27f70cd3ef
2 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/QueryDrawer.tsx
View File

@ -12,9 +12,9 @@ type RawQueryResult = {
const QueryDrawer = () => { const QueryDrawer = () => {
const queryStore = useQueryStore(); const queryStore = useQueryStore();
const context = queryStore.context;
const [rawResults, setRawResults] = useState<RawQueryResult[]>([]); const [rawResults, setRawResults] = useState<RawQueryResult[]>([]);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const context = queryStore.context;
const columns = Object.keys(head(rawResults) || {}).map((key) => { const columns = Object.keys(head(rawResults) || {}).map((key) => {
return { return {
name: key, name: key,
@ -23,6 +23,10 @@ const QueryDrawer = () => {
}); });
useEffect(() => { useEffect(() => {
if (!queryStore.showDrawer) {
return;
}
if (!context) { if (!context) {
toast.error("No execution context found."); toast.error("No execution context found.");
setIsLoading(false); setIsLoading(false);
@ -56,7 +60,7 @@ const QueryDrawer = () => {
}; };
executeStatement(); executeStatement();
}, [context]); }, [context, queryStore.showDrawer]);
const close = () => queryStore.toggleDrawer(false); const close = () => queryStore.toggleDrawer(false);

4
pages/index.tsx
View File

@ -3,7 +3,6 @@ import Head from "next/head";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import { ResponsiveWidth, useLayoutStore } from "@/store"; import { ResponsiveWidth, useLayoutStore } from "@/store";
import QueryDrawer from "@/components/QueryDrawer";
// Use dynamic import to avoid page hydrated. // Use dynamic import to avoid page hydrated.
// reference: https://github.com/pmndrs/zustand/issues/1145#issuecomment-1316431268 // reference: https://github.com/pmndrs/zustand/issues/1145#issuecomment-1316431268
@ -13,6 +12,9 @@ const ConnectionSidebar = dynamic(() => import("@/components/ConnectionSidebar")
const ChatView = dynamic(() => import("@/components/ChatView"), { const ChatView = dynamic(() => import("@/components/ChatView"), {
ssr: false, ssr: false,
}); });
const QueryDrawer = dynamic(() => import("@/components/QueryDrawer"), {
ssr: false,
});
const ChatPage: NextPage = () => { const ChatPage: NextPage = () => {
const layoutStore = useLayoutStore(); const layoutStore = useLayoutStore();