diff --git a/web/src/views/envConfig/envConfig.jsx b/web/src/views/envConfig/envConfig.jsx
index dfe74fa96..2d8099a23 100644
--- a/web/src/views/envConfig/envConfig.jsx
+++ b/web/src/views/envConfig/envConfig.jsx
@@ -187,7 +187,6 @@ export function EnvConfig(props) {
 
   const validationCallback = (errors) => {
     if (errors) {
-      errors.forEach(e => toast.warn(e.message), { autoClose: 7000, className: 'font-xs font-mono' })
       setErrors(errors);
     } else {
       setErrors(undefined);
@@ -205,8 +204,7 @@ export function EnvConfig(props) {
   const save = () => {
     if (errors) {
       errors.forEach(e => toast.warn(e.message), {
-        className: "bg-gray-50 shadow-lg p-2",
-        autoClose: 7000,
+        autoClose: 5000,
       })
       return
     }
diff --git a/web/src/views/environment/environment.jsx b/web/src/views/environment/environment.jsx
index 45c88aec3..15df83765 100644
--- a/web/src/views/environment/environment.jsx
+++ b/web/src/views/environment/environment.jsx
@@ -96,10 +96,9 @@ export default function EnvironmentView(props) {
   const saveComponents = () => {
     for (const variable of Object.keys(errors)) {
       if (errors[variable] !== null) {
-        toast({
-          render: <Error header="Error" message={<ul>
-            {errors[variable].map(error => (<li>{`${error.message}`}</li>))}
-          </ul>} />,
+        toast(<Error header="Error" message={<ul>
+          {errors[variable].map(error => (<li>{`${error.message}`}</li>))}
+        </ul>} />, {
           className: "bg-red-50 shadow-lg p-2",
           bodyClassName: "p-2",
           progressClassName: "!bg-red-200",
@@ -114,7 +113,7 @@ export default function EnvironmentView(props) {
     gimletClient.saveInfrastructureComponents(environment.name, stackConfig)
       .then((data) => {
         toast.update(progressToastId.current, {
-          render: <Success header="Success" message="A Pull Request was created" link={data.link}/>,
+          render: <Success header="Success" message={<div className='pb-4'>A Pull Request was created</div>} link={data.createdPr.link}/>,
           className: "bg-green-50 shadow-lg p-2",
           bodyClassName: "p-2",
         });
diff --git a/web/src/views/environments/environments.jsx b/web/src/views/environments/environments.jsx
index 716d2f915..d1fc7814c 100644
--- a/web/src/views/environments/environments.jsx
+++ b/web/src/views/environments/environments.jsx
@@ -1,14 +1,17 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import {
   ACTION_TYPE_ENVS,
 } from "../../redux/redux";
 import EnvironmentCard from '../../components/environmentCard/environmentCard';
 import { SkeletonLoader } from '../../../src/views/repositories/repositories';
 import { useNavigate } from 'react-router-dom'
+import { toast } from 'react-toastify';
+import { InProgress, Success, Error } from '../../popUpWindow';
 
 export default function Environments(props) {
   const { store, gimletClient } = props
   const navigate = useNavigate()
+  const progressToastId = useRef(null);
 
   const reduxState = store.getState();
   const [connectedAgents, setConnectedAgents] = useState(reduxState.connectedAgents)