UI
playground
Interactive SQL playground for querying and visualizing data.
The playground
function allows you to create an interactive SQL playground within your application. It provides a dynamic interface for querying connected data sources and visualizing results directly.
Parameters
label
(str): The display label for the playground component. This is used for identification and UI rendering.query
(str): The SQL query string to execute. This supports standard SQL syntax and can includeSELECT
,JOIN
,WHERE
, etc.source
(str, optional): (Optional) The name of the specific data source to query. If not provided, the function attempts to auto-detect the data source from the SQL query itself. (See “Default Behavior forsource
” below)size
(float): (Optional) The width of the component in a row. Defaults to1.0
(full row).
For example:
In this case, source
is auto-detected as users
.
Note: Auto-detection works best when the query has a clear FROM
or JOIN
clause.
Returns
pd.DataFrame
: The resulting DataFrame after executing the query. You can use it for further processing or visualization.
Usage Example
Here’s how to create a simple playground:
Or, explicitly pass the data source:
Query Execution
The playground component:
- Auto-loads any saved query state (if user modified the query previously).
- Runs the SQL query against the provided or detected data source.
- Renders the result interactively in the frontend.
Error Handling
- Handles invalid queries and missing data sources gracefully
- Captures and displays query errors in the UI
- Logs detailed debug information for troubleshooting
Best Practices
- Use meaningful labels to distinguish multiple playgrounds.
- Prefer explicit
source
when working with complex queries or joins. - Always review auto-detected source for correctness.
- Use appropriate
WHERE
clauses to limit large datasets. - Handle exceptions gracefully to improve user experience.
Related Functions
query()
: Executes SQL queries directlyget_df()
: Retrieves full datasets
Was this page helpful?