diff --git a/frontend/src/metabase/lib/formatting.js b/frontend/src/metabase/lib/formatting.js index 7720718d7867d62c5e9b41f24c1223202939c556..a43e869d3c06ef8e7dba95c7b459dd1d1596b6c0 100644 --- a/frontend/src/metabase/lib/formatting.js +++ b/frontend/src/metabase/lib/formatting.js @@ -51,6 +51,9 @@ const BINNING_DEGREES_FORMATTER = (value, binWidth) => { return d3.format(`.0${decimalCount(binWidth)}f`)(value); }; +const monthFormat = options => (options.compact ? "MMM" : "MMMM"); +const dayFormat = options => (options.compact ? "ddd" : "dddd"); + // use en dashes, for Maz const RANGE_SEPARATOR = ` – `; @@ -156,8 +159,9 @@ export function formatTimeRangeWithUnit( } // Tooltips should show full month name, but condense "MMMM D, YYYY - MMMM D, YYYY" to "MMMM D - D, YYYY" etc - const monthFormat = options.type === "tooltip" ? "MMMM" : "MMM"; - const condensed = options.type === "tooltip"; + const monthFormat = + options.type === "tooltip" ? "MMMM" : monthFormat(options); + const condensed = options.compact || options.type === "tooltip"; const start = m.clone().startOf(unit); const end = m.clone().endOf(unit); @@ -206,11 +210,11 @@ export function formatTimeWithUnit( case "hour": // 12 AM - January 1, 2015 return formatMajorMinor( m.format("h A"), - m.format("MMMM D, YYYY"), + m.format(`${monthFormat(options)} D, YYYY`), options, ); case "day": // January 1, 2015 - return m.format("MMMM D, YYYY"); + return m.format(`${monthFormat(options)} D, YYYY`); case "week": // 1st - 2015 if (options.type === "tooltip") { // tooltip show range like "January 1 - 7, 2017" @@ -230,11 +234,11 @@ export function formatTimeWithUnit( case "month": // January 2015 return options.jsx ? ( <div> - <span className="text-bold">{m.format("MMMM")}</span>{" "} + <span className="text-bold">{m.format(monthFormat(options))}</span>{" "} {m.format("YYYY")} </div> ) : ( - m.format("MMMM") + " " + m.format("YYYY") + m.format(`${monthFormat(options)} YYYY`) ); case "year": // 2015 return m.format("YYYY"); @@ -252,7 +256,7 @@ export function formatTimeWithUnit( moment() // $FlowFixMe: .day(value - 1) - .format("dddd") + .format(dayFormat(options)) ); case "day-of-month": return moment() @@ -267,7 +271,7 @@ export function formatTimeWithUnit( moment() // $FlowFixMe: .month(value - 1) - .format("MMMM") + .format(monthFormat(options)) ); case "quarter-of-year": // January return moment()