| import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; | 
| import { | 
|     useDataProvider, | 
|     useTranslate, | 
| } from 'react-admin'; | 
| import { Box, Divider, Stack, LinearProgress } from '@mui/material'; | 
|   | 
| import { Action } from './Action'; | 
|   | 
| export const ActionsIterator = ({ actionIds }) => { | 
|     const dataProvider = useDataProvider(); | 
|   | 
|     const [actions, setActions] = useState([]); | 
|   | 
|     useEffect(() => { | 
|         if (actionIds?.length > 0) { | 
|             dataProvider.getMany('action', { ids: actionIds }).then(res => { | 
|                 if (res.data?.length > 0) { | 
|                     setActions(res.data); | 
|                 } | 
|             }) | 
|         } | 
|     }, [actionIds]) | 
|   | 
|     if (!actionIds?.length) return <LinearProgress />; | 
|   | 
|     return ( | 
|         <Box mt={2}> | 
|             {actions && ( | 
|                 <Stack mt={2} gap={1}> | 
|                     {actions.map((action, idx) => ( | 
|                         <React.Fragment key={idx}> | 
|                             <Action | 
|                                 data={action} | 
|                                 isLast={idx === actions.length - 1} | 
|                                 key={idx} | 
|                             /> | 
|                             {idx < actions.length - 1 && <Divider />} | 
|                         </React.Fragment> | 
|                     ))} | 
|                 </Stack> | 
|             )} | 
|         </Box> | 
|     ); | 
| }; |