ਸਮੱਗਰੀ ਤੇ ਜਾਓ
Yuvashadcn
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

ਅਗਲਾ →Yuva chat