Files
formbricks-formbricks/apps/web/components/shared/CodeBlock.tsx
Matti Nannt 27d63c01e1 Introducing the new Formbricks (#210)
### New Formbricks Release: Complete Rewrite, New Features & Enhanced UI 🚀

We're thrilled to announce the release of the new Formbricks, a complete overhaul of our codebase, packed with powerful features and an improved user experience.

#### What's New:

1. **Survey Builder**: Design and customize your in-product micro-surveys with our intuitive survey builder.
2. **Trigger Micro-Surveys**: Set up micro-surveys to appear at specific points within your app, allowing you to gather feedback when it matters most.
3. **JavaScript SDK**: Our new JavaScript SDK makes integration a breeze - just embed it once and you're ready to go.
4. **No-Code Events**: Set up events and triggers without writing a single line of code, making it accessible for everyone on your team.
5. **Revamped UI**: Enjoy an entirely new user interface that enhances usability and provides a smooth, delightful experience.

This release marks a major step forward for Formbricks, enabling you to better understand your users and build an outstanding product experience.

Please update your Formbricks integration to take advantage of these exciting new features, and let us know in the Discord if you have any questions or feedback!

Happy surveying! 🎉
2023-03-29 23:34:29 +02:00

36 lines
1.1 KiB
TypeScript

// components/ui/CodeBlock.tsx
import React, { useEffect } from "react";
import Prism from "prismjs";
import "prismjs/themes/prism.css";
import { DocumentDuplicateIcon } from "@heroicons/react/24/outline";
import toast from "react-hot-toast";
interface CodeBlockProps {
children: React.ReactNode;
language: string;
}
const CodeBlock: React.FC<CodeBlockProps> = ({ children, language }) => {
useEffect(() => {
Prism.highlightAll();
}, [children]);
return (
<div className="group relative mt-4 rounded-md font-light text-slate-200">
<DocumentDuplicateIcon
className="absolute top-4 right-4 z-20 h-5 w-5 cursor-pointer text-slate-600 opacity-0 transition-all duration-150 group-hover:opacity-60"
onClick={() => {
const childText = children?.toString() || "";
navigator.clipboard.writeText(childText);
toast.success("Copied to clipboard");
}}
/>
<pre>
<code className={`language-${language} whitespace-pre-wrap`}>{children}</code>
</pre>
</div>
);
};
export default CodeBlock;