feat(text): Add txOptions prop to Text to pass options through to tra…

…nslate (#191 by @ryanlntn)

boilerplate/app/components/text/text.props.ts

@@ -12,6 +12,12 @@ export interface TextProps extends TextProperties {
    */
   tx?: string
 
+  /**
+   * Optional options to pass to i18n. Useful for interpolation
+   * as well as explicitly setting locale or translation fallbacks.
+   */
+  txOptions?: object
+
   /**
    * The text to display if not using `tx` or nested components.
    */

boilerplate/app/components/text/text.tsx

@@ -12,10 +12,10 @@ import { mergeAll, flatten } from "ramda"
  */
 export function Text(props: TextProps) {
   // grab the props
-  const { preset = "default", tx, text, children, style: styleOverride, ...rest } = props
+  const { preset = "default", tx, txOptions, text, children, style: styleOverride, ...rest } = props
 
   // figure out which content to use
-  const i18nText = tx && translate(tx)
+  const i18nText = tx && translate(tx, txOptions)
   const content = i18nText || text || children
 
   const style = mergeAll(flatten([presets[preset] || presets.default, styleOverride]))

boilerplate/app/i18n/translate.ts

@@ -5,16 +5,6 @@ import i18n from "i18n-js"
  *
  * @param key The i18n key.
  */
-export function translate(key: string) {
-  return key ? i18n.t(key) : null
-}
-
-/**
- * Translates with variables.
- *
- * @param key The i18n key
- * @param vars Additional values sure to replace.
- */
-export function translateWithVars(key: string, vars: object) {
-  return key ? i18n.t(key, vars) : null
-}
+export function translate(key: string, options?: object) {
+  return key ? i18n.t(key, options) : null
+}