Solutions

Code Editor

A VS Code-style development environment embedded directly within your platform, providing file-based code editing with syntax highlighting, terminal access, and full workspace navigation.

Overview

The Code Editor embeds a full VS Code-style interface by leveraging Databricks' Code Editor Lakehouse App. This provides developers with a familiar IDE experience directly within your platform, without requiring them to authenticate with Databricks separately.

Users authenticate via your application's SSO, and all API calls use SSO-Mapped Service Principal credentials. The Go reverse proxy handles token encryption and WebSocket connections for real-time features like terminal sessions and language server protocol (LSP).

Key Benefits

Full VS Code experience without Databricks SSO exposure
Integrated terminal for shell commands and git operations
Language Server Protocol for autocomplete and linting
Direct access to workspace files and repositories
Extension support for additional functionality

How It Works

The Code Editor uses the same iframe proxy architecture as the Notebook Editor. When a user navigates to the code editor, the server fetches their SPN token, encrypts it, and generates a proxy URL pointing to the VS Code Lakehouse App.

Architecture

WebSocket Support

The Code Editor relies heavily on WebSocket connections for real-time features. The Go proxy automatically detects WebSocket upgrade requests and establishes bidirectional tunnels with proper authentication.

WebSocket Features

Terminal Sessions: Interactive shell access for command execution
Language Server Protocol: Real-time code completion, linting, and diagnostics
File Watching: Automatic refresh when files change on the server
Debugging: Interactive debugger with breakpoints and variable inspection
Live Reload: Hot module reloading during development

User Experience

The Code Editor provides a comprehensive development environment familiar to VS Code users.

Features

VS Code-style interface with file tree navigation
Syntax highlighting for Python, SQL, Scala, R, and more
Integrated terminal for command execution
Git integration for version control (status, diff, commit)
Multi-file editing with tabs
Search and replace across files
Extension support for additional languages and tools
Keyboard shortcuts matching VS Code defaults

Supported Languages

The Code Editor supports all languages commonly used in data engineering and data science workflows:

Python

Full LSP support

SQL

Spark SQL dialect

Scala

With Metals LSP

Syntax highlighting

JSON/YAML

Config files

Markdown

Documentation

Shell

Bash scripts

Terraform

IaC files

Backend Configuration

The Code Editor component follows the same pattern as the Notebook Editor, implemented as a server-side rendered React component.

Component Implementation

// src/components/sso-spn-code-editor-iframe.tsx
import { redirect } from "next/navigation";
import { getDatabricksWorkspaceToken } from "@/lib/databricks-workspace-token";
import { generateProxyUrl } from "@/lib/token-encryption";

export default async function CodeEditorIframe() {
  const tokenResult = await getDatabricksWorkspaceToken();

  if (!tokenResult.success) {
    redirect("/sso-spn");
  }

  const { accessToken } = tokenResult.data;
  const appUrl = process.env.DATABRICKS_APP_URL; // VS Code Lakehouse App
  const proxyBaseUrl = process.env.NEXT_PUBLIC_PROXY_URL;

  const proxyPath = generateProxyUrl(accessToken, appUrl, "/");
  const fullProxyUrl = `${proxyBaseUrl}${proxyPath}`;

  return (
    <div className="h-full flex flex-col">
      <iframe
        src={fullProxyUrl}
        className="w-full h-full border-0"
        title="Code Editor"
        sandbox="allow-scripts allow-same-origin allow-forms allow-popups allow-modals allow-downloads"
        allow="clipboard-write; clipboard-read"
      />
    </div>
  );
}

Environment Variables

Variable	Description	Example
`DATABRICKS_APP_URL`	URL of the VS Code Lakehouse App	https://code-editor-shared-xxx.aws.databricksapps.com
`NEXT_PUBLIC_PROXY_URL`	Base URL of the Go proxy server	https://app-proxy.your-domain.com
`ENCRYPTION_KEY`	AES-256 encryption key (64 hex chars)	Generated via `openssl rand -hex 32`

Enhancement Opportunities

The Code Editor can be extended with additional features to provide a more integrated development experience.

Deep Linking

Open specific files at specific line numbers via URL parameters to enable cross-linking from other parts of your application (e.g., error logs).

Custom Extensions

Pre-install organization-specific VS Code extensions for custom linting rules, code snippets, or integrations.

Git Integration

Enable deeper Git integration to show commit history, pull request status, and code review comments inline.

Workspace Templates

Provide pre-configured workspace templates with common folder structures, config files, and starter code.