remove links from nav and other fixes
This commit is contained in:
priyanshuvish
76
package-lock.json
generated
76
package-lock.json
generated
@@ -49,6 +49,7 @@
|
||||
"react-dom": "^18.3.1",
|
||||
"react-hook-form": "^7.55.0",
|
||||
"react-resizable-panels": "^2.1.7",
|
||||
"react-router-dom": "^7.8.2",
|
||||
"recharts": "^2.15.2",
|
||||
"sonner": "^2.0.3",
|
||||
"tailwind-merge": "*",
|
||||
@@ -57,6 +58,8 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.10.0",
|
||||
"@types/react": "^19.1.12",
|
||||
"@types/react-dom": "^19.1.9",
|
||||
"@vitejs/plugin-react-swc": "^3.10.2",
|
||||
"vite": "^5.4.19"
|
||||
}
|
||||
@@ -2742,6 +2745,26 @@
|
||||
"undici-types": "~6.21.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react": {
|
||||
"version": "19.1.12",
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.12.tgz",
|
||||
"integrity": "sha512-cMoR+FoAf/Jyq6+Df2/Z41jISvGZZ2eTlnsaJRptmZ76Caldwy1odD4xTr/gNV9VLj0AWgg/nmkevIyUfIIq5w==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-dom": {
|
||||
"version": "19.1.9",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.1.9.tgz",
|
||||
"integrity": "sha512-qXRuZaOsAdXKFyOhRBg6Lqqc0yay13vN7KrIg4L7N4aaHN68ma9OK3NE1BoDFgFOTfM7zg+3/8+2n8rLUH3OKQ==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"@types/react": "^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@vitejs/plugin-react-swc": {
|
||||
"version": "3.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-3.11.0.tgz",
|
||||
@@ -2814,6 +2837,15 @@
|
||||
"react-dom": "^18 || ^19 || ^19.0.0-rc"
|
||||
}
|
||||
},
|
||||
"node_modules/cookie": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
|
||||
"integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/csstype": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||
@@ -3716,6 +3748,44 @@
|
||||
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
|
||||
}
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "7.8.2",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-7.8.2.tgz",
|
||||
"integrity": "sha512-7M2fR1JbIZ/jFWqelpvSZx+7vd7UlBTfdZqf6OSdF9g6+sfdqJDAWcak6ervbHph200ePlu+7G8LdoiC3ReyAQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"cookie": "^1.0.1",
|
||||
"set-cookie-parser": "^2.6.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=20.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18",
|
||||
"react-dom": ">=18"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-router-dom": {
|
||||
"version": "7.8.2",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.8.2.tgz",
|
||||
"integrity": "sha512-Z4VM5mKDipal2jQ385H6UBhiiEDlnJPx6jyWsTYoZQdl5TrjxEV2a9yl3Fi60NBJxYzOTGTTHXPi0pdizvTwow==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"react-router": "7.8.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=20.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18",
|
||||
"react-dom": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/react-smooth": {
|
||||
"version": "4.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-4.0.4.tgz",
|
||||
@@ -3850,6 +3920,12 @@
|
||||
"loose-envify": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/set-cookie-parser": {
|
||||
"version": "2.7.1",
|
||||
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
|
||||
"integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/sonner": {
|
||||
"version": "2.0.7",
|
||||
"resolved": "https://registry.npmjs.org/sonner/-/sonner-2.0.7.tgz",
|
||||
|
||||
@@ -44,6 +44,7 @@
|
||||
"react-dom": "^18.3.1",
|
||||
"react-hook-form": "^7.55.0",
|
||||
"react-resizable-panels": "^2.1.7",
|
||||
"react-router-dom": "^7.8.2",
|
||||
"recharts": "^2.15.2",
|
||||
"sonner": "^2.0.3",
|
||||
"tailwind-merge": "*",
|
||||
@@ -52,6 +53,8 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.10.0",
|
||||
"@types/react": "^19.1.12",
|
||||
"@types/react-dom": "^19.1.9",
|
||||
"@vitejs/plugin-react-swc": "^3.10.2",
|
||||
"vite": "^5.4.19"
|
||||
},
|
||||
|
||||
1214
src/App.tsx
1214
src/App.tsx
File diff suppressed because it is too large
Load Diff
@@ -184,7 +184,7 @@ export function Router() {
|
||||
case '/settings':
|
||||
return <Settings />;
|
||||
case '/surveys':
|
||||
return <Surveys />;
|
||||
return <Surveys userType="corporate" />;
|
||||
case '/webinars':
|
||||
// Route to appropriate webinar page based on view parameter
|
||||
if (viewParam === 'corporate') {
|
||||
|
||||
@@ -5,10 +5,10 @@ import { Badge } from '../ui/badge';
|
||||
import { Sheet, SheetContent, SheetTrigger } from '../ui/sheet';
|
||||
import { ScrollArea } from '../ui/scroll-area';
|
||||
import { Separator } from '../ui/separator';
|
||||
import {
|
||||
Menu,
|
||||
Search,
|
||||
Bell,
|
||||
import {
|
||||
Menu,
|
||||
Search,
|
||||
Bell,
|
||||
ChevronDown,
|
||||
Home,
|
||||
BookOpen,
|
||||
@@ -61,7 +61,7 @@ function NotificationPanel({ isOpen, onClose, notifications }: NotificationPanel
|
||||
<div className="fixed inset-0 z-50 lg:relative lg:inset-auto">
|
||||
{/* Mobile overlay */}
|
||||
<div className="lg:hidden fixed inset-0 bg-black/50" onClick={onClose} />
|
||||
|
||||
|
||||
{/* Panel */}
|
||||
<div className="fixed right-0 top-0 h-full w-80 bg-card border-l border-border shadow-xl lg:absolute lg:top-full lg:right-0 lg:h-auto lg:max-h-96 lg:rounded-lg lg:border lg:shadow-lg">
|
||||
<div className="flex items-center justify-between p-4 border-b border-border">
|
||||
@@ -72,7 +72,7 @@ function NotificationPanel({ isOpen, onClose, notifications }: NotificationPanel
|
||||
<X className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
|
||||
<ScrollArea className="h-80 lg:h-64">
|
||||
<div className="p-4 space-y-3">
|
||||
{notifications.length === 0 ? (
|
||||
@@ -82,17 +82,16 @@ function NotificationPanel({ isOpen, onClose, notifications }: NotificationPanel
|
||||
</div>
|
||||
) : (
|
||||
notifications.map((notification) => (
|
||||
<div
|
||||
<div
|
||||
key={notification.id}
|
||||
className={`p-3 rounded-lg border ${notification.read ? 'bg-muted/50' : 'bg-background'} hover:bg-muted/70 transition-colors cursor-pointer`}
|
||||
>
|
||||
<div className="flex items-start gap-3">
|
||||
<div className={`w-2 h-2 rounded-full mt-2 flex-shrink-0 ${
|
||||
notification.type === 'info' ? 'bg-blue-500' :
|
||||
notification.type === 'success' ? 'bg-success' :
|
||||
notification.type === 'warning' ? 'bg-yellow-500' :
|
||||
'bg-destructive'
|
||||
}`} />
|
||||
<div className={`w-2 h-2 rounded-full mt-2 flex-shrink-0 ${notification.type === 'info' ? 'bg-blue-500' :
|
||||
notification.type === 'success' ? 'bg-success' :
|
||||
notification.type === 'warning' ? 'bg-yellow-500' :
|
||||
'bg-destructive'
|
||||
}`} />
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="font-medium text-lg text-foreground">{notification.title}</p>
|
||||
<p className="text-lg text-muted-foreground mt-1">{notification.message}</p>
|
||||
@@ -104,12 +103,12 @@ function NotificationPanel({ isOpen, onClose, notifications }: NotificationPanel
|
||||
)}
|
||||
</div>
|
||||
</ScrollArea>
|
||||
|
||||
|
||||
{notifications.length > 0 && (
|
||||
<div className="p-4 border-t border-border">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="w-full text-lg min-h-[44px]"
|
||||
onClick={() => navigateTo('/notifications')}
|
||||
>
|
||||
@@ -130,13 +129,13 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
const [sidebarOpen, setSidebarOpen] = useState(false);
|
||||
const [notificationsOpen, setNotificationsOpen] = useState(false);
|
||||
const [searchValue, setSearchValue] = useState('');
|
||||
|
||||
|
||||
// Get current view parameter directly from URL
|
||||
const getCurrentView = () => {
|
||||
const searchParams = new URLSearchParams(window.location.search);
|
||||
return searchParams.get('view');
|
||||
};
|
||||
|
||||
|
||||
const [currentView, setCurrentView] = useState(getCurrentView);
|
||||
|
||||
// Update URL params when location changes
|
||||
@@ -146,17 +145,17 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
};
|
||||
|
||||
window.addEventListener('popstate', handleLocationChange);
|
||||
|
||||
|
||||
// Listen for programmatic navigation changes
|
||||
const originalPushState = window.history.pushState;
|
||||
const originalReplaceState = window.history.replaceState;
|
||||
|
||||
window.history.pushState = function(...args) {
|
||||
|
||||
window.history.pushState = function (...args) {
|
||||
originalPushState.apply(window.history, args);
|
||||
setTimeout(handleLocationChange, 0);
|
||||
};
|
||||
|
||||
window.history.replaceState = function(...args) {
|
||||
|
||||
window.history.replaceState = function (...args) {
|
||||
originalReplaceState.apply(window.history, args);
|
||||
setTimeout(handleLocationChange, 0);
|
||||
};
|
||||
@@ -200,39 +199,39 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
|
||||
// Navigation items with simplified active state logic
|
||||
const navigationItems = [
|
||||
{
|
||||
name: 'Dashboard',
|
||||
icon: Home,
|
||||
{
|
||||
name: 'Dashboard',
|
||||
icon: Home,
|
||||
href: `/dashboard?view=${userType}`,
|
||||
active: currentPath === '/dashboard' && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
},
|
||||
{
|
||||
name: 'Library',
|
||||
icon: BookOpen,
|
||||
{
|
||||
name: 'Library',
|
||||
icon: BookOpen,
|
||||
href: `/library?view=${userType}`,
|
||||
active: currentPath === '/library' && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
},
|
||||
{
|
||||
name: 'Surveys',
|
||||
icon: MessageSquare,
|
||||
{
|
||||
name: 'Surveys',
|
||||
icon: MessageSquare,
|
||||
href: `/surveys?view=${userType}`,
|
||||
active: currentPath === '/surveys' && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
},
|
||||
{
|
||||
name: 'Webinars',
|
||||
icon: Calendar,
|
||||
{
|
||||
name: 'Webinars',
|
||||
icon: Calendar,
|
||||
href: `/webinars?view=${userType}`,
|
||||
active: (currentPath === '/webinars' || currentPath === '/individual-webinars') && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
},
|
||||
{
|
||||
name: 'Leaderboard',
|
||||
icon: Trophy,
|
||||
{
|
||||
name: 'Leaderboard',
|
||||
icon: Trophy,
|
||||
href: `/leaderboard?view=${userType}`,
|
||||
active: currentPath === '/leaderboard' && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
},
|
||||
{
|
||||
name: 'Settings',
|
||||
icon: Settings,
|
||||
{
|
||||
name: 'Settings',
|
||||
icon: Settings,
|
||||
href: `/settings?view=${userType}`,
|
||||
active: currentPath?.startsWith('/settings') && (currentView === userType || (!currentView && userType === 'individual'))
|
||||
}
|
||||
@@ -261,11 +260,10 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
<Button
|
||||
key={item.name}
|
||||
variant={item.active ? "secondary" : "ghost"}
|
||||
className={`w-full justify-start text-lg h-10 min-h-[44px] ${
|
||||
item.active
|
||||
? 'bg-brand-gold text-brand-gold-foreground hover:bg-brand-gold/90'
|
||||
className={`w-full justify-start text-lg h-10 min-h-[44px] ${item.active
|
||||
? 'bg-brand-gold text-brand-gold-foreground hover:bg-brand-gold/90'
|
||||
: 'text-white/80 hover:bg-white/10 hover:text-white'
|
||||
}`}
|
||||
}`}
|
||||
onClick={() => {
|
||||
navigateTo(item.href);
|
||||
setSidebarOpen(false);
|
||||
@@ -355,9 +353,8 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
<div className="flex-1 lg:ml-0">
|
||||
{/* Desktop Header */}
|
||||
<header className="hidden lg:block border-b border-border bg-card/95 backdrop-blur supports-[backdrop-filter]:bg-card/60">
|
||||
<div className="flex items-center justify-between px-4 py-4">
|
||||
{/* Search - Reduced max width for more space */}
|
||||
<div className="flex-1 max-w-sm">
|
||||
<div className="flex items-center justify-end px-4 py-4">
|
||||
{/* <div className="flex-1 max-w-sm">
|
||||
<div className="relative">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-4 w-4" />
|
||||
<input
|
||||
@@ -368,7 +365,7 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
className="w-full pl-10 pr-4 py-2 text-lg border border-border rounded-lg bg-background focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="flex items-center gap-3">
|
||||
{/* Corporate features */}
|
||||
@@ -435,7 +432,7 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
</header>
|
||||
|
||||
{/* Page Content - Remove default padding, let pages control their own spacing */}
|
||||
<main
|
||||
<main
|
||||
className="flex-1 min-h-screen bg-background"
|
||||
role="main"
|
||||
id="main-content"
|
||||
@@ -452,7 +449,7 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
</a>
|
||||
|
||||
{/* Main learner content area */}
|
||||
<div
|
||||
<div
|
||||
id="learner-content"
|
||||
className="w-full"
|
||||
role="region"
|
||||
@@ -464,7 +461,7 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
<div className="absolute inset-0 opacity-[0.02] pointer-events-none">
|
||||
<div className="w-full h-full bg-gradient-to-br from-[#04045B]/5 via-transparent to-[#F8C301]/5"></div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Main content with proper spacing */}
|
||||
<div className="relative z-10">
|
||||
{children}
|
||||
@@ -493,41 +490,41 @@ export function LearnerLayout({ children, currentPage, userType = 'individual',
|
||||
<div className="fixed bottom-6 left-6 z-40">
|
||||
<button
|
||||
onClick={() => {
|
||||
document.getElementById('main-content')?.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
document.getElementById('main-content')?.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
});
|
||||
}}
|
||||
className="sr-only focus:not-sr-only bg-[#04045B] hover:bg-[#04045B]/90 text-white p-3 rounded-full shadow-lg transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-[#F8C301] focus:ring-offset-2"
|
||||
aria-label="Back to top of page"
|
||||
title="Back to top"
|
||||
>
|
||||
<svg
|
||||
className="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
<svg
|
||||
className="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M5 10l7-7m0 0l7 7m-7-7v18"
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M5 10l7-7m0 0l7 7m-7-7v18"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Progress indicator for course content */}
|
||||
<div
|
||||
<div
|
||||
id="learner-progress-indicator"
|
||||
className="fixed top-[70px] left-0 right-0 h-1 bg-gray-200 opacity-0 transition-opacity duration-200 z-40"
|
||||
role="progressbar"
|
||||
aria-label="Page loading progress"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div
|
||||
<div
|
||||
className="h-full bg-gradient-to-r from-[#04045B] to-[#F8C301] transition-all duration-300 ease-out"
|
||||
style={{ width: '0%' }}
|
||||
></div>
|
||||
|
||||
15
src/main.tsx
15
src/main.tsx
@@ -1,7 +1,10 @@
|
||||
import { createRoot } from "react-dom/client";
|
||||
import { BrowserRouter } from "react-router-dom";
|
||||
import App from "./App.tsx";
|
||||
import "./styles/globals.css";
|
||||
|
||||
import { createRoot } from "react-dom/client";
|
||||
import App from "./App.tsx";
|
||||
import "./styles/globals.css";
|
||||
|
||||
createRoot(document.getElementById("root")!).render(<App />);
|
||||
|
||||
createRoot(document.getElementById("root")!).render(
|
||||
<BrowserRouter>
|
||||
<App />
|
||||
</BrowserRouter>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user