fix(Breacrumbs): change goBackTitle to accept React.Node

BREAKING CHANGE: translation removed, use goBackTitle prop with Translate
kiwicom · Apr 17, 2023 · b1614e6 · b1614e6
1 parent 5dc5d89
commit b1614e6
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 15 deletions.
diff --git a/packages/orbit-components/src/Breadcrumbs/README.md b/packages/orbit-components/src/Breadcrumbs/README.md
@@ -25,7 +25,7 @@ Table below contains all types of the props available in Breadcrumbs component.
 | **children** | `React.Node`               |          | The content of the Breadcrumbs, normally [`BreadcrumbsItem`](#breadcrumbsitem).                                                                                   |
 | onGoBack     | `event => void \| Promise` |          | Callback for handling back button action. If present the back button is visible.                                                                                  |
 | backHref     | `string`                   |          | The location for the back button to direct to. Turns the back button into a link when present (renders as an `a` element).                                        |
-| goBackTitle  | `Translation`              | `"Back"` | Property for passing translation string when you want to use the `onGoBack` callback.                                                                             |
+| goBackTitle  | `React.Node`               | `"Back"` | Property for passing translation string when you want to use the `onGoBack` callback.                                                                             |
 | spaceAfter   | `enum`                     |          | Additional `margin-bottom` after component. [See spacing docs](https://github.com/kiwicom/orbit/tree/master/packages/orbit-components/src/common/getSpacingToken) |
 
 ## Functional specs

diff --git a/packages/orbit-components/src/Breadcrumbs/index.js.flow b/packages/orbit-components/src/Breadcrumbs/index.js.flow
@@ -4,7 +4,7 @@
 */
 import * as React from "react";
 
-import type { Globals, Translation } from "../common/common.js.flow";
+import type { Globals } from "../common/common.js.flow";
 import typeof BreadcrumbsItemType from "./BreadcrumbsItem/index.js.flow";
 import type { spaceAfter } from "../common/getSpacingToken/index.js.flow";
 
@@ -13,7 +13,7 @@ export type Props = {|
   +children: React.Node,
   +onGoBack?: (ev: SyntheticEvent<HTMLElement>) => void | Promise<any>,
   +backHref?: string,
-  +goBackTitle?: Translation,
+  +goBackTitle?: React.Node,
   ...spaceAfter,
 |};
 

diff --git a/packages/orbit-components/src/Breadcrumbs/index.tsx b/packages/orbit-components/src/Breadcrumbs/index.tsx
@@ -5,7 +5,6 @@ import type * as Common from "../common/types";
 import defaultTheme from "../defaultTheme";
 import ChevronBackward from "../icons/ChevronBackward";
 import getSpacingToken from "../common/getSpacingToken";
-import useTranslate from "../hooks/useTranslate";
 import { right } from "../utils/rtl";
 import TextLink from "../TextLink";
 import Hide from "../Hide";
@@ -43,20 +42,11 @@ StyledBackButtonWrapper.defaultProps = {
 };
 
 const Breadcrumbs = (props: Props) => {
-  const translate = useTranslate();
   const childEls = React.Children.toArray(
     props.children,
   ) as React.ReactElement<BreadcrumbsItemProps>[];
 
-  const {
-    children,
-    dataTest,
-    onGoBack,
-    goBackTitle = translate("breadcrumbs_back"),
-    spaceAfter,
-    backHref,
-    id,
-  } = props;
+  const { children, dataTest, onGoBack, goBackTitle = "Back", spaceAfter, backHref, id } = props;
   return (
     <>
       <Hide on={["smallMobile", "mediumMobile"]}>

diff --git a/packages/orbit-components/src/Breadcrumbs/types.d.ts b/packages/orbit-components/src/Breadcrumbs/types.d.ts
@@ -7,7 +7,7 @@ import type * as Common from "../common/types";
 
 export interface Props extends Common.Globals, Common.SpaceAfter {
   readonly children: React.ReactNode;
-  readonly goBackTitle?: Common.Translation;
+  readonly goBackTitle?: React.ReactNode;
   readonly onGoBack?: Common.Event<React.SyntheticEvent<HTMLAnchorElement>>;
   readonly backHref?: string;
 }