import { HStack, IconButton, Text, VStack } from '@cdx-ui/components';
import { quickActions } from './data';

export function QuickActionsRow() {
  return (
    <HStack className="justify-between gap-3">
      {quickActions.map((action) => (
        <VStack key={action.id} className="items-center gap-1.5">
          <IconButton
            as={action.icon}
            variant="subtle"
            color="action"
            accessibilityLabel={action.label}
          />
          <Text className="body-sm text-content-secondary">{action.label}</Text>
        </VStack>
      ))}
    </HStack>
  );
}