decomp-tree-snowflake Svelte Themes

Decomp Tree Snowflake

A D3 + Svelte decomposition tree visualization ported from a Tableau extension, deployed natively inside Snowflake using Snowpark Container Services. Supports live Snowflake table browsing, custom SQL queries, and hierarchical data exploration within a governed Snowflake environment.

Decomposition Tree for Snowflake

A D3.js + Svelte visualization app for root cause analysis, deployed as a Snowflake Native App with Snowpark Container Services (SPCS).

Features

  • Interactive decomposition tree visualization
  • Query Snowflake data directly via /query-ui/ panel
  • OAuth integration for secure Snowflake authentication
  • Deployable as a Native App for easy distribution

Architecture

  • Frontend: Svelte 5 + D3.js for tree visualization
  • Backend: FastAPI Python server for Snowflake queries
  • Infrastructure: Nginx reverse proxy, Supervisord process management
  • Deployment: Multi-stage Docker build for SPCS

Quick Start (Local Development)

npm install
npm run dev

Deploy to SPCS

Prerequisites

  • Snowflake account with SPCS enabled
  • Docker installed
  • snow CLI configured

Build and Push Image

docker build --platform linux/amd64 -t decomp-tree:latest .
docker tag decomp-tree:latest <registry-url>/decomp-tree:latest
docker push <registry-url>/decomp-tree:latest

Create Service

CREATE SERVICE DECOMP_TREE_SERVICE
  IN COMPUTE POOL <pool_name>
  FROM SPECIFICATION $$
spec:
  containers:
  - name: app
    image: /<db>/<schema>/<repo>/decomp-tree:latest
    env:
      SNOWFLAKE_WAREHOUSE: COMPUTE_WH
  endpoints:
  - name: ui
    port: 8080
    public: true
$$;

Install as Native App

If published as a Native App:

-- Install the app
CREATE APPLICATION DECOMP_TREE_APP
  FROM APPLICATION PACKAGE DECOMP_TREE_PKG
  USING VERSION V5;

-- Grant required privileges
GRANT USAGE ON COMPUTE POOL <pool_name> TO APPLICATION DECOMP_TREE_APP;
GRANT BIND SERVICE ENDPOINT ON ACCOUNT TO APPLICATION DECOMP_TREE_APP;

-- Start the service
CALL DECOMP_TREE_APP.APP_SCHEMA.START_SERVICE('<pool_name>');

-- Get the URL
SHOW ENDPOINTS IN SERVICE DECOMP_TREE_APP.SERVICE_SCHEMA.DECOMP_TREE_SERVICE;

Project Structure

├── src/                    # Svelte frontend source
├── backend/                # FastAPI backend
├── query-ui/               # Snowflake query panel
├── native-app/             # Native App manifest and setup
├── Dockerfile              # Multi-stage build
├── nginx.conf              # Reverse proxy config
└── supervisord.conf        # Process manager config

Usage

  1. Open the app URL
  2. Click "Snowflake" tab or navigate to /query-ui/
  3. Run a query returning name, parent, value columns
  4. Click "Send to Tree" to visualize

Example Query

SELECT 'Company' as name, NULL as parent, 1000000 as value
UNION ALL SELECT 'Sales', 'Company', 400000
UNION ALL SELECT 'Engineering', 'Company', 350000
UNION ALL SELECT 'Marketing', 'Company', 250000

License

MIT

Top categories

Loading Svelte Themes