diff --git a/frontend/src/metabase/tutorial/QueryBuilderTutorial.jsx b/frontend/src/metabase/tutorial/QueryBuilderTutorial.jsx index 2d8ffbf46909e07650296bd2943c0369fe121851..e84bd9f8c40b03286558a46315e69c5346aa961c 100644 --- a/frontend/src/metabase/tutorial/QueryBuilderTutorial.jsx +++ b/frontend/src/metabase/tutorial/QueryBuilderTutorial.jsx @@ -1,7 +1,7 @@ /* eslint-disable react/display-name */ import React, { Component } from "react"; -import { t } from "ttag"; +import { t, jt } from "ttag"; import MetabaseSettings from "metabase/lib/settings"; import Tutorial, { qs, qsWithContent } from "./Tutorial.jsx"; @@ -111,7 +111,11 @@ const QUERY_BUILDER_STEPS = [ width={115} /> <h3>{t`Here's where you can choose to add or average your data, count the number of rows in the table, or just view the raw data.`}</h3> - <p>{t`Try it: click on <strong>Raw Data</strong> to change it to <strong>Count of rows</strong> so we can count how many orders there are in this table.`}</p> + <p>{jt`Try it: click on ${( + <strong>{t`Raw Data`}</strong> + )} to change it to ${( + <strong>{t`Count of rows`}</strong> + )} so we can count how many orders there are in this table.`}</p> </div> ), shouldAllowEvent: e => qs(".View-section-aggregation").contains(e.target), @@ -135,7 +139,9 @@ const QUERY_BUILDER_STEPS = [ width={232} /> <h3>{t`Add a grouping to break out your results by category, day, month, and more.`}</h3> - <p>{t`Let's do it: click on <strong>Add a grouping</strong>, and choose <strong>Created At: by Week</strong>.`}</p> + <p>{jt`Let's do it: click on ${( + <strong>{t`Add a grouping`}</strong> + )}, and choose ${<strong>{t`Created At: by Week`}</strong>}.`}</p> </div> ), shouldAllowEvent: e => qs(".Query-section-breakout").contains(e.target), @@ -165,7 +171,9 @@ const QUERY_BUILDER_STEPS = [ width={217} /> <h3>{t`Run Your Query.`}</h3> - <p>{t`You're doing so well! Click <strong>Run query</strong> to get your results!`}</p> + <p>{jt`You're doing so well! Click ${( + <strong>{t`Run query`}</strong> + )} to get your results!`}</p> </div> ), shouldAllowEvent: e => qs(".RunButton").contains(e.target), @@ -183,7 +191,9 @@ const QUERY_BUILDER_STEPS = [ width={160} /> <h3>{t`You can view your results as a chart instead of a table.`}</h3> - <p>{t`Everbody likes charts! Click the <strong>Visualization</strong> dropdown and select <strong>Line</strong>.`}</p> + <p>{jt`Everbody likes charts! Click the ${( + <strong>{t`Visualization`}</strong> + )} dropdown and select ${<strong>{t`Line`}</strong>}.`}</p> </div> ), shouldAllowEvent: e => qs(".VisualizationSettings a").contains(e.target),