feat: add Non-Host Users page with user filtering and CSV download functionality

Author: akarsh911

src/App.tsx

@@ -20,6 +20,7 @@ import BannersPage from "./pages/BannersPage.tsx";
 import EmailSender from "./pages/EmailSender.tsx";
 import Store from "./pages/Store.tsx";
 import AccommodationPage from "./pages/AccommodationPage.tsx";
+import NonHostUsersPage from "./pages/NonHostUsersPage.tsx";
 import { ThemeProvider } from "./contexts/ThemeContext";
 import "./styles/dark-theme.css";
 
@@ -193,6 +194,16 @@ const App: React.FC = () => {
             </DashboardLayout>
           }
         />
+        <Route
+          path="/non-host-users"
+          element={
+            <DashboardLayout>
+              <ProtectedRoute allowedRoles={["admin","outreach-admin","event-admin","outreach-member"]}>
+                <NonHostUsersPage />
+              </ProtectedRoute>
+            </DashboardLayout>
+          }
+        />
         <Route
           path="/users/:userId"
           element={

src/component/EventTransactions.tsx

@@ -167,6 +167,8 @@ const EventTransactions: React.FC<EventTransactionsProps> = ({ eventId, eventNam
       pending: { variant: "warning", text: "Pending" },
       completed: { variant: "success", text: "Completed" },
       failed: { variant: "danger", text: "Failed" },
+      success: { variant: "success", text: "Success" },
+      usercancelled: { variant: "danger", text: "User Cancelled" },
       cancelled: { variant: "secondary", text: "Cancelled" },
     };
 

src/component/Sidebar.tsx

@@ -15,7 +15,8 @@ import {
   BsList,
   BsChevronLeft,
   BsShop,
-  BsHouseDoor
+  BsHouseDoor,
+  BsPersonBadge
 } from "react-icons/bs";
 import satLogo from "../../public/sat-logo.png";
 // import useCurrentUser from "../hooks/useCurrentUser";
@@ -232,6 +233,19 @@ const Sidebar: React.FC = () => {
         </NavLink>
       </Tooltip>
 
+      <Tooltip text="Non-Host Users" show={isCollapsed && hoveredItem === 'non-host-users'}>
+        <NavLink
+          to="/non-host-users"
+         className={({ isActive }) => getNavLinkClasses(isActive)}
+          style={{ textDecoration: 'none', transition: 'all 0.2s ease' }}
+          onMouseEnter={() => setHoveredItem('non-host-users')}
+          onMouseLeave={() => setHoveredItem(null)}
+        >
+          <BsPersonBadge size={ICON_SIZE} />
+          {!isCollapsed && <span className="ms-3">Non-Host Users</span>}
+        </NavLink>
+      </Tooltip>
+      
       <Tooltip text="Bills" show={isCollapsed && hoveredItem === 'bills'}>
         <NavLink
           to="/bills"