Features
Forms

Forms

Create public forms that automatically create tasks from submissions.

Use Cases

  • Customer Requests - Collect feature requests
  • Bug Reports - Allow users to report issues
  • Intake Forms - New project requests
  • Surveys - Collect feedback

Creating a Form

Via UI

  1. Open a board
  2. Click Forms in the header
  3. Click + Create Form
  4. Add form fields
  5. Map fields to columns
  6. Save and share the public URL

Form Schema

interface Form {
  id: string
  boardId: string
  name: string
  description?: string
  fields: FormField[]
  submissions: FormSubmission[]
  publicUrl: string
  createdAt: string
}

Form Fields

Field TypeInputMaps To
textSingle line textText column
textareaMulti-line textText column
emailEmail inputEmail column
dateDate pickerDate column
numberNumeric inputNumber column
dropdownSelect optionsDropdown/Status column

Field Configuration

interface FormField {
  id: string
  type: "text" | "email" | "dropdown" | "date" | "number" | "textarea"
  label: string
  required: boolean
  options?: string[]      // For dropdown
  mapToColumn?: string    // Column ID to map values
}

Column Mapping

Map form fields to board columns:

// Form field
{
  label: "Priority Level",
  type: "dropdown",
  options: ["Low", "Medium", "High"],
  mapToColumn: "priority-column-id"
}

When submitted, the value automatically populates the mapped column.

Submissions

Submission Flow

Submission Schema

interface FormSubmission {
  id: string
  formId: string
  data: Record<string, string>  // field_id -> value
  createdAt: string
  taskId?: string  // Created task ID
}

Public URL

Each form has a unique public URL:

https://yourapp.com/forms/[form-id]

Share this URL to collect submissions without authentication.

Store Usage

import { useAppStore } from '@/lib/store'
 
// Form actions
const addForm = useAppStore((s) => s.addForm)
const updateForm = useAppStore((s) => s.updateForm)
const deleteForm = useAppStore((s) => s.deleteForm)
const submitForm = useAppStore((s) => s.submitForm)
 
// Create form
addForm({
  boardId: 'board-id',
  name: 'Bug Report Form',
  description: 'Report issues with our product',
  fields: [
    { id: 'f1', type: 'text', label: 'Title', required: true },
    { id: 'f2', type: 'textarea', label: 'Description', required: true },
    { id: 'f3', type: 'dropdown', label: 'Severity', options: ['Low', 'Medium', 'High'] }
  ]
})
 
// Submit form (creates task)
submitForm(formId, {
  f1: 'Login button broken',
  f2: 'Cannot click the login button on mobile',
  f3: 'High'
})

Example: Bug Report Form

{
  name: "Bug Report",
  description: "Report a bug in our application",
  fields: [
    {
      id: "title",
      type: "text",
      label: "Bug Title",
      required: true,
      mapToColumn: "name-column"
    },
    {
      id: "description",
      type: "textarea",
      label: "Describe the bug",
      required: true,
      mapToColumn: "description-column"
    },
    {
      id: "severity",
      type: "dropdown",
      label: "Severity",
      options: ["Low", "Medium", "High", "Critical"],
      mapToColumn: "priority-column"
    },
    {
      id: "email",
      type: "email",
      label: "Your email",
      required: true,
      mapToColumn: "reporter-email-column"
    }
  ]
}