Merge pull request 'azeem' (#9) from azeem into dev

Reviewed-on: https://gitea.maskantech.in/gitea_admin/saas_frontend/pulls/9

src/App.tsx

@@ -1,17 +1,30 @@
 import { BrowserRouter } from "react-router-dom";
+import { ToastContainer } from "react-toastify";
+import "react-toastify/dist/ReactToastify.css";
+import "./toast.css";
 import { AuthProvider } from "./context/AuthContext";
 import { ThemeProvider } from "./context/ThemeContext";
 import AppRoutes from "./routes";
 
 const App = () => {
   return (
-    <AuthProvider>
-      <ThemeProvider>
-        <BrowserRouter>
+    <BrowserRouter>
+      <AuthProvider>
+        <ThemeProvider>
           <AppRoutes />
-        </BrowserRouter>
-      </ThemeProvider>
-    </AuthProvider>
+          <ToastContainer
+            position="top-right"
+            autoClose={3000}
+            hideProgressBar={false}
+            newestOnTop
+            closeOnClick
+            pauseOnHover
+            draggable
+            closeButton={true}
+          />
+        </ThemeProvider>
+      </AuthProvider>
+    </BrowserRouter>
   );
 };
 

src/application/tenants/components/AllTenants.tsx

@@ -240,6 +240,9 @@ const AllTenants = () => {
     event.preventDefault();
     if (!selectedTenant) return;
 
+    // Capture the ID to use in the async context
+    const tenantId = selectedTenant.id;
+
     setEditError("");
     setIsSaving(true);
 
@@ -251,15 +254,22 @@ const AllTenants = () => {
         is_active: editForm.is_active,
       };
 
-      const updatedTenant = await tenantsApi.update(selectedTenant.id, payload);
+      const updatedTenant = await tenantsApi.update(tenantId, payload);
+
+      // Safeguard: Ensure we actually got a tenant back
+      if (!updatedTenant || !updatedTenant.id) {
+        throw new Error("Invalid response from server");
+      }
+
       setTenants((prev) =>
         prev.map((tenant) =>
-          tenant.id === updatedTenant.id ? updatedTenant : tenant
+          tenant.id === tenantId ? updatedTenant : tenant
         )
       );
       setIsEditOpen(false);
       setSelectedTenant(null);
     } catch (error) {
+      console.error("Update failed:", error);
       const message =
         error instanceof Error ? error.message : "Unable to update tenant.";
       setEditError(message);
@@ -271,17 +281,21 @@ const AllTenants = () => {
   const handleDelete = async () => {
     if (!selectedTenant) return;
 
+    // Capture the ID securely
+    const tenantId = selectedTenant.id;
+
     setDeleteError("");
     setIsDeleting(true);
 
     try {
-      await tenantsApi.remove(selectedTenant.id);
+      await tenantsApi.remove(tenantId);
       setTenants((prev) =>
-        prev.filter((tenant) => tenant.id !== selectedTenant.id)
+        prev.filter((tenant) => tenant.id !== tenantId)
       );
       setIsDeleteOpen(false);
       setSelectedTenant(null);
     } catch (error) {
+      console.error("Delete failed:", error);
       const message =
         error instanceof Error ? error.message : "Unable to delete tenant.";
       setDeleteError(message);

src/toast.css

@@ -0,0 +1,55 @@
+/* Toast container */
+.Toastify__toast-container {
+  padding: 16px;
+}
+
+/* Toast base */
+.Toastify__toast {
+  border-radius: 12px;
+  padding: 14px 16px;
+  font-size: 14px;
+  font-weight: 500;
+  background: #0f172a;
+  color: #e5e7eb;
+  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
+  border: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+/* Success */
+.Toastify__toast--success {
+  border-left: 4px solid #22c55e;
+}
+
+/* Error */
+.Toastify__toast--error {
+  border-left: 4px solid #ef4444;
+}
+
+/* Info */
+.Toastify__toast--info {
+  border-left: 4px solid #3b82f6;
+}
+
+/* Warning */
+.Toastify__toast--warning {
+  border-left: 4px solid #f59e0b;
+}
+
+/* Progress bar */
+.Toastify__progress-bar {
+  height: 3px;
+  background: rgba(255, 255, 255, 0.25);
+}
+
+/* Close Button */
+.Toastify__close-button {
+  color: #94a3b8;
+  opacity: 0.7;
+  align-self: flex-start;
+  margin-top: 2px;
+}
+
+.Toastify__close-button:hover {
+  color: #e5e7eb;
+  opacity: 1;
+}