@myrjfa/ui 2.1.4 → 2.1.6

package/dist/main/footer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../src/main/footer.tsx"],"names":[],"mappings":"AAOA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AA+CD,QAAA,MAAM,MAAM,GAAI,UAAkB,WAAW,4CAiF5C,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,eAAe,MAAM,CAAC"}
+{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../src/main/footer.tsx"],"names":[],"mappings":"AAOA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AA2CD,QAAA,MAAM,MAAM,GAAI,UAAkB,WAAW,4CAiF5C,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,eAAe,MAAM,CAAC"}

package/dist/main/footer.js

@@ -22,18 +22,14 @@ const footerItems = [
             "Adventures": "/adventures",
             "Rentals": "/rentals",
             "Events": "/events",
-            // "Local Guides": "/guides",
             "Packages": "/packages",
-            // "Store": "/store",
+            "Explore Places": "/places",
         },
     },
     {
-        title: "Opportunities",
+        title: "Services",
         fields: {
-            "Volunteering": "/opportunities?type=volunteer",
-            "Internships": "/opportunities?type=internship",
-            "Jobs": "/opportunities?type=job",
-            "Freelancing": "/opportunities?type=freelance",
+            "Opportunities": "/opportunities",
             "Find Companions": "/find-companion",
             "Plan a Trip ✨": "/plan",
             "Blogs": "/blogs",

package/dist/main/navbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../src/main/navbar.tsx"],"names":[],"mappings":"AAoBA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,wBAAgB,MAAM,CAAC,EAAE,IAAY,EAAE,EAAE,WAAW,2CAqWnD;AAED,eAAe,MAAM,CAAC"}
+{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../src/main/navbar.tsx"],"names":[],"mappings":"AAoBA,UAAU,WAAW;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,wBAAgB,MAAM,CAAC,EAAE,IAAY,EAAE,EAAE,WAAW,2CAkYnD;AAED,eAAe,MAAM,CAAC"}

package/dist/main/navbar.js

@@ -6,7 +6,7 @@ import { logoutUser } from "@myrjfa/state/dist/lib/actions/auth";
 import { isLoggedInAtom, userAtom, userLoadingAtom } from "@myrjfa/state/dist/lib/userAtom";
 import { opportunityTypeOptions } from "@myrjfa/state/dist/lib/models/opportunities/opportunity";
 import { useAtom, useAtomValue } from "jotai";
-import { ChevronDown, Globe, Heart, LayoutDashboardIcon, Store, Target, Luggage, Compass, Mountain, Users, Sparkles, BedDouble, Ticket, Car } from "lucide-react";
+import { ChevronDown, Globe, Heart, LayoutDashboardIcon, Store, Target, Luggage, Compass, Mountain, Users, Sparkles, BedDouble, Ticket, Car, Package } from "lucide-react";
 import Link from "next/link";
 import { useRouter, usePathname } from "next/navigation";
 import { useEffect, useState } from "react";
@@ -66,8 +66,8 @@ export function Navbar({ dark = false }) {
     const navItemColor = effectiveDark
         ? "text-white/90 hover:text-white"
         : "text-muted-foreground hover:text-foreground";
-    return (_jsx("header", { className: `fixed top-0 left-0 z-[100] mx-auto transition-all duration-300 w-full ${navbarBg} ${textColor} ${navbarBorder}`, children: _jsxs("div", { className: "mx-auto flex items-center justify-between gap-10 py-4 px-4 lg:px-8", children: [_jsxs(Link, { href: "/", className: "flex items-center gap-3", children: [_jsxs(Avatar, { className: "ml-2 -mr-4.5", children: [_jsx(AvatarImage, { src: "/images/logoicon.webp" }), _jsxs(AvatarFallback, { children: [(currentUser === null || currentUser === void 0 ? void 0 : currentUser.firstName.charAt(0)) || "D", (currentUser === null || currentUser === void 0 ? void 0 : currentUser.lastName.charAt(0)) || "P"] })] }), _jsx("span", { className: "font-heading text-xl font-bold", children: "rippeaze" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("nav", { className: "hidden md:flex items-center gap-10 justify-end", children: [_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { className: `flex items-center gap-1 text-sm font-medium cursor-pointer ${navItemColor}`, children: [_jsx(Target, { className: "h-5 w-5" }), _jsx("span", { children: "Opportunities" }), _jsx(ChevronDown, { className: "h-4 w-4" })] }) }), _jsx(PopoverContent, { className: "w-56 p-2 mt-3 bg-white rounded-lg shadow-lg border", align: "start", sideOffset: 5, children: _jsx("div", { className: "flex flex-col", children: opportunityTypeOptions.map((opt) => (_jsxs(Link, { href: `/opportunities?type=${opt.value}`, className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-md flex flex-col", children: [_jsx("span", { className: "font-medium", children: opt.label }), _jsx("span", { className: "text-xs text-gray-500", children: opt.description })] }, opt.value))) }) })] }), _jsx(NavItem, { icon: _jsx(Luggage, { className: "h-5 w-5" }), label: "Packages", href: "/packages", className: navItemColor }), _jsx(NavItem, { icon: _jsx(Globe, { className: "h-5 w-5" }), label: "Blogs", href: "/blogs", className: navItemColor }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { className: `flex items-center gap-1 text-sm font-medium cursor-pointer ${navItemColor}`, children: [_jsx(Compass, { className: "h-5 w-5" }), _jsx("span", { children: "Explore" }), _jsx(ChevronDown, { className: "h-4 w-4" })] }) }), _jsx(PopoverContent, { className: "w-64 p-2 mt-3 bg-white rounded-xl shadow-xl border", align: "start", sideOffset: 5, children: _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-1 pb-0.5", children: "Travel" }), _jsxs(Link, { href: "/stays", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(BedDouble, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Stays" }), _jsx("p", { className: "text-xs text-gray-400", children: "Hotels, hostels & homestays" })] })] }), _jsxs(Link, { href: "/events", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Ticket, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Events" }), _jsx("p", { className: "text-xs text-gray-400", children: "Concerts, workshops & more" })] })] }), _jsxs(Link, { href: "/adventures", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Mountain, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Adventures" }), _jsx("p", { className: "text-xs text-gray-400", children: "Tours & thrilling activities" })] })] }), _jsxs(Link, { href: "/rentals", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Car, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Rentals" }), _jsx("p", { className: "text-xs text-gray-400", children: "Bikes, cars & vehicles" })] })] }), _jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-2 pb-0.5", children: "For You" }), _jsxs(Link, { href: "/find-companion", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Users, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Find Companions" }), _jsx("p", { className: "text-xs text-gray-400", children: "Connect with travel buddies" })] })] }), _jsxs(Link, { href: "/plan", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Sparkles, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Plan a Trip" }), _jsx("p", { className: "text-xs text-gray-400", children: "AI-powered itinerary builder" })] })] })] }) })] }), currentUser ? _jsx(NavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Become a Partner", href: "/contact", className: navItemColor })
-                                    : _jsx(NavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Register as Business", href: "/auth/register?role=host", className: navItemColor }), isLoggedIn && _jsx(NotificationBell, { navItemColor: navItemColor })] }), _jsx("div", { className: "hidden md:flex items-center gap-2", children: _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "link", className: "flex w-full gap-1 cursor-pointer", children: _jsxs(Avatar, { className: "ml-5 mr-4.5", children: [_jsx(AvatarImage, { src: (_a = currentUser === null || currentUser === void 0 ? void 0 : currentUser.profilePic) !== null && _a !== void 0 ? _a : "/images/profile_placeholder.webp" }), _jsxs(AvatarFallback, { children: [(currentUser === null || currentUser === void 0 ? void 0 : currentUser.firstName.charAt(0)) || "D", (currentUser === null || currentUser === void 0 ? void 0 : currentUser.lastName.charAt(0)) || "P"] })] }) }) }), _jsx(PopoverContent, { className: `w-full p-0 mt-3 bg-${dark ? "primary" : "white"} rounded-lg shadow-lg`, align: "end", sideOffset: 5, children: _jsxs("div", { className: "py-2 w-full", children: [_jsxs("div", { className: "px-4 py-3 border-b w-full", children: [_jsx("p", { className: "text-sm font-medium", children: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.username) || "Guest" }), _jsx("p", { className: "text-xs text-gray-500", children: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.email) || "user@example.com" })] }), _jsxs("div", { className: "flex flex-col", children: [isLoggedIn ?
+    return (_jsx("header", { className: `fixed top-0 left-0 z-[100] mx-auto transition-all duration-300 w-full ${navbarBg} ${textColor} ${navbarBorder}`, children: _jsxs("div", { className: "mx-auto flex items-center justify-between gap-10 py-4 px-4 lg:px-8", children: [_jsxs(Link, { href: "/", className: "flex items-center gap-3", children: [_jsxs(Avatar, { className: "ml-2 -mr-4.5", children: [_jsx(AvatarImage, { src: "/images/logoicon.webp" }), _jsxs(AvatarFallback, { children: [(currentUser === null || currentUser === void 0 ? void 0 : currentUser.firstName.charAt(0)) || "D", (currentUser === null || currentUser === void 0 ? void 0 : currentUser.lastName.charAt(0)) || "P"] })] }), _jsx("span", { className: "font-heading text-xl font-bold", children: "rippeaze" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("nav", { className: "hidden md:flex items-center gap-10 justify-end", children: [_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { className: `flex items-center gap-1 text-sm font-medium cursor-pointer ${navItemColor}`, children: [_jsx(Target, { className: "h-5 w-5" }), _jsx("span", { children: "Opportunities" }), _jsx(ChevronDown, { className: "h-4 w-4" })] }) }), _jsx(PopoverContent, { className: "w-56 p-2 mt-3 bg-white rounded-lg shadow-lg border", align: "start", sideOffset: 5, children: _jsx("div", { className: "flex flex-col", children: opportunityTypeOptions.map((opt) => (_jsxs(Link, { href: `/opportunities?type=${opt.value}`, className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-md flex flex-col", children: [_jsx("span", { className: "font-medium", children: opt.label }), _jsx("span", { className: "text-xs text-gray-500", children: opt.description })] }, opt.value))) }) })] }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { className: `flex items-center gap-1 text-sm font-medium cursor-pointer ${navItemColor}`, children: [_jsx(Luggage, { className: "h-5 w-5" }), _jsx("span", { children: "Tours" }), _jsx(ChevronDown, { className: "h-4 w-4" })] }) }), _jsx(PopoverContent, { className: "w-64 p-2 mt-3 bg-white rounded-xl shadow-xl border", align: "start", sideOffset: 5, children: _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-1 pb-0.5", children: "Book an Experience" }), _jsxs(Link, { href: "/packages", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Package, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Packages" }), _jsx("p", { className: "text-xs text-gray-400", children: "Curated all-inclusive tours" })] })] }), _jsxs(Link, { href: "/adventures", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Mountain, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Adventures" }), _jsx("p", { className: "text-xs text-gray-400", children: "Treks, rafting & thrills" })] })] }), _jsxs(Link, { href: "/stays", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(BedDouble, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Stays" }), _jsx("p", { className: "text-xs text-gray-400", children: "Hotels, hostels & homestays" })] })] }), _jsxs(Link, { href: "/rentals", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Car, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Rentals" }), _jsx("p", { className: "text-xs text-gray-400", children: "Bikes, cars & gear" })] })] }), _jsxs(Link, { href: "/plan", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Sparkles, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Plan a Trip" }), _jsx("p", { className: "text-xs text-gray-400", children: "AI-powered itinerary builder" })] })] })] }) })] }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { className: `flex items-center gap-1 text-sm font-medium cursor-pointer ${navItemColor}`, children: [_jsx(Compass, { className: "h-5 w-5" }), _jsx("span", { children: "Explore" }), _jsx(ChevronDown, { className: "h-4 w-4" })] }) }), _jsx(PopoverContent, { className: "w-64 p-2 mt-3 bg-white rounded-xl shadow-xl border", align: "start", sideOffset: 5, children: _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-1 pb-0.5", children: "Discover" }), _jsxs(Link, { href: "/events", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Ticket, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Events" }), _jsx("p", { className: "text-xs text-gray-400", children: "Festivals, workshops & more" })] })] }), _jsxs(Link, { href: "/blogs", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Globe, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Blogs" }), _jsx("p", { className: "text-xs text-gray-400", children: "Travel stories & guides" })] })] }), _jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-2 pb-0.5", children: "Community" }), _jsxs(Link, { href: "/find-companion", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Users, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Find Companions" }), _jsx("p", { className: "text-xs text-gray-400", children: "Connect with travel buddies" })] })] }), _jsx("p", { className: "text-[10px] font-black uppercase tracking-widest text-gray-400 px-3 pt-2 pb-0.5", children: "Destinations" }), _jsxs(Link, { href: "/places", className: "px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg flex items-center gap-3", children: [_jsx(Globe, { className: "h-4 w-4 text-primary flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold", children: "Explore Places" }), _jsx("p", { className: "text-xs text-gray-400", children: "Countries, cities & landmarks" })] })] })] }) })] }), currentUser ? _jsx(NavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Become a Partner", href: "/contact", className: navItemColor })
+                                    : _jsx(NavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Register as Business", href: "/auth/register?role=host", className: navItemColor }), isLoggedIn && _jsx(NotificationBell, { navItemColor: navItemColor, userId: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) !== "host" ? currentUser === null || currentUser === void 0 ? void 0 : currentUser.id : undefined, hostId: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === "host" ? currentUser === null || currentUser === void 0 ? void 0 : currentUser.id : undefined })] }), _jsx("div", { className: "hidden md:flex items-center gap-2", children: _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "link", className: "flex w-full gap-1 cursor-pointer", children: _jsxs(Avatar, { className: "ml-5 mr-4.5", children: [_jsx(AvatarImage, { src: (_a = currentUser === null || currentUser === void 0 ? void 0 : currentUser.profilePic) !== null && _a !== void 0 ? _a : "/images/profile_placeholder.webp" }), _jsxs(AvatarFallback, { children: [(currentUser === null || currentUser === void 0 ? void 0 : currentUser.firstName.charAt(0)) || "D", (currentUser === null || currentUser === void 0 ? void 0 : currentUser.lastName.charAt(0)) || "P"] })] }) }) }), _jsx(PopoverContent, { className: `w-full p-0 mt-3 bg-${dark ? "primary" : "white"} rounded-lg shadow-lg`, align: "end", sideOffset: 5, children: _jsxs("div", { className: "py-2 w-full", children: [_jsxs("div", { className: "px-4 py-3 border-b w-full", children: [_jsx("p", { className: "text-sm font-medium", children: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.username) || "Guest" }), _jsx("p", { className: "text-xs text-gray-500", children: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.email) || "user@example.com" })] }), _jsxs("div", { className: "flex flex-col", children: [isLoggedIn ?
                                                             _jsxs(Link, { href: `/profile/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) || "user"}/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.username) || "Guest"}`, className: "w-full py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2", children: [_jsxs(Avatar, { className: "w-4 h-4", children: [_jsx(AvatarImage, { src: (_b = currentUser === null || currentUser === void 0 ? void 0 : currentUser.profilePic) !== null && _b !== void 0 ? _b : "/images/profile_placeholder.webp" }), _jsx(AvatarFallback, { children: "U" })] }), "Profile"] }) :
                                                             _jsxs(Button, { variant: "ghost", onClick: () => router.push('/auth/login?role=user'), className: "w-full py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2 justify-start", children: [_jsxs(Avatar, { className: "w-4 h-4", children: [_jsx(AvatarImage, { src: "/images/profile_placeholder.webp" }), _jsx(AvatarFallback, { children: "U" })] }), "Login As Volunteer"] }), isLoggedIn && _jsxs(Link, { href: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === 'host' || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === 'admin' ? `/dashboard/host/overview` : `/overview/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) || 'user'}`, className: "w-full py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2", children: [_jsx(LayoutDashboardIcon, { className: "h-4 w-4" }), "Dashboard"] }), isLoggedIn && ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === "user" || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) == null) &&
                                                             _jsxs(Link, { href: "/overview/user#bookings", className: "w-full py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2", children: [_jsx(Luggage, { className: "h-4 w-4" }), "My Bookings"] }), isLoggedIn && ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === "user" || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) == null) &&
@@ -84,7 +84,7 @@ export function Navbar({ dark = false }) {
                                                                         router.push('/auth/login?role=host');
                                                                     }, className: "w-full py-2 px-4 text-sm text-gray-700 hover:bg-gray-100 flex items-center gap-2 justify-start", children: [_jsxs(Avatar, { className: "w-4 h-4", children: [_jsx(AvatarImage, { src: "/images/profile_placeholder.webp" }), _jsx(AvatarFallback, { children: "H" })] }), "Login As Business"] }), _jsx(Separator, { className: "my-1" }), isLoggedIn && _jsx(Button, { variant: "outline", className: "py-2 mx-2 text-sm text-gray-700 hover:bg-gray-100 justify-center cursor-pointer", onClick: () => {
                                                                 logout();
-                                                            }, children: "Sign out" })] })] }) })] }) })] }), _jsx(MobileNavbar, { children: _jsx("div", { className: `rounded-b-lg py-4 px-4 shadow-xl ${"bg-background"} ${textColor}`, children: _jsxs("nav", { className: "flex flex-col gap-1 pt-2", children: [_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2 py-2 px-2 text-muted-foreground", children: [_jsx(Target, { className: "h-5 w-5" }), _jsx("span", { className: "text-sm font-medium", children: "Opportunities" })] }), _jsx("div", { className: "pl-8 flex flex-col gap-1", children: opportunityTypeOptions.map((opt) => (_jsx(Link, { href: `/opportunities?type=${opt.value}`, className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: opt.label }, opt.value))) })] }), _jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2 py-2 px-2 text-muted-foreground", children: [_jsx(Compass, { className: "h-5 w-5" }), _jsx("span", { className: "text-sm font-medium", children: "Explore" })] }), _jsxs("div", { className: "pl-8 flex flex-col gap-1", children: [_jsx(Link, { href: "/stays", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Stays" }), _jsx(Link, { href: "/events", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Events" }), _jsx(Link, { href: "/adventures", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Adventures" }), _jsx(Link, { href: "/rentals", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Rentals" }), _jsx(Link, { href: "/find-companion", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Find Companions" }), _jsx(Link, { href: "/plan", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Plan a Trip \u2728" })] })] }), _jsx(MobileNavItem, { icon: _jsx(Luggage, { className: "h-5 w-5" }), label: "Packages", href: "/packages" }), _jsx(MobileNavItem, { icon: _jsx(Globe, { className: "h-5 w-5" }), label: "Blogs", href: "/blogs" }), currentUser ? _jsx(MobileNavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Become a Partner", href: "/contact" }) :
+                                                            }, children: "Sign out" })] })] }) })] }) })] }), _jsx(MobileNavbar, { children: _jsx("div", { className: `rounded-b-lg py-4 px-4 shadow-xl ${"bg-background"} ${textColor}`, children: _jsxs("nav", { className: "flex flex-col gap-1 pt-2", children: [_jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2 py-2 px-2 text-muted-foreground", children: [_jsx(Target, { className: "h-5 w-5" }), _jsx("span", { className: "text-sm font-medium", children: "Opportunities" })] }), _jsx("div", { className: "pl-8 flex flex-col gap-1", children: opportunityTypeOptions.map((opt) => (_jsx(Link, { href: `/opportunities?type=${opt.value}`, className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: opt.label }, opt.value))) })] }), _jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2 py-2 px-2 text-muted-foreground", children: [_jsx(Luggage, { className: "h-5 w-5" }), _jsx("span", { className: "text-sm font-medium", children: "Tours" })] }), _jsxs("div", { className: "pl-8 flex flex-col gap-1", children: [_jsx(Link, { href: "/packages", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Packages" }), _jsx(Link, { href: "/adventures", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Adventures" }), _jsx(Link, { href: "/stays", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Stays" }), _jsx(Link, { href: "/rentals", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Rentals" }), _jsx(Link, { href: "/plan", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Plan a Trip \u2728" })] })] }), _jsxs("div", { className: "flex flex-col", children: [_jsxs("div", { className: "flex items-center gap-2 py-2 px-2 text-muted-foreground", children: [_jsx(Compass, { className: "h-5 w-5" }), _jsx("span", { className: "text-sm font-medium", children: "Explore" })] }), _jsxs("div", { className: "pl-8 flex flex-col gap-1", children: [_jsx(Link, { href: "/events", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Events" }), _jsx(Link, { href: "/blogs", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Blogs" }), _jsx(Link, { href: "/find-companion", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Find Companions" }), _jsx(Link, { href: "/places", className: "py-1.5 px-2 text-sm text-gray-600 hover:text-foreground hover:bg-gray-100 rounded", children: "Explore Places" })] })] }), currentUser ? _jsx(MobileNavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Become a Partner", href: "/contact" }) :
                                     _jsx(MobileNavItem, { icon: _jsx(Store, { className: "h-5 w-5" }), label: "Register as Business", href: "/auth/register?role=host" }), isLoggedIn && _jsx(MobileNotificationBell, {}), isLoggedIn && _jsx(MobileNavItem, { icon: _jsx(LayoutDashboardIcon, { className: "h-5 w-5" }), label: "Dashboard", href: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === 'host' || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === 'admin' ? `/dashboard/host/overview` : `/overview/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) || 'user'}`, className: "md:hidden" }), isLoggedIn && ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === "user" || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) == null) &&
                                     _jsx(MobileNavItem, { icon: _jsx(Luggage, { className: "h-5 w-5" }), label: "My Bookings", href: "/overview/user#bookings", className: "md:hidden" }), isLoggedIn && ((currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) === "user" || (currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) == null) &&
                                     _jsx(MobileNavItem, { icon: _jsx(Heart, { className: "h-5 w-5" }), label: "Favourites", href: "/opportunities/favourites", className: "md:hidden" }), isLoggedIn ? _jsxs(Link, { href: `/profile/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.role) || "user"}/${(currentUser === null || currentUser === void 0 ? void 0 : currentUser.username) || "Guest"}`, className: "flex w-full gap-1 cursor-pointer my-2", children: [_jsxs(Avatar, { className: "w-5 h-5 ml-2", children: [_jsx(AvatarImage, { src: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.profilePic) || "/images/profile_placeholder.webp" }), _jsx(AvatarFallback, { children: "DP" })] }), _jsx(Label, { htmlFor: "username", className: "cursor-pointer text-muted-foreground hover:text-foreground", children: (currentUser === null || currentUser === void 0 ? void 0 : currentUser.username) || "Guest" })] }) :

package/dist/misc/button.d.ts

@@ -1,6 +1,6 @@
 import { type VariantProps } from "class-variance-authority";
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {

package/dist/misc/filterBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filterBar.d.ts","sourceRoot":"","sources":["../../src/misc/filterBar.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAK1C,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC1C,QAAQ,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrD,WAAW,EAAE,MAAM,CAAC;IAEpB,OAAO,CAAC,EAAE,SAAS;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAE5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAErC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IAEzE,eAAe,CAAC,EAAE,MAAM,SAAS,CAAC;IAElC,UAAU,CAAC,EAAE,KAAK,GAAG,UAAU,CAAC;IAEhC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IAExB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,cAAc;IAC3B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACvC;AA+eD,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,cAAc,2CAMhE"}
+{"version":3,"file":"filterBar.d.ts","sourceRoot":"","sources":["../../src/misc/filterBar.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAK1C,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC1C,QAAQ,EAAE,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrD,WAAW,EAAE,MAAM,CAAC;IAEpB,OAAO,CAAC,EAAE,SAAS;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAE5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAErC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IAEzE,eAAe,CAAC,EAAE,MAAM,SAAS,CAAC;IAElC,UAAU,CAAC,EAAE,KAAK,GAAG,UAAU,CAAC;IAEhC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IAExB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,cAAc;IAC3B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,YAAY,CAAC,EAAE,kBAAkB,EAAE,CAAC;CACvC;AAgfD,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,cAAc,2CAMhE"}

package/dist/misc/filterBar.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { retrieveCity, retrieveState } from "@myrjfa/state";
+import { retrieveCity, retrieveState, INDIAN_CITIES } from "@myrjfa/state";
 import { Search, SearchIcon, SlidersHorizontal, X } from "lucide-react";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { Suspense, useEffect, useState } from "react";
@@ -107,7 +107,8 @@ function FilterBarComponent({ tiles, filterConfig = defaultFilterOptions }) {
             return opt.options.map(o => o.label);
         }
         if (opt.deriveFromTiles === 'location') {
-            return Array.from(new Set((tiles !== null && tiles !== void 0 ? tiles : []).map(tile => [retrieveState((tile === null || tile === void 0 ? void 0 : tile.location) || ''), retrieveCity((tile === null || tile === void 0 ? void 0 : tile.location) || '')]).flat().filter(Boolean)));
+            const tileLocations = (tiles !== null && tiles !== void 0 ? tiles : []).map(tile => [retrieveState((tile === null || tile === void 0 ? void 0 : tile.location) || ''), retrieveCity((tile === null || tile === void 0 ? void 0 : tile.location) || '')]).flat().filter(Boolean);
+            return Array.from(new Set([...tileLocations, ...INDIAN_CITIES]));
         }
         if (opt.deriveFromTiles === 'skills') {
             return Array.from(new Set((tiles !== null && tiles !== void 0 ? tiles : []).flatMap(tile => tile.skills || [])));

package/dist/misc/notification.d.ts

@@ -1,5 +1,7 @@
-export declare function NotificationBell({ navItemColor }: {
+export declare function NotificationBell({ navItemColor, userId, hostId }: {
     navItemColor: string;
+    userId?: string;
+    hostId?: string;
 }): import("react/jsx-runtime").JSX.Element;
 export declare function MobileNotificationBell(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=notification.d.ts.map

package/dist/misc/notification.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../src/misc/notification.tsx"],"names":[],"mappings":"AAkDA,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,2CA8I1E;AAED,wBAAgB,sBAAsB,4CAUrC"}
+{"version":3,"file":"notification.d.ts","sourceRoot":"","sources":["../../src/misc/notification.tsx"],"names":[],"mappings":"AAmEA,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,2CA0K5H;AAED,wBAAgB,sBAAsB,4CAUrC"}

package/dist/misc/notification.js

@@ -3,10 +3,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Popover, PopoverContent, PopoverTrigger } from "@radix-ui/react-popover";
 import { getNotifications, toggleAllNotification, toggleNotification } from "@myrjfa/state/dist/lib/actions/actions";
 import { formatTimestamp } from "@myrjfa/state/dist/lib/utils";
-import { Bell, MessageCircle, CheckCircle2, Receipt, Users, AlertCircle, Megaphone, Briefcase, ShieldCheck, ShieldX, Package, ClipboardList } from "lucide-react";
+import { Bell, MessageCircle, CheckCircle2, Receipt, Users, AlertCircle, Megaphone, Briefcase, ShieldCheck, ShieldX, Package, ClipboardList, Star, CalendarCheck } from "lucide-react";
 import { useRouter } from "next/navigation";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { FaSpinner } from "react-icons/fa6";
+import { io } from "socket.io-client";
 import { showAlert } from "./alertdialogclaude";
 import { Button } from "./button";
 import { Card, CardHeader, CardTitle } from "./card";
@@ -35,20 +36,37 @@ const getNotificationIcon = (notif) => {
         case "id_rejected":
             return _jsx(ShieldX, { className: "w-4 h-4 text-red-500 mt-0.5 flex-shrink-0" });
         case "package_enquiry":
+        case "package_approval":
+        case "package_denial":
+        case "package_review":
+        case "package_rating":
             return _jsx(Package, { className: "w-4 h-4 text-cyan-500 mt-0.5 flex-shrink-0" });
         case "opportunity_assigned":
+        case "opportunity_approval":
+        case "opportunity_denial":
+        case "opportunity_review":
+        case "opportunity_rating":
             return _jsx(ClipboardList, { className: "w-4 h-4 text-amber-500 mt-0.5 flex-shrink-0" });
+        case "blog_like":
+        case "blog_comment":
+        case "blog_posted":
+        case "blog_approval":
+        case "blog_denial":
+            return _jsx(Star, { className: "w-4 h-4 text-pink-500 mt-0.5 flex-shrink-0" });
+        case "booking_confirmed":
+            return _jsx(CalendarCheck, { className: "w-4 h-4 text-teal-500 mt-0.5 flex-shrink-0" });
         case "system":
             return _jsx(AlertCircle, { className: "w-4 h-4 text-gray-500 mt-0.5 flex-shrink-0" });
         default:
             return _jsx("div", { className: `w-2.5 h-2.5 rounded-full mt-1.5 flex-shrink-0 ${!notif.read ? "bg-blue-500" : "bg-gray-300"}` });
     }
 };
-export function NotificationBell({ navItemColor }) {
+export function NotificationBell({ navItemColor, userId, hostId }) {
     const [notifs, setNotifs] = useState([]);
     const [unreadCount, setUnreadCount] = useState(0);
     const [loadingNotifId, setLoadingNotifId] = useState(null);
     const [isOpen, setIsOpen] = useState(false);
+    const socketRef = useRef(null);
     const router = useRouter();
     const fetchData = async () => {
         try {
@@ -62,6 +80,33 @@ export function NotificationBell({ navItemColor }) {
             console.error("Failed to fetch notifications:", err);
         }
     };
+    // Connect to socket for real-time notifications
+    useEffect(() => {
+        var _a;
+        if (!userId && !hostId)
+            return;
+        const apiUrl = ((_a = process.env.NEXT_PUBLIC_API_URL) === null || _a === void 0 ? void 0 : _a.replace("/api/v1", "")) || "";
+        if (!apiUrl)
+            return;
+        const query = {};
+        if (userId)
+            query.userId = userId;
+        if (hostId)
+            query.hostId = hostId;
+        const socket = io(apiUrl, { query, withCredentials: true, transports: ["websocket", "polling"] });
+        socketRef.current = socket;
+        socket.on("notification", (incoming) => {
+            setNotifs((prev) => {
+                const updated = [incoming, ...prev];
+                return updated.slice(0, NOTIF_LIMIT_FOR_BELL);
+            });
+            setUnreadCount((c) => c + 1);
+        });
+        return () => {
+            socket.disconnect();
+            socketRef.current = null;
+        };
+    }, [userId, hostId]);
     // Re-fetch when popover opens
     useEffect(() => {
         if (isOpen)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myrjfa/ui",
-  "version": "2.1.4",
+  "version": "2.1.6",
   "type": "module",
   "exports": {
     ".": "./dist/index.js",
@@ -47,7 +47,8 @@
     "react-hook-form": "^7.54.2",
     "react-icons": "^5.5.0",
     "react-leaflet": "^5.0.0",
-    "react-share": "^5.2.2"
+    "react-share": "^5.2.2",
+    "socket.io-client": "^4.8.3"
   },
   "peerDependencies": {
     "@myrjfa/state": "*",
@@ -71,7 +72,7 @@
     "react-dom": "^19.0.0",
     "typescript": "^5.0.0",
     "zod": "^3.24.2",
-    "@myrjfa/state": "2.1.2"
+    "@myrjfa/state": "2.1.5"
   },
   "repository": {
     "type": "git",