diff --git a/app/docs/[...slug]/page.tsx b/app/docs/[...slug]/page.tsx index 0b957fc50..a2033ccd5 100644 --- a/app/docs/[...slug]/page.tsx +++ b/app/docs/[...slug]/page.tsx @@ -12,6 +12,7 @@ import { tocItemProps } from '../layout' import DocsPrevNext from '../../../components/DocsPrevNext/DocsPrevNext' import PageFeedback from '../../../components/PageFeedback/PageFeedback' import { notFound } from 'next/navigation' +import TrySigNozFloatingCard from '@/components/TrySigNozFloatingCard/TrySigNozFloatingCard'; export async function generateMetadata({ params, @@ -88,9 +89,8 @@ export default async function Page({ params }: { params: { slug: string[] } }) { )} + - - {/* */} ) -} \ No newline at end of file +} diff --git a/components/TrySigNozFloatingCard/TrySigNozFloatingCard.tsx b/components/TrySigNozFloatingCard/TrySigNozFloatingCard.tsx new file mode 100644 index 000000000..89ef994a1 --- /dev/null +++ b/components/TrySigNozFloatingCard/TrySigNozFloatingCard.tsx @@ -0,0 +1,48 @@ +'use client'; + +import React, { useState, useEffect } from 'react'; +import Link from 'next/link'; +import { ArrowRight, X } from 'lucide-react'; + +const TrySigNozFloatingCard: React.FC = () => { + const [isVisible, setIsVisible] = useState(true); + + useEffect(() => { + const cardClosed = localStorage.getItem('trySigNozCardClosed'); + if (cardClosed) { + setIsVisible(false); + } + }, []); + + const handleClose = () => { + setIsVisible(false); + localStorage.setItem('trySigNozCardClosed', 'true'); + }; + + if (!isVisible) return null; + + return ( +
+ +

Try SigNoz Cloud for FREE

+

Instant setup, predictable pricing, and advanced features without infrastructure hassles.

+ + Get Started + + +
+ ); +}; + +export default TrySigNozFloatingCard;