52:I[707087,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"RegistryDependencies"] 53:I[512940,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"Installation"] 54:I[314491,["/_next/static/immutable/chunks/2985g-hklwiee.js","/_next/static/immutable/chunks/0qkc3dps_9x_i.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3thksmxn95rly.js","/_next/static/immutable/chunks/15bpbjna9-vr3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/0agonoz1szsjm.js","/_next/static/immutable/chunks/1ynd3dcge2kn1.js","/_next/static/immutable/chunks/0krdn-21gkgjt.js","/_next/static/immutable/chunks/0n9w9riw96l80.js","/_next/static/immutable/chunks/0w75qangey2ys.js","/_next/static/immutable/chunks/1tge7vcvsb70s.js","/_next/static/immutable/chunks/35ju_ac0ysz07.js"],"FilesView"] 55:T328a,'use client' import { useState, useEffect, useRef } from 'react' import { Plus, X } from 'lucide-react' import { Label } from '@/components/ui/label' import { Textarea } from '@/components/ui/textarea' import { Input } from '@/components/ui/input' import { Button } from '@/components/ui/button' import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@/components/ui/select' import type { PromptTemplate, FilterParameter, FilterOperator, GroupBy, } from '@/registry/default/lib/types' const PROMPT_TEMPLATES = [ 'Select template', 'Daily Standup Report', 'Sprint Report', 'Release Notes', 'Custom', ] as const const GROUP_BY_OPTIONS = [ { value: 'NONE', label: 'None' }, { value: 'REPOSITORY', label: 'Repository' }, { value: 'USER', label: 'User' }, { value: 'TEAM', label: 'Team' }, { value: 'LABEL', label: 'Label' }, { value: 'STATE', label: 'State' }, { value: 'SOURCEBRANCH', label: 'Source Branch' }, { value: 'TARGETBRANCH', label: 'Target Branch' }, ] as const const FILTER_PARAMETERS = [ { value: 'REPOSITORY', label: 'Repository' }, { value: 'LABEL', label: 'Label' }, { value: 'TEAM', label: 'Team' }, { value: 'USER', label: 'User' }, { value: 'SOURCEBRANCH', label: 'Source Branch' }, { value: 'TARGETBRANCH', label: 'Target Branch' }, { value: 'STATE', label: 'State' }, ] as const const FILTER_OPERATORS = [ { value: 'IN', label: 'In' }, { value: 'ALL', label: 'All' }, { value: 'NOT_IN', label: 'Not In' }, ] as const export interface FilterParameterForm { parameter: string operator: string values: string } export interface CodeRabbitReportFormData { fromDate: string toDate: string promptTemplate: string customPrompt: string groupBy: string subgroupBy: string orgId: string filters: FilterParameterForm[] } interface CodeRabbitReportFormProps { value: CodeRabbitReportFormData onChange: (value: CodeRabbitReportFormData) => void } /** * Get default date range (last 7 days) */ function getDefaultDateRange() { const today = new Date() const weekAgo = new Date(today.getTime() - 7 * 24 * 60 * 60 * 1000) return { fromDate: weekAgo.toISOString().split('T')[0], toDate: today.toISOString().split('T')[0], } } /** * Get initial form data with sensible defaults */ export function getInitialFormData(): CodeRabbitReportFormData { const { fromDate, toDate } = getDefaultDateRange() return { fromDate, toDate, promptTemplate: '', customPrompt: '', groupBy: 'NONE', subgroupBy: 'NONE', orgId: '', filters: [], } } export function CodeRabbitReportForm({ value, onChange, }: CodeRabbitReportFormProps) { const [showAdvanced, setShowAdvanced] = useState(false) const initializedRef = useRef(false) // Set default dates on mount if not provided useEffect(() => { if (initializedRef.current) return initializedRef.current = true if (!value.fromDate || !value.toDate) { const { fromDate, toDate } = getDefaultDateRange() onChange({ ...value, fromDate: value.fromDate || fromDate, toDate: value.toDate || toDate, }) } }, [value, onChange]) const addFilter = () => { onChange({ ...value, filters: [ ...value.filters, { parameter: 'REPOSITORY', operator: 'IN', values: '' }, ], }) } const removeFilter = (index: number) => { onChange({ ...value, filters: value.filters.filter((_, i) => i !== index), }) } const updateFilter = ( index: number, field: keyof FilterParameterForm, newValue: string, ) => { const newFilters = [...value.filters] newFilters[index] = { ...newFilters[index], [field]: newValue } onChange({ ...value, filters: newFilters }) } return (

{/* Date Range */}

From Date onChange({ ...value, fromDate: e.target.value })} className="h-11" />

To Date onChange({ ...value, toDate: e.target.value })} className="h-11" />

{/* Template Selection */}

Report Template

{/* Custom Prompt (shown only for Custom template) */} {value.promptTemplate === 'Custom' && (

Custom Prompt

) =>
              onChange({ ...value, customPrompt: e.target.value })
            }
            placeholder="Describe what you want in the report..."
            rows={4}
            required
          />
        </div>
      )}

{/* Advanced Options Toggle */}
      <Button
        type="button"
        variant="outline"
        size="sm"
        onClick={() => setShowAdvanced(!showAdvanced)}
        className="w-full"
      >
        {showAdvanced ? 'Hide' : 'Show'} Advanced Options
      </Button>

{showAdvanced && (
        <div className="space-y-4 pt-5 border-t bg-muted/20 -mx-6 px-6 pb-1">
          {/* Group By */}
          <div className="space-y-2">
            <Label htmlFor="groupBy">Group By</Label>
            <Select
              value={value.groupBy}
              onValueChange={(groupBy) => onChange({ ...value, groupBy })}
            >
              <SelectTrigger id="groupBy">
                <SelectValue />
              </SelectTrigger>
              <SelectContent>
                {GROUP_BY_OPTIONS.map((option) => (
                  <SelectItem key={option.value} value={option.value}>
                    {option.label}
                  </SelectItem>
                ))}
              </SelectContent>
            </Select>
          </div>

{/* Subgroup By */}
          <div className="space-y-2">
            <Label htmlFor="subgroupBy">Subgroup By (Optional)</Label>
            <Select
              value={value.subgroupBy}
              onValueChange={(subgroupBy) => onChange({ ...value, subgroupBy })}
            >
              <SelectTrigger id="subgroupBy">
                <SelectValue placeholder="None" />
              </SelectTrigger>
              <SelectContent>
                {GROUP_BY_OPTIONS.map((option) => (
                  <SelectItem key={option.value} value={option.value}>
                    {option.label}
                  </SelectItem>
                ))}
              </SelectContent>
            </Select>
          </div>

{/* Organization ID */}
          <div className="space-y-2">
            <Label htmlFor="orgId">Organization ID (Optional)</Label>
            <Input
              id="orgId"
              value={value.orgId}
              onChange={(e) => onChange({ ...value, orgId: e.target.value })}
              placeholder="Enter organization ID"
            />
          </div>

{/* Filters */}
          <div className="space-y-3">
            <div className="flex items-center justify-between">
              <Label className="text-sm font-medium">Filters (Optional)</Label>
              <Button
                type="button"
                variant="outline"
                size="sm"
                onClick={addFilter}
                className="h-8"
              >
                <Plus className="h-3.5 w-3.5 mr-1.5" />
                Add Filter
              </Button>
            </div>

{value.filters.map((filter, index) => (
              <div
                key={index}
                className="grid grid-cols-[1fr,1fr,2fr,auto] gap-3 items-end p-4 border rounded-lg bg-muted/30 hover:bg-muted/50 transition-colors"
              >
                <div className="space-y-1.5">
                  <Label className="text-xs">Parameter</Label>
                  <Select
                    value={filter.parameter}
                    onValueChange={(val) =>
                      updateFilter(index, 'parameter', val)
                    }
                  >
                    <SelectTrigger>
                      <SelectValue />
                    </SelectTrigger>
                    <SelectContent>
                      {FILTER_PARAMETERS.map((param) => (
                        <SelectItem key={param.value} value={param.value}>
                          {param.label}
                        </SelectItem>
                      ))}
                    </SelectContent>
                  </Select>
                </div>

<div className="space-y-1.5">
                  <Label className="text-xs">Operator</Label>
                  <Select
                    value={filter.operator}
                    onValueChange={(val) =>
                      updateFilter(index, 'operator', val)
                    }
                  >
                    <SelectTrigger>
                      <SelectValue />
                    </SelectTrigger>
                    <SelectContent>
                      {FILTER_OPERATORS.map((op) => (
                        <SelectItem key={op.value} value={op.value}>
                          {op.label}
                        </SelectItem>
                      ))}
                    </SelectContent>
                  </Select>
                </div>

<div className="space-y-1.5">
                  <Label className="text-xs">Values (pipe-separated)</Label>
                  <Input
                    value={filter.values}
                    onChange={(e) =>
                      updateFilter(index, 'values', e.target.value)
                    }
                    placeholder="value1 | value2"
                  />
                </div>

<Button
                  type="button"
                  variant="ghost"
                  size="icon"
                  onClick={() => removeFilter(index)}
                  className="text-destructive hover:text-destructive"
                >
                  <X className="h-4 w-4" />
                </Button>
              </div>
            ))}

{value.filters.length === 0 && (
              <div className="text-center py-6 px-4 border border-dashed rounded-lg bg-muted/20">
                <p className="text-sm text-muted-foreground">
                  No filters added. Click "Add Filter" to narrow down the report
                  scope. Use pipe (|) to separate multiple values.
                </p>
              </div>
            )}
          </div>
        </div>
      )}
    </div>
  )
}

export function getCodeRabbitReportPayload(data: CodeRabbitReportFormData) {
  const isCustomPrompt = data.promptTemplate === 'Custom'

// Convert pipe-separated filter values to arrays
  const parameters =
    data.filters.length > 0
      ? data.filters
          .filter((f) => f.values.trim())
          .map((f) => ({
            parameter: f.parameter as FilterParameter,
            operator: f.operator as FilterOperator,
            values: f.values.split('|').map((v) => v.trim()),
          }))
      : undefined

return {
    from: data.fromDate,
    to: data.toDate,
    promptTemplate: isCustomPrompt
      ? undefined
      : (data.promptTemplate as PromptTemplate),
    prompt: isCustomPrompt ? data.customPrompt : undefined,
    groupBy: data.groupBy as GroupBy,
    subgroupBy:
      data.subgroupBy && data.subgroupBy !== 'NONE'
        ? (data.subgroupBy as GroupBy)
        : undefined,
    orgId: data.orgId || undefined,
    parameters,
  }
}
4e:["$","div",null,{"className":"flex flex-col gap-12","children":[["$","div",null,{"className":"pt-10 flex flex-col gap-4","children":[["$","ul",null,{"className":"flex gap-2 flex-wrap","children":[["$","li","react",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/react","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"react"}]]}]}],["$","li","lucide-react",{"children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"rounded-md border p-2 text-sm flex items-center gap-1 ","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L52",null,{"registryDependencies":["button","input","label","select","textarea","https://coderabbit-shadcn-registry.vercel.app/r/types.json"]}]]}],["$","$L53",null,{"sourceUrl":"https://coderabbit-shadcn-registry.vercel.app/r/report-form.json","proxyUrl":"https://shadcnregistry.com/r/ramonclaudio-coderabbit/report-form","itemId":"@ramonclaudio-coderabbit/report-form"}],["$","section",null,{"className":"flex flex-col gap-4","id":"files","children":[["$","h2",null,{"className":"text-lg md:text-2xl font-bold font-mono","children":"Files"}],["$","$L54",null,{"files":[{"path":"registry/default/components/report-form/report-form.tsx","content":"$55","type":"registry:component"}]}]]}],"$L56"]}]
</article></body></html>

CodeRabbit Report Form

Installation

Files

components

Styles