NotedeckFAQ.tsx (6023B)
1 import { FormattedMessage, useIntl } from "react-intl"; 2 import { motion } from "framer-motion"; 3 import { RoundedContainerWithGradientBorder } from "@/components/ui/RoundedContainerWithGradientBorder"; 4 import { cn } from "@/lib/utils"; 5 import { Award, Badge, Heart, Joystick, KeyRound, Scale, Stars, Wallet } from "lucide-react"; 6 import { MeshGradient3 } from "@/components/effects/MeshGradient.3"; 7 import { 8 Accordion, 9 AccordionContent, 10 AccordionItem, 11 AccordionTrigger, 12 } from "@/components/ui/Accordion" 13 import { Onest } from "next/font/google"; 14 import { MarkdownView } from "@/components/ui/MarkdownView"; 15 16 const onest = Onest({ subsets: ['latin'] }) 17 18 19 export function NotedeckFAQ({ className }: { className?: string }) { 20 const intl = useIntl() 21 22 const faq = [ 23 { 24 question: intl.formatMessage({ id: "faq.start", defaultMessage: "How do I get started (private key, public key)?" }), 25 answer: intl.formatMessage({ 26 id: "faq.start.a", 27 defaultMessage: `**From iOS Damus:** \`Go to side menu\` -> \`Tap on profile\` -> Tap on the *Copy button* adjacent to npub field\n\n**Any public key:** Go to [nostr.band](https://nostr.band) in your browser, and search for a nostr user of interest (e.g. Terry Yiu) to find their npub (public key). Tap on npub to copy it.\n\n\n\n**Private key:** From iOS Damus -> go to side menu -> settings -> keys -> copy "secret account login key" and use this to log in to notedeck.` 28 }), 29 }, 30 { 31 question: intl.formatMessage({ id: "faq.purple.effect", defaultMessage: "How does my purple membership affect notedeck?" }), 32 answer: intl.formatMessage({ id: "faq.purple.effect.a", defaultMessage: "You get access to notedeck before anyone else!" }), 33 }, 34 { 35 question: intl.formatMessage({ id: "faq.need.purple", defaultMessage: "Do I need purple to get notedeck on day one?" }), 36 answer: intl.formatMessage({ id: "faq.need.purple.a", defaultMessage: "Yes!" }), 37 }, 38 { 39 question: intl.formatMessage({ id: "faq.day.one", defaultMessage: "What works on day one?" }), 40 answer: intl.formatMessage({ 41 id: "faq.day.one.a", 42 defaultMessage: "- Login with public key (npub)\n- Login with private key (nsec)\n- Multiple accounts\n- Add profile columns\n- Add notifications columns\n- Add hashtag columns\n- Create post\n- Reply\n- Quote note\n- Log out`" 43 }), 44 }, 45 { 46 question: intl.formatMessage({ id: "faq.not.work.day.one", defaultMessage: "Important stuff that doesn't work on day one" }), 47 answer: intl.formatMessage({ 48 id: "faq.not.work.day.one.a", 49 defaultMessage: `- Auto suggest tagging\n- Zaps\n- DMs\n- Reposts\n- Likes/reactions\n- Embedded video\n- Upload media\n- Modifying profile\n- Modifying relay list\n- See followers/following count\n- Search, and many more` 50 }), 51 }, 52 { 53 question: intl.formatMessage({ id: "faq.trouble.feedback", defaultMessage: "Having trouble, or have feedback?" }), 54 answer: intl.formatMessage({ 55 id: "faq.trouble.feedback.a", 56 defaultMessage: "Tag damus on nostr, or send an email to [support@damus.io](mailto:support@damus.io)." 57 }), 58 }, 59 { 60 question: intl.formatMessage({ id: "faq.buy.purple", defaultMessage: "How can I buy purple if I am not a purple member?" }), 61 answer: intl.formatMessage({ id: "faq.buy.purple.a", defaultMessage: "[https://damus.io/purple](https://damus.io/purple)" }), 62 }, 63 { 64 question: intl.formatMessage({ id: "faq.supported.os", defaultMessage: "Supported operating systems" }), 65 answer: intl.formatMessage({ id: "faq.supported.os.a", defaultMessage: `**On day one:**\n\n- Linux\n- Ubuntu\n- Fedora\n- MacOS\n- Windows\n\n**In the future:**\n- Android\n- iOS\n- iPadOS` }), 66 }, 67 { 68 question: intl.formatMessage({ id: "faq.support.signer.extension", defaultMessage: "Does notedeck support signer extension?" }), 69 answer: intl.formatMessage({ id: "faq.support.signer.extension.a", defaultMessage: "No. Notedeck is a desktop app where key storage is local so a signer extension isn't required. Trust in third party apps is eliminated by using the desktop app Notedeck." }), 70 }, 71 ] 72 73 return (<> 74 <div className={cn("bg-black overflow-hidden relative", className)}> 75 <MeshGradient3 className="absolute top-0 left-0 pointer-events-none translate-y-3/4 overflow-visible scale-150" /> 76 <div className="container mx-auto px-6 pb-32 pt-20"> 77 <div className="flex flex-col items-center justify-center mt-16"> 78 <div className="relative mb-12 flex flex-col items-center"> 79 <motion.h2 80 className={cn("mt-6 text-3xl sm:text-4xl md:text-5xl text-center text-transparent bg-clip-text pb-6 font-semibold whitespace-pre-line max-w-4xl tracking-wide leading-relaxed", onest.className)} 81 style={{ 82 backgroundImage: "linear-gradient(to right, #ffffff -100%, #ffffff -40%, #2D175B 100%)", 83 opacity: 0, 84 }} 85 animate={{ 86 backgroundImage: "linear-gradient(to right, #ffffff 0%, #ffffff 40%, #2D175B 100%)", 87 transition: { duration: 3 }, 88 opacity: 1 89 }} 90 > 91 {intl.formatMessage({ id: "purple.faq.headline", defaultMessage: "Frequent Questions" })} 92 </motion.h2> 93 </div> 94 </div> 95 <Accordion type="single" collapsible className="w-full text-white max-w-2xl mx-auto"> 96 {faq.map((item, index) => ( 97 <AccordionItem value={`item-${index}`} key={index}> 98 <AccordionTrigger>{item.question}</AccordionTrigger> 99 <AccordionContent className="whitespace-pre-line"> 100 <MarkdownView> 101 {item.answer} 102 </MarkdownView> 103 </AccordionContent> 104 </AccordionItem> 105 ))} 106 </Accordion> 107 </div> 108 </div> 109 </>) 110 }