diff --git a/web/src/pages/Execution/Execution.tsx b/web/src/pages/Execution/Execution.tsx
index 0f509639a..dafb08918 100644
--- a/web/src/pages/Execution/Execution.tsx
+++ b/web/src/pages/Execution/Execution.tsx
@@ -47,7 +47,7 @@ const Execution = () => {
 
   useSpaceSSE({
     space,
-    events: ['execution_updated', 'execution_completed'],
+    events: ['execution_updated', 'execution_completed', 'execution_canceled', 'execution_running'],
     onEvent: data => {
       if (
         data?.repo_id === execution?.repo_id &&
diff --git a/web/src/pages/ExecutionList/ExecutionList.tsx b/web/src/pages/ExecutionList/ExecutionList.tsx
index b0954cfe8..ec42bd2e2 100644
--- a/web/src/pages/ExecutionList/ExecutionList.tsx
+++ b/web/src/pages/ExecutionList/ExecutionList.tsx
@@ -69,7 +69,7 @@ const ExecutionList = () => {
 
   useSpaceSSE({
     space,
-    events: ['execution_updated', 'execution_completed'],
+    events: ['execution_updated', 'execution_completed', 'execution_canceled', 'execution_running'],
     onEvent: data => {
       // ideally this would include number - so we only check for executions on the page - but what if new executions are kicked off? - could check for ids that are higher than the lowest id on the page?
       if (
diff --git a/web/src/pages/PipelineList/PipelineList.tsx b/web/src/pages/PipelineList/PipelineList.tsx
index 4e970a4e6..9013887e0 100644
--- a/web/src/pages/PipelineList/PipelineList.tsx
+++ b/web/src/pages/PipelineList/PipelineList.tsx
@@ -79,7 +79,7 @@ const PipelineList = () => {
 
   useSpaceSSE({
     space,
-    events: ['execution_updated', 'execution_completed'],
+    events: ['execution_updated', 'execution_completed', 'execution_canceled', 'execution_running'],
     onEvent: data => {
       // should I include pipeline id here? what if a new pipeline is created? coould check for ids that are higher than the lowest id on the page?
       if (pipelines?.some(pipeline => pipeline.repo_id === data?.repo_id && pipeline.id === data?.pipeline_id)) {
@@ -105,7 +105,7 @@ const PipelineList = () => {
     () => [
       {
         Header: getString('pipelines.name'),
-        width: 'calc(100% - 210px)',
+        width: 'calc(50% - 105px)',
         Cell: ({ row }: CellProps<TypesPipeline>) => {
           const record = row.original
           return (
@@ -127,7 +127,7 @@ const PipelineList = () => {
       },
       {
         Header: getString('pipelines.lastExecution'),
-        width: 'calc(50% - 90px)',
+        width: 'calc(50% - 105px)',
         Cell: ({ row }: CellProps<TypesPipeline>) => {
           const record = row.original.execution