Implementation:Ucbepic Docetl FrontendTypes

Knowledge Sources	Ucbepic_Docetl
Domains	Frontend, React_UI
Last Updated	2026-02-08 00:00 GMT

Overview

Concrete tool for the shared TypeScript type definitions used throughout the DocETL frontend application.

Description

This module defines the core type system for the DocETL frontend. It exports types for File (dataset files with name, path, type), Operation (pipeline operations with type, prompt, schema, gleaning, and validation), SchemaItem and SchemaType (output schema definitions supporting string, float, int, boolean, list, dict, and enum types), UserNote and Bookmark (user annotation types), OutputType, OptimizeRequest/Result, DecomposeRequest/Result, and APIKey. These types are imported by virtually every component in the application.

Usage

Imported throughout the frontend codebase for type safety. Used by components, contexts, hooks, and API routes.

Code Reference

Source Location

• Repository: Ucbepic_Docetl
• File: website/src/app/types.ts
• Lines: 1-138

Signature

export type File = {
  name: string;
  path: string;
  type: "json" | "document" | "pipeline-yaml";
  parentFolder?: string;
  blob?: Blob;
}

export type Operation = {
  id: string;
  llmType: "LLM" | "non-LLM";
  type: "map" | "reduce" | "filter" | "resolve" | "parallel_map" | "rank"
    | "extract" | "unnest" | "split" | "gather" | "sample"
    | "code_map" | "code_reduce" | "code_filter";
  name: string;
  prompt?: string;
  output?: { schema: SchemaItem[] };
  validate?: string[];
  gleaning?: { num_rounds: number; validation_prompt: string };
  otherKwargs?: Record<string, any>;
  visibility: boolean;
}

export interface SchemaItem {
  key: string;
  type: SchemaType;
  subType?: SchemaItem | SchemaItem[];
  enumValues?: string[];
}

export interface APIKey { name: string; value: string; }
export interface Bookmark { id: string; color: string; notes: UserNote[]; }
export interface OutputType { path: string; operationId: string; inputPath?: string; }
export interface DecomposeResult { task_id: string; status: TaskStatus; ... }

Import

import { File, Operation, SchemaItem, SchemaType, APIKey, Bookmark, OutputType } from "@/app/types";

I/O Contract

Inputs (Props)

Name	Type	Required	Description
No props -- this is a type definition module

Outputs

Name	Type	Description
types	TypeScript types	Exported type definitions for the entire frontend

Usage Examples

import { Operation, File, SchemaItem } from "@/app/types";

const newOperation: Operation = {
  id: "op-1",
  llmType: "LLM",
  type: "map",
  name: "extract_themes",
  prompt: "Analyze: {{ input.content }}",
  output: { schema: [{ key: "themes", type: "list" }] },
  visibility: true,
};

Related Pages

• Environment:Ucbepic_Docetl_Frontend_Node_Environment