Exports

These are available export from @traveloka/core package

Hooks

• useAPI(options)
• useContentResource(query)
• useCurentRoute()
• useCurrencies()
• useCurrency()
• useFeatureControl(featureKey)
• useICUFormatter()
• useImageSlider(query)
• useLocale()
• useLocales()
• useLocalizedRouter()
• usePageViewTracker()
• useResource(query)
• useRouter()
• useSSE(options)
• useTracker()
• useTrackPageView(pageViewId)
• usePerformanceTracer()
• usePrefetchJs()
• useUser()

Components & HoC

• <LocalizedLink />
• progressive(loader)
• withTravelokaApp(config)
• withTravelokaDocument()

Helpers

• callAPI(ctx, options)
• closeAllSSEConnections()
• staticProps(config)
• getPublicRuntimeConfig
• getServerRuntimeConfig
• logger
• monitorEventCount()
• monitorTime()
• parseURL(url)

---

Reference

This section here is for API that's not included in any guides yet

withTravelokaApp(config)

This is used to augment your _app.tsx. Most of the time you can simply call the function as an export, but you can set global A/B Test namespaces here as well.

Under the hood, withTravelokaApp renders your page component with correct (default) provider.

// pages/_app.tsx
import { withTravelokaApp, ExternalTrackingManager } from '@traveloka/core';

const config = {
  abTestNamespaces: [],
};

export default withTravelokaApp(config);

withTravelokaDocument()

This is used to augment your _document.tsx file. It automatically extract critical CSS on server-render using react-native-web.

// pages/_document.tsx
import { withTravelokaDocument } from '@traveloka/core';

export default withTravelokaDocuemnt();

logger

Singleton to print something to console. By default it uses pretty printer in server in development, while using JSON logger in the server. In client, it just log to browser console as usual.

It provide 6 methods to print with different log leve: trace, debug, info, warning, error, and fatal. Those methods accept string message as first argument and context object containing anything you want to put for additional information.

import { logger } from '@traveloka/core';

const ctx = { a: 'b' };
logger.trace('message', ctx);
logger.info('message', ctx);

monitorEventCount(eventName, tags, sample_rate)

Send monitoring data to DataDog. This only works on server-side, and replaced with noop function in browser. Tags are key value pair. If you pass string to tags, it will get converted to name: tags. Sample rate is optional and defaults to 1.

import { monitorTime } from '@traveloka/core';

monitorEventCount('name', { key: 'value' });

monitorTime(metricName, tags)

This return a function that you can use to measure time spent between 2 execution. When that function is called, it will send measurement metrics to DataDog

import { monitorTime } from '@traveloka/core';

const end = monitorTime('name', { key: 'value' });
// do something
end();