মূল অংশে যান
shadcn/ui-এর জন্য Yuvaমেনু

shadcn/ui-এর জন্য Yuva

লাইভ চ্যাট, ডকুমেন্টেশন পাতার আলোচনা এবং মেইলিং লিস্টে সাইন-আপের জন্য React কম্পোনেন্ট, আপনার shadcn/ui প্রকল্পে কপি করা হয়।

Yuva রেজিস্ট্রি হলো কম্পোনেন্ট ও hooks-এর একটি সংগ্রহ, যা shadcn CLI আপনার প্রকল্পে কপি করে। এগুলো আপনার থিম ব্যবহার করে, 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