Přejít na hlavní obsah
Složka public/ v kořenu vaší aplikace obsahuje statické soubory — obrázky, ikony, písma a další prostředky, které vaše aplikace potřebuje za běhu. Tyto soubory jsou automaticky zahrnuty do buildů, synchronizovány během vývojového režimu a nahrávány na server. Soubory umístěné v public/ jsou:
  • Veřejně přístupné — po synchronizaci na server jsou prostředky dostupné na veřejné URL. K přístupu k nim není potřeba žádná autentizace.
  • Dostupné ve frontendových komponentách — použijte URL prostředků k zobrazení obrázků, ikon či jiných médií uvnitř komponent Reactu.
  • Dostupné v logických funkcích — odkazujte na URL prostředků v e-mailech, odpovědích API či jiné serverové logice.
  • Používány pro metadata Marketplace — pole logoUrl a screenshots v defineApplication() odkazují na soubory z této složky (např. public/logo.png). Zobrazují se v Marketplace, když je vaše aplikace zveřejněna.
  • Automaticky synchronizované ve vývojovém režimu — když v public/ přidáte, aktualizujete nebo smažete soubor, je automaticky synchronizován na server. Není potřeba restartovat.
  • Zahrnuté do buildů — yarn twenty dev:build zabalí všechny veřejné prostředky do distribučního výstupu.

​
Přístup k veřejným prostředkům pomocí getPublicAssetUrl

K získání plné URL souboru ve vaší složce public/ použijte pomocnou funkci getPublicAssetUrl z twenty-sdk. Funguje jak v logických funkcích, tak ve frontendových komponentách. V logické funkci:
src/logic-functions/send-invoice.ts
import { defineLogicFunction } from 'twenty-sdk/define';
import { getPublicAssetUrl } from 'twenty-sdk/utils';

const handler = async (): Promise<any> => {
  const logoUrl = getPublicAssetUrl('logo.png');
  const invoiceUrl = getPublicAssetUrl('templates/invoice.png');

  // Fetch the file content (no auth required — public endpoint)
  const response = await fetch(invoiceUrl);
  const buffer = await response.arrayBuffer();

  return { logoUrl, size: buffer.byteLength };
};

export default defineLogicFunction({
  universalIdentifier: 'a1b2c3d4-...',
  name: 'send-invoice',
  description: 'Sends an invoice with the app logo',
  timeoutSeconds: 10,
  handler,
});
Ve frontendové komponentě:
src/front-components/company-card.tsx
import { defineFrontComponent } from 'twenty-sdk/define';
import { getPublicAssetUrl } from 'twenty-sdk/utils';

const CompanyCard = () => {
  const logoUrl = getPublicAssetUrl('logo.png');

  return <img src={logoUrl} alt="App logo" />;
};

export default defineFrontComponent({
  universalIdentifier: '...',
  name: 'company-card',
  component: CompanyCard,
});
Argument path je relativní ke složce public/ vaší aplikace. Jak getPublicAssetUrl('logo.png'), tak getPublicAssetUrl('public/logo.png') se vyhodnotí na stejnou URL — předpona public/ je, je-li přítomna, automaticky odstraněna.