oxios 1.5.2

Oxios Agent OS — Agent Operating System powered by oxi-sdk
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

import { Send } from 'lucide-react'
import { useTranslation } from 'react-i18next'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { Separator } from '@/components/ui/separator'
import type { SettingsFieldDef } from './field-defs'
import { FieldRow } from './field-row'

interface ChannelsSectionProps {
  /** Section key, e.g. `channels.telegram`. */
  sectionKey: string
  labelKey: string
  fields: SettingsFieldDef[]
  formValues: Record<string, Record<string, string | boolean | string[]>>
  onFieldChange: (sectionKey: string, fieldKey: string, value: string | boolean | string[]) => void
}

/**
 * Renders a single channel section (currently just Telegram). Uses the
 * standard `FieldRow` for every field so the restart badges and form
 * controls stay consistent.
 */
export function ChannelsSection({
  sectionKey,
  labelKey,
  fields,
  formValues,
  onFieldChange,
}: ChannelsSectionProps) {
  const { t } = useTranslation()
  if (fields.length === 0) return null

  return (
    <Card>
      <CardHeader className="pb-4">
        <CardTitle className="flex items-center gap-2 text-base">
          <Send className="h-4 w-4" />
          {t(labelKey)}
        </CardTitle>
      </CardHeader>
      <CardContent className="space-y-4">
        {fields.map((field, i) => (
          <div key={field.key}>
            {i > 0 && <Separator className="mb-4" />}
            <FieldRow
              sectionKey={sectionKey}
              field={field}
              value={
                formValues[sectionKey]?.[field.key] as
                  | string
                  | boolean
                  | string[]
                  | number
                  | undefined
              }
              onChange={(val) => onFieldChange(sectionKey, field.key, val)}
              sectionValues={formValues[sectionKey]}
            />
          </div>
        ))}
      </CardContent>
    </Card>
  )
}