diff --git a/components/elements/processes/index.tsx b/components/elements/processes/index.tsx
index 140186c..374e15f 100644
--- a/components/elements/processes/index.tsx
+++ b/components/elements/processes/index.tsx
@@ -26,6 +26,8 @@ export interface ProcessProgressInterface {
     total: number,
     progress: number,
     memory: any[],
+    remaining: string
+    percent: number
 }
 
 export interface ProcessInterface {
@@ -45,14 +47,20 @@ export interface ProcessInterface {
     pausedAt: string | null,
     cancelledAt: string | null
     completedAt: string | null
+    status: Status
+    canPlay: boolean
+    canPause: boolean
+    canRepeat: boolean
+    canStop: boolean
+    canKill: boolean
 }
 
 enum Status {
-    Wait,
-    Running,
-    Cancelled,
-    Error,
-    Success
+    Wait = 'wait',
+    Running = 'running',
+    Cancelled = 'cancelled',
+    Error = 'error',
+    Success = 'success',
 }
 
 export default function Processes() {
@@ -99,28 +107,6 @@ export default function Processes() {
     }, [page]);
 
     let isFinished = (process: ProcessInterface) => process.cancelledAt || process.completedAt
-    let canPlay = (process: ProcessInterface) => !isFinished(process) && process.progress && process.pausedAt
-    let canPause = (process: ProcessInterface) => !isFinished(process) && process.progress && !process.pausedAt
-    let canRepeat = (process: ProcessInterface) => isFinished(process)
-    let canStop = (process: ProcessInterface) => !isFinished(process) && process.progress
-    let canKill = (process: ProcessInterface) => !isFinished(process) && process.startedAt
-    let progress = (progress: ProcessProgressInterface) => progress.progress / progress.total * 100
-
-    let status = (process: ProcessInterface): Status => {
-        if (process.cancelledAt && process.completedAt) {
-            return Status.Cancelled
-        }
-        if (process.exception && process.completedAt) {
-            return Status.Error
-        }
-        if (!process.exception && process.completedAt) {
-            return Status.Success
-        }
-        if (process.startedAt && !process.completedAt) {
-            return Status.Running
-        }
-        return Status.Wait
-    }
 
     const handleChangePage = (event: any, page: number) => {
         setPage(page);
@@ -157,55 +143,6 @@ export default function Processes() {
         setOpen(false)
     }
 
-    let formatSize = (length: any) => {
-        var i = 0, type = ['b','Kb','Mb','Gb','Tb','Pb'];
-        while((length / 1000 | 0) && i < type.length - 1) {
-            length /= 1024;
-            i++;
-        }
-        return length.toFixed(2) + ' ' + type[i];
-    }
-
-    let remaining = (process: ProcessInterface) =>
-    {
-        if (!process?.progress?.progress || !process.startedAt) {
-            return null
-        }
-        return Math.round((new Date().getTime() - new Date(process.startedAt).getTime()) / process?.progress.progress * (process?.progress.total - process?.progress.progress));
-    }
-
-    let formatTime = ($secs: number | null) =>  {
-        if ($secs === null) {
-            return ''
-        }
-        let $timeFormats = [
-            [0, '< 1 sec'],
-            [1, '1 sec'],
-            [2, 'secs', 1],
-            [60, '1 min'],
-            [120, 'mins', 60],
-            [3600, '1 hr'],
-            [7200, 'hrs', 3600],
-            [86400, '1 day'],
-            [172800, 'days', 86400],
-        ];
-
-        for (let $index in $timeFormats) {
-            let $format = $timeFormats[$index]
-            if ($secs >= $format[0]) {
-                if ((typeof $timeFormats[$index + 1] !== 'undefined' && $secs < $timeFormats[$index + 1][0])
-                    || $index == $timeFormats.length - 1
-            ) {
-                    if (2 == $format.length) {
-                        return $format[1];
-                    }
-
-                    return Math.floor($secs / $format[2]) + ' ' + $format[1];
-                }
-            }
-        }
-    }
-
     return (
         <>
             <TableContainer>
@@ -226,42 +163,42 @@ export default function Processes() {
                                 <TableCell>
                                     {!process.progress && !isFinished(process) && <LinearProgress/>}
                                     {!process.progress && isFinished(process) && <LinearProgress variant="determinate" value={100}/>}
-                                    {process.progress && <LinearProgress variant="determinate" value={progress(process.progress)}/>}
+                                    {process.progress && <LinearProgress variant="determinate" value={process.progress.percent}/>}
                                     {process.progress && <span>
-                                    {`${process.progress.progress}`} / {`${process.progress.total}`} - {progress(process.progress)}% [{formatSize(process.progress.memory)}] / {formatTime(remaining(process))}
+                                    {`${process.progress.progress}`} / {`${process.progress.total}`} - {process.progress.percent}% [{process.progress.memory}] / {process.progress.remaining}
                                 </span>}
-                                    {canPlay(process) && <IconButton title={`Play`} aria-label="Play">
+                                    {process.canPlay && <IconButton title={`Play`} aria-label="Play">
                                         <PlayCircleOutline/>
                                     </IconButton>}
-                                    {canPause(process) && <IconButton title={`Pause`} aria-label="Pause">
+                                    {process.canPause && <IconButton title={`Pause`} aria-label="Pause">
                                         <PauseCircleOutline/>
                                     </IconButton>}
-                                    {canStop(process) && <IconButton title={`Stop`} aria-label="Stop">
+                                    {process.canStop && <IconButton title={`Stop`} aria-label="Stop">
                                         <StopCircleOutlined/>
                                     </IconButton>}
                                 </TableCell>
                                 <TableCell>
-                                    {Status.Error === status(process) && <IconButton title={`Error`} aria-label="Error">
+                                    {Status.Error === process.status && <IconButton title={`Error`} aria-label="Error">
                                         <ErrorOutline/>
                                     </IconButton>}
-                                    {Status.Success === status(process) && <IconButton title={`Success`} aria-label="Success">
+                                    {Status.Success === process.status && <IconButton title={`Success`} aria-label="Success">
                                         <CheckCircleOutline/>
                                     </IconButton>}
-                                    {Status.Running === status(process) && <IconButton title={`Running`} aria-label="Running">
+                                    {Status.Running === process.status && <IconButton title={`Running`} aria-label="Running">
                                         <RunCircleOutlined/>
                                     </IconButton>}
-                                    {Status.Cancelled === status(process) && <IconButton title={`Cancelled`} aria-label="Cancelled">
+                                    {Status.Cancelled === process.status && <IconButton title={`Cancelled`} aria-label="Cancelled">
                                         <StopCircleOutlined/>
                                     </IconButton>}
-                                    {Status.Wait === status(process) && <IconButton title={`Wait`} aria-label="Wait">
+                                    {Status.Wait === process.status && <IconButton title={`Wait`} aria-label="Wait">
                                         <HourglassEmptyOutlined/>
                                     </IconButton>}
                                 </TableCell>
                                 <TableCell>
-                                    {canRepeat(process) && <IconButton onClick={() => openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat">
+                                    {process.canRepeat && <IconButton onClick={() => openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat">
                                         <ReplayOutlined/>
                                     </IconButton>}
-                                    {canKill(process) && <IconButton title={`Kill`} aria-label="Kill">
+                                    {process.canKill && <IconButton title={`Kill`} aria-label="Kill">
                                         <DeleteForeverOutlined/>
                                     </IconButton>}
                                     {process?.outputId && <IconButton title={`Output`} onClick={() => output(process)} aria-label="Output">