Yuva help · shadcn/ui માટે Yuva

The help center in one block: search, the best matches for the page or the popular articles, collections, the article view with its rating and related articles, and a Message us row.

Still stuck?Ask the team, we read every message.

પ્રીવ્યૂ નમૂના ડેટા પર ચાલે છે. તેને નેટવર્ક કે ચેનલની જરૂર નથી.

tsx

import { YuvaHelp } from "@/components/yuva-help"

export function HelpCenter() {
  return (
    <YuvaHelp
      server={process.env.NEXT_PUBLIC_YUVA_SERVER}
      channel={process.env.NEXT_PUBLIC_YUVA_CHANNEL}
      page={window.location.pathname}
      onAsk={(articleId) => openChat(articleId)}
    />
  )
}

ઇન્સ્ટોલેશન

આને shadcn પ્રોજેક્ટમાં ચલાવો. ફાઇલો તમારા પોતાના કોડમાં કૉપિ થાય છે.

Shell

npx shadcn@latest add https://useyuva.com/r/yuva-help.json

Shell

pnpm dlx shadcn@latest add https://useyuva.com/r/yuva-help.json

Shell

yarn dlx shadcn@latest add https://useyuva.com/r/yuva-help.json

Shell

bunx --bun shadcn@latest add https://useyuva.com/r/yuva-help.json

ઉપયોગ

tsx

import { YuvaHelp } from "@/components/yuva-help"

<YuvaHelp server={server} channel={channel} page="/billing" onAsk={() => chat.open()} />

Props

`YuvaHelpProps`

Prop	પ્રકાર
`server?`	`string`
`channel?`	`string`
`client?`	`YuvaClient`
`identityToken?`	`IdentityTokenSource \| null`
`locale?`	`string`
`page?`	`string`
`articleId?`	`string`
`onAsk?`	`(articleId?: string) => void`
`labels?`	`Partial<YuvaHelpLabels>`
`className?`	`string`

લેબલ

દરેક લેબલનું અંગ્રેજી ડિફૉલ્ટ છે. તેમને બદલવા કે અનુવાદ કરવા labels ઑબ્જેક્ટનો એક ભાગ આપો.

લેબલ	ડિફૉલ્ટ
`heading`	`"Help center"`
`searchLabel`	`"Search for help"`
`searchPlaceholder`	`"Search for help"`
`bestMatches`	`"Best matches"`
`popular`	`"Popular articles"`
`browse`	`"Browse"`
`noResults`	`"No articles found."`
`searching`	`"Searching…"`
`helpfulQuestion`	`"Was this helpful?"`
`yes`	`"Yes"`
`no`	`"No"`
`thanks`	`"Thanks for your feedback"`
`related`	`"Related articles"`
`back`	`"Back"`
`stillStuck`	`"Still stuck?"`
`askText`	`"Ask the team, we read every message."`
`messageUs`	`"Message us"`
`loadError`	`"Could not load this."`
`retry`	`"Try again"`
`loading`	`"Loading…"`
`articles`	(count) => `${count} ${count === 1 ? "article" : "articles"}`

નિર્ભરતાઓ

આ આઇટમ ઇન્સ્ટોલ કરવાથી નીચેનું પણ ઉમેરાય છે.

shadcn/ui ના કમ્પોનન્ટ

Yuva ની અન્ય આઇટમ

npm પૅકેજ

lucide-react ↗