diff --git a/app/Helpers/InstitutionHelper.php b/app/Helpers/InstitutionHelper.php
index f0c0dde..89a4cf7 100644
--- a/app/Helpers/InstitutionHelper.php
+++ b/app/Helpers/InstitutionHelper.php
@@ -59,8 +59,10 @@ public static function GetInstitution(Request $request)
         if ($inst !== '') {
             $full = self::fetchInstitutionById($request, $inst);
             session(['institution' => $full ?? ['inst_id' => $inst]]);
+
             return [$inst, ''];
         }
+
         return ['', ''];
     }
 
diff --git a/app/Http/Middleware/RequireInstitution.php b/app/Http/Middleware/RequireInstitution.php
index f624e72..9fb3fbd 100644
--- a/app/Http/Middleware/RequireInstitution.php
+++ b/app/Http/Middleware/RequireInstitution.php
@@ -62,7 +62,7 @@ public function handle(Request $request, Closure $next): Response
             }
         }
 
-        [$inst, $instErr] = InstitutionHelper::GetInstitution($request);
+        [$inst] = InstitutionHelper::GetInstitution($request);
         if ($inst !== null && $inst !== '') {
             $institution = session('institution');
             if (is_array($institution) && ! empty($institution['inst_id'] ?? '')) {
@@ -74,11 +74,10 @@ public function handle(Request $request, Closure $next): Response
             return $next($request);
         }
 
-        $message = InstitutionHelper::SET_INST_REQUIRED_MESSAGE;
         if ($request->expectsJson()) {
-            return response()->json(['error' => $message], 401);
+            return response()->json(['error' => 'Institution required.'], 401);
         }
 
-        return redirect()->route('set-inst', ['message' => $message]);
+        return redirect()->route('set-inst');
     }
 }
diff --git a/resources/js/Components/Alert.jsx b/resources/js/Components/Alert.jsx
new file mode 100644
index 0000000..3957b41
--- /dev/null
+++ b/resources/js/Components/Alert.jsx
@@ -0,0 +1,97 @@
+import React from 'react';
+import classNames from 'classnames';
+import {
+  CheckCircleIcon,
+  ExclamationTriangleIcon,
+  InformationCircleIcon,
+  XCircleIcon,
+} from '@heroicons/react/24/solid';
+
+const VARIANTS = {
+  danger: {
+    Icon: XCircleIcon,
+    border: 'border-red',
+    surface: 'bg-red-50',
+    iconWrap: 'bg-red',
+    title: 'text-red-900',
+    item: 'text-red-800',
+  },
+  warning: {
+    Icon: ExclamationTriangleIcon,
+    border: 'border-amber-500',
+    surface: 'bg-amber-50',
+    iconWrap: 'bg-amber-500',
+    title: 'text-amber-900',
+    item: 'text-amber-800',
+  },
+  info: {
+    Icon: InformationCircleIcon,
+    border: 'border-sky-500',
+    surface: 'bg-sky-50',
+    iconWrap: 'bg-sky-500',
+    title: 'text-sky-900',
+    item: 'text-sky-800',
+  },
+  success: {
+    Icon: CheckCircleIcon,
+    border: 'border-green-600',
+    surface: 'bg-green-50',
+    iconWrap: 'bg-green-600',
+    title: 'text-green-900',
+    item: 'text-green-800',
+  },
+};
+
+export default function Alert({
+  variant = 'info',
+  mainMsg,
+  msgDict,
+  excludeValue,
+  className,
+}) {
+  if (mainMsg == undefined || mainMsg == '') {
+    return null;
+  }
+
+  const v = VARIANTS[variant] ?? VARIANTS.info;
+  const Icon = v.Icon;
+
+  return (
+    <div
+      className={classNames(
+        className,
+        'flex w-full rounded-lg border-l-[6px] px-7 py-8 shadow-[0px_2px_10px_0px_rgba(0,0,0,0.08)] md:p-9',
+        v.border,
+        v.surface,
+      )}
+    >
+      <div
+        className={classNames(
+          'mr-5 flex h-[34px] w-full max-w-[34px] items-center justify-center rounded-lg',
+          v.iconWrap,
+        )}
+      >
+        <Icon className="size-[18px] text-white" aria-hidden />
+      </div>
+      <div className="flex h-fit w-full flex-col">
+        <h5 className={classNames('mb-3 text-lg font-semibold', v.title)}>
+          {mainMsg}
+        </h5>
+        <ul className="list-inside list-disc">
+          {msgDict !== undefined && Object.keys(msgDict).length !== 0
+            ? Object.entries(msgDict).map(([k, val]) =>
+                val !== excludeValue ? (
+                  <li
+                    className={classNames('text-base leading-relaxed', v.item)}
+                    key={k}
+                  >
+                    <span className="font-semibold">{k}:</span> {val}
+                  </li>
+                ) : null,
+              )
+            : null}
+        </ul>
+      </div>
+    </div>
+  );
+}
diff --git a/resources/js/Components/ErrorAlert.jsx b/resources/js/Components/ErrorAlert.jsx
deleted file mode 100644
index eb54410..0000000
--- a/resources/js/Components/ErrorAlert.jsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import React from 'react';
-import { XCircleIcon } from '@heroicons/react/24/solid';
-import classNames from 'classnames';
-
-export default function ErrorAlert({
-  mainMsg,
-  msgDict,
-  excludeValue,
-  className,
-}) {
-  if (mainMsg == undefined || mainMsg == '') {
-    return null;
-  }
-
-  return (
-    <div
-      className={classNames(
-        className,
-        'flex w-full rounded-lg border-l-[6px] border-red bg-red-50 px-7 py-8 shadow-[0px_2px_10px_0px_rgba(0,0,0,0.08)] md:p-9',
-      )}
-    >
-      <div className="mr-5 flex h-[34px] w-full max-w-[34px] items-center justify-center rounded-lg bg-red">
-        <svg
-          width="18"
-          height="18"
-          viewBox="0 0 18 18"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <g clipPath="url(#clip0_961_15645)">
-            <path
-              d="M9 0.506256C4.30313 0.506256 0.50625 4.30313 0.50625 9.00001C0.50625 13.6969 4.30313 17.5219 9 17.5219C13.6969 17.5219 17.5219 13.6969 17.5219 9.00001C17.5219 4.30313 13.6969 0.506256 9 0.506256ZM9 16.2563C5.00625 16.2563 1.77188 12.9938 1.77188 9.00001C1.77188 5.00626 5.00625 1.77188 9 1.77188C12.9938 1.77188 16.2563 5.03438 16.2563 9.02813C16.2563 12.9938 12.9938 16.2563 9 16.2563Z"
-              fill="white"
-            />
-            <path
-              d="M11.5875 6.38438C11.3344 6.13125 10.9406 6.13125 10.6875 6.38438L9 8.1L7.28438 6.38438C7.03125 6.13125 6.6375 6.13125 6.38438 6.38438C6.13125 6.6375 6.13125 7.03125 6.38438 7.28438L8.1 9L6.38438 10.7156C6.13125 10.9688 6.13125 11.3625 6.38438 11.6156C6.49688 11.7281 6.66563 11.8125 6.83438 11.8125C7.00313 11.8125 7.17188 11.7563 7.28438 11.6156L9 9.9L10.7156 11.6156C10.8281 11.7281 10.9969 11.8125 11.1656 11.8125C11.3344 11.8125 11.5031 11.7563 11.6156 11.6156C11.8688 11.3625 11.8688 10.9688 11.6156 10.7156L9.9 9L11.6156 7.28438C11.8406 7.03125 11.8406 6.6375 11.5875 6.38438Z"
-              fill="white"
-            />
-          </g>
-          <defs>
-            <clipPath id="clip0_961_15645">
-              <rect width="18" height="18" fill="white" />
-            </clipPath>
-          </defs>
-        </svg>
-      </div>
-      <div className="flex w-full flex-col h-fit">
-        <h5 className="mb-3 text-lg font-semibold text-red-900">{mainMsg}</h5>
-        <ul className="list-inside list-disc">
-          {msgDict !== undefined && Object.keys(msgDict).length !== 0 ? (
-            Object.entries(msgDict).map(([k, v]) =>
-              v !== excludeValue ? (
-                <li className="text-base leading-relaxed text-red-800" key={k}>
-                  <span className="font-semibold">{k}:</span> {v}
-                </li>
-              ) : (
-                <></>
-              ),
-            )
-          ) : (
-            <></>
-          )}
-        </ul>
-      </div>
-    </div>
-  );
-}
diff --git a/resources/js/Pages/Dashboard.jsx b/resources/js/Pages/Dashboard.jsx
index e387d6c..d9e0924 100644
--- a/resources/js/Pages/Dashboard.jsx
+++ b/resources/js/Pages/Dashboard.jsx
@@ -1,17 +1,11 @@
 import axios from 'axios';
 import React, { useEffect, useState } from 'react';
 import { Chart } from 'react-google-charts';
-
 import Spinner from '@/Components/Spinner';
 import AppLayout from '@/Layouts/AppLayout';
 import ModelRunHistory from '@/Components/ModelRunHistory';
-import HeaderLabel from '@/Components/HeaderLabel';
-import ErrorAlert from '@/Components/ErrorAlert';
-import classNames from 'classnames';
+import Alert from '@/Components/Alert';
 import { formatModelName } from '@/utils/stringUtils';
-
-import { ChartBarIcon, ArrowUpTrayIcon } from '@heroicons/react/24/outline';
-import Button from '@/Components/Landing/Button';
 import PageHeading from '@/Components/PageHeading';
 
 const histogramOptions = {
@@ -212,10 +206,11 @@ export default function Dashboard({ modelname }) {
             </div>
           ) : error != null &&
             !(error.message == 'NO_MODELS' || error.message == 'NO_RUNS') ? (
-            <ErrorAlert
+            <Alert
+              variant="danger"
               mainMsg={'Error: ' + error.message}
               className="ml-24 mr-24 flex h-fit"
-            ></ErrorAlert>
+            />
           ) : (
             <div
               className="flex w-full flex-col items-center"
@@ -229,7 +224,7 @@ export default function Dashboard({ modelname }) {
               </div>
 
               {error != null &&
-                (error.message == 'NO_MODELS' || error.message == 'NO_RUNS') ? (
+              (error.message == 'NO_MODELS' || error.message == 'NO_RUNS') ? (
                 <>
                   <div className="flex w-full flex-row justify-between pl-12 pr-12 pt-12">
                     <div className="flex flex-row items-center justify-center gap-x-2">
@@ -264,7 +259,10 @@ export default function Dashboard({ modelname }) {
                     </div>
                   )}
                   <div className="mx-auto w-full max-w-[1057px]">
-                    <ModelRunHistory runInfos={[]} modelName={modelInfo?.name || ''} />
+                    <ModelRunHistory
+                      runInfos={[]}
+                      modelName={modelInfo?.name || ''}
+                    />
                   </div>
                 </>
               ) : (
@@ -277,7 +275,7 @@ export default function Dashboard({ modelname }) {
                       <div className="flex">Run Time:</div>
                       <div className="flex">
                         {runDatesToJobDict == undefined ||
-                          Object.keys(runDatesToJobDict).length == 0 ? (
+                        Object.keys(runDatesToJobDict).length == 0 ? (
                           <select
                             className="px-30 flex items-center justify-center rounded-lg border border-gray-200 bg-white py-2 text-gray-700 focus:border-gray-500 focus:outline-none"
                             id="run_time"
diff --git a/resources/js/Pages/EdaDashboard.jsx b/resources/js/Pages/EdaDashboard.jsx
index b4877c4..2da5af8 100644
--- a/resources/js/Pages/EdaDashboard.jsx
+++ b/resources/js/Pages/EdaDashboard.jsx
@@ -615,23 +615,14 @@ const raceByPellStatusOptions = data => {
 };
 
 export default function EdaDashboard({ batch_id: propBatchId }) {
-  // Get institution and set-inst message from Inertia shared props
-  const { institution, set_inst_required_message } = usePage().props;
+  const { institution } = usePage().props;
   const inst_id = institution?.inst_id;
-
   const [batchInfo, setBatchInfo] = useState(null);
   const [batchLoading, setBatchLoading] = useState(true);
   const [edaData, setEdaData] = useState(null);
   const [loading, setLoading] = useState(false); // Start false, will be set when batch_id is resolved
   const [error, setError] = useState(null);
 
-  useEffect(() => {
-    if (!inst_id) {
-      const msg = set_inst_required_message ?? 'Set an institution to proceed.';
-      router.visit(`/set-inst?message=${encodeURIComponent(msg)}`);
-    }
-  }, [inst_id, set_inst_required_message]);
-
   // Fetch batch info - either from propBatchId or get most recent
   useEffect(() => {
     const fetchBatchInfo = async () => {
diff --git a/resources/js/Pages/FileUpload.jsx b/resources/js/Pages/FileUpload.jsx
index a7fa78f..a072cd2 100644
--- a/resources/js/Pages/FileUpload.jsx
+++ b/resources/js/Pages/FileUpload.jsx
@@ -12,7 +12,7 @@ import DangerAlert from '@/Components/DangerAlert';
 import Steppers from '@/Components/Steppers';
 import classNames from 'classnames';
 import BigSuccessAlert from '@/Components/BigSuccessAlert';
-import ErrorAlert from '@/Components/ErrorAlert';
+import Alert from '@/Components/Alert';
 import Spinner from '@/Components/Spinner';
 
 /** Keep in sync with BACKEND_HTTP_VALIDATE_TIMEOUT_SECONDS (seconds) on the Laravel proxy. */
@@ -100,7 +100,7 @@ export default function FileUpload() {
         '[ERROR] Prediction trigger failed: ' + predictionResults['error'];
       return (
         <div className="flex flex-col pl-24 pr-24">
-          <ErrorAlert mainMsg={msg}></ErrorAlert>
+          <Alert variant="danger" mainMsg={msg} />
         </div>
       );
     }
@@ -125,7 +125,7 @@ export default function FileUpload() {
       let msg = '[ERROR] Batch creation failed: ' + batchCreationResult;
       return (
         <div className="flex flex-col pl-24 pr-24">
-          <ErrorAlert mainMsg={msg}></ErrorAlert>
+          <Alert variant="danger" mainMsg={msg} />
           <div className="flex w-full flex-row items-end justify-between pt-48">
             <Link
               href={route('file-upload')}
@@ -170,11 +170,12 @@ export default function FileUpload() {
     if (Object.values(validationResults).find(element => element !== 'ok')) {
       return (
         <div className="flex flex-col pl-24 pr-24">
-          <ErrorAlert
+          <Alert
+            variant="danger"
             mainMsg="[ERROR] The following files must be re-uploaded"
             msgDict={validationResults}
             excludeValue="ok"
-          ></ErrorAlert>
+          />
           <div className="flex w-full flex-row items-end justify-between pt-48">
             <Link
               href={route('file-upload')}
diff --git a/resources/js/Pages/RunInference.jsx b/resources/js/Pages/RunInference.jsx
index 533218a..836cb4c 100644
--- a/resources/js/Pages/RunInference.jsx
+++ b/resources/js/Pages/RunInference.jsx
@@ -6,7 +6,7 @@ import HeaderLabel from '@/Components/HeaderLabel';
 import { PlusCircleIcon } from '@heroicons/react/24/outline';
 import { Link } from '@inertiajs/react';
 import BigSuccessAlert from '@/Components/BigSuccessAlert';
-import ErrorAlert from '@/Components/ErrorAlert';
+import Alert from '@/Components/Alert';
 
 export default function RunInference() {
   const [currentStep, setCurrentStep] = useState(1);
@@ -99,7 +99,7 @@ export default function RunInference() {
       msg = '[ERROR] Prediction request failed with: ' + error;
       return (
         <div className="flex px-36">
-          <ErrorAlert mainMsg={msg}></ErrorAlert>
+          <Alert variant="danger" mainMsg={msg} />
         </div>
       );
     }
diff --git a/resources/js/Pages/SetInst.jsx b/resources/js/Pages/SetInst.jsx
index c1d664b..af311b3 100644
--- a/resources/js/Pages/SetInst.jsx
+++ b/resources/js/Pages/SetInst.jsx
@@ -3,27 +3,28 @@ import { usePage, router } from '@inertiajs/react';
 import AppLayout from '@/Layouts/AppLayout';
 import axios from 'axios';
 import { Cog8ToothIcon } from '@heroicons/react/24/outline';
-import ErrorAlert from '@/Components/ErrorAlert';
+import Alert from '@/Components/Alert';
 import HeaderLabel from '@/Components/HeaderLabel';
 
 export default function SetInstitution() {
-  const { institution, message } = usePage().props;
+  const { institution, set_inst_required_message } = usePage().props;
 
   const [resultList, setResultList] = useState({});
   const [error, setError] = useState(null);
   const [loading, setLoading] = useState(true);
-  const [instId, setInstId] = useState(institution?.inst_id ?? '');
-  const [selectedInstId, setSelectedInstId] = useState(institution?.inst_id ?? '');
-  const [hideSetInstError, setHideSetInstError] = useState(false);
+  const [selectedInstId, setSelectedInstId] = useState(
+    institution?.inst_id ?? '',
+  );
+  const [setInstSuccess, setSetInstSuccess] = useState(null);
+  const [settingInst, setSettingInst] = useState(false);
+  const [setInstSubmitError, setSetInstSubmitError] = useState(null);
 
   useEffect(() => {
     const next = institution?.inst_id ?? '';
-    setInstId(next);
     setSelectedInstId(next);
   }, [institution?.inst_id]);
 
   useEffect(() => {
-    // Fetch all institutions
     axios
       .get('/view-all-institutions-api')
       .then(res => {
@@ -41,34 +42,33 @@ export default function SetInstitution() {
   const handleSubmit = event => {
     event.preventDefault();
     const inst = selectedInstId;
-    const resultArea = document.getElementById('result_area');
 
+    setSetInstSuccess(null);
     if (!inst || inst === '') {
-      resultArea.innerHTML =
-        '<span class="text-red-600 font-semibold">Error: Please select an institution</span>';
+      setSetInstSubmitError('Please select an institution');
       return;
     }
 
-    resultArea.innerHTML =
-      '<span class="text-gray-600">Setting institution...</span>';
-
+    setSetInstSubmitError(null);
+    setSettingInst(true);
     return axios
       .post('/set-inst-api/' + inst)
-      .then(res => {
+      .then(() => {
+        setSettingInst(false);
         const institutionName =
-          Object.entries(resultList).find(([name, id]) => id === inst)?.[0] ||
+          Object.entries(resultList).find(([, id]) => id === inst)?.[0] ||
           'Unknown';
-        setInstId(inst); // Update current institution after successful change
-        resultArea.innerHTML = `<span class="text-green-600 font-semibold">✓ Successfully set institution to: ${institutionName}</span>`;
-        setHideSetInstError(true);
-        router.visit(route('set-inst'));
+        setSetInstSuccess(
+          `Successfully set institution to: ${institutionName}`,
+        );
+        router.reload({ only: ['institution', 'user', 'set_inst_required_message'] });
       })
       .catch(e => {
-        resultArea.innerHTML = `<span class="text-red-600 font-semibold">Error: ${e.message || e}</span>`;
+        setSettingInst(false);
+        setSetInstSubmitError(e.message || String(e));
       });
   };
 
-  // The title in AppLayout needs to match the nav bar label.
   return (
     <AppLayout
       title="Set Institution"
@@ -88,10 +88,11 @@ export default function SetInstitution() {
           minorTitle="Act as Institution"
         ></HeaderLabel>
 
-        {message && !hideSetInstError && (
+        {!institution?.inst_id && (
           <div className="mt-6 w-full max-w-2xl">
-            <ErrorAlert
-              mainMsg={`Error: ${message} Select an institution below to proceed.`}
+            <Alert
+              variant="warning"
+              mainMsg={`${set_inst_required_message} Select an institution below to proceed.`}
             />
           </div>
         )}
@@ -119,7 +120,10 @@ export default function SetInstitution() {
                     style={{ backgroundImage: 'none' }}
                     name="instid"
                     value={selectedInstId}
-                    onChange={e => setSelectedInstId(e.target.value)}
+                    onChange={e => {
+                      setSelectedInstId(e.target.value);
+                      setSetInstSubmitError(null);
+                    }}
                     required
                     disabled={loading}
                   >
@@ -155,14 +159,30 @@ export default function SetInstitution() {
           <div className="flex justify-center">
             <button
               type="submit"
-              disabled={loading}
+              disabled={loading || settingInst}
               className="mb-4 w-1/3 items-center justify-center rounded-lg bg-[#f79222] px-3 py-2 text-white disabled:cursor-not-allowed disabled:opacity-50"
             >
               Set Institution
             </button>
           </div>
         </form>
-        <div className="flex" id="result_area"></div>
+        {settingInst && (
+          <div className="mt-4 flex w-full max-w-2xl justify-center text-gray-600">
+            Setting institution...
+          </div>
+        )}
+        {setInstSubmitError && (
+          <div className="mt-4 flex w-full max-w-2xl justify-center">
+            <span className="font-semibold text-red-600">
+              Error: {setInstSubmitError}
+            </span>
+          </div>
+        )}
+        {setInstSuccess && (
+          <div className="mt-6 w-full max-w-2xl">
+            <Alert variant="success" mainMsg={setInstSuccess} />
+          </div>
+        )}
       </div>
     </AppLayout>
   );
diff --git a/routes/web.php b/routes/web.php
index 3958a69..20dd5c3 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -170,7 +170,7 @@
     })->name('create-model');
 
     Route::get('/set-inst', function () {
-        return Inertia::render('SetInst', ['message' => request('message')]);
+        return Inertia::render('SetInst');
     })->name('set-inst');
 
     Route::get('/add-dk', function () {