@open-mercato/core 0.5.1-develop.2663.2c29774b5b → 0.5.1-develop.2681.c559bb2bc3

package/src/modules/customers/components/detail/schedule/LinkedEntitiesField.tsx

@@ -0,0 +1,277 @@
+'use client'
+
+import * as React from 'react'
+import { Building2, Briefcase, FileText, Search, X } from 'lucide-react'
+import { cn } from '@open-mercato/shared/lib/utils'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { readApiResultOrThrow } from '@open-mercato/ui/backend/utils/apiCall'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { IconButton } from '@open-mercato/ui/primitives/icon-button'
+import { Popover, PopoverContent, PopoverTrigger } from '@open-mercato/ui/primitives/popover'
+import type { ActivityType, ScheduleFieldId } from './fieldConfig'
+import { isVisible } from './fieldConfig'
+import type { LinkedEntity } from './useScheduleFormState'
+
+const ENTITY_LINK_TYPES = ['company', 'deal', 'offer'] as const
+
+function readLabelCandidate(value: unknown): string | null {
+  if (typeof value !== 'string') return null
+  const trimmed = value.trim()
+  return trimmed.length > 0 ? trimmed : null
+}
+
+function resolveLinkedEntityLabel(
+  item: Record<string, unknown>,
+  linkType: 'company' | 'deal' | 'offer',
+): string {
+  if (linkType === 'offer') {
+    const quoteNumber =
+      readLabelCandidate(item.quoteNumber)
+      ?? readLabelCandidate(item.quote_number)
+      ?? readLabelCandidate(item.documentNumber)
+      ?? readLabelCandidate(item.document_number)
+      ?? readLabelCandidate(item.externalReference)
+      ?? readLabelCandidate(item.external_reference)
+    const customerName =
+      readLabelCandidate(item.customerName)
+      ?? readLabelCandidate(item.customer_name)
+      ?? readLabelCandidate(item.display_name)
+      ?? readLabelCandidate(item.displayName)
+      ?? readLabelCandidate(item.name)
+      ?? readLabelCandidate(item.title)
+    if (quoteNumber && customerName) return `${quoteNumber} · ${customerName}`
+    if (quoteNumber) return quoteNumber
+    if (customerName) return customerName
+  }
+
+  if (linkType === 'deal') {
+    const dealLabel =
+      readLabelCandidate(item.title)
+      ?? readLabelCandidate(item.name)
+      ?? readLabelCandidate(item.display_name)
+      ?? readLabelCandidate(item.displayName)
+    if (dealLabel) return dealLabel
+  }
+
+  return (
+    readLabelCandidate(item.display_name)
+    ?? readLabelCandidate(item.displayName)
+    ?? readLabelCandidate(item.name)
+    ?? readLabelCandidate(item.title)
+    ?? String(item.id ?? '')
+  )
+}
+
+function EntityLinkSearchPopover({
+  existingIds,
+  onAdd,
+  onAddMany,
+  t,
+}: {
+  existingIds: Set<string>
+  onAdd: (entity: LinkedEntity) => void
+  onAddMany: (entities: LinkedEntity[]) => void
+  t: (key: string, fallback: string) => string
+}) {
+  const [open, setOpen] = React.useState(false)
+  const [linkType, setLinkType] = React.useState<'company' | 'deal' | 'offer'>('company')
+  const [query, setQuery] = React.useState('')
+  const [results, setResults] = React.useState<Array<{ id: string; label: string }>>([])
+  const [page, setPage] = React.useState(1)
+  const [totalPages, setTotalPages] = React.useState(1)
+  const [loading, setLoading] = React.useState(false)
+  const selectableResults = React.useMemo(
+    () => results.filter((result) => !existingIds.has(result.id)),
+    [existingIds, results],
+  )
+
+  React.useEffect(() => {
+    if (!open) return
+    const controller = new AbortController()
+    setLoading(true)
+    const searchParam = query.trim() ? `&search=${encodeURIComponent(query.trim())}` : ''
+    const pagingParam = `&page=${page}&pageSize=20`
+    const endpoint = linkType === 'company'
+      ? `/api/customers/companies?sortField=name&sortDir=asc${pagingParam}${searchParam}`
+      : linkType === 'deal'
+        ? `/api/customers/deals?pageSize=20&page=${page}${searchParam}`
+        : `/api/sales/quotes?pageSize=20&page=${page}${searchParam}`
+    readApiResultOrThrow<{ items?: Array<Record<string, unknown>>; totalPages?: number; page?: number; pageSize?: number; total?: number }>(endpoint, { signal: controller.signal })
+      .then((data) => {
+        const items = Array.isArray(data?.items) ? data.items : []
+        const nextResults = items.map((item) => ({
+          id: typeof item?.id === 'string' ? item.id : '',
+          label: resolveLinkedEntityLabel(item, linkType),
+        })).filter((r) => r.id)
+        setResults((current) => {
+          if (page <= 1) return nextResults
+          const merged = new Map(current.map((entry) => [entry.id, entry]))
+          nextResults.forEach((entry) => merged.set(entry.id, entry))
+          return Array.from(merged.values())
+        })
+        if (typeof data?.totalPages === 'number') {
+          setTotalPages(data.totalPages)
+        } else if (typeof data?.total === 'number' && typeof data?.pageSize === 'number') {
+          setTotalPages(Math.max(1, Math.ceil(data.total / data.pageSize)))
+        } else {
+          setTotalPages(1)
+        }
+      })
+      .catch(() => setResults([]))
+      .finally(() => setLoading(false))
+    return () => controller.abort()
+  }, [open, page, query, linkType])
+
+  React.useEffect(() => {
+    if (!open) return
+    setPage(1)
+  }, [open, query, linkType])
+
+  return (
+    <Popover open={open} onOpenChange={setOpen}>
+      <PopoverTrigger asChild>
+        <Button type="button" variant="ghost" size="sm" className="h-auto inline-flex items-center gap-1.5 rounded-full border border-border bg-background px-2.5 py-1.5 text-xs text-muted-foreground">
+          <span className="text-sm">+</span>
+          {t('customers.schedule.addLink', 'Add link')}
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent align="start" className="w-72 p-2">
+        <div className="flex gap-1 mb-2">
+          {ENTITY_LINK_TYPES.map((type) => (
+            <Button
+              key={type}
+              type="button"
+              variant={linkType === type ? 'default' : 'ghost'}
+              size="sm"
+              className="h-6 text-xs flex-1"
+              onClick={() => { setLinkType(type as typeof linkType); setQuery('') }}
+            >
+              {type === 'company' ? <Building2 className="mr-1 size-3" /> : type === 'deal' ? <Briefcase className="mr-1 size-3" /> : <FileText className="mr-1 size-3" />}
+              {type === 'company' ? t('customers.schedule.linkType.company', 'Company') : type === 'deal' ? t('customers.schedule.linkType.deal', 'Deal') : t('customers.schedule.linkType.offer', 'Offer')}
+            </Button>
+          ))}
+        </div>
+        <div className="flex items-center gap-2 rounded-md border bg-background px-2 py-1.5 mb-2">
+          <Search className="size-3.5 text-muted-foreground shrink-0" />
+          <input
+            type="text"
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+            placeholder={t('customers.schedule.searchEntity', 'Search...')}
+            className="flex-1 bg-transparent text-sm focus:outline-none"
+            autoFocus
+          />
+        </div>
+        {selectableResults.length ? (
+          <div className="mb-2">
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              className="w-full"
+              onClick={() => {
+                onAddMany(
+                  selectableResults.map((result) => ({
+                    id: result.id,
+                    type: linkType,
+                    label: result.label,
+                  })),
+                )
+                setOpen(false)
+                setQuery('')
+              }}
+            >
+              {t('customers.schedule.addVisibleLinks', 'Add all visible')}
+            </Button>
+          </div>
+        ) : null}
+        <div className="max-h-48 overflow-y-auto space-y-0.5">
+          {loading && <p className="px-2 py-3 text-xs text-muted-foreground text-center">{t('customers.schedule.searching', 'Searching...')}</p>}
+          {!loading && results.length === 0 && <p className="px-2 py-3 text-xs text-muted-foreground text-center">{t('customers.schedule.noResults', 'No results')}</p>}
+          {results.map((r) => {
+            const alreadyLinked = existingIds.has(r.id)
+            return (
+              <Button
+                key={r.id}
+                type="button"
+                variant="ghost"
+                size="sm"
+                disabled={alreadyLinked}
+                onClick={() => {
+                  onAdd({ id: r.id, type: linkType, label: r.label })
+                  setOpen(false)
+                  setQuery('')
+                }}
+                className={cn(
+                  'h-auto flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm transition-colors',
+                  alreadyLinked ? 'opacity-40 cursor-default' : 'hover:bg-accent cursor-pointer',
+                )}
+              >
+                {linkType === 'company' ? <Building2 className="size-3.5 text-muted-foreground shrink-0" /> : linkType === 'deal' ? <Briefcase className="size-3.5 text-muted-foreground shrink-0" /> : <FileText className="size-3.5 text-muted-foreground shrink-0" />}
+                <span className="min-w-0 flex-1 truncate">{r.label}</span>
+              </Button>
+            )
+          })}
+          {!loading && page < totalPages ? (
+            <div className="px-2 py-2">
+              <Button type="button" variant="outline" size="sm" className="w-full" onClick={() => setPage((current) => current + 1)}>
+                {t('customers.schedule.loadMore', 'Load more')}
+              </Button>
+            </div>
+          ) : null}
+        </div>
+      </PopoverContent>
+    </Popover>
+  )
+}
+
+interface LinkedEntitiesFieldProps {
+  visible: Set<ScheduleFieldId>
+  activityType: ActivityType
+  linkedEntities: LinkedEntity[]
+  setLinkedEntities: React.Dispatch<React.SetStateAction<LinkedEntity[]>>
+}
+
+export function LinkedEntitiesField({
+  visible,
+  activityType,
+  linkedEntities,
+  setLinkedEntities,
+}: LinkedEntitiesFieldProps) {
+  const t = useT()
+
+  if (!isVisible(activityType, 'linkedEntities')) return null
+
+  return (
+    <div>
+      <label className="text-overline font-semibold uppercase text-muted-foreground tracking-wider">
+        {t('customers.schedule.linkedEntities', 'Linked entities')}
+      </label>
+      <div className="mt-2.5 flex flex-wrap content-center items-center gap-2">
+        {linkedEntities.map((entity) => (
+          <div
+            key={entity.id}
+            className={cn(
+              'inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1.5 text-xs',
+              entity.type === 'deal'
+                ? 'border-status-success-border bg-status-success-bg font-semibold text-foreground'
+                : 'border-border bg-muted text-foreground',
+            )}
+          >
+            {entity.type === 'company' ? <Building2 className="size-3" /> : entity.type === 'deal' ? <Briefcase className="size-3" /> : <FileText className="size-3" />}
+            {entity.label}
+            <IconButton type="button" variant="ghost" size="sm" onClick={() => setLinkedEntities((prev) => prev.filter((e) => e.id !== entity.id))} className="h-auto text-muted-foreground hover:text-foreground p-0" aria-label={t('customers.schedule.removeLink', 'Remove link')}>
+              <X className="size-2.5" />
+            </IconButton>
+          </div>
+        ))}
+        <EntityLinkSearchPopover
+          existingIds={new Set(linkedEntities.map((e) => e.id))}
+          onAdd={(entity) => setLinkedEntities((prev) => [...prev, entity])}
+          onAddMany={(entities) => setLinkedEntities((prev) => [...prev, ...entities])}
+          t={t}
+        />
+      </div>
+    </div>
+  )
+}

package/src/modules/customers/components/detail/schedule/LocationField.tsx

@@ -0,0 +1,42 @@
+'use client'
+
+import { MapPin } from 'lucide-react'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import type { ActivityType, ScheduleFieldId } from './fieldConfig'
+import { isVisible, getFieldLabel } from './fieldConfig'
+
+interface LocationFieldProps {
+  visible: Set<ScheduleFieldId>
+  activityType: ActivityType
+  location: string
+  setLocation: (value: string) => void
+}
+
+export function LocationField({
+  visible,
+  activityType,
+  location,
+  setLocation,
+}: LocationFieldProps) {
+  const t = useT()
+
+  if (!isVisible(activityType, 'location')) return null
+
+  return (
+    <div className="flex flex-col gap-1.5">
+      <label className="text-overline font-semibold text-muted-foreground tracking-wider">
+        {getFieldLabel(activityType, 'location', t, 'customers.schedule.location', 'Location')}
+      </label>
+      <div className="flex items-center gap-2 rounded-md border border-border bg-background px-3 py-2.5">
+        <MapPin className="size-3.5 text-muted-foreground shrink-0" />
+        <input
+          type="text"
+          value={location}
+          onChange={(e) => setLocation(e.target.value)}
+          placeholder={t('customers.schedule.locationPlaceholder', 'Add location or meeting link...')}
+          className="flex-1 bg-transparent text-sm text-foreground placeholder:text-muted-foreground focus:outline-none"
+        />
+      </div>
+    </div>
+  )
+}

package/src/modules/customers/components/detail/schedule/ParticipantsField.tsx

@@ -0,0 +1,255 @@
+'use client'
+
+import * as React from 'react'
+import { Users, Search, X, Clock, CheckCircle2, XCircle } from 'lucide-react'
+import { cn } from '@open-mercato/shared/lib/utils'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { IconButton } from '@open-mercato/ui/primitives/icon-button'
+import { Popover, PopoverContent, PopoverTrigger } from '@open-mercato/ui/primitives/popover'
+import { fetchAssignableStaffMembersPage } from '../assignableStaff'
+import type { ActivityType, ScheduleFieldId } from './fieldConfig'
+import { isVisible } from './fieldConfig'
+import type { Participant, RsvpStatus } from './useScheduleFormState'
+import { PARTICIPANT_COLORS } from './useScheduleFormState'
+
+function ParticipantSearchPopover({
+  existingIds,
+  onAdd,
+  onAddMany,
+  t,
+}: {
+  existingIds: Set<string>
+  onAdd: (p: Participant) => void
+  onAddMany: (participants: Participant[]) => void
+  t: (key: string, fallback: string) => string
+}) {
+  const [open, setOpen] = React.useState(false)
+  const [query, setQuery] = React.useState('')
+  const [results, setResults] = React.useState<Array<{ userId: string; name: string; email: string }>>([])
+  const [page, setPage] = React.useState(1)
+  const [totalPages, setTotalPages] = React.useState(1)
+  const [loading, setLoading] = React.useState(false)
+  const [loadError, setLoadError] = React.useState<string | null>(null)
+  const selectableResults = React.useMemo(
+    () => results.filter((result) => !existingIds.has(result.userId)),
+    [existingIds, results],
+  )
+
+  React.useEffect(() => {
+    if (!open) return
+    const controller = new AbortController()
+    setLoading(true)
+    fetchAssignableStaffMembersPage(query, { page, pageSize: 20, signal: controller.signal })
+      .then((result) => {
+        const members = result.items
+        const nextResults = members.map((member) => ({
+          userId: member.userId,
+          name: member.displayName,
+          email: member.email ?? '',
+        }))
+        setResults((current) => {
+          if (page <= 1) return nextResults
+          const merged = new Map(current.map((entry) => [entry.userId, entry]))
+          nextResults.forEach((entry) => merged.set(entry.userId, entry))
+          return Array.from(merged.values())
+        })
+        setTotalPages(result.total > 0 ? Math.max(1, Math.ceil(result.total / result.pageSize)) : 1)
+        setLoadError(null)
+      })
+      .catch(() => {
+        setResults([])
+        setLoadError(
+          t(
+            'customers.assignableStaff.loadError',
+            'Unable to load team members. Check your permissions and try again.',
+          ),
+        )
+      })
+      .finally(() => setLoading(false))
+    return () => controller.abort()
+  }, [open, page, query, t])
+
+  React.useEffect(() => {
+    if (!open) return
+    setPage(1)
+  }, [open, query])
+
+  return (
+    <Popover open={open} onOpenChange={setOpen}>
+      <PopoverTrigger asChild>
+        <Button type="button" variant="ghost" size="sm" className="h-auto inline-flex items-center gap-1.5 rounded-full border border-status-success-border bg-status-success-bg px-2.5 py-1.5 text-xs font-semibold text-foreground">
+          <Users className="size-3" />
+          {t('customers.schedule.addParticipant', 'Add participant')}
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent align="start" className="w-72 p-2">
+        <div className="flex items-center gap-2 rounded-md border bg-background px-2 py-1.5 mb-2">
+          <Search className="size-3.5 text-muted-foreground shrink-0" />
+          <input
+            type="text"
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+            placeholder={t('customers.schedule.searchParticipant', 'Search team members...')}
+            className="flex-1 bg-transparent text-sm focus:outline-none"
+            autoFocus
+          />
+        </div>
+        {selectableResults.length ? (
+          <div className="mb-2">
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              className="w-full"
+              onClick={() => {
+                onAddMany(
+                  selectableResults.map((participant, index) => ({
+                    userId: participant.userId,
+                    name: participant.name,
+                    email: participant.email,
+                    color: PARTICIPANT_COLORS[(existingIds.size + index) % PARTICIPANT_COLORS.length],
+                  })),
+                )
+                setOpen(false)
+                setQuery('')
+              }}
+            >
+              {t('customers.schedule.addVisibleParticipants', 'Add all visible')}
+            </Button>
+          </div>
+        ) : null}
+        <div className="max-h-48 overflow-y-auto space-y-0.5">
+          {loading && <p className="px-2 py-3 text-xs text-muted-foreground text-center">{t('customers.schedule.searching', 'Searching...')}</p>}
+          {!loading && loadError && <p className="px-2 py-3 text-xs text-destructive text-center">{loadError}</p>}
+          {!loading && !loadError && results.length === 0 && <p className="px-2 py-3 text-xs text-muted-foreground text-center">{t('customers.schedule.noResults', 'No results')}</p>}
+          {results.map((r) => {
+            const alreadyAdded = existingIds.has(r.userId)
+            return (
+              <Button
+                key={r.userId}
+                type="button"
+                variant="ghost"
+                size="sm"
+                disabled={alreadyAdded}
+                onClick={() => {
+                  onAdd({ userId: r.userId, name: r.name, email: r.email, color: PARTICIPANT_COLORS[existingIds.size % PARTICIPANT_COLORS.length] })
+                  setOpen(false)
+                  setQuery('')
+                }}
+                className={cn(
+                  'h-auto flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm transition-colors',
+                  alreadyAdded ? 'opacity-40 cursor-default' : 'hover:bg-accent cursor-pointer',
+                )}
+              >
+                <span className="inline-flex size-6 items-center justify-center rounded-full bg-muted text-xs font-bold shrink-0">
+                  {r.name.charAt(0).toUpperCase()}
+                </span>
+                <span className="min-w-0 flex-1 truncate">{r.name}</span>
+                {r.email && <span className="text-xs text-muted-foreground truncate">{r.email}</span>}
+              </Button>
+            )
+          })}
+          {!loading && !loadError && page < totalPages ? (
+            <div className="px-2 py-2">
+              <Button type="button" variant="outline" size="sm" className="w-full" onClick={() => setPage((current) => current + 1)}>
+                {t('customers.schedule.loadMore', 'Load more')}
+              </Button>
+            </div>
+          ) : null}
+        </div>
+      </PopoverContent>
+    </Popover>
+  )
+}
+
+interface ParticipantsFieldProps {
+  visible: Set<ScheduleFieldId>
+  activityType: ActivityType
+  participants: Participant[]
+  setParticipants: React.Dispatch<React.SetStateAction<Participant[]>>
+  removeParticipant: (userId: string) => void
+  guestPermissions: { canInviteOthers: boolean; canModify: boolean; canSeeList: boolean }
+  setGuestPermissions: React.Dispatch<React.SetStateAction<{ canInviteOthers: boolean; canModify: boolean; canSeeList: boolean }>>
+}
+
+export function ParticipantsField({
+  visible,
+  activityType,
+  participants,
+  setParticipants,
+  removeParticipant,
+  guestPermissions,
+  setGuestPermissions,
+}: ParticipantsFieldProps) {
+  const t = useT()
+
+  if (!isVisible(activityType, 'participants')) return null
+
+  return (
+    <div>
+      <label className="text-overline font-semibold uppercase text-muted-foreground tracking-wider">
+        {t('customers.schedule.participants', 'Participants')}
+      </label>
+      <div className="mt-2.5 flex flex-wrap content-center items-center gap-2 rounded-lg border border-border bg-background px-3 py-2.5">
+        {participants.map((p) => (
+          <div key={p.userId} className="inline-flex items-center gap-1.5 rounded-full border border-border bg-muted px-2.5 py-1.5">
+            <span className={cn('inline-flex size-5 items-center justify-center rounded-full text-xs font-bold text-white', p.color ?? 'bg-primary')}>
+              {p.name.charAt(0).toUpperCase()}
+            </span>
+            <span className="text-xs text-foreground">{p.name}</span>
+            <IconButton type="button" variant="ghost" size="sm" onClick={() => removeParticipant(p.userId)} className="h-auto text-muted-foreground hover:text-foreground p-0" aria-label={t('customers.schedule.removeParticipant', 'Remove participant')}>
+              <X className="size-3" />
+            </IconButton>
+          </div>
+        ))}
+        <ParticipantSearchPopover
+          existingIds={new Set(participants.map((p) => p.userId))}
+          onAdd={(p) => setParticipants((prev) => [...prev, { ...p, status: 'pending' as RsvpStatus }])}
+          onAddMany={(nextParticipants) => {
+            setParticipants((prev) => [
+              ...prev,
+              ...nextParticipants.map((participant) => ({ ...participant, status: 'pending' as RsvpStatus })),
+            ])
+          }}
+          t={t}
+        />
+      </div>
+
+      {/* Guest permissions -- shown when participants exist */}
+      {participants.length > 0 && (
+        <div className="mt-3 flex flex-wrap items-center gap-x-[16px] gap-y-[6px] text-xs">
+          <span className="font-medium text-muted-foreground">{t('customers.schedule.guestPermissions', 'Guest permissions:')}</span>
+          <label className="flex items-center gap-1.5 cursor-pointer">
+            <input type="checkbox" checked={guestPermissions.canInviteOthers} onChange={(e) => setGuestPermissions((p) => ({ ...p, canInviteOthers: e.target.checked }))} className="rounded" />
+            {t('customers.schedule.guestPerm.invite', 'Invite others')}
+          </label>
+          <label className="flex items-center gap-1.5 cursor-pointer">
+            <input type="checkbox" checked={guestPermissions.canModify} onChange={(e) => setGuestPermissions((p) => ({ ...p, canModify: e.target.checked }))} className="rounded" />
+            {t('customers.schedule.guestPerm.modify', 'Modify')}
+          </label>
+          <label className="flex items-center gap-1.5 cursor-pointer">
+            <input type="checkbox" checked={guestPermissions.canSeeList} onChange={(e) => setGuestPermissions((p) => ({ ...p, canSeeList: e.target.checked }))} className="rounded" />
+            {t('customers.schedule.guestPerm.seeList', 'See list')}
+          </label>
+        </div>
+      )}
+
+      {/* RSVP summary -- shown when participants exist */}
+      {participants.length > 0 && (() => {
+        const accepted = participants.filter((p) => p.status === 'accepted').length
+        const pending = participants.filter((p) => !p.status || p.status === 'pending').length
+        const declined = participants.filter((p) => p.status === 'declined').length
+        if (accepted === 0 && pending === 0 && declined === 0) return null
+        return (
+          <div className="mt-2 flex items-center gap-3 text-xs">
+            <span className="text-muted-foreground">{t('customers.schedule.rsvp.label', 'Responses:')}</span>
+            {accepted > 0 && <span className="flex items-center gap-1 font-medium text-status-success-text"><CheckCircle2 className="size-3.5" /> {accepted} {t('customers.schedule.rsvp.accepted', 'tak')}</span>}
+            {pending > 0 && <span className="flex items-center gap-1 font-medium text-status-warning-text"><Clock className="size-3.5" /> {pending} {t('customers.schedule.rsvp.pending', 'czeka')}</span>}
+            {declined > 0 && <span className="flex items-center gap-1 font-medium text-status-error-text"><XCircle className="size-3.5" /> {declined} {t('customers.schedule.rsvp.declined', 'nie')}</span>}
+          </div>
+        )
+      })()}
+    </div>
+  )
+}

package/src/modules/customers/components/detail/schedule/fieldConfig.ts

@@ -0,0 +1,70 @@
+export type ActivityType = 'meeting' | 'call' | 'task' | 'email'
+
+export type ScheduleFieldId =
+  | 'title'
+  | 'date'
+  | 'startTime'
+  | 'duration'
+  | 'allDay'
+  | 'timezone'
+  | 'recurrence'
+  | 'participants'
+  | 'guestPermissions'
+  | 'location'
+  | 'linkedEntities'
+  | 'description'
+  | 'reminder'
+  | 'visibility'
+
+export const FIELD_VISIBILITY: Record<ActivityType, Set<ScheduleFieldId>> = {
+  meeting: new Set([
+    'title', 'date', 'startTime', 'duration', 'allDay', 'timezone', 'recurrence',
+    'participants', 'guestPermissions', 'location', 'linkedEntities', 'description',
+    'reminder', 'visibility',
+  ]),
+  call: new Set([
+    'title', 'date', 'startTime', 'duration',
+    'participants', 'linkedEntities', 'description',
+    'reminder', 'visibility',
+  ]),
+  task: new Set([
+    'title', 'date',
+    'linkedEntities', 'description',
+    'reminder', 'visibility',
+  ]),
+  email: new Set([
+    'title', 'date', 'startTime',
+    'linkedEntities', 'description',
+    'visibility',
+  ]),
+}
+
+type LabelOverride = { key: string; fallback: string }
+
+export const FIELD_LABEL_OVERRIDES: Partial<
+  Record<ActivityType, Partial<Record<ScheduleFieldId, LabelOverride>>>
+> = {
+  email: {
+    title: { key: 'customers.schedule.subject', fallback: 'Subject' },
+    description: { key: 'customers.schedule.body', fallback: 'Body' },
+  },
+  task: {
+    date: { key: 'customers.schedule.dueDate', fallback: 'Due date' },
+  },
+}
+
+export function isVisible(type: ActivityType, fieldId: ScheduleFieldId): boolean {
+  return FIELD_VISIBILITY[type].has(fieldId)
+}
+
+export function getFieldLabel(
+  type: ActivityType,
+  fieldId: ScheduleFieldId,
+  t: (key: string, fallback: string) => string,
+  defaultKey: string,
+  defaultFallback: string,
+): string {
+  const override = FIELD_LABEL_OVERRIDES[type]?.[fieldId]
+  if (override) return t(override.key, override.fallback)
+  return t(defaultKey, defaultFallback)
+}

package/src/modules/customers/components/detail/schedule/index.ts

@@ -0,0 +1,9 @@
+export { DateTimeFields } from './DateTimeFields'
+export { ParticipantsField } from './ParticipantsField'
+export { LocationField } from './LocationField'
+export { FooterFields } from './FooterFields'
+export { LinkedEntitiesField } from './LinkedEntitiesField'
+export { isVisible, getFieldLabel, FIELD_VISIBILITY, FIELD_LABEL_OVERRIDES } from './fieldConfig'
+export type { ActivityType, ScheduleFieldId } from './fieldConfig'
+export { useScheduleFormState, PARTICIPANT_COLORS } from './useScheduleFormState'
+export type { Participant, LinkedEntity, RsvpStatus, ScheduleActivityEditData } from './useScheduleFormState'