8000 feat: duckdb-wasm query UI [DRAFT] by mattrothenberg · Pull Request #39 · githubocto/flat-viewer · GitHub
[go: up one dir, main page]
Skip to content

feat: duckdb-wasm query UI [DRAFT] #39

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 19 commits into
base: main
Choose a base branch
from
Draft

feat: duckdb-wasm query UI [DRAFT] #39

Changes from 1 commit
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
fa9d83a
wasm spike successful
May 12, 2022
713488f
auto fetch
May 12, 2022
4127796
wip
May 12, 2022
6f75755
remove janky require shim
May 12, 2022
c225595
remove vite config changes
May 12, 2022
12955b2
error handling
May 12, 2022
e0b17f4
fix stale transaction error
May 12, 2022
abc4d0b
pull in grid component
May 12, 2022
c66c2a2
rudimentary toggle UI
May 12, 2022
54376d9
Update src/components/repo-detail.tsx
mattrothenberg May 16, 2022
c558164
refactor
May 16, 2022
99055d6
remove co-located duckdb package
May 16, 2022
5efc418
use filename as table name
May 16, 2022
c848a11
handle SQL errors
May 16, 2022
7c5a885
move SQL out to query param
May 16, 2022
93c654f
fix: conditionally insert CSV or JSON
May 16, 2022
7fff932
tweaks
May 16, 2022
c83b98c
switch statement for db initialization
May 16, 2022
62bdc9f
suppress fade animation for SQL results
May 16, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8000
Prev Previous commit
Next Next commit
error handling
  • Loading branch information
Matt Rothenberg committed May 12, 2022
commit 12955b2ecfaa644d2033cc6c5cee5cd2f34b18d0
36 changes: 25 additions & 11 deletions src/components/db-explorer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ import { useQuery } from "react-query";
import { useDebounce } from "use-debounce";
import { useRawDataFile } from "../hooks";
import { LoadingState } from "./loading-state";
import { ErrorState } from "./error-state";
import { Spinner } from "./spinner";
import Bug from "../bug.svg";

interface Props {
sha: string;
Expand All @@ -28,7 +30,7 @@ function DBExplorerInner(props: DBExplorerInnerProps) {
const { content, extension, filename, sha } = props;
8000 const connectionRef = useRef<duckdb.AsyncDuckDBConnection>();
const [query, setQuery] = useState("");
const [debouncedQuery] = useDebounce(query, 1000);
const [debouncedQuery] = useDebounce(query, 500);
const [dbStatus, setDbStatus] = useState<"error" | "idle" | "success">(
"idle"
);
Expand Down Expand Up @@ -76,16 +78,19 @@ function DBExplorerInner(props: DBExplorerInnerProps) {
const c = await db.connect();
connectionRef.current = c;

if (extension === "csv") {
await db.registerFileText(`data.csv`, content);
await c.insertCSVFromPath(`data.csv`, { name: "data" });
} else if (extension === "json") {
await db.registerFileText(`data.json`, content);
await c.insertJSONFromPath("data.json", { name: "data" });
try {
if (extension === "csv") {
await db.registerFileText(`data.csv`, content);
await c.insertCSVFromPath(`data.csv`, { name: "data" });
} else if (extension === "json") {
await db.registerFileText(`data.json`, content);
await c.insertJSONFromPath("data.json", { name: "data" });
}
setDbStatus("success");
setQuery("select * from data");
} catch {
setDbStatus("error");
}

setDbStatus("success");
setQuery("select * from data");
};

initDuckDb();
Expand All @@ -104,7 +109,11 @@ function DBExplorerInner(props: DBExplorerInnerProps) {
const names = content.split("\n")[0].split(",");
return names.map((name) => name.replace(/"/g, ""));
} else if (extension === "json") {
return Object.keys(JSON.parse(content)[0]);
try {
return Object.keys(JSON.parse(content)[0]);
} catch {
return [];
}
} else {
return [];
}
Expand All @@ -113,6 +122,11 @@ function DBExplorerInner(props: DBExplorerInnerProps) {
return (
<div className="flex-1 flex-shrink-0 overflow-hidden flex flex-col z-0">
{dbStatus === "idle" && <LoadingState text="Initializing DuckDB 🦆" />}
{dbStatus === "error" && (
<ErrorState img={Bug} alt="Database initialization error">
Couldn't initialize DuckDB 😕
</ErrorState>
)}
{dbStatus === "success" && (
<>
<div className="border-b bg-gray-50 sticky top-0 z-20">
Expand Down
0