task.view.ts

// Copyright (c) 2025 ObjectStack. Licensed under the Apache-2.0 license.

import { defineView, P } from '@objectstack/spec';

const data = { provider: 'object' as const, object: 'showcase_task' };

/**
 * Task view gallery — a single object backing **all eight** list-view types
 * plus the simple / tabbed / wizard / split / drawer form variants. This is
 * the heart of the view-layer coverage: the coverage manifest references
 * each `listViews.*.type` here.
 */
export const TaskViews = defineView({
  // Default list shown when the object is opened.
  list: {
    label: 'All Tasks',
    type: 'grid',
    data,
    columns: [
      { field: 'title' },
      { field: 'project' },
      { field: 'assignee' },
      { field: 'status' },
      { field: 'priority' },
      { field: 'due_date' },
      { field: 'progress' },
    ],

    // ADR-0053 — on the object's DEFAULT list (views mode) status presets are
    // *named views* in the switcher (Salesforce/Airtable "saved views"), not an
    // in-view tab row. See the `in_progress` / `urgent` / `done` listViews below.
    // The end-user filter ELEMENTS (Airtable "User filters": tabs / dropdowns)
    // belong to interface pages (filters mode) — see the *.page.ts examples.

    // ADR-0047 — runtime visualization whitelist (Airtable "Appearance →
    // Visualizations"). Rendered as a compact dropdown in the toolbar's
    // right cluster; types whose bindings don't resolve are hidden by the
    // client regardless. This default list is the showcase's "switch every
    // view" case: the SAME records re-shaped into each record-based
    // visualization (chart is excluded — it aggregates a dataset, not records,
    // and lives as its own named view + dashboard element).
    appearance: {
      // The six record-based visualizations the spec + runtime switcher support
      // out of the box: the SAME task records re-shaped on demand. (map needs a
      // spec MapConfigSchema the ListViewSchema doesn't yet have, and chart
      // aggregates a dataset rather than records — both live as their own named
      // views below instead of in this switcher.)
      allowedVisualizations: ['grid', 'kanban', 'gallery', 'calendar', 'timeline', 'gantt'],
    },

    // Per-visualization bindings so each type in the switcher resolves and
    // renders the same task records. Field names map to task.object.ts.
    kanban: { groupByField: 'status', summarizeField: 'estimate_hours', columns: ['title', 'assignee', 'priority'] },
    gallery: { coverField: 'cover', titleField: 'title', visibleFields: ['assignee', 'status', 'priority'] },
    calendar: { startDateField: 'due_date', titleField: 'title', colorField: 'status' },
    timeline: { startDateField: 'created_at', titleField: 'title', colorField: 'priority', scale: 'week' },
    gantt: { startDateField: 'start_date', endDateField: 'end_date', titleField: 'title', progressField: 'progress' },
  },

  listViews: {
    // ── Status presets (ADR-0053) — saved views with a base ListView.filter,
    // shown as switcher entries on the object's default list (views mode). ──
    in_progress: {
      label: 'In Progress',
      type: 'grid',
      data,
      columns: [{ field: 'title' }, { field: 'project' }, { field: 'assignee' }, { field: 'status' }, { field: 'priority' }, { field: 'due_date' }],
      filter: [{ field: 'status', operator: 'equals', value: 'in_progress' }],
      exportOptions: ['csv', 'xlsx', 'json'],
    },
    urgent: {
      label: 'Urgent',
      type: 'grid',
      data,
      columns: [{ field: 'title' }, { field: 'project' }, { field: 'assignee' }, { field: 'status' }, { field: 'priority' }, { field: 'due_date' }],
      filter: [{ field: 'priority', operator: 'equals', value: 'urgent' }],
    },
    done: {
      label: 'Done',
      type: 'grid',
      data,
      columns: [{ field: 'title' }, { field: 'project' }, { field: 'assignee' }, { field: 'status' }, { field: 'due_date' }],
      filter: [{ field: 'status', operator: 'equals', value: 'done' }],
    },

    // 0 ── Tabular ───────────────────────────────────────────────────────
    // ADR-0021 Phase 2: replaces the former `showcase_task_list` report
    // (a flat record list — a ListView concern, not analytics).
    tabular: {
      label: 'Task List',
      type: 'grid',
      data,
      columns: [
        { field: 'title' },
        { field: 'project' },
        { field: 'assignee' },
        { field: 'status' },
        { field: 'estimate_hours' },
      ],

      // @objectstack/spec ListViewSchema.sort accepts a bare STRING
      // ("field [asc|desc]"), not only the {field,order}[] array form. This
      // is the exact shape that used to crash the renderer with
      // "schema.sort.map is not a function" (objectui#2601) — kept here as a
      // live coverage fixture so a real list view exercises the string form.
      sort: 'estimate_hours desc',

      // ADR-0053 — NO `userFilters` here: on an object list view ("views"
      // mode) the console suppresses them by design (the view switcher is
      // the only nav control; objectui warns since #2220). End-user filter
      // elements live in interface pages ("filters" mode) — see
      // task-workbench / task-triage / active-projects *.page.ts. Status
      // presets on this object are the named views above instead.
    },

    // 1 ── Grid ─────────────────────────────────────────────────────────
    grid: {
      label: 'Grid',
      type: 'grid',
      data,
      columns: [
        { field: 'title' },
        { field: 'assignee' },
        { field: 'status' },
        { field: 'priority' },
        { field: 'estimate_hours' },
        { field: 'due_date' },
      ],
      rowColor: { field: 'priority' },
      // List-level inline edit — cells become editable in place, with a
      // per-row edit affordance and a save-all/cancel-all toolbar (view-level
      // master switch; distinct from the master-detail `inlineEdit` on fields).
      inlineEdit: true,
    },

    // 2 ── Kanban ───────────────────────────────────────────────────────
    board: {
      label: 'Board (Kanban)',
      type: 'kanban',
      data,
      columns: ['title', 'assignee', 'priority'],
      kanban: {
        groupByField: 'status',
        summarizeField: 'estimate_hours',
        columns: ['title', 'assignee', 'priority'],
      },
    },

    // 3 ── Gallery ──────────────────────────────────────────────────────
    cards: {
      label: 'Cards (Gallery)',
      type: 'gallery',
      data,
      columns: ['title', 'assignee', 'status'],
      gallery: {
        coverField: 'cover',
        coverFit: 'cover',
        cardSize: 'medium',
        titleField: 'title',
        visibleFields: ['assignee', 'status', 'priority'],
      },
    },

    // 4 ── Calendar ─────────────────────────────────────────────────────
    calendar: {
      label: 'Calendar',
      type: 'calendar',
      data,
      columns: ['title', 'assignee'],
      calendar: {
        startDateField: 'due_date',
        titleField: 'title',
        colorField: 'status',
      },
    },

    // 5 ── Timeline ─────────────────────────────────────────────────────
    timeline: {
      label: 'Activity Timeline',
      type: 'timeline',
      data,
      columns: ['title'],
      timeline: {
        startDateField: 'created_at',
        titleField: 'title',
        colorField: 'priority',
        scale: 'week',
      },
    },

    // 6 ── Gantt ────────────────────────────────────────────────────────
    gantt: {
      label: 'Schedule (Gantt)',
      type: 'gantt',
      data,
      columns: ['title', 'assignee'],
      gantt: {
        startDateField: 'start_date',
        endDateField: 'end_date',
        titleField: 'title',
        progressField: 'progress',
      },
    },

    // 7 ── Map ──────────────────────────────────────────────────────────
    map: {
      label: 'Work Locations (Map)',
      type: 'map',
      data,
      columns: ['title', 'location', 'assignee'],
    },

    // 8 ── Chart ────────────────────────────────────────────────────────
    chart: {
      label: 'Hours by Status (Chart)',
      type: 'chart',
      data,
      columns: ['status', 'estimate_hours'],
      chart: {
        chartType: 'bar',
        // ADR-0021 dual-form — bind to the task dataset.
        dataset: 'showcase_task_metrics',
        dimensions: ['status', 'priority'],
        values: ['est_hours'],
      },
    },
  },

  formViews: {
    // Keyed `edit`, NOT `default`: list and form views share one
    // `<object>.<key>` namespace, and the main `list` implicitly claims
    // `showcase_task.default`. A `default` form key collides — the build-time
    // view-ref lint fails on it (framework #2554) instead of silently renaming
    // it to `default_2` and breaking any action target that references it.
    // simple ── single-section form ──────────────────────────────────────
    edit: {
      type: 'simple',
      data,
      sections: [
        {
          label: 'Task',
          columns: 2,
          fields: [
            { field: 'title', required: true },
            { field: 'project', required: true },
            { field: 'assignee' },
            { field: 'status', required: true },
            { field: 'priority' },
            { field: 'due_date' },
            // View-level conditional visibility (FormField.visibleWhen, CEL):
            // the notes box only appears while the task is Urgent. Data-level
            // counterpart is `visibleWhen` on invoice.paid_on.
            // Width via the semantic `span` (#2578): 'full' = whole row at any
            // derived column count — the primary primitive; absolute colSpan
            // is legacy and lint-discouraged.
            { field: 'notes', visibleWhen: P`record.priority == 'urgent'`, span: 'full' },
          ],
        },
      ],
    },

    // tabbed ── sections rendered as tabs ────────────────────────────────
    tabbed: {
      type: 'tabbed',
      data,
      sections: [
        { name: 'overview', label: 'Overview', columns: 2, fields: ['title', 'project', 'assignee', 'status'] },
        { name: 'schedule', label: 'Schedule', columns: 2, fields: ['start_date', 'end_date', 'due_date', 'progress'] },
        { name: 'details', label: 'Details', columns: 1, fields: ['estimate_hours', 'labels', 'location', 'notes'] },
      ],
    },

    // wizard ── step-by-step creation ────────────────────────────────────
    wizard: {
      type: 'wizard',
      data,
      sections: [
        { name: 'step_basics', label: 'Basics', columns: 1, fields: ['title', 'project'] },
        { name: 'step_assign', label: 'Assignment', columns: 1, fields: ['assignee', 'priority'] },
        { name: 'step_schedule', label: 'Schedule', columns: 2, fields: ['start_date', 'end_date', 'due_date'] },
      ],
    },

    // split ── master-detail split pane ──────────────────────────────────
    split: {
      type: 'split',
      data,
      sections: [{ label: 'Task', columns: 1, fields: ['title', 'status', 'assignee'] }],
    },

    // drawer ── side panel quick edit ────────────────────────────────────
    quick: {
      type: 'drawer',
      data,
      sections: [{ label: 'Quick Edit', columns: 1, fields: ['status', 'priority', 'progress'] }],
    },
  },
});