diff --git a/packages/twenty-docs/l/ar/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/ar/developers/extend/capabilities/apps.mdx index 7ae2e29eb0..2e0dbeca33 100644 --- a/packages/twenty-docs/l/ar/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/ar/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ ستضيف الأوامر اللاحقة مزيدًا من الملفات والمجلدات: -* `yarn twenty app:dev` سيولّد تلقائيًا عميل API مضبوط الأنواع في `node_modules/twenty-sdk/generated` (عميل Twenty مضبوط الأنواع + أنواع مساحة العمل). +* سيقوم `yarn twenty app:dev` بتوليد عميلين API مضبوطي الأنواع تلقائيًا في `node_modules/twenty-sdk/generated`: `CoreApiClient` (لبيانات مساحة العمل عبر `/graphql`) و`MetadataApiClient` (لتكوين مساحة العمل وتحميل الملفات عبر `/metadata`). * `yarn twenty entity:add` سيضيف ملفات تعريف الكيانات ضمن `src/` لكائناتك المخصّصة، والوظائف، ومكوّنات الواجهة الأمامية، والأدوار، والمهارات، وغير ذلك. ## المصادقة @@ -426,10 +426,10 @@ export default defineRole({ // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ const handler = async (event: RoutePayload) => { ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ export default defineLogicFunction({ تتيح لك المكوّنات الأمامية إنشاء مكوّنات React مخصّصة تُعرَض داخل واجهة مستخدم Twenty. استخدم `defineFrontComponent()` لتعريف مكوّنات مع تحقّق مدمج: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ النقاط الرئيسية: * المكوّنات الأمامية هي مكوّنات React تُعرَض ضمن سياقات معزولة داخل Twenty. -* استخدم لاحقة الملف `*.front-component.tsx` للاكتشاف التلقائي. * يشير الحقل `component` إلى مكوّن React الخاص بك. * يتم بناء المكوّنات ومزامنتها تلقائيًا أثناء `yarn twenty app:dev`. يمكنك إنشاء مكوّنات أمامية جديدة بطريقتين: * **مُنشأ بالقالب**: شغّل `yarn twenty entity:add` واختر خيار إضافة مكوّن أمامي جديد. -* **يدوي**: أنشئ ملفًا جديدًا `*.front-component.tsx` واستخدم `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### المهارات @@ -772,18 +771,24 @@ export default defineSkill({ * **مُنشأ بالقالب**: شغِّل `yarn twenty entity:add` واختر خيار إضافة مهارة جديدة. * **يدوي**: أنشئ ملفًا جديدًا واستخدم `defineSkill()` مع اتباع النمط نفسه. -### عميل مُولَّد مضبوط الأنواع +### عملاء مُولَّدون مضبوطو الأنواع -يُولَّد العميل مضبوط الأنواع تلقائيًا بواسطة `yarn twenty app:dev` ويُخزَّن في `node_modules/twenty-sdk/generated` استنادًا إلى مخطط مساحة العمل لديك. استخدمه في وظائفك: +يتم توليد عميلين مضبوطي الأنواع تلقائيًا بواسطة `yarn twenty app:dev` وتخزينهما في `node_modules/twenty-sdk/generated` استنادًا إلى مخطط مساحة العمل لديك: + +* **`CoreApiClient`** — يُجري استعلامات إلى نقطة النهاية `/graphql` للحصول على بيانات مساحة العمل +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -يُعاد توليد العميل تلقائيًا بواسطة `yarn twenty app:dev` كلما تغيّرت كائناتك أو حقولك. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### بيانات الاعتماد وقت التشغيل في الوظائف المنطقية @@ -800,17 +805,17 @@ const { me } = await client.query({ me: { id: true, displayName: true } }); #### رفع الملفات -يتضمن العميل `Twenty` المُولَّد طريقة `uploadFile` لإرفاق الملفات بالحقول من نوع ملف ضمن كائنات مساحة العمل الخاصة بك. نظرًا لأن عملاء GraphQL القياسيون لا يدعمون تحميل الملفات متعددة الأجزاء افتراضيًا، يوفر العميل هذه الطريقة المخصصة التي تطبق [مواصفة طلب GraphQL متعدد الأجزاء](https://github.com/jaydenseric/graphql-multipart-request-spec) في الخلفية. +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. نظرًا لأن عملاء GraphQL القياسيون لا يدعمون تحميل الملفات متعددة الأجزاء افتراضيًا، يوفر العميل هذه الطريقة المخصصة التي تطبق [مواصفة طلب GraphQL متعدد الأجزاء](https://github.com/jaydenseric/graphql-multipart-request-spec) في الخلفية. ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( النقاط الرئيسية: -* ترسل هذه الطريقة الملف إلى **نقطة نهاية البيانات الوصفية** (وليست نقطة النهاية الرئيسية لـ GraphQL)، حيث تُنفَّذ عملية الرفع. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * تستخدم `universalIdentifier` الخاص بالحقل (وليس المعرّف الخاص بمساحة العمل)، ليعمل كود الرفع لديك عبر أي مساحة عمل مُثبَّت فيها تطبيقك — بما يتماشى مع كيفية إشارة التطبيقات إلى الحقول في كل مكان آخر. * العنوان `url` المُعاد هو عنوان URL موقّع يمكنك استخدامه للوصول إلى الملف المرفوع. diff --git a/packages/twenty-docs/l/cs/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/cs/developers/extend/capabilities/apps.mdx index 43bb200c4a..8106541538 100644 --- a/packages/twenty-docs/l/cs/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/cs/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Pozdější příkazy přidají další soubory a složky: -* `yarn twenty app:dev` automaticky vygeneruje typovaného klienta API v `node_modules/twenty-sdk/generated` (typovaný klient Twenty + typy pracovního prostoru). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` přidá soubory s definicemi entit do `src/` pro vaše vlastní objekty, funkce, frontové komponenty, role, dovednosti a další. ## Ověření @@ -426,10 +426,10 @@ Každý soubor funkce používá `defineLogicFunction()` k exportu konfigurace s // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Chcete-li označit logickou funkci jako nástroj, nastavte `isTool: true` a posk ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ Hlavní body: Frontendové komponenty vám umožňují vytvářet vlastní React komponenty, které se vykreslují v rozhraní Twenty. K definování komponent s vestavěnou validací použijte `defineFrontComponent()`: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Hlavní body: * Frontendové komponenty jsou React komponenty, které se vykreslují v izolovaných kontextech v rámci Twenty. -* Pro automatickou detekci použijte příponu souboru `*.front-component.tsx`. * Pole `component` odkazuje na vaši React komponentu. * Komponenty se během `yarn twenty app:dev` automaticky sestaví a synchronizují. Nové frontendové komponenty můžete vytvořit dvěma způsoby: * **Vygenerované**: Spusťte `yarn twenty entity:add` a zvolte možnost přidat novou frontendovou komponentu. -* **Ruční**: Vytvořte nový soubor `*.front-component.tsx` a použijte `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Dovednosti @@ -772,18 +771,24 @@ Nové dovednosti můžete vytvářet dvěma způsoby: * **Vygenerované**: Spusťte `yarn twenty entity:add` a zvolte možnost přidat novou dovednost. * **Ruční**: Vytvořte nový soubor a použijte `defineSkill()` podle stejného vzoru. -### Generovaný typovaný klient +### Generated typed clients -Typovaný klient je automaticky generován pomocí `yarn twenty app:dev` a ukládá se do `node_modules/twenty-sdk/generated` podle schématu vašeho pracovního prostoru. Použijte jej ve svých funkcích: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Klient se automaticky znovu generuje pomocí `yarn twenty app:dev` kdykoli se změní vaše objekty nebo pole. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Běhové přihlašovací údaje v logických funkcích @@ -800,17 +805,17 @@ Poznámky: #### Nahrávání souborů -Vygenerovaný klient `Twenty` obsahuje metodu `uploadFile` pro připojování souborů k polím typu souboru u objektů ve vašem pracovním prostoru. Protože standardní klienti GraphQL nativně nepodporují nahrávání souborů pomocí multipart, klient poskytuje tuto speciální metodu, která interně implementuje [specifikaci multipart požadavků GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Protože standardní klienti GraphQL nativně nepodporují nahrávání souborů pomocí multipart, klient poskytuje tuto speciální metodu, která interně implementuje [specifikaci multipart požadavků GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Hlavní body: -* Metoda odešle soubor na **koncový bod metadat** (nikoli na hlavní koncový bod GraphQL), kde se provede mutace nahrání. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Používá `universalIdentifier` pole (nikoli jeho ID specifické pro pracovní prostor), takže váš kód pro nahrávání funguje ve všech pracovních prostorech, kde je vaše aplikace nainstalována — v souladu s tím, jak aplikace odkazují na pole všude jinde. * Vrácená hodnota `url` je podepsaná adresa URL, kterou můžete použít k přístupu k nahranému souboru. diff --git a/packages/twenty-docs/l/de/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/de/developers/extend/capabilities/apps.mdx index 38e73f1998..df86820074 100644 --- a/packages/twenty-docs/l/de/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/de/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Spätere Befehle fügen weitere Dateien und Ordner hinzu: -* `yarn twenty app:dev` generiert automatisch einen typisierten API-Client in `node_modules/twenty-sdk/generated` (typisierter Twenty-Client + Arbeitsbereichs-Typen). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` fügt unter `src/` Entitätsdefinitionsdateien für Ihre benutzerdefinierten Objekte, Funktionen, Frontend-Komponenten, Rollen, Skills und mehr hinzu. ## Authentifizierung @@ -426,10 +426,10 @@ Jede Funktionsdatei verwendet `defineLogicFunction()`, um eine Konfiguration mit // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Um eine Logikfunktion als Tool zu markieren, setzen Sie `isTool: true` und geben ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ Hauptpunkte: Frontend-Komponenten ermöglichen es Ihnen, benutzerdefinierte React-Komponenten zu erstellen, die innerhalb der Twenty-UI gerendert werden. Verwenden Sie `defineFrontComponent()`, um Komponenten mit eingebauter Validierung zu definieren: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Hauptpunkte: * Frontend-Komponenten sind React-Komponenten, die in isolierten Kontexten innerhalb von Twenty gerendert werden. -* Verwenden Sie die Dateiendung `*.front-component.tsx` für die automatische Erkennung. * Das Feld `component` verweist auf Ihre React-Komponente. * Komponenten werden während `yarn twenty app:dev` automatisch gebaut und synchronisiert. Sie können neue Frontend-Komponenten auf zwei Arten erstellen: * **Generiert**: Führen Sie `yarn twenty entity:add` aus und wählen Sie die Option zum Hinzufügen einer neuen Frontend-Komponente. -* **Manuell**: Erstellen Sie eine neue `*.front-component.tsx`-Datei und verwenden Sie `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Fähigkeiten @@ -772,18 +771,24 @@ Sie können neue Skills auf zwei Arten erstellen: * **Generiert**: Führen Sie `yarn twenty entity:add` aus und wählen Sie die Option zum Hinzufügen eines neuen Skills. * **Manuell**: Erstellen Sie eine neue Datei und verwenden Sie `defineSkill()` nach demselben Muster. -### Generierter typisierter Client +### Generated typed clients -Der typisierte Client wird von `yarn twenty app:dev` automatisch generiert und basierend auf Ihrem Arbeitsbereichs-Schema in `node_modules/twenty-sdk/generated` gespeichert. Verwenden Sie ihn in Ihren Funktionen: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Der Client wird von `yarn twenty app:dev` automatisch neu generiert, sobald sich Ihre Objekte oder Felder ändern. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Laufzeit-Anmeldedaten in Logikfunktionen @@ -800,17 +805,17 @@ Notizen: #### Dateien hochladen -Der generierte `Twenty`-Client enthält eine Methode `uploadFile`, um Dateien an Felder des Typs Datei in Ihren Arbeitsbereichsobjekten anzuhängen. Da Standard-GraphQL-Clients Multipart-Datei-Uploads nicht nativ unterstützen, stellt der Client diese dedizierte Methode bereit, die unter der Haube die [GraphQL-Multipart-Anfragespezifikation](https://github.com/jaydenseric/graphql-multipart-request-spec) implementiert. +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Da Standard-GraphQL-Clients Multipart-Datei-Uploads nicht nativ unterstützen, stellt der Client diese dedizierte Methode bereit, die unter der Haube die [GraphQL-Multipart-Anfragespezifikation](https://github.com/jaydenseric/graphql-multipart-request-spec) implementiert. ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Hauptpunkte: -* Die Methode sendet die Datei an den **metadata endpoint** (nicht den main GraphQL endpoint), wo die Upload-Mutation ausgeführt wird. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Sie verwendet den `universalIdentifier` des Feldes (nicht dessen arbeitsbereichsspezifische ID), sodass Ihr Upload-Code in jedem Arbeitsbereich funktioniert, in dem Ihre App installiert ist — im Einklang damit, wie Apps Felder überall sonst referenzieren. * Die zurückgegebene `url` ist eine signierte URL, mit der Sie auf die hochgeladene Datei zugreifen können. diff --git a/packages/twenty-docs/l/it/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/it/developers/extend/capabilities/apps.mdx index 00ccff0f5b..11b76cfec8 100644 --- a/packages/twenty-docs/l/it/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/it/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Comandi successivi aggiungeranno altri file e cartelle: -* `yarn twenty app:dev` genererà automaticamente un client API tipizzato in `node_modules/twenty-sdk/generated` (client Twenty tipizzato + tipi dell'area di lavoro). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` will add entity definition files under `src/` for your custom objects, functions, front components, roles, skills, and more. ## Autenticazione @@ -426,10 +426,10 @@ Ogni file di funzione usa `defineLogicFunction()` per esportare una configurazio // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Per contrassegnare una funzione logica come strumento, imposta `isTool: true` e ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ Punti chiave: I componenti front-end ti consentono di creare componenti React personalizzati che vengono renderizzati all'interno dell'interfaccia di Twenty. Usa `defineFrontComponent()` per definire componenti con convalida integrata: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Punti chiave: * I componenti front-end sono componenti React che eseguono il rendering in contesti isolati all'interno di Twenty. -* Usa il suffisso di file `*.front-component.tsx` per il rilevamento automatico. * Il campo `component` fa riferimento al tuo componente React. * I componenti vengono compilati e sincronizzati automaticamente durante `yarn twenty app:dev`. Puoi creare nuovi componenti front-end in due modi: * **Generata dallo scaffolder**: Esegui `yarn twenty entity:add` e scegli l'opzione per aggiungere un nuovo componente front-end. -* **Manuale**: Crea un nuovo file `*.front-component.tsx` e usa `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Abilità @@ -772,18 +771,24 @@ You can create new skills in two ways: * **Scaffolded**: Run `yarn twenty entity:add` and choose the option to add a new skill. * **Manual**: Create a new file and use `defineSkill()`, following the same pattern. -### Client tipizzato generato +### Generated typed clients -Il client tipizzato è generato automaticamente da `yarn twenty app:dev` e salvato in `node_modules/twenty-sdk/generated` in base allo schema della tua area di lavoro. Usalo nelle tue funzioni: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Il client viene rigenerato automaticamente da `yarn twenty app:dev` ogni volta che i tuoi oggetti o campi cambiano. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Credenziali di runtime nelle funzioni logiche @@ -800,17 +805,17 @@ Note: #### Caricamento dei file -Il client `Twenty` generato include un metodo `uploadFile` per allegare file ai campi di tipo file sugli oggetti del tuo spazio di lavoro. Poiché i client GraphQL standard non supportano nativamente il caricamento di file multipart, il client fornisce questo metodo dedicato che implementa la [specifica della richiesta GraphQL multipart](https://github.com/jaydenseric/graphql-multipart-request-spec) dietro le quinte. +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Poiché i client GraphQL standard non supportano nativamente il caricamento di file multipart, il client fornisce questo metodo dedicato che implementa la [specifica della richiesta GraphQL multipart](https://github.com/jaydenseric/graphql-multipart-request-spec) dietro le quinte. ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Punti chiave: -* Il metodo invia il file al **metadata endpoint** (non all'endpoint GraphQL principale), dove la mutation di upload viene risolta. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Usa l'`universalIdentifier` del campo (non il suo ID specifico dello spazio di lavoro), quindi il tuo codice di upload funziona in qualsiasi spazio di lavoro in cui la tua app è installata — coerentemente con il modo in cui le app fanno riferimento ai campi altrove. * L'`url` restituito è un URL firmato che puoi usare per accedere al file caricato. diff --git a/packages/twenty-docs/l/pt/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/pt/developers/extend/capabilities/apps.mdx index 3674ea2c29..f81bbd71a8 100644 --- a/packages/twenty-docs/l/pt/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/pt/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Comandos posteriores adicionarão mais arquivos e pastas: -* `yarn twenty app:dev` vai gerar automaticamente um cliente de API tipado em `node_modules/twenty-sdk/generated` (cliente Twenty tipado + tipos do espaço de trabalho). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` adicionará arquivos de definição de entidade em `src/` para seus objetos, funções, componentes de front-end, papéis e habilidades personalizados, entre outros. ## Autenticação @@ -426,10 +426,10 @@ Cada arquivo de função usa `defineLogicFunction()` para exportar uma configura // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Para marcar uma função lógica como ferramenta, defina `isTool: true` e forne ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ Pontos-chave: Componentes de front-end permitem criar componentes React personalizados que são renderizados na UI do Twenty. Use `defineFrontComponent()` para definir componentes com validação integrada: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Pontos-chave: * Componentes de front-end são componentes React que renderizam em contextos isolados dentro do Twenty. -* Use o sufixo de arquivo `*.front-component.tsx` para detecção automática. * O campo `component` faz referência ao seu componente React. * Os componentes são compilados e sincronizados automaticamente durante `yarn twenty app:dev`. Você pode criar novos componentes de front-end de duas formas: * **Gerado automaticamente**: Execute `yarn twenty entity:add` e escolha a opção para adicionar um novo componente de front-end. -* **Manual**: Crie um novo arquivo `*.front-component.tsx` e use `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Habilidades @@ -772,18 +771,24 @@ Você pode criar novas habilidades de duas formas: * **Gerado automaticamente**: Execute `yarn twenty entity:add` e escolha a opção para adicionar uma nova habilidade. * **Manual**: Crie um novo arquivo e use `defineSkill()`, seguindo o mesmo padrão. -### Cliente tipado gerado +### Generated typed clients -O cliente tipado é gerado automaticamente pelo `yarn twenty app:dev` e armazenado em `node_modules/twenty-sdk/generated` com base no esquema do seu espaço de trabalho. Use-o em suas funções: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -O cliente é regenerado automaticamente pelo `yarn twenty app:dev` sempre que seus objetos ou campos forem alterados. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Credenciais em tempo de execução em funções de lógica @@ -800,17 +805,17 @@ Notas: #### Carregamento de ficheiros -O cliente `Twenty` gerado inclui um método `uploadFile` para anexar ficheiros a campos do tipo ficheiro nos objetos do seu espaço de trabalho. Como os clientes GraphQL padrão não suportam nativamente o carregamento de ficheiros multipart, o cliente fornece este método dedicado que implementa, nos bastidores, a [especificação de pedidos multipart do GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Como os clientes GraphQL padrão não suportam nativamente o carregamento de ficheiros multipart, o cliente fornece este método dedicado que implementa, nos bastidores, a [especificação de pedidos multipart do GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Pontos-chave: -* O método envia o arquivo para o **endpoint de metadados** (não para o endpoint GraphQL principal), onde a mutação de upload é resolvida. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Ele usa o `universalIdentifier` do campo (não o ID específico do espaço de trabalho), de modo que seu código de upload funcione em qualquer espaço de trabalho onde seu app esteja instalado — consistente com a forma como os apps referenciam campos em qualquer outro lugar. * A `url` retornada é um URL assinado que você pode usar para acessar o arquivo enviado. diff --git a/packages/twenty-docs/l/ro/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/ro/developers/extend/capabilities/apps.mdx index 5f6ab11efe..4ae3616838 100644 --- a/packages/twenty-docs/l/ro/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/ro/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Comenzile ulterioare vor adăuga mai multe fișiere și foldere: -* `yarn twenty app:dev` va genera automat un client API tipizat în `node_modules/twenty-sdk/generated` (client Twenty tipizat + tipuri ale spațiului de lucru). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` va adăuga fișiere de definire a entităților în `src/` pentru obiectele, funcțiile, componentele front-end, rolurile, abilitățile și altele. ## Autentificare @@ -426,10 +426,10 @@ Fiecare fișier de funcție folosește `defineLogicFunction()` pentru a exporta // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Pentru a marca o funcție logică drept instrument, setați `isTool: true` și f ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ Puncte cheie: Componentele Front vă permit să construiți componente React personalizate care sunt randate în interfața Twenty. Utilizați `defineFrontComponent()` pentru a defini componente cu validare încorporată: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Puncte cheie: * Componentele Front sunt componente React care sunt randate în contexte izolate în cadrul Twenty. -* Folosiți sufixul de fișier `*.front-component.tsx` pentru detectare automată. * Câmpul `component` face referire la componenta React. * Componentele sunt construite și sincronizate automat în timpul `yarn twenty app:dev`. Puteți crea componente Front noi în două moduri: * **Generat**: Rulați `yarn twenty entity:add` și alegeți opțiunea de a adăuga o componentă frontend nouă. -* **Manual**: Creați un fișier nou `*.front-component.tsx` și folosiți `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Abilități @@ -772,18 +771,24 @@ Puteți crea abilități noi în două moduri: * **Generat**: Rulați `yarn twenty entity:add` și alegeți opțiunea de a adăuga o abilitate nouă. * **Manual**: Creați un fișier nou și folosiți `defineSkill()`, urmând același model. -### Client tipizat generat +### Generated typed clients -Clientul tipizat este generat automat de `yarn twenty app:dev` și stocat în `node_modules/twenty-sdk/generated`, pe baza schemei spațiului tău de lucru. Folosiți-l în funcțiile dvs.: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Clientul este regenerat automat de `yarn twenty app:dev` ori de câte ori obiectele sau câmpurile tale se schimbă. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Acreditări la runtime în funcțiile de logică @@ -800,17 +805,17 @@ Notițe: #### Încărcarea fișierelor -Clientul `Twenty` generat include o metodă `uploadFile` pentru atașarea fișierelor la câmpuri de tip fișier ale obiectelor din spațiul de lucru. Deoarece clienții GraphQL standard nu acceptă în mod nativ încărcarea fișierelor multipart, clientul oferă această metodă dedicată care implementează, sub capotă, [specificația cererilor GraphQL multipart](https://github.com/jaydenseric/graphql-multipart-request-spec). +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Deoarece clienții GraphQL standard nu acceptă în mod nativ încărcarea fișierelor multipart, clientul oferă această metodă dedicată care implementează, sub capotă, [specificația cererilor GraphQL multipart](https://github.com/jaydenseric/graphql-multipart-request-spec). ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Puncte cheie: -* Metoda trimite fișierul către **metadata endpoint** (nu către endpoint-ul principal GraphQL), unde mutația de încărcare este rezolvată. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Folosește `universalIdentifier` al câmpului (nu ID-ul specific spațiului de lucru), astfel încât codul tău de încărcare funcționează în orice spațiu de lucru în care aplicația ta este instalată — în concordanță cu modul în care aplicațiile fac referire la câmpuri în rest. * `url` returnat este un URL semnat pe care îl poți folosi pentru a accesa fișierul încărcat. diff --git a/packages/twenty-docs/l/ru/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/ru/developers/extend/capabilities/apps.mdx index dbe5560330..47688c1f53 100644 --- a/packages/twenty-docs/l/ru/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/ru/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ Позднее команды добавят больше файлов и папок: -* `yarn twenty app:dev` автоматически сгенерирует типизированный клиент API в `node_modules/twenty-sdk/generated` (типизированный клиент Twenty + типы рабочего пространства). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` добавит файлы определений сущностей в `src/` для ваших пользовательских объектов, функций, фронтенд-компонентов, ролей, навыков и многого другого. ## Аутентификация @@ -426,10 +426,10 @@ export default defineRole({ // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ const handler = async (event: RoutePayload) => { ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ export default defineLogicFunction({ Фронт-компоненты позволяют создавать пользовательские компоненты React, которые рендерятся внутри интерфейса Twenty. Используйте `defineFrontComponent()` для определения компонентов со встроенной валидацией: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Основные моменты: * Фронт-компоненты — это компоненты React, которые рендерятся в изолированных контекстах внутри Twenty. -* Используйте суффикс файла `*.front-component.tsx` для автоматического обнаружения. * Поле `component` ссылается на ваш компонент React. * Компоненты автоматически собираются и синхронизируются во время `yarn twenty app:dev`. Вы можете создать новые фронт-компоненты двумя способами: * **Сгенерировано**: Запустите `yarn twenty entity:add` и выберите опцию добавления нового фронтенд-компонента. -* **Вручную**: Создайте новый файл `*.front-component.tsx` и используйте `defineFrontComponent()`. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Навыки @@ -772,18 +771,24 @@ export default defineSkill({ * **Сгенерировано**: Запустите `yarn twenty entity:add` и выберите опцию добавления нового навыка. * **Вручную**: Создайте новый файл и используйте `defineSkill()`, следуя тому же шаблону. -### Сгенерированный типизированный клиент +### Generated typed clients -Типизированный клиент автоматически генерируется с помощью `yarn twenty app:dev` и сохраняется в `node_modules/twenty-sdk/generated` на основе схемы вашего рабочего пространства. Используйте его в своих функциях: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Клиент автоматически перегенерируется с помощью `yarn twenty app:dev` при изменении ваших объектов или полей. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Учётные данные времени выполнения в логических функциях @@ -800,17 +805,17 @@ const { me } = await client.query({ me: { id: true, displayName: true } }); #### Загрузка файлов -Сгенерированный клиент `Twenty` включает метод `uploadFile` для прикрепления файлов к полям типа «файл» в объектах вашего рабочего пространства. Поскольку стандартные клиенты GraphQL изначально не поддерживают многочастовую загрузку файлов, клиент предоставляет специальный метод, который под капотом реализует [спецификацию многочастных запросов GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Поскольку стандартные клиенты GraphQL изначально не поддерживают многочастовую загрузку файлов, клиент предоставляет специальный метод, который под капотом реализует [спецификацию многочастных запросов GraphQL](https://github.com/jaydenseric/graphql-multipart-request-spec). ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Основные моменты: -* Метод отправляет файл на **metadata endpoint** (не на основной GraphQL endpoint), где обрабатывается мутация загрузки. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Он использует `universalIdentifier` поля (а не его идентификатор, специфичный для рабочего пространства), поэтому ваш код загрузки будет работать в любом рабочем пространстве, где установлено ваше приложение — в соответствии с тем, как приложения ссылаются на поля повсюду. * Возвращаемый `url` — это подписанный URL, который можно использовать для доступа к загруженному файлу. diff --git a/packages/twenty-docs/l/tr/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/tr/developers/extend/capabilities/apps.mdx index eb8cf0b9ba..f6140cd4b7 100644 --- a/packages/twenty-docs/l/tr/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/tr/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ İlerideki komutlar daha fazla dosya ve klasör ekleyecektir: -* `yarn twenty app:dev`, `node_modules/twenty-sdk/generated` içinde tipli bir API istemcisini otomatik olarak oluşturur (tipli Twenty istemcisi + çalışma alanı türleri). +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add`, özel nesneleriniz, fonksiyonlarınız, ön bileşenleriniz, rolleriniz, yetenekleriniz ve daha fazlası için `src/` altında varlık tanım dosyaları ekler. ## Kimlik Doğrulama @@ -426,10 +426,10 @@ Her fonksiyon dosyası, bir işleyici ve isteğe bağlı tetikleyiciler içeren // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ Bir mantık işlevini bir araç olarak işaretlemek için `isTool: true` olarak ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ export default defineLogicFunction({ Ön uç bileşenleri, Twenty'nin kullanıcı arayüzünde görüntülenen özel React bileşenleri oluşturmanıza olanak tanır. Yerleşik doğrulamayla bileşenleri tanımlamak için `defineFrontComponent()` kullanın: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ Önemli noktalar: * Ön uç bileşenleri, Twenty içinde yalıtılmış bağlamlarda görüntülenen React bileşenleridir. -* Otomatik algılama için `*.front-component.tsx` dosya soneğini kullanın. * `component` alanı, React bileşeninize referans verir. * Bileşenler, `yarn twenty app:dev` sırasında otomatik olarak oluşturulur ve senkronize edilir. Yeni ön uç bileşenlerini iki şekilde oluşturabilirsiniz: * **Şablondan**: `yarn twenty entity:add` çalıştırın ve yeni bir ön uç bileşeni ekleme seçeneğini seçin. -* **Manuel**: Yeni bir `*.front-component.tsx` dosyası oluşturun ve `defineFrontComponent()` kullanın. +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### Beceriler @@ -772,18 +771,24 @@ Yeni yetenekleri iki şekilde oluşturabilirsiniz: * **Şablondan**: `yarn twenty entity:add` komutunu çalıştırın ve yeni bir yetenek ekleme seçeneğini seçin. * **Manuel**: Yeni bir dosya oluşturun ve aynı deseni izleyerek `defineSkill()` kullanın. -### Oluşturulmuş türlendirilmiş istemci +### Generated typed clients -Tipli istemci, `yarn twenty app:dev` tarafından otomatik olarak oluşturulur ve çalışma alanı şemanıza göre `node_modules/twenty-sdk/generated` içine kaydedilir. Fonksiyonlarınızda kullanın: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -Nesneleriniz veya alanlarınız değiştiğinde, istemci `yarn twenty app:dev` tarafından otomatik olarak yeniden oluşturulur. +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### Mantık fonksiyonlarında çalışma zamanı kimlik bilgileri @@ -800,17 +805,17 @@ Notlar: #### Dosya yükleme -Oluşturulan `Twenty` istemcisi, çalışma alanı nesnelerinizdeki dosya türündeki alanlara dosya eklemek için bir `uploadFile` yöntemi içerir. Standart GraphQL istemcileri çok parçalı dosya yüklemelerini yerel olarak desteklemediğinden, istemci arka planda [GraphQL çok parçalı istek belirtimi](https://github.com/jaydenseric/graphql-multipart-request-spec) uygulayan bu özel yöntemi sağlar. +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. Standart GraphQL istemcileri çok parçalı dosya yüklemelerini yerel olarak desteklemediğinden, istemci arka planda [GraphQL çok parçalı istek belirtimi](https://github.com/jaydenseric/graphql-multipart-request-spec) uygulayan bu özel yöntemi sağlar. ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( Önemli noktalar: -* Yöntem dosyayı, yükleme mutasyonunun çözümlendiği **metadata endpoint**'e (ana GraphQL endpoint'ine değil) gönderir. +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * Alan için `universalIdentifier` kullanılır (çalışma alanına özgü kimliği değil), böylece yükleme kodunuz uygulamanızın yüklü olduğu herhangi bir çalışma alanında çalışır — uygulamaların başka her yerde alanlara nasıl atıfta bulunduğuyla tutarlıdır. * Döndürülen `url`, yüklenen dosyaya erişmek için kullanabileceğiniz imzalı bir URL'dir. diff --git a/packages/twenty-docs/l/zh/developers/extend/capabilities/apps.mdx b/packages/twenty-docs/l/zh/developers/extend/capabilities/apps.mdx index aee05237b6..c8cbb4cf64 100644 --- a/packages/twenty-docs/l/zh/developers/extend/capabilities/apps.mdx +++ b/packages/twenty-docs/l/zh/developers/extend/capabilities/apps.mdx @@ -165,7 +165,7 @@ export default defineObject({ 后续命令将添加更多文件和文件夹: -* `yarn twenty app:dev` 将在 `node_modules/twenty-sdk/generated` 中自动生成一个类型化的 API 客户端(类型化的 Twenty 客户端 + 工作区类型)。 +* `yarn twenty app:dev` will auto-generate two typed API clients in `node_modules/twenty-sdk/generated`: `CoreApiClient` (for workspace data via `/graphql`) and `MetadataApiClient` (for workspace configuration and file uploads via `/metadata`). * `yarn twenty entity:add` will add entity definition files under `src/` for your custom objects, functions, front components, roles, skills, and more. ## 身份验证 @@ -426,10 +426,10 @@ export default defineRole({ // src/app/createPostCard.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; import type { DatabaseEventPayload, ObjectRecordCreateEvent, CronPayload, RoutePayload } from 'twenty-sdk'; -import Twenty, { type Person } from '~/generated'; +import { CoreApiClient, type Person } from 'twenty-sdk/generated'; const handler = async (params: RoutePayload) => { - const client = new Twenty(); // generated typed client + const client = new CoreApiClient(); const name = 'name' in params.queryStringParameters ? params.queryStringParameters.name ?? process.env.DEFAULT_RECIPIENT_NAME ?? 'Hello world' : 'Hello world'; @@ -644,10 +644,10 @@ const handler = async (event: RoutePayload) => { ```typescript // src/logic-functions/enrich-company.logic-function.ts import { defineLogicFunction } from 'twenty-sdk'; -import Twenty from '~/generated'; +import { CoreApiClient } from 'twenty-sdk/generated'; const handler = async (params: { companyName: string; domain?: string }) => { - const client = new Twenty(); + const client = new CoreApiClient(); const result = await client.mutation({ createTask: { @@ -705,7 +705,7 @@ export default defineLogicFunction({ 前端组件使你可以构建在 Twenty 的 UI 中渲染的自定义 React 组件。 使用 `defineFrontComponent()` 以内置校验定义组件: ```typescript -// src/my-widget.front-component.tsx +// src/front-components/my-widget.tsx import { defineFrontComponent } from 'twenty-sdk'; const MyWidget = () => { @@ -728,14 +728,13 @@ export default defineFrontComponent({ 关键点: * 前端组件是在 Twenty 中的隔离上下文中渲染的 React 组件。 -* 使用 `*.front-component.tsx` 文件后缀以便自动检测。 * `component` 字段引用你的 React 组件。 * 组件会在 `yarn twenty app:dev` 期间自动构建并同步。 你可以通过两种方式创建新的前端组件: * **脚手架生成**:运行 `yarn twenty entity:add` 并选择添加新前端组件的选项。 -* **手动**:创建一个新的 `*.front-component.tsx` 文件,并使用 `defineFrontComponent()`。 +* **Manual**: Create a new `.tsx` file and use `defineFrontComponent()`, following the same pattern. ### 技能 @@ -772,18 +771,24 @@ You can create new skills in two ways: * **Scaffolded**: Run `yarn twenty entity:add` and choose the option to add a new skill. * **Manual**: Create a new file and use `defineSkill()`, following the same pattern. -### 生成的类型化客户端 +### Generated typed clients -类型化客户端由 `yarn twenty app:dev` 自动生成,并基于你的工作区架构存放在 `node_modules/twenty-sdk/generated`。 在你的函数中使用它: +Two typed clients are auto-generated by `yarn twenty app:dev` and stored in `node_modules/twenty-sdk/generated` based on your workspace schema: + +* **`CoreApiClient`** — queries the `/graphql` endpoint for workspace data +* **`MetadataApiClient`** — queries the `/metadata` endpoint for workspace configuration and file uploads ```typescript -import Twenty from '~/generated'; +import { CoreApiClient, MetadataApiClient } from 'twenty-sdk/generated'; -const client = new Twenty(); +const client = new CoreApiClient(); const { me } = await client.query({ me: { id: true, displayName: true } }); + +const metadataClient = new MetadataApiClient(); +const { currentWorkspace } = await metadataClient.query({ currentWorkspace: { id: true } }); ``` -每当你的对象或字段发生变化时,`yarn twenty app:dev` 都会自动重新生成该客户端。 +Both clients are re-generated automatically by `yarn twenty app:dev` whenever your objects or fields change. #### 逻辑函数中的运行时凭据 @@ -800,17 +805,17 @@ const { me } = await client.query({ me: { id: true, displayName: true } }); #### 上传文件 -生成的 `Twenty` 客户端包含一个 `uploadFile` 方法,用于将文件附加到工作区对象的文件类型字段。 由于标准 GraphQL 客户端不原生支持多部分文件上传,该客户端提供了一个专用方法,在底层实现了 [GraphQL 多部分请求规范](https://github.com/jaydenseric/graphql-multipart-request-spec)。 +The generated `MetadataApiClient` includes an `uploadFile` method for attaching files to file-type fields on your workspace objects. 由于标准 GraphQL 客户端不原生支持多部分文件上传,该客户端提供了一个专用方法,在底层实现了 [GraphQL 多部分请求规范](https://github.com/jaydenseric/graphql-multipart-request-spec)。 ```typescript -import Twenty from '~/generated'; +import { MetadataApiClient } from 'twenty-sdk/generated'; import * as fs from 'fs'; -const client = new Twenty(); +const metadataClient = new MetadataApiClient(); const fileBuffer = fs.readFileSync('./invoice.pdf'); -const uploadedFile = await client.uploadFile( +const uploadedFile = await metadataClient.uploadFile( fileBuffer, // file contents as a Buffer 'invoice.pdf', // filename 'application/pdf', // MIME type (defaults to 'application/octet-stream') @@ -841,7 +846,7 @@ uploadFile( 关键点: -* 该方法将文件发送到**元数据端点**(而不是主 GraphQL 端点),在那里处理上传变更操作。 +* The `uploadFile` method is available on `MetadataApiClient` because the upload mutation is resolved by the `/metadata` endpoint. * 它使用该字段的 `universalIdentifier`(而不是其工作区特定的 ID),因此你的上传代码可以在安装了你的应用的任何工作区中使用——这与应用在其他地方引用字段的方式保持一致。 * 返回的 `url` 是一个签名 URL,你可以用它来访问已上传的文件。