Files
OmniRoute/docs/i18n/bn/docs/frameworks/PLAYGROUND_STUDIO.md
Diego Rodrigues de Sa e Souza 8feea123bb feat(docs): mirror every docs/ page in all 65 locales (#14106)
* feat(docs): mirror every docs/ page in all 65 locales

Extends the documentation mirrors from the 22-page core set (#13940) to
every Markdown page under docs/: 152 sources x 65 locales = 9,880 mirrors
(6,208 new), language bars rewritten for the full locale list, state
adopted so the blocking drift gate now covers all 152 pages.

run-translation.mjs: an oversized block made only of table rows or list
items (PROVIDER_REFERENCE.md 244-row table, FREE_TIERS.md 71-item list) is
cut at item boundaries and rejoined without a blank line — the single
16-40 KB request outlived the backend socket for verbose scripts. 48
older mirrors whose tables had lost rows were retranslated with --force.

* docs(i18n): refresh mirrors for the sources the base changed since the branch cut

Section-level retranslation of the 29 docs (and README.md) whose source
or mirrors moved on release/v3.8.51 during the run, then state adoption;
the drift gate is green again on the merged tree.
2026-09-18 13:16:46 -03:00

24 KiB
Raw Blame History

Playground Studio (বাংলা)

🌐 Languages: 🇺🇸 English · 🇪🇹 am · 🇸🇦 ar · 🇦🇿 az · 🇧🇬 bg · 🇨🇿 cs · 🇩🇰 da · 🇩🇪 de · 🇬🇷 el · 🇪🇸 es · 🇪🇪 et · 🇮🇷 fa · 🇫🇮 fi · 🇫🇷 fr · 🇮🇪 ga · 🇮🇳 gu · 🇳🇬 ha · 🇮🇱 he · 🇮🇳 hi · 🇭🇷 hr · 🇭🇺 hu · 🇦🇲 hy · 🇮🇩 id · 🇳🇬 ig · 🇮🇹 it · 🇯🇵 ja · 🇬🇪 ka · 🇰🇭 km · 🇮🇳 kn · 🇰🇷 ko · 🇱🇹 lt · 🇱🇻 lv · 🇮🇳 ml · 🇮🇳 mr · 🇲🇾 ms · 🇲🇹 mt · 🇲🇲 my · 🇳🇵 ne · 🇳🇱 nl · 🇳🇴 no · 🇮🇳 or · 🇮🇳 pa · 🇵🇭 phi · 🇵🇱 pl · 🇵🇹 pt · 🇧🇷 pt-BR · 🇷🇴 ro · 🇷🇺 ru · 🇱🇰 si · 🇸🇰 sk · 🇸🇮 sl · 🇷🇸 sr · 🇸🇪 sv · 🇰🇪 sw · 🇮🇳 ta · 🇮🇳 te · 🇹🇭 th · 🇹🇷 tr · 🇺🇦 uk-UA · 🇵🇰 ur · 🇺🇿 uz · 🇻🇳 vi · 🇳🇬 yo · 🇨🇳 zh-CN · 🇹🇼 zh-TW


ফিচার: Playground Studio — /dashboard/playground-এর জন্য সমন্বিত AI টেস্টিং ওয়ার্কস্পেস। প্ল্যান: 17-playground-studio-redesign.plan.md + _orchestration/master-plan-group-C.md স্ট্যাটাস: v3.8.6-এ প্রকাশিত


সংক্ষিপ্ত বিবরণ

Playground Studio /dashboard/playground-কে একটি সাধারণ Monaco-ভিত্তিক এডিটর থেকে একটি পূর্ণাঙ্গ টেস্টিং ওয়ার্কস্পেসে রূপান্তর করে। এটি পুরোনো page.tsx-এর পরিবর্তে একটি PlaygroundStudio শেল ব্যবহার করে, যা চারটি ট্যাব এবং একটি শেয়ার্ড কনফিগ প্যান রেন্ডার করে।

┌ Playground ──────────────────────────────────────────────────────────┐
│ [💬 চ্যাট] [⚖ তুলনা] [{} API] [🔧 বিল্ড]       142↑ 38↓ · $0.002 </>│
├──────────────────────────────────────────┬───────────────────────────┤
│  {সক্রিয় ট্যাবের কনটেন্ট}               │ ─ কনফিগ                   │
│                                          │ এন্ডপয়েন্ট [chat ]       │
│                                          │ মডেল      [gpt-5.4 ]     │
│                                          │ সিস্টেম   [টেক্সটএরিয়া]   │
│                                          │ টেম্প     ▕▕▔▔ 0.7        │
│                                          │ প্রিসেট [▾ লোড][সেভ]      │
│                                          │ [✨ প্রম্পট উন্নত করুন]    │
└──────────────────────────────────────────┴───────────────────────────┘

ট্যাবসমূহ

চ্যাট ট্যাব

ChatPlayground.tsx-কে একটি মাল্টি-টার্ন স্ট্রিমিং ওয়ার্কবেঞ্চে উন্নীত করে:

  • MarkdownMessage.tsx-এর মাধ্যমে সম্পূর্ণ markdown রেন্ডারিং (কোড ব্লক, টেবিল, তালিকা, লিংক)।
  • শেয়ার্ড কনফিগ প্যান থেকে নেওয়া সিস্টেম প্রম্পট।
  • প্রতি মেসেজের টোকেন/খরচ (প্রম্পট + কমপ্লিশন টোকেন)।
  • সর্বশেষ রেসপন্স পুনরায় তৈরি করা।
  • SSE স্ট্রিমিংসহ POST /v1/chat/completions-এ পাঠায়।

তুলনা ট্যাব

একটি প্রক্সির মূল স্বাতন্ত্র্যসূচক বৈশিষ্ট্য: সর্বোচ্চ 4টি মডেলে সমান্তরালভাবে 1টি প্রম্পট চালানো।

  • সর্বোচ্চ 4টি কলাম, যার প্রতিটি /v1/chat/completions থেকে স্বতন্ত্রভাবে স্ট্রিম করে।
  • কলাম যোগ করতে + মডেল যোগ করুন বাটন (Cmd+K শর্টকাট)।
  • সব চালান ▶ Promise.all + প্রতি-কলামের AbortController ব্যবহার করে একই সঙ্গে সব স্ট্রিম চালু করে।
  • গ্লোবাল সব বাতিল করুন চলমান প্রতিটি স্ট্রিম বাতিল করে।
  • প্রতি-কলামের ProviderMetrics রিয়েল টাইমে TTFT, TPS, টোকেন এবং আনুমানিক খরচ দেখায়।
  • মেট্রিক্সে "ক্লায়েন্ট-সাইড অনুমান" (D12) লেবেল থাকে — প্রথম SSE চাঙ্ক থেকে পরিমাপ করা হয়।

API ট্যাব

দক্ষ ব্যবহারকারীদের জন্য মূল Monaco এডিটরের 100% অক্ষুণ্ণ রাখে (D14):

  • 10টি এন্ডপয়েন্ট: চ্যাট কমপ্লিশন, কমপ্লিশন, এমবেডিং, ছবি, অডিও, স্পিচ, ট্রান্সক্রিপশন, মডারেশন, রির্যাঙ্ক, সার্চ।
  • মাল্টিমোডাল ফাইল আপলোড।
  • রিয়েল-টাইম আউটপুটসহ SSE স্ট্রিমিং।
  • ApiTab.tsx হিসেবে মোড়ানো (অলসভাবে লোড করা, ssr: false)।

বিল্ড ট্যাব

টুল/ফাংশন কলিং এবং স্ট্রাকচার্ড আউটপুট UI:

  • ToolsBuilder.tsx — প্রতি টুলের জন্য JSON স্কিমা এডিটরসহ tools[] যোগ/সম্পাদনা/অপসারণ। ToolDefinitionSchema (Zod)-এর মাধ্যমে প্যারামিটার যাচাই করে।
  • StructuredOutputEditor.tsx — JSON মোড টগল + JSON স্কিমা এডিটর। StructuredOutputSchema (Zod)-এর মাধ্যমে স্কিমার বিপরীতে রেসপন্স যাচাই করে।
  • tools[] এবং/অথবা response_format-সহ /v1/chat/completions-এ রিকোয়েস্ট পাঠায়।

কনফিগ পেন (শেয়ার্ড)

StudioConfigPane.tsx — সর্বদা দৃশ্যমান, সংকোচনযোগ্য।

ফিল্ড কম্পোনেন্ট নোট
এন্ডপয়েন্ট <select> PlaygroundEndpoint-এর সঙ্গে মিলে এমন 10টি বিকল্প
মডেল <input> অবাধ টেক্সট, যেমন openai/gpt-4o
সিস্টেম প্রম্পট <textarea> সব ট্যাবে সরবরাহ করা হয়
প্যারামিটার ParamSliders temperature, max_tokens, top_p, presence/frequency penalty, seed, stop
প্রিসেট PresetPicker নামযুক্ত কনফিগ স্ন্যাপশট লোড/সংরক্ষণ করে (DB-তে স্থায়ীভাবে সংরক্ষিত)
প্রম্পট উন্নত করুন ImprovePromptButton কোটা-সতর্কতা মডাল খোলে, /api/playground/improve-prompt কল করে

স্টেট PlaygroundStudio.tsx-এ তুলে নেওয়া হয় এবং সব ট্যাবে পাঠানো হয়। ট্যাব পরিবর্তন করলেও কনফিগ স্টেট সংরক্ষিত থাকে।


টপ বার

StudioTopBar.tsx:

  • ট্যাব সুইচার (role="tablist")।
  • TokenCostCounter — লাইভ টোকেন (↑/↓) এবং আনুমানিক খরচ প্রদর্শন।
  • কোড এক্সপোর্ট বোতাম (</>) — ExportCodeModal খোলে।

কোড এক্সপোর্ট মডাল

ExportCodeModal.tsx বর্তমান PlaygroundState থেকে curl / Python / TypeScript স্নিপেট তৈরি করতে codeExport.ts ব্যবহার করে। API কী প্লেসহোল্ডার সবসময় $OMNIROUTE_API_KEY (D11)।


প্রম্পট ইমপ্রুভার

ImprovePromptButton.tsxuseImprovePrompt.tsPOST /api/playground/improve-prompt:

  1. মডাল সতর্ক করে যে এটি "কোটা ব্যবহার করবে"।
  2. নিশ্চিত করলে, রুটে { system, prompt, model, tone } পাঠায়।
  3. রুট অভ্যন্তরীণভাবে promptImprover.META_SYSTEM_PROMPT দিয়ে /v1/chat/completions কল করে।
  4. { improvedSystem?, improvedPrompt?, tokensIn, tokensOut } ফেরত দেয়।
  5. UI কনফিগ পেনের সিস্টেম প্রম্পট এবং চ্যাট ট্যাবের ব্যবহারকারী প্রম্পট প্যাচ করে।

প্রিসেট

PresetPicker.tsxusePresets.ts/api/playground/presets/*:

  • playground_presets SQLite টেবিলে সংরক্ষিত হয় (মাইগ্রেশন 084_playground_presets.sql)।
  • প্রতিটি প্রিসেটে সংরক্ষিত থাকে: name, endpoint, model, system, params_json, created_at
  • CRUD: তালিকার জন্য GET, তৈরির জন্য POST, GET /:id, PUT /:id, DELETE /:id

স্ট্রিম মেট্রিক্স

useStreamMetrics.ts + streamMetrics.ts (পিওর ফাংশন):

  • start() — অনুরোধ শুরুর সময় রেকর্ড করে।
  • onFirstChunk() — TTFT রেকর্ড করে।
  • onChunk(n) — কমপ্লিশন টোকেনের সংখ্যা সঞ্চিত করে।
  • finish(usage?) — চূড়ান্ত মেট্রিক্স গণনা করে: ttftMs, totalMs, tps, tokensIn, tokensOut, costUsd
  • src/lib/playground/types.ts-এর স্ট্যাটিক টেবিল থেকে মূল্য নির্ধারণ করা হয় ("আনুমানিক" হিসেবে লেবেল করা — D13)।

ব্যাকএন্ড রুট

মেথড পাথ হ্যান্ডলার
POST /api/playground/improve-prompt ImprovePromptRequestSchema দিয়ে Zod-ভ্যালিডেশন করে; মেটা-প্রম্পটসহ /v1/chat/completions কল করে
GET /api/playground/presets { presets: PlaygroundPresetListItem[] } ফেরত দেয়
POST /api/playground/presets প্রিসেট তৈরি করে; PlaygroundPresetCreateSchema দিয়ে ভ্যালিডেশন করে
GET /api/playground/presets/:id একটি প্রিসেট অথবা 404 ফেরত দেয়
PUT /api/playground/presets/:id আংশিক আপডেট
DELETE /api/playground/presets/:id 204

প্রমাণীকরণ: ঐচ্ছিক (REQUIRE_API_KEY)। ত্রুটিগুলো buildErrorBody()-এর মাধ্যমে পরিচালিত হয় (কঠোর নিয়ম #12)।


মূল ফাইলসমূহ

পাথ উদ্দেশ্য
src/app/(dashboard)/dashboard/playground/PlaygroundStudio.tsx শেল কম্পোনেন্ট, ট্যাব অর্কেস্ট্রেটর
src/app/(dashboard)/dashboard/playground/components/StudioTopBar.tsx ট্যাব + কাউন্টার + এক্সপোর্ট বোতাম
src/app/(dashboard)/dashboard/playground/components/StudioConfigPane.tsx শেয়ার্ড কনফিগ প্যানেল
src/app/(dashboard)/dashboard/playground/components/tabs/ChatTab.tsx চ্যাট ওয়ার্কবেঞ্চ
src/app/(dashboard)/dashboard/playground/components/tabs/CompareTab.tsx একাধিক মডেলের তুলনা
src/app/(dashboard)/dashboard/playground/components/tabs/ApiTab.tsx Monaco এডিটর (সংরক্ষিত)
src/app/(dashboard)/dashboard/playground/components/tabs/BuildTab.tsx টুল + স্ট্রাকচার্ড আউটপুট
src/app/(dashboard)/dashboard/playground/components/ExportCodeModal.tsx কোড এক্সপোর্ট মোডাল
src/app/(dashboard)/dashboard/playground/components/CompareColumn.tsx একক তুলনা কলাম
src/app/(dashboard)/dashboard/playground/components/ProviderMetrics.tsx TTFT/TPS প্রদর্শন
src/app/(dashboard)/dashboard/playground/hooks/useStreamMetrics.ts ক্লায়েন্ট-সাইড মেট্রিক হুক
src/app/(dashboard)/dashboard/playground/hooks/usePresets.ts প্রিসেট CRUD হুক
src/app/(dashboard)/dashboard/playground/hooks/useImprovePrompt.ts প্রম্পট উন্নত করার হুক
src/lib/playground/codeExport.ts curl/Python/TS জেনারেটর (Search Tools-এর সঙ্গে শেয়ার্ড)
src/lib/playground/promptImprover.ts মেটা-প্রম্পট নির্মাতা
src/lib/playground/streamMetrics.ts বিশুদ্ধ মেট্রিক গণনা
src/lib/db/playgroundPresets.ts DB মডিউল (CRUD)
src/app/api/playground/improve-prompt/route.ts প্রম্পট উন্নত করার REST রুট
src/app/api/playground/presets/route.ts প্রিসেট তালিকা + তৈরি
src/app/api/playground/presets/[id]/route.ts প্রিসেট সংগ্রহ/আপডেট/মুছে ফেলা
src/lib/db/migrations/084_playground_presets.sql DB মাইগ্রেশন

সমস্যা সমাধান

লক্ষণ কারণ সমাধান
API ট্যাবে Monaco editor রেন্ডার হচ্ছে না SSR Monaco লোড করেছে যাচাই করুন যে ApiTab-এ dynamic(..., { ssr: false }) ব্যবহার করা হয়েছে
তুলনামূলক স্ট্রিমগুলো ধারাবাহিকভাবে চালু হয় Promise.all-এর ভুল ব্যবহার সব স্ট্রিম চালু করার কাজ একটি Promise.all কলে পাঠাতে হবে
মেট্রিক্সে TTFT null দেখায় প্রথম chunk handler সংযুক্ত নেই SSE reader loop-এ useStreamMetrics.onFirstChunk() কল করা হয়েছে কি না পরীক্ষা করুন
প্রিসেট সংরক্ষিত থাকছে না DB migration চালানো হয়নি npm run db:migrate চালান অথবা সার্ভার পুনরায় চালু করুন (স্টার্টআপের সময় migration স্বয়ংক্রিয়ভাবে চলে)
প্রম্পট উন্নত করতে গেলে 502 ফেরত আসে Config-এ model সেট করা নেই উন্নত করার আগে ব্যবহারকারীকে Config pane-এ একটি model-এর নাম লিখতে হবে
এক্সপোর্ট করা কোডে MISSING_API_KEY দেখায় Placeholder প্রবেশ করানো হয়নি codeExport.ts সর্বদা API_KEY_PLACEHOLDER = "$OMNIROUTE_API_KEY" ব্যবহার করে

তথ্যসূত্র

  • মূল পরিকল্পনা: _tasks/features-v3.8.6/refactorpages/_orchestration/master-plan-group-C.md
  • ফিচার পরিকল্পনা: _tasks/features-v3.8.6/refactorpages/17-playground-studio-redesign.plan.md
  • কোড এক্সপোর্ট: src/lib/playground/codeExport.ts
  • প্রম্পট উন্নতকারী: src/lib/playground/promptImprover.ts
  • Search Tools Studio: docs/frameworks/SEARCH_TOOLS_STUDIO.md