fixed bugs

2026-06-12 23:23:22 +00:00 · 2026-02-22 23:25:10 +00:00
parent 53279e8fe1
commit f5d1bfb49d
10 changed files with 1073 additions and 834 deletions
--- a/src/components/PublicLayout.tsx
+++ b/src/components/PublicLayout.tsx
@@ -0,0 +1,116 @@
+import React, { useState } from 'react'
+import { Link, useLocation } from 'react-router-dom'
+import { Sparkles, Menu, X } from 'lucide-react'
+
+/**
+ * R-07 FIX: PublicLayout provides navigation for unauthenticated users
+ * on public pages (Marketplace, Pricing, ChatbotDetail).
+ * Previously these pages had NO navigation header, making it impossible
+ * for unauthenticated users to navigate between public pages.
+ */
+export const PublicLayout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const location = useLocation()
+  const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
+
+  const isActive = (path: string) => location.pathname.startsWith(path)
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      {/* Navigation Header */}
+      <nav className="bg-white border-b border-gray-200 sticky top-0 z-50">
+        <div className="max-w-6xl mx-auto px-4 sm:px-6">
+          <div className="flex items-center justify-between h-14">
+            {/* Logo */}
+            <Link to="/" className="flex items-center gap-2 group">
+              <div className="w-8 h-8 bg-gradient-to-br from-primary-500 to-primary-700 rounded-lg flex items-center justify-center
+                shadow-sm group-hover:shadow-md transition-shadow">
+                <Sparkles className="w-4 h-4 text-white" />
+              </div>
+              <span className="font-bold text-gray-900 text-lg tracking-tight">Contexta</span>
+            </Link>
+
+            {/* Desktop nav links */}
+            <div className="hidden md:flex items-center gap-6">
+              <Link
+                to="/marketplace"
+                className={`text-sm font-medium transition-colors ${
+                  isActive('/marketplace') ? 'text-primary-600' : 'text-gray-600 hover:text-gray-900'
+                }`}
+              >
+                Marketplace
+              </Link>
+              <Link
+                to="/pricing"
+                className={`text-sm font-medium transition-colors ${
+                  isActive('/pricing') ? 'text-primary-600' : 'text-gray-600 hover:text-gray-900'
+                }`}
+              >
+                Pricing
+              </Link>
+            </div>
+
+            {/* Auth buttons (desktop) */}
+            <div className="hidden md:flex items-center gap-3">
+              <Link to="/login" className="text-sm text-gray-600 hover:text-gray-900 font-medium px-3 py-1.5 transition-colors">
+                Sign in
+              </Link>
+              <Link
+                to="/signup"
+                className="bg-primary-600 text-white text-sm px-4 py-2 rounded-lg hover:bg-primary-700 font-semibold transition-all shadow-sm"
+              >
+                Get started free
+              </Link>
+            </div>
+
+            {/* Mobile hamburger */}
+            <button
+              className="md:hidden p-2 rounded-lg hover:bg-gray-100 transition-colors"
+              onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
+              aria-label="Toggle menu"
+            >
+              {mobileMenuOpen ? <X className="w-5 h-5" /> : <Menu className="w-5 h-5" />}
+            </button>
+          </div>
+
+          {/* Mobile menu */}
+          {mobileMenuOpen && (
+            <div className="md:hidden border-t border-gray-100 py-3 space-y-1 animate-fade-in-down">
+              <Link
+                to="/marketplace"
+                className="block px-3 py-2 text-sm text-gray-700 font-medium rounded-lg hover:bg-gray-50"
+                onClick={() => setMobileMenuOpen(false)}
+              >
+                Marketplace
+              </Link>
+              <Link
+                to="/pricing"
+                className="block px-3 py-2 text-sm text-gray-700 font-medium rounded-lg hover:bg-gray-50"
+                onClick={() => setMobileMenuOpen(false)}
+              >
+                Pricing
+              </Link>
+              <hr className="border-gray-100 my-2" />
+              <Link
+                to="/login"
+                className="block px-3 py-2 text-sm text-gray-700 font-medium rounded-lg hover:bg-gray-50"
+                onClick={() => setMobileMenuOpen(false)}
+              >
+                Sign in
+              </Link>
+              <Link
+                to="/signup"
+                className="block mx-3 bg-primary-600 text-white text-sm px-4 py-2.5 rounded-lg font-semibold text-center"
+                onClick={() => setMobileMenuOpen(false)}
+              >
+                Get started free
+              </Link>
+            </div>
+          )}
+        </div>
+      </nav>
+
+      {/* Page content */}
+      <main>{children}</main>
+    </div>
+  )
+}