Date range in "human friendly" format for Spanish and European format

human-date-range.js

const defaultLocale = "default"; // falls back to user's locale using the string "default"

const getMonthName = (date, { locale = defaultLocale, format = "long" }) => {
  let result = date.toLocaleString(locale, {
    month: format,
  });
  // Fix for ES: make first letter uppercase and remove trailing "."
  return result.slice(0, 1).toUpperCase() + result.slice(1).replace(/\.$/, "");
};

/**
 * Prints a range of dates in a human-readable format.
 *
 * Shows "13-24 Jan" if dates are in the same month, but "13 Jan - 24 Feb" if they are not.
 * Similar with year. Always shows year if it's not the current one.
 *
 * The implementation prints months _after_ days, in the latin/european date format.
 *
 * For other date formats, this helper should be adapted:
 *
 * - Implementation in the US date format: [human-date-range](https://www.npmjs.com/package/human-date-range),
 * - Implementation for Japanese date format: ??
 *
 * @param {Number} start
 * @param {Number} end
 */
export default function humanDateRange(start, end, { locale } = {}) {
  const currentYear = new Date().getFullYear();

  const startDate = new Date(start);
  const startMonthName = getMonthName(startDate, {
    locale: locale || defaultLocale,
  });
  const startYear = startDate.getFullYear();

  const endDate = new Date(end);
  const endMonthName = getMonthName(endDate, {
    locale: locale || defaultLocale,
  });
  const endYear = endDate.getFullYear();

  return (
    startDate.getDate() +
    (startMonthName !== endMonthName ? ` ${startMonthName}` : "") +
    (startYear !== endYear ? ` ${startYear}` : "") +
    ` - ${endDate.getDate()} ${endMonthName}` +
    (startYear !== endYear || endYear !== currentYear ? ` ${endYear}` : "")
  );
}

human-date-range.spec.js

const humanDateRange = require("./humanDateRange").default;

// date's month in user's locale (in node, it would normally be English I think)
const getMonthName = (date) =>
  date.toLocaleString("en", {
    month: "long",
  });

describe("humanDateRange", () => {
  it("shows simple date ranges when range is in same month and year", () => {
    let dateStart = new Date();
    dateStart.setMonth(0);
    dateStart.setDate(1);

    let dateEnd = new Date();
    dateEnd.setMonth(0);
    dateEnd.setDate(4);

    const result = humanDateRange(dateStart.getTime(), dateEnd.getTime(), {
      locale: "en",
    });
    expect(result).toBe(`1 - 4 ${getMonthName(dateStart)}`);
  });

  it("shows year when date is not in current year", () => {
    let dateStart = new Date();
    dateStart.setFullYear(2019);
    dateStart.setMonth(0);
    dateStart.setDate(1);

    let dateEnd = new Date();
    dateEnd.setFullYear(2019);
    dateEnd.setMonth(0);
    dateEnd.setDate(4);

    const result = humanDateRange(dateStart.getTime(), dateEnd.getTime(), {
      locale: "en",
    });

    expect(result).toBe(
      `1 - 4 ${getMonthName(dateStart)} ${dateStart.getFullYear()}`
    );
  });

  it("shows start month if it's different than end month", () => {
    let dateStart = new Date();
    dateStart.setMonth(0);
    dateStart.setDate(30);

    let dateEnd = new Date();
    dateEnd.setMonth(1);
    dateEnd.setDate(14);

    const result = humanDateRange(dateStart.getTime(), dateEnd.getTime(), {
      locale: "en",
    });
    expect(result).toBe(
      `30 ${getMonthName(dateStart)} - 14 ${getMonthName(dateEnd)}`
    );
  });

  it("shows start year if it's different than end year", () => {
    let dateStart = new Date();
    dateStart.setMonth(11);
    dateStart.setDate(30);

    let dateEnd = new Date();
    dateEnd.setFullYear(dateEnd.getFullYear() + 1);
    dateEnd.setMonth(1);
    dateEnd.setDate(14);

    const result = humanDateRange(dateStart.getTime(), dateEnd.getTime(), {
      locale: "en",
    });
    expect(result).toBe(
      `30 ${getMonthName(dateStart)} ${dateStart.getFullYear()}` +
        ` - 14 ${getMonthName(dateEnd)} ${dateEnd.getFullYear()}`
    );
  });
});