summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/lib/utils/tick_formats.js
blob: af3ca7144008fec9a8a491fadc1d660a6e1be857 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import { createDateTimeFormat } from '../../locale';

let dateTimeFormats;

export const initDateFormats = () => {
  const dayFormat = createDateTimeFormat({ month: 'short', day: 'numeric' });
  const monthFormat = createDateTimeFormat({ month: 'long' });
  const yearFormat = createDateTimeFormat({ year: 'numeric' });

  dateTimeFormats = {
    dayFormat,
    monthFormat,
    yearFormat,
  };
};

initDateFormats();

/**
  Formats a localized date in way that it can be used for d3.js axis.tickFormat().

  That is, it displays
  - 4-digit for first of January
  - full month name for first of every month
  - day and abbreviated month otherwise

  see also https://github.com/d3/d3-3.x-api-reference/blob/master/SVG-Axes.md#tickFormat
  */
export const dateTickFormat = date => {
  if (date.getDate() !== 1) {
    return dateTimeFormats.dayFormat.format(date);
  }

  if (date.getMonth() > 0) {
    return dateTimeFormats.monthFormat.format(date);
  }

  return dateTimeFormats.yearFormat.format(date);
};