import { ActionFiltersBar } from '@/components/actions/ActionFiltersBar';
import { ActionList } from '@/components/actions/ActionList';
import { ActionsHeader } from '@/components/actions/ActionsHeader';
import { ActionsViewData } from '@/lib/view-data/ActionsViewData';
import { Box } from '@/ui/Box';

export function ActionsTemplate({ actions }: ActionsViewData) {
  return (
    <Box display="flex" flexDirection="col" fullHeight bg="bg-[#0C0D0F]" color="text-white">
      <ActionsHeader title="Telemetry Actions" />
      <Box display="flex" flexDirection="col" flexGrow={1} overflow="hidden">
        <ActionFiltersBar />
        <Box flexGrow={1} overflow="auto" p={4}>
          <ActionList actions={actions} />
        </Box>
      </Box>
    </Box>
  );
}