Skip to content

Switch to Material UI #22

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

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Switch to Material UI #22

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
30 changes: 16 additions & 14 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ or remote Trino cluster.
> production workloads. Treat the current release as an early-stage demo;
> production-ready builds and documentation are planned.

![Trino Query UI Demo](demos.gif "Trino Query UI Demo")
![Trino Query UI](screenshot.png "Trino Query UI")

Implementation details:
* React TypeScript project with Vite
Expand All @@ -29,7 +29,7 @@ import { QueryEditor } from 'trino-query-ui'
import 'trino-query-ui/dist/index.css'

function MyTrinoApp() {
return <QueryEditor />
return <QueryEditor theme="dark" height={800} />
}

export default MyTrinoApp
Expand All @@ -51,8 +51,10 @@ npm run build

### Copying into Trino

```
mkdir -p $TRINO_HOME/core/trino-main/src/main/resources/query_ui_webapp/
cp -r dist/* $TRINO_HOME/core/trino-main/src/main/resources/query_ui_webapp/
```

### Modifying Trino to respond to /query/

Expand Down Expand Up @@ -126,7 +128,7 @@ npm run dev

The local URL is displayed, and you can open it in your browser.

### Set Up proxying to a local Trino instance
### Set up proxying to a local Trino instance

Update `vite.config.ts` with the following so that queries can be
proxied to Trino's query endpoint running on `http://localhost:8080` (or any
Expand Down Expand Up @@ -182,19 +184,19 @@ cases are:

The approach:
1. Direct integration into the Trino UI
- No need for an additional authentication hop (although it could be added
in the future)
- Authenticates as the user executing the query when using OAuth2
- Trino does the heavy lifting
- No need for an additional authentication hop (although it could be added
in the future)
- Authenticates as the user executing the query when using OAuth2
- Trino does the heavy lifting
2. Remove friction so you can simply write a query
- Autocomplete understands the Trino language, tables, and columns
- Provides syntax highlighting and validation
- Offers a comprehensive catalog explorer
- Autocomplete understands the Trino language, tables, and columns
- Provides syntax highlighting and validation
- Offers a comprehensive catalog explorer
3. Avoid black-box query execution
- Show progress and execution details. People ask "why is my query slow?"
mostly because they only see a spinner for minutes.
- Link to the Trino Query UI to drill into query performance
- Show stages and split counts like the Trino console client
- Show progress and execution details. People ask "why is my query slow?"
mostly because they only see a spinner for minutes.
- Link to the Trino Query UI to drill into query performance
- Show stages and split counts like the Trino console client
4. Keep the experience easy to navigate

### Gaps and future direction
Expand Down
2 changes: 1 addition & 1 deletion precise/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/commander_bunbun.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Trino Query Editor - Example app</title>
<title>Trino query editor - Example app</title>
</head>
<body>
<div id="root"></div>
Expand Down
Loading