diff --git a/src/App.tsx b/src/App.tsx index 01e0de9..376c2de 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,7 +2,8 @@ import { Toaster } from "@/components/ui/toaster"; import { Toaster as Sonner } from "@/components/ui/sonner"; import { TooltipProvider } from "@/components/ui/tooltip"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; -import { BrowserRouter, Routes, Route } from "react-router-dom"; +import { BrowserRouter, Routes, Route, useLocation } from "react-router-dom"; +import { useEffect } from "react"; // Layouts import PublicLayout from "@/components/layouts/PublicLayout"; @@ -15,6 +16,7 @@ import FeaturesPage from "@/pages/marketing/FeaturesPage"; import PricingPage from "@/pages/marketing/PricingPage"; import SecurityPage from "@/pages/marketing/SecurityPage"; import SSHCertificatesPage from "@/pages/marketing/SSHCertificatesPage"; +import ZeroTierPage from "@/pages/marketing/ZeroTierPage"; import DemoPage from "@/pages/marketing/DemoPage"; // Public pages @@ -59,7 +61,6 @@ import OAuthProvidersPage from "@/pages/admin/OAuthProvidersPage"; import OrgSetupPage from "@/pages/auth/OrgSetupPage"; import NotFound from "@/pages/NotFound"; -import ApiDevTools from "@/components/dev/ApiDevTools"; const queryClient = new QueryClient({ defaultOptions: { @@ -82,12 +83,22 @@ const App = () => ( + ); +// Scroll to top on navigation +function ScrollToTop() { + const location = useLocation(); + useEffect(() => { + window.scrollTo({ top: 0, left: 0, behavior: 'instant' }); + }, [location.pathname]); + return null; +} + // Separate component so AuthProvider can use useNavigate import { AuthProvider, useAuth } from "@/contexts/AuthContext"; import { OrgProvider } from "@/contexts/OrgContext"; @@ -148,6 +159,7 @@ function AppRoutes() { } /> } /> } /> + } /> } /> @@ -208,8 +220,6 @@ function AppRoutes() { } /> - {/* Dev tools - only shown in development */} - ); diff --git a/src/components/layouts/AuthenticatedLayout.tsx b/src/components/layouts/AuthenticatedLayout.tsx index a107200..73ab8d6 100644 --- a/src/components/layouts/AuthenticatedLayout.tsx +++ b/src/components/layouts/AuthenticatedLayout.tsx @@ -2,6 +2,7 @@ import { Outlet } from "react-router-dom"; import { SidebarProvider } from "@/components/ui/sidebar"; import { AppSidebar } from "@/components/navigation/AppSidebar"; import { TopBar } from "@/components/navigation/TopBar"; +import ApiDevTools from "@/components/dev/ApiDevTools"; export default function AuthenticatedLayout() { return ( @@ -15,6 +16,7 @@ export default function AuthenticatedLayout() { + {import.meta.env.DEV && } ); } diff --git a/src/components/layouts/MarketingLayout.tsx b/src/components/layouts/MarketingLayout.tsx index 2b3bcce..1bd42b1 100644 --- a/src/components/layouts/MarketingLayout.tsx +++ b/src/components/layouts/MarketingLayout.tsx @@ -14,11 +14,12 @@ X import { useState } from "react"; const navigation = [ -{ name: "Features", href: "/features" }, -{ name: "Security", href: "/security" }, -{ name: "SSH Certificates", href: "/ssh-certificates" }, -{ name: "Pricing", href: "/pricing" }, -{ name: "Demo", href: "/demo" }, + { name: "Features", href: "/features" }, + { name: "Security", href: "/security" }, + { name: "SSH Certificates", href: "/ssh-certificates" }, + { name: "ZeroTier", href: "/zerotier" }, + { name: "Pricing", href: "/pricing" }, + { name: "Demo", href: "/demo" }, ]; export default function MarketingLayout() { @@ -143,6 +144,7 @@ return (
  • Features
  • Security
  • SSH Certificates
  • +
  • ZeroTier
  • Pricing
  • @@ -152,7 +154,7 @@ return (

    Resources

    diff --git a/src/pages/marketing/FeaturesPage.tsx b/src/pages/marketing/FeaturesPage.tsx index 748b84f..4d45c04 100644 --- a/src/pages/marketing/FeaturesPage.tsx +++ b/src/pages/marketing/FeaturesPage.tsx @@ -2,179 +2,214 @@ import { Link } from "react-router-dom"; import { Button } from "@/components/ui/button"; import { Card, CardContent } from "@/components/ui/card"; import { -Shield, -Key, -Users, -Lock, -Terminal, -Building2, -Globe, -ShieldCheck, -ArrowRight, -CheckCircle2, -Fingerprint, -ArrowRightLeft, -Eye, -Settings, -UserCheck, -Clock, -Server, -UserPlus, -FileKey, -Activity, -Layers, -ShieldAlert, -Network, -ScanLine, -LogIn, -AppWindow, + Shield, + Key, + Users, + Lock, + Terminal, + Building2, + Globe, + ShieldCheck, + ArrowRight, + CheckCircle2, + Fingerprint, + ArrowRightLeft, + Eye, + Settings, + UserCheck, + Clock, + Server, + UserPlus, + FileKey, + Activity, + Layers, + ShieldAlert, + Network, + ScanLine, + LogIn, + AppWindow, + Monitor, + Zap, } from "lucide-react"; const authenticationFeatures = [ { -icon: Building2, -title: "Microsoft 365 SSO", -description: "Connect your Microsoft Entra ID (Azure AD) directory. Users authenticate with their corporate credentials instantly.", + icon: Building2, + title: "Microsoft 365 SSO", + description: "Connect your Microsoft Entra ID (Azure AD) directory. Users authenticate with their corporate credentials instantly.", }, { -icon: Globe, -title: "Google Workspace SSO", -description: "Seamless integration with Google Workspace. Enable single sign-on for all your internal applications.", + icon: Globe, + title: "Google Workspace SSO", + description: "Seamless integration with Google Workspace. Enable single sign-on for all your internal applications.", }, { -icon: Key, -title: "GitHub Authentication", -description: "Allow developers to authenticate using their GitHub accounts. Perfect for engineering teams.", + icon: Key, + title: "GitHub Authentication", + description: "Allow developers to authenticate using their GitHub accounts. Perfect for engineering teams.", }, { -icon: Lock, -title: "Traditional Username/Password", -description: "Full support for traditional authentication with email verification and secure password policies.", + icon: Lock, + title: "Traditional Username/Password", + description: "Full support for traditional authentication with email verification and secure password policies.", }, ]; const mfaFeatures = [ { -icon: Fingerprint, -title: "WebAuthn/Passkeys", -description: "Hardware security keys and platform authenticators (Face ID, Touch ID, Windows Hello). Phishing-resistant authentication.", + icon: Fingerprint, + title: "WebAuthn/Passkeys", + description: "Hardware security keys and platform authenticators (Face ID, Touch ID, Windows Hello). Phishing-resistant authentication.", }, { -icon: Shield, -title: "TOTP Authenticator Apps", -description: "Support for Google Authenticator, Authy, 1Password, and any TOTP-compatible authenticator app.", + icon: Shield, + title: "TOTP Authenticator Apps", + description: "Support for Google Authenticator, Authy, 1Password, and any TOTP-compatible authenticator app.", }, { -icon: Clock, -title: "Grace Periods", -description: "Configure grace periods for MFA enrollment. Give users time to set up their authenticators without blocking access.", + icon: Clock, + title: "Grace Periods", + description: "Configure grace periods for MFA enrollment. Give users time to set up their authenticators without blocking access.", }, { -icon: ShieldAlert, -title: "Policy Enforcement", -description: "Organization-wide MFA requirements. Require specific methods (TOTP only, Passkey only, or both).", + icon: ShieldAlert, + title: "Policy Enforcement", + description: "Organization-wide MFA requirements. Require specific methods (TOTP only, Passkey only, or both).", }, ]; const oidcFeatures = [ { -icon: ArrowRightLeft, -title: "OIDC Provider", -description: "Secuird acts as a standards-compliant OpenID Connect provider. Connect any OIDC-compatible application.", + icon: ArrowRightLeft, + title: "OIDC Provider", + description: "Secuird acts as a standards-compliant OpenID Connect provider. Connect any OIDC-compatible application.", }, { -icon: AppWindow, -title: "Multiple Applications", -description: "Register unlimited client applications. Each gets unique credentials and configurable redirect URIs.", + icon: AppWindow, + title: "Multiple Applications", + description: "Register unlimited client applications. Each gets unique credentials and configurable redirect URIs.", }, { -icon: UserCheck, -title: "Consent Management", -description: "Users see and approve what information is shared. Transparent data access with user control.", + icon: UserCheck, + title: "Consent Management", + description: "Users see and approve what information is shared. Transparent data access with user control.", }, { -icon: Network, -title: "Scopes & Claims", -description: "Configure custom scopes and claims. Pass user roles, groups, and custom attributes to your applications.", + icon: Network, + title: "Scopes & Claims", + description: "Configure custom scopes and claims. Pass user roles, groups, and custom attributes to your applications.", }, ]; const sshFeatures = [ { -icon: Terminal, -title: "Native SSH Support", -description: "Use standard OpenSSH client. No custom agents or modified binaries required. Works everywhere SSH works.", + icon: Terminal, + title: "Native SSH Support", + description: "Use standard OpenSSH client. No custom agents or modified binaries required. Works everywhere SSH works.", }, { -icon: FileKey, -title: "Short-Lived Certificates", -description: "Certificates expire in minutes or hours. Eliminate long-lived SSH keys that persist after employees leave.", + icon: FileKey, + title: "Short-Lived Certificates", + description: "Certificates expire in minutes or hours. Eliminate long-lived SSH keys that persist after employees leave.", }, { -icon: Eye, -title: "Complete Audit Trail", -description: "Every certificate issuance and SSH connection is logged. Full chain of custody from creation to usage.", + icon: Eye, + title: "Complete Audit Trail", + description: "Every certificate issuance and SSH connection is logged. Full chain of custody from creation to usage.", }, { -icon: Users, -title: "Group-Based Access", -description: "Configure principals and policies per department or team. Automatic group membership from identity provider.", + icon: Users, + title: "Group-Based Access", + description: "Configure principals and policies per department or team. Automatic group membership from identity provider.", }, { -icon: Server, -title: "Host Certificates", -description: "Issue certificates for servers too. Verify host identity without TOFU warnings or known_hosts management.", + icon: Server, + title: "Host Certificates", + description: "Issue certificates for servers too. Verify host identity without TOFU warnings or known_hosts management.", }, { -icon: Activity, -title: "Real-Time Monitoring", -description: "Monitor certificate usage in real-time. Detect anomalies and suspicious access patterns.", + icon: Activity, + title: "Real-Time Monitoring", + description: "Monitor certificate usage in real-time. Detect anomalies and suspicious access patterns.", }, ]; +const zerotierFeatures = [ + { + icon: Monitor, + title: "Device Registration", + description: "Register ZeroTier nodes by Node ID. No shared secrets — users own their devices.", + }, + { + icon: Users, + title: "Approval Workflows", + description: "Manager approval required before network access. Durable approvals survive across days.", + }, + { + icon: Clock, + title: "Activation Sessions", + description: "Time-bounded access sessions. Re-authenticate to activate for a fixed period like an 8-hour workday.", + }, + { + icon: Zap, + title: "Kill Switch", + description: "Instantly revoke all active memberships for a user across all networks. Lost laptop? Immediate response.", + }, + { + icon: ShieldCheck, + title: "Complete Audit Trail", + description: "Every network access event logged. Know who accessed what, when, and from which device.", + }, + { + icon: Network, + title: "Multi-Network Support", + description: "Manage production, staging, and lab networks separately with environment-based policies.", + }, +]; + const organizationFeatures = [ { -icon: Users, -title: "Multi-Tenant Architecture", -description: "Separate organizations with complete isolation. Each org has its own members, policies, and resources.", + icon: Users, + title: "Multi-Tenant Architecture", + description: "Separate organizations with complete isolation. Each org has its own members, policies, and resources.", }, { -icon: UserPlus, -title: "Invite System", -description: "Invite users by email with role assignments. Automatic onboarding with pre-configured group memberships.", + icon: UserPlus, + title: "Invite System", + description: "Invite users by email with role assignments. Automatic onboarding with pre-configured group memberships.", }, { -icon: Layers, -title: "Department Management", -description: "Organize users into departments. Apply policies and SSH certificate settings per department.", + icon: Layers, + title: "Department Management", + description: "Organize users into departments. Apply policies and SSH certificate settings per department.", }, { -icon: ScanLine, -title: "Registration Tracking", -description: "Track user registration sources. UTM codes, referral links, and marketing campaigns are captured automatically.", + icon: ScanLine, + title: "Registration Tracking", + description: "Track user registration sources. UTM codes, referral links, and marketing campaigns are captured automatically.", }, ]; const complianceFeatures = [ { -icon: Eye, -title: "Audit Logging", -description: "Every action is logged with user, timestamp, IP address, and details. Export logs for SIEM integration.", + icon: Eye, + title: "Audit Logging", + description: "Every action is logged with user, timestamp, IP address, and details. Export logs for SIEM integration.", }, { -icon: Settings, -title: "Security Policies", -description: "Define organization-wide security policies. MFA requirements, password rules, and session settings.", + icon: Settings, + title: "Security Policies", + description: "Define organization-wide security policies. MFA requirements, password rules, and session settings.", }, { -icon: ShieldCheck, -title: "Compliance Reports", -description: "Generate compliance reports for SOC 2, HIPAA, and other frameworks. Demonstrate security controls.", + icon: ShieldCheck, + title: "Compliance Reports", + description: "Generate compliance reports for SOC 2, HIPAA, and other frameworks. Demonstrate security controls.", }, { -icon: Activity, -title: "Activity Monitoring", -description: "Real-time visibility into user activity. Login patterns, certificate usage, and security events.", + icon: Activity, + title: "Activity Monitoring", + description: "Real-time visibility into user activity. Login patterns, certificate usage, and security events.", }, ]; @@ -393,8 +428,84 @@ return ( + {/* ZeroTier Network Governance */} +
    +
    +
    +
    + {/* Screenshot placeholder - replace with actual screenshot */} + + +
    + +
    +

    ZeroTier Network Management

    +

    Screenshot placeholder — replace with:

    +
      +
    • Networks list with environment tags
    • +
    • Member status and activation state
    • +
    • Pending requests and approvals
    • +
    +
    +
    +
    +
    +
    + +
    +
    + + ZeroTier Network Governance +
    +

    + Govern ZeroTier Access
    + With Your Identity Platform +

    +

    + Add approval workflows, time-bounded activation sessions, and complete audit trails to your + ZeroTier networks. Stop using raw ZeroTier administration and give managers the controls they need. +

    +
      + {[ + "Devices registered by ZeroTier Node ID — no shared secrets", + "Manager approval separates authorization from activation", + "Activation sessions last hours, not days — automatic expiration", + "Kill switch for lost devices or immediate offboarding", + "Immutable audit trail for every network access event", + ].map((item, index) => ( +
    • + + {item} +
    • + ))} +
    + + + +
    +
    + +
    + {zerotierFeatures.map((feature) => ( + + +
    + +
    +

    {feature.title}

    +

    {feature.description}

    +
    +
    + ))} +
    +
    +
    + {/* Organization Management */} -
    +
    @@ -446,7 +557,7 @@ return (
    {/* Compliance & Audit */} -
    +
    @@ -526,4 +637,4 @@ return (
    ); -} \ No newline at end of file +} diff --git a/src/pages/marketing/HomePage.tsx b/src/pages/marketing/HomePage.tsx index bd05e68..1b60d6b 100644 --- a/src/pages/marketing/HomePage.tsx +++ b/src/pages/marketing/HomePage.tsx @@ -2,439 +2,512 @@ import { Link } from "react-router-dom"; import { Button } from "@/components/ui/button"; import { Card, CardContent } from "@/components/ui/card"; import { -Shield, -Key, -Users, -Lock, -Terminal, -Building2, -ShieldCheck, -ArrowRight, -CheckCircle2, -Globe, -Fingerprint, -Clock, -ArrowRightLeft, -Eye, -Settings, -UserCheck + Shield, + Key, + Users, + Lock, + Terminal, + Building2, + ShieldCheck, + ArrowRight, + CheckCircle2, + Globe, + Fingerprint, + Clock, + ArrowRightLeft, + Eye, + Settings, + UserCheck, + Network } from "lucide-react"; const features = [ -{ -icon: Shield, -title: "Enterprise SSO Without Complexity", -description: - "Enable single sign-on with Microsoft 365, Google Workspace, and GitHub. No complex federation setups—just connect and go.", -}, -{ -icon: Key, -title: "SSH Certificate Authority", -description: - "Issue short-lived SSH certificates tied to user identities. Eliminate shared SSH keys and achieve complete auditability.", -}, -{ -icon: Lock, -title: "Multi-Factor Authentication", -description: - "Enforce MFA policies across your organization with TOTP and WebAuthn/Passkey support. Compliance made simple.", -}, -{ -icon: ArrowRightLeft, -title: "OIDC Provider Built-In", -description: - "Secuird acts as an OIDC identity provider for your internal applications. One identity, seamless access everywhere.", -}, + { + icon: Shield, + title: "Enterprise SSO Without Complexity", + description: + "Enable single sign-on with Microsoft 365, Google Workspace, and GitHub. No complex federation setups—just connect and go.", + }, + { + icon: Key, + title: "SSH Certificate Authority", + description: + "Issue short-lived SSH certificates tied to user identities. Eliminate shared SSH keys and achieve complete auditability.", + }, + { + icon: Lock, + title: "Multi-Factor Authentication", + description: + "Enforce MFA policies across your organization with TOTP and WebAuthn/Passkey support. Compliance made simple.", + }, + { + icon: ArrowRightLeft, + title: "OIDC Provider Built-In", + description: + "Secuird acts as an OIDC identity provider for your internal applications. One identity, seamless access everywhere.", + }, + { + icon: Network, + title: "ZeroTier Network Governance", + description: + "Control access to private ZeroTier networks with approval workflows, time-bounded activation sessions, and instant kill switches.", + }, ]; const sshFeatures = [ -{ -icon: Terminal, -title: "Native SSH Integration", -description: "Use standard SSH clients—no custom agents or modified binaries required. Works with OpenSSH out of the box.", -}, -{ -icon: Clock, -title: "Short-Lived Certificates", -description: "Certificates expire automatically. Reduce blast radius and eliminate the headache of key rotation.", -}, -{ -icon: Eye, -title: "Complete Audit Trail", -description: "Every certificate issuance and SSH connection is logged. Know exactly who accessed what, when.", -}, -{ -icon: UserCheck, -title: "Identity-Linked Access", -description: "SSH access is tied to verified corporate identities. No more anonymous shared accounts.", -}, + { + icon: Terminal, + title: "Native SSH Integration", + description: "Use standard SSH clients—no custom agents or modified binaries required. Works with OpenSSH out of the box.", + }, + { + icon: Clock, + title: "Short-Lived Certificates", + description: "Certificates expire automatically. Reduce blast radius and eliminate the headache of key rotation.", + }, + { + icon: Eye, + title: "Complete Audit Trail", + description: "Every certificate issuance and SSH connection is logged. Know exactly who accessed what, when.", + }, + { + icon: UserCheck, + title: "Identity-Linked Access", + description: "SSH access is tied to verified corporate identities. No more anonymous shared accounts.", + }, ]; const socialProviders = [ -{ name: "Microsoft 365", icon: Building2 }, -{ name: "Google Workspace", icon: Globe }, -{ name: "GitHub", icon: Key }, + { name: "Microsoft 365", icon: Building2 }, + { name: "Google Workspace", icon: Globe }, + { name: "GitHub", icon: Key }, + { name: "ZeroTier", icon: Network }, ]; export default function HomePage() { -return ( - <> - {/* Hero Section */} -
    -
    -
    - {/* Badge */} -
    - - Security-first identity platform -
    - - {/* Headline */} -

    - Enterprise Authentication, - Without the Enterprise Complexity -

    - - {/* Subheadline */} -

    - Secuird unifies social logins, MFA, and SSH certificate management in one platform. - Your team gets seamless access. You get complete control and auditability. -

    - - {/* CTA Buttons */} -
    - - - - - - -
    - - {/* Trust indicators */} -
    -

    Trusted authentication providers

    -
    - {socialProviders.map((provider) => ( -
    - - {provider.name} -
    - ))} + return ( + <> + {/* Hero Section */} +
    +
    +
    + {/* Badge */} +
    + + Security-first identity platform
    -
    -
    -
    -
    - {/* Features Grid */} -
    -
    -
    -

    - Everything You Need for Identity & Access -

    -

    - From user authentication to SSH certificate management, Secuird provides a complete identity platform. -

    -
    + {/* Headline */} +

    + Every Identity. One Platform. + Complete Access Control. +

    -
    - {features.map((feature) => ( - - -
    - -
    -

    {feature.title}

    -

    {feature.description}

    -
    -
    - ))} -
    - -
    - - - -
    -
    -
    - - {/* SSH Certificates Feature Highlight */} -
    -
    -
    -
    -
    - - SSH Certificate Authority -
    -

    - Eliminate SSH Key Chaos -

    -

    - Replace static SSH keys with short-lived certificates tied to verified identities. - Every access is logged, every certificate is traceable. + {/* Subheadline */} +

    + Secuird unifies Google, Microsoft, GitHub, and traditional authentication with MFA enforcement, + SSH certificates, and ZeroTier network governance — all in one platform.

    -
      - {[ - "Works with standard OpenSSH—no custom clients needed", - "Certificates expire automatically—no more key rotation", - "Full audit trail from issuance to usage", - "Group-based access policies", - ].map((item) => ( -
    • - - {item} -
    • - ))} -
    + {/* CTA Buttons */} +
    + + + + + + +
    - - - + {/* Trust indicators */} +
    +

    Trusted authentication providers

    +
    + {socialProviders.map((provider) => ( +
    + + {provider.name} +
    + ))} +
    +
    +
    +
    +
    + + {/* Features Grid */} +
    +
    +
    +

    + Everything You Need for Identity & Access +

    +

    + From user authentication to SSH certificate management, Secuird provides a complete identity platform. +

    -
    - {sshFeatures.map((feature) => ( - +
    + {features.map((feature) => ( + -
    - +
    +
    -

    {feature.title}

    +

    {feature.title}

    {feature.description}

    ))}
    -
    -
    -
    - {/* How It Works */} -
    -
    -
    -

    - How It Works -

    -

    - Get started in minutes, not months. No complex federation required. -

    +
    + + + +
    +
    -
    - {[ - { - step: "01", - title: "Connect Your Providers", - description: "Link Microsoft 365, Google Workspace, or GitHub. Users authenticate with credentials they already have.", - icon: Users, - }, - { - step: "02", - title: "Configure Policies", - description: "Set MFA requirements, access policies, and SSH certificate parameters. One policy, organization-wide.", - icon: Settings, - }, - { - step: "03", - title: "Connect Your Apps", - description: "Register internal applications as OIDC clients. Users get seamless SSO access to everything.", - icon: Fingerprint, - }, - ].map((step) => ( -
    -
    {step.step}
    -
    - + {/* SSH Certificates Feature Highlight */} +
    +
    +
    +
    +
    + + SSH Certificate Authority
    -

    {step.title}

    -

    {step.description}

    -
    - ))} -
    -
    -
    +

    + Eliminate SSH Key Chaos +

    +

    + Replace static SSH keys with short-lived certificates tied to verified identities. + Every access is logged, every certificate is traceable. +

    - {/* Marketing & Registration Tracking */} -
    -
    -
    -
    - - -
    -
    -
    - -
    -
    -

    Marketing Campaign A

    -

    utm_source=newsletter

    -
    -
    -
    -
    - -
    -
    -

    Partner Integration

    -

    referral_code=partner123

    -
    -
    -
    -
    - -
    -
    -

    Direct Signup

    -

    organic registration

    -
    -
    -
    -

    Auto-applied policies:

    -
    - Trial Extended - Partner Group -
    -
    -
    -
    -
    -
    +
      + {[ + "Works with standard OpenSSH—no custom clients needed", + "Certificates expire automatically—no more key rotation", + "Full audit trail from issuance to usage", + "Group-based access policies", + ].map((item) => ( +
    • + + {item} +
    • + ))} +
    -
    -
    - - Registration Tracking -
    -

    - Know Where Your Users Come From -

    -

    - Track user registration sources through marketing codes, UTM parameters, or referral links. - Apply policies and group memberships automatically based on origin. -

    - -
      - {[ - "Automatic group assignment based on registration source", - "UTM parameter tracking for marketing attribution", - "Custom invite codes with policy presets", - "Partner and affiliate tracking", - ].map((item) => ( -
    • - - {item} -
    • - ))} -
    -
    -
    -
    -
    - - {/* Security & Compliance */} -
    -
    -
    -
    - - Security First -
    -

    - Built for Enterprise Security Requirements -

    -

    - Every feature is designed with security and compliance in mind. From MFA enforcement to complete audit trails. -

    -
    - -
    - {[ - { - icon: Lock, - title: "MFA Enforcement", - description: "Organization-wide MFA policies. Require TOTP or WebAuthn for all users, with grace periods for enrollment.", - }, - { - icon: Eye, - title: "Complete Audit Trail", - description: "Every action is logged. From logins to SSH certificate usage, you have full visibility into who did what.", - }, - { - icon: ShieldCheck, - title: "Compliance Ready", - description: "Meet SOC 2, HIPAA, and other compliance requirements with documented security controls and audit logs.", - }, - ].map((item) => ( - - -
    - -
    -

    {item.title}

    -

    {item.description}

    -
    -
    - ))} -
    - -
    - - - -
    -
    -
    - - {/* CTA Section */} -
    -
    - -
    - -

    - Ready to Simplify Your Identity Stack? -

    -

    - Start your free trial today. No credit card required. Set up SSO and SSH certificates in under an hour. -

    -
    - - - -
    + +
    + {sshFeatures.map((feature) => ( + + +
    + +
    +

    {feature.title}

    +

    {feature.description}

    +
    +
    + ))} +
    +
    +
    +
    + + {/* ZeroTier Network Access Section */} +
    +
    +
    +
    +
    + + ZeroTier Network Governance +
    +

    + Govern Your ZeroTier Networks
    + With Your Identity Platform +

    +

    + Stop managing ZeroTier access through raw administration interfaces. Secuird adds + approval workflows, time-bounded activation sessions, and complete audit trails + to your ZeroTier networks. +

    + +
      + {[ + "Register devices by ZeroTier Node ID — no shared secrets", + "Manager approval before any network access is granted", + "Time-bounded activation sessions (e.g., 8-hour workday)", + "Instant kill switch to revoke all active memberships", + "Full audit trail of who accessed what network when", + ].map((item) => ( +
    • + + {item} +
    • + ))} +
    + + +
    - - -
    -
    - -); -} \ No newline at end of file + +
    + {/* Screenshot placeholder - replace with actual screenshot */} + + +
    + +
    +

    ZeroTier Networks Dashboard

    +

    Screenshot placeholder — replace with:

    +
      +
    • Networks list view
    • +
    • Device activation status
    • +
    • Member management panel
    • +
    +
    +
    +
    +
    +
    +
    +
    +
    + + {/* How It Works */} +
    +
    +
    +

    + How It Works +

    +

    + Get started in minutes, not months. No complex federation required. +

    +
    + +
    + {[ + { + step: "01", + title: "Connect Your Providers", + description: "Link Microsoft 365, Google Workspace, or GitHub. Users authenticate with credentials they already have.", + icon: Users, + }, + { + step: "02", + title: "Configure Policies", + description: "Set MFA requirements, access policies, and SSH certificate parameters. One policy, organization-wide.", + icon: Settings, + }, + { + step: "03", + title: "Connect Your Apps", + description: "Register internal applications as OIDC clients. Users get seamless SSO access to everything.", + icon: Fingerprint, + }, + ].map((step) => ( +
    +
    {step.step}
    +
    + +
    +

    {step.title}

    +

    {step.description}

    +
    + ))} +
    +
    +
    + + {/* Marketing & Registration Tracking */} +
    +
    +
    +
    + + +
    +
    +
    + +
    +
    +

    Marketing Campaign A

    +

    utm_source=newsletter

    +
    +
    +
    +
    + +
    +
    +

    Partner Integration

    +

    referral_code=partner123

    +
    +
    +
    +
    + +
    +
    +

    Direct Signup

    +

    organic registration

    +
    +
    +
    +

    Auto-applied policies:

    +
    + Trial Extended + Partner Group +
    +
    +
    +
    +
    +
    + +
    +
    + + Registration Tracking +
    +

    + Know Where Your Users Come From +

    +

    + Track user registration sources through marketing codes, UTM parameters, or referral links. + Apply policies and group memberships automatically based on origin. +

    + +
      + {[ + "Automatic group assignment based on registration source", + "UTM parameter tracking for marketing attribution", + "Custom invite codes with policy presets", + "Partner and affiliate tracking", + ].map((item) => ( +
    • + + {item} +
    • + ))} +
    +
    +
    +
    +
    + + {/* Security & Compliance */} +
    +
    +
    +
    + + Security First +
    +

    + Built for Enterprise Security Requirements +

    +

    + Every feature is designed with security and compliance in mind. From MFA enforcement to complete audit trails. +

    +
    + +
    + {[ + { + icon: Lock, + title: "MFA Enforcement", + description: "Organization-wide MFA policies. Require TOTP or WebAuthn for all users, with grace periods for enrollment.", + }, + { + icon: Eye, + title: "Complete Audit Trail", + description: "Every action is logged. From logins to SSH certificate usage, you have full visibility into who did what.", + }, + { + icon: ShieldCheck, + title: "Compliance Ready", + description: "Meet SOC 2, HIPAA, and other compliance requirements with documented security controls and audit logs.", + }, + ].map((item) => ( + + +
    + +
    +

    {item.title}

    +

    {item.description}

    +
    +
    + ))} +
    + +
    + + + +
    +
    +
    + + {/* CTA Section */} +
    +
    + +
    + +

    + Ready to Simplify Your Identity Stack? +

    +

    + Start your free trial today. No credit card required. Set up SSO and SSH certificates in under an hour. +

    +
    + + + + + + +
    +
    + +
    +
    + + ); +} diff --git a/src/pages/marketing/SSHCertificatesPage.tsx b/src/pages/marketing/SSHCertificatesPage.tsx index a876f73..ae18375 100644 --- a/src/pages/marketing/SSHCertificatesPage.tsx +++ b/src/pages/marketing/SSHCertificatesPage.tsx @@ -68,14 +68,14 @@ code: "# Certificate auto-expires", ]; const comparisonFeatures = [ -{ feature: "Lifetime", static: "Permanent", cert: "Minutes to hours" }, -{ feature: "Rotation", static: "Manual, error-prone", cert: "Automatic" }, -{ feature: "Auditability", static: "None", cert: "Full chain of custody" }, -{ feature: "Revocation", static: "Distribute to all servers", cert: "Disable user" }, -{ feature: "Access Control", static: "Manual key distribution", cert: "Group-based policies" }, -{ feature: "Identity Link", static: "Anonymous", cert: "Verified identity" }, -{ feature: "Onboarding", static: "Copy keys manually", cert: "Self-service" }, -{ feature: "Offboarding", static: "Hunt and remove keys", cert: "Instant revocation" }, + { feature: "Key Lifetime", static: "Permanent — keys never expire", cert: "Minutes to hours — auto-expiration" }, + { feature: "Key Rotation", static: "Manual process, error-prone", cert: "Automatic with each certificate" }, + { feature: "Audit Trail", static: "No visibility into usage", cert: "Full chain of custody logged" }, + { feature: "Revocation", static: "Must reach all servers manually", cert: "Disable user — instant globally" }, + { feature: "Access Control", static: "Manual key distribution to servers", cert: "Group-based policies, self-service" }, + { feature: "Identity Link", static: "Anonymous — no user verification", cert: "Tied to verified corporate identity" }, + { feature: "Onboarding", static: "Admin copies keys to every server", cert: "User registers key once, self-service" }, + { feature: "Offboarding", static: "Hunt and remove keys from servers", cert: "Disable user — all certs invalidated" }, ]; const useCases = [ diff --git a/src/pages/marketing/ZeroTierPage.tsx b/src/pages/marketing/ZeroTierPage.tsx new file mode 100644 index 0000000..97f6661 --- /dev/null +++ b/src/pages/marketing/ZeroTierPage.tsx @@ -0,0 +1,466 @@ +import { Link } from "react-router-dom"; +import { Button } from "@/components/ui/button"; +import { Card, CardContent } from "@/components/ui/card"; +import { + Network, + Monitor, + Users, + Clock, + Zap, + ShieldCheck, + ArrowRight, + CheckCircle2, + ShieldAlert, + Globe, + Lock, + Key, +} from "lucide-react"; + +const benefits = [ + { + icon: Monitor, + title: "Node ID Registration", + description: "Register ZeroTier nodes by their unique Node ID. No shared secrets — users own their devices, not the network.", + }, + { + icon: Users, + title: "Approval Workflows", + description: "Manager approval required before network access. Durable approvals survive across days while maintaining security.", + }, + { + icon: Clock, + title: "Time-Bounded Sessions", + description: "Activation sessions last hours, not days. Re-authenticate to activate for a fixed period like an 8-hour workday.", + }, + { + icon: Zap, + title: "Instant Kill Switch", + description: "Revoke all active memberships for a user across all networks. Lost laptop? Immediate response.", + }, +]; + +const howItWorks = [ + { + step: "01", + title: "Register ZeroTier Node", + description: "Users register their ZeroTier Node ID in Secuird. This is a one-time setup — no shared secrets required.", + code: "zerotier-cli info", + }, + { + step: "02", + title: "Request Network Access", + description: "When users need access to a ZeroTier network, they request access through Secuird.", + code: "Request via Secuird dashboard", + }, + { + step: "03", + title: "Manager Approval", + description: "A manager reviews and approves the request. Approval is durable — it persists until explicitly revoked.", + code: "Approved in Secuird portal", + }, + { + step: "04", + title: "Activate for a Session", + description: "User activates their access for a time-bounded session. When the session expires, they re-authenticate.", + code: "Session expires automatically", + }, +]; + +const comparisonFeatures = [ + { + feature: "Access Control", + traditional: "Shared secrets or public lists", + secuird: "Identity-based, approval workflows", + }, + { + feature: "Session Duration", + traditional: "Permanent until manually removed", + secuird: "Hours — automatic expiration", + }, + { + feature: "Revocation", + traditional: "Remove from every network manually", + secuird: "Disable user — instant global revoke", + }, + { + feature: "Audit Trail", + traditional: "None", + secuird: "Complete log of all access events", + }, + { + feature: "Manager Control", + traditional: "No approval workflow", + secuird: "Explicit approval before access granted", + }, + { + feature: "Contractor Access", + traditional: "Share credentials, revoke later", + secuird: "Time-limited, self-service, audited", + }, +]; + +const useCases = [ + { + title: "Managed Service Providers (MSPs)", + description: "Manage access for multiple client networks without sharing credentials. Contractors come and go — maintain control with time-bounded sessions.", + features: [ + "Isolate each client's network access", + "Time-limited access for contractors", + "Complete audit trail for compliance", + "Instant revocation when contracts end", + ], + }, + { + title: "Cloud Service Providers (CSPs)", + description: "Offer ZeroTier-based private networking to your customers with enterprise-grade access controls.", + features: [ + "Multi-tenant network isolation", + "Approval workflows for sensitive networks", + "Usage auditing for billing", + "White-label options", + ], + }, + { + title: "Hyperscalers", + description: "Provide secure ZeroTier connectivity across distributed infrastructure with identity-based access control.", + features: [ + "Scale to thousands of nodes", + "Identity-linked access everywhere", + "Automated compliance reporting", + "API-driven provisioning", + ], + }, + { + title: "Short-Term Contractors", + description: "Give contractors access to specific networks for specific periods. When the contract ends, access ends — automatically.", + features: [ + "Hours-long activation sessions", + "No shared credentials", + "Full audit of what they accessed", + "One-click revocation", + ], + }, +]; + +const features = [ + { + icon: Monitor, + title: "Node ID Registration", + description: "Register ZeroTier nodes by their unique Node ID. No shared secrets — users own their devices.", + }, + { + icon: Users, + title: "Approval Workflows", + description: "Manager approval required before network access. Durable approvals survive across days.", + }, + { + icon: Clock, + title: "Activation Sessions", + description: "Time-bounded access sessions. Re-authenticate to activate for a fixed period like an 8-hour workday.", + }, + { + icon: Zap, + title: "Kill Switch", + description: "Instantly revoke all active memberships for a user across all networks. Lost laptop? Immediate response.", + }, + { + icon: ShieldCheck, + title: "Complete Audit Trail", + description: "Every network access event logged. Know who accessed what, when, and from which device.", + }, + { + icon: Network, + title: "Multi-Network Support", + description: "Manage production, staging, and lab networks separately with environment-based policies.", + }, +]; + +export default function ZeroTierPage() { + return ( + <> + {/* Hero */} +
    +
    +
    +
    +
    + + ZeroTier Network Governance +
    +

    + Identity-Based Access Control + For ZeroTier Networks +

    +

    + Stop managing ZeroTier access through raw administration interfaces. Secuird adds + approval workflows, time-bounded activation sessions, and complete audit trails + to your ZeroTier networks — without requiring SSH certificates. +

    +
    + + + + + + +
    +
    + +
    + + +
    +
    +
    + +
    +
    +

    Production Network

    +

    zt1abc...def

    +
    + Active +
    +
    +

    Pending Requests

    +
    +
    + jane@contractor.io + 2 hours ago +
    +
    + build-server-03 + 5 hours ago +
    +
    +
    +
    +

    Active Sessions

    +
    +
    + john@company.com + Expires in 4h 23m +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + + {/* Not Tied to SSH */} +
    +
    +
    +
    + +
    +

    Independent of SSH Certificates

    +

    + ZeroTier Network Governance works completely independently of SSH Certificate Authority. + Use it on its own to control ZeroTier network access, or combine it with SSH certificates + for comprehensive infrastructure access control. Two powerful features, one unified platform. +

    +
    +
    +
    +
    +
    + + {/* Benefits */} +
    +
    +
    +

    + Why ZeroTier Governance? +

    +

    + Traditional ZeroTier management relies on shared secrets and manual administration. + Secuird brings identity-based access control to ZeroTier. +

    +
    + +
    + {benefits.map((benefit) => ( + + +
    + +
    +

    {benefit.title}

    +

    {benefit.description}

    +
    +
    + ))} +
    +
    +
    + + {/* How It Works */} +
    +
    +
    +

    + How It Works +

    +

    + Simple four-step process from registration to time-bounded access. +

    +
    + +
    + {howItWorks.map((step) => ( + + +
    {step.step}
    +

    {step.title}

    +

    {step.description}

    +
    +                    {step.code}
    +                  
    +
    +
    + ))} +
    +
    +
    + + {/* Traditional vs Secuird */} +
    +
    +
    +

    + Traditional vs. Secuird-Governed ZeroTier +

    +

    + See the difference identity-based access control makes. +

    +
    + + + +
    + + + + + + + + + + {comparisonFeatures.map((row) => ( + + + + + + ))} + +
    FeatureTraditional ZeroTierSecuird-Governed
    {row.feature}{row.traditional}{row.secuird}
    +
    +
    +
    +
    +
    + + {/* Use Cases */} +
    +
    +
    +

    + Use Cases +

    +

    + Perfect for organizations managing access to ZeroTier networks at scale. +

    +
    + +
    + {useCases.map((useCase) => ( + + +

    {useCase.title}

    +

    {useCase.description}

    +
      + {useCase.features.map((feature) => ( +
    • + + {feature} +
    • + ))} +
    +
    +
    + ))} +
    +
    +
    + + {/* Features Deep Dive */} +
    +
    +
    +

    + Powerful Features +

    +

    + Everything you need to manage ZeroTier network access at scale. +

    +
    + +
    + {features.map((feature) => ( + + +
    + +
    +

    {feature.title}

    +

    {feature.description}

    +
    +
    + ))} +
    +
    +
    + + {/* CTA */} +
    +
    + +
    + +

    + Ready to Govern Your ZeroTier Networks? +

    +

    + Start your free trial today. No credit card required. Set up your first network governance policy in minutes. +

    +
    + + + + + + +
    +
    + +
    +
    + + ); +} diff --git a/src/pages/marketing/__tests__/MarketingPages.test.tsx b/src/pages/marketing/__tests__/MarketingPages.test.tsx new file mode 100644 index 0000000..b546494 --- /dev/null +++ b/src/pages/marketing/__tests__/MarketingPages.test.tsx @@ -0,0 +1,29 @@ +import React from "react"; +import { renderToString } from "react-dom/server"; +import { MemoryRouter } from "react-router-dom"; +import HomePage from "../HomePage"; +import FeaturesPage from "../FeaturesPage"; + +// Basic SSR tests to verify marketing page content renders as expected. +// We SSR the components to a string and assert presence of key headlines/texts. + +describe("Marketing Pages SSR", () => { + test("HomePage renders main hero headline", () => { + const html = renderToString( + React.createElement(MemoryRouter, null, React.createElement(HomePage)) + ); + expect(html).toContain("Every Identity. One Platform."); + // Ensure subheading is also present + expect(html).toContain("Secuird unifies Google, Microsoft, GitHub"); + }); + + test("FeaturesPage renders hero section title", () => { + const html = renderToString( + React.createElement(MemoryRouter, null, React.createElement(FeaturesPage)) + ); + // The hero section uses a combined heading with a span; test for the main line. + expect(html).toContain("Everything You Need for Enterprise Identity"); + // Also verify the badge text is present + expect(html).toContain("Complete Feature Set"); + }); +});