Skip to main content
Version: 5.x.x

Plugin

TolgeePlugin interface​

Plugin is a function which receives Tolgee instance and additional tools object, where you have access to additional methods for adding different middlewares, it also needs to return tolgee instance at the end.

function (tolgee: TolgeeInstance, tools: PluginTools): TolgeeInstance

PluginTools​

Tools to manipulate different middleware interfaces.

Formatter​

Methods​

tools.setFinalFormatter(formatter: FormatterMiddleware): void;
tools.addFormatter(formatter: FormatterMiddleware): void;

Inteface​

interface FormatterMiddleware {
  format(props: {
    translation: string;
    language: string;
    params: Record<string, any>;
  }): string;
}

Formats translation, allows you to add custom formatter. There can be multiple formatters, they will be applied in order in which they were added. FinalFormatter is applied last and can return different value than string.

Observer​

Methods​

tools.setObserver(observer: ObserverMiddleware): void;
tools.hasObserver(): boolean;

Interface​

type ObserverMiddleware = (props: ObserverProps) => {
  unwrap: (text: string) => Unwrapped;
  wrap: WrapperWrapFunction;
  retranslate: () => void;
  stop: () => void;
  run: (props: ObserverRunProps) => void;
  highlight: HighlightInterface;
  outputNotFormattable: boolean;
};

Middleware which enables in-context translating. Check Observer options.

UI​

Methods​

tools.setUi(ui: UiMiddleware): void;
tools.hasUi(): boolean;

Tolgee UI enables in-context translating.

Backend​

Methods​

tools.addBackend(backend: BackendMiddleware): void;
tools.setDevBackend(backend: BackendMiddleware): void;

Interface​

interface BackendMiddleware {
  getRecord(props: {
    language: string;
    namespace?: string;
  }): Promise<TreeTranslationsData | undefined>;
}

Backend middleware is used when Tolgee needs to fetch record (identified by language and namespace). Backend can be skipped if getRecord returns undefined, in that case next backend is used.

DevBackend is used when in dev mode and only difference in interface is that getRecord will also recieve apiUrl, apiKey and projectId. It's used to connect to Tolgee platform.

Language detector​

tools.setLanguageDetector(
  languageDetector: LanguageDetectorMiddleware
): void

Interface​

interface LanguageDetectorMiddleware {
  getLanguage: (props: {
    availableLanguages: string[];
  }): string | Promise<string>;
}

Language detector, use for detection from user locale/cookies, etc.

Language storage​

tools.setLanguageStorage(
  languageStorage: LanguageStorageMiddleware
): void

Interface​

interface LanguageStorageMiddleware {
  getLanguage(): strin | Promise<string>;
  setLanguage(language: string): void | Promise<void>;
}

Language storage, use for storing language in LocalStorage or on custom server.

Override credentials​

tools.overrideCredentials(credentials: {
  apiUrl?: string;
  apiKey?: string;
  projectId?: string | number;
}): void;

Method which overrides user credentials to tolgee platform.