feat(help): Add floating help button to all pages
Replaced inline HelpButton components with a global FloatingHelpButton that appears fixed in the top-right corner of all pages. The button: - Automatically detects the current route and links to the appropriate help page - Uses a consistent position across all pages (fixed, top-right) - Is hidden on help pages themselves - Works on both business and platform layouts 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -9,6 +9,7 @@ import { Business, User } from '../types';
|
||||
import MasqueradeBanner from '../components/MasqueradeBanner';
|
||||
import OnboardingWizard from '../components/OnboardingWizard';
|
||||
import TicketModal from '../components/TicketModal';
|
||||
import FloatingHelpButton from '../components/FloatingHelpButton';
|
||||
import { useStopMasquerade } from '../hooks/useAuth';
|
||||
import { useNotificationWebSocket } from '../hooks/useNotificationWebSocket';
|
||||
import { useTicket } from '../hooks/useTickets';
|
||||
@@ -167,6 +168,9 @@ const BusinessLayoutContent: React.FC<BusinessLayoutProps> = ({ business, user,
|
||||
|
||||
return (
|
||||
<div className="flex h-full bg-gray-50 dark:bg-gray-900 transition-colors duration-200">
|
||||
{/* Floating Help Button */}
|
||||
<FloatingHelpButton />
|
||||
|
||||
<div className={`fixed inset-y-0 left-0 z-40 transform ${isMobileMenuOpen ? 'translate-x-0' : '-translate-x-full'} transition-transform duration-300 ease-in-out md:hidden`}>
|
||||
<Sidebar business={business} user={user} isCollapsed={false} toggleCollapse={() => { }} />
|
||||
</div>
|
||||
|
||||
@@ -6,6 +6,7 @@ import PlatformSidebar from '../components/PlatformSidebar';
|
||||
import UserProfileDropdown from '../components/UserProfileDropdown';
|
||||
import NotificationDropdown from '../components/NotificationDropdown';
|
||||
import TicketModal from '../components/TicketModal';
|
||||
import FloatingHelpButton from '../components/FloatingHelpButton';
|
||||
import { useTicket } from '../hooks/useTickets';
|
||||
import { useScrollToTop } from '../hooks/useScrollToTop';
|
||||
|
||||
@@ -36,6 +37,9 @@ const PlatformLayout: React.FC<PlatformLayoutProps> = ({ user, darkMode, toggleT
|
||||
|
||||
return (
|
||||
<div className="flex h-screen bg-gray-100 dark:bg-gray-900">
|
||||
{/* Floating Help Button */}
|
||||
<FloatingHelpButton />
|
||||
|
||||
{/* Mobile menu */}
|
||||
<div className={`fixed inset-y-0 left-0 z-40 transform ${isMobileMenuOpen ? 'translate-x-0' : '-translate-x-full'} transition-transform duration-300 ease-in-out md:hidden`}>
|
||||
<PlatformSidebar user={user} isCollapsed={false} toggleCollapse={() => { }} />
|
||||
|
||||
Reference in New Issue
Block a user