కంటెంట్‌కు వెళ్ళు
Yuvashadcn
shadcn/ui కోసం Yuvaమెనూ

shadcn/ui కోసం Yuva

లైవ్ చాట్, డాక్యుమెంటేషన్ పేజీల చర్చలు, మెయిలింగ్ లిస్ట్ సైన్-అప్ కోసం React కాంపోనెంట్‌లు, మీ shadcn/ui ప్రాజెక్ట్‌లోకి కాపీ అవుతాయి.

Yuva రిజిస్ట్రీ అనేది shadcn CLI మీ ప్రాజెక్ట్‌లోకి కాపీ చేసే కాంపోనెంట్‌లు మరియు hooks సమితి. అవి మీ థీమ్‌ను ఉపయోగిస్తాయి, useyuva క్లయింట్ ద్వారా Yuva తో మాట్లాడతాయి, సవరించడం మీ చేతిలోనే.

అవసరాలు

  • ఇప్పటికే shadcn/ui ఉపయోగిస్తున్న ప్రాజెక్ట్, React మరియు Tailwind CSS తో.
  • ఒక Yuva చాట్ ఛానెల్ మరియు దాని పబ్లిక్ కీ (yuva_pk_…).

ఛానెల్‌ను సెటప్ చేయండి

  1. Yuva ప్యానెల్‌లో సెట్టింగ్‌లు, మీ ఇన్‌బాక్స్, ఛానెల్‌లు తెరిచి ఒక చాట్ ఛానెల్‌ను జోడించండి.
  2. కాంపోనెంట్‌లను చూపించే ప్రతి origin ను అనుమతించిన origin గా జోడించండి: మీ సైట్ మరియు మీ డెవలప్‌మెంట్ సర్వర్.
  3. ఛానెల్ పబ్లిక్ కీని కాపీ చేయండి. అది రహస్యం కాదు.
  4. చర్చల కోసం ఛానెల్ చర్చా మోడ్‌ను moderated లేదా open చేయండి. సబ్‌స్క్రైబ్ ఫారమ్ కోసం ఒక పబ్లిక్ మెయిలింగ్ లిస్ట్ జోడించండి.

కీని మరియు మీ Yuva సర్వర్ చిరునామాను కాంపోనెంట్‌లకు ఇవ్వండి, ఉదాహరణకు ఎన్విరాన్‌మెంట్‌లో:

.env.local
NEXT_PUBLIC_YUVA_SERVER=https://support.example.com
NEXT_PUBLIC_YUVA_CHANNEL=yuva_pk_xxxxxxxxxxxxxxxx

మీ మొదటి ఐటమ్‌ను జోడించండి

చాట్ బ్లాక్‌ను ఇన్‌స్టాల్ చేసి, ఆపై రెండర్ చేయండి:

Shell
npx shadcn@latest add https://useyuva.com/r/yuva-chat.json
tsx
import { YuvaChat } from "@/components/yuva-chat"

export function Support() {
  return (
    <YuvaChat
      server={process.env.NEXT_PUBLIC_YUVA_SERVER}
      channel={process.env.NEXT_PUBLIC_YUVA_CHANNEL}
    />
  )
}

ఐటమ్‌లు

రిజిస్ట్రీలోని అన్ని ఐటమ్‌లు, సైడ్‌బార్ లాగా సమూహపరచబడ్డాయి.

బ్లాక్‌లు

భాగాలు

Hooks

తదుపరి →Yuva chat