From 17a21e00dbd9799bac65bd28eb6e1395d94b45d9 Mon Sep 17 00:00:00 2001 From: Paul Sealock Date: Wed, 2 Jan 2019 12:25:52 +1300 Subject: [PATCH] DateRange: use DayOfWeek from moment locale{ --- .../woocommerce-admin/lib/client-assets.php | 3 --- .../components/src/calendar/date-range.js | 1 - .../packages/components/src/chart/index.js | 10 ++++---- .../packages/components/src/chart/style.scss | 2 +- .../packages/date/src/index.js | 24 +++++-------------- .../packages/date/test/index.js | 13 ++++------ 6 files changed, 17 insertions(+), 36 deletions(-) diff --git a/plugins/woocommerce-admin/lib/client-assets.php b/plugins/woocommerce-admin/lib/client-assets.php index 8e876376ceb..c49f2209d5f 100644 --- a/plugins/woocommerce-admin/lib/client-assets.php +++ b/plugins/woocommerce-admin/lib/client-assets.php @@ -180,9 +180,6 @@ function wc_admin_print_script_settings() { 'embedBreadcrumbs' => wc_admin_get_embed_breadcrumbs(), 'siteLocale' => esc_attr( get_bloginfo( 'language' ) ), 'currency' => wc_admin_currency_settings(), - 'date' => array( - 'dow' => get_option( 'start_of_week', 0 ), - ), 'orderStatuses' => format_order_statuses( wc_get_order_statuses() ), 'stockStatuses' => wc_get_product_stock_status_options(), 'siteTitle' => get_bloginfo( 'name' ), diff --git a/plugins/woocommerce-admin/packages/components/src/calendar/date-range.js b/plugins/woocommerce-admin/packages/components/src/calendar/date-range.js index bb2a05f8d63..271a1c9039f 100644 --- a/plugins/woocommerce-admin/packages/components/src/calendar/date-range.js +++ b/plugins/woocommerce-admin/packages/components/src/calendar/date-range.js @@ -152,7 +152,6 @@ class DateRange extends Component { noBorder initialVisibleMonth={ this.setTnitialVisibleMonth( isDoubleCalendar, before ) } phrases={ phrases } - firstDayOfWeek={ Number( wcSettings.date.dow ) } /> diff --git a/plugins/woocommerce-admin/packages/components/src/chart/index.js b/plugins/woocommerce-admin/packages/components/src/chart/index.js index 9b1e2dc97ff..d26e0b6bc02 100644 --- a/plugins/woocommerce-admin/packages/components/src/chart/index.js +++ b/plugins/woocommerce-admin/packages/components/src/chart/index.js @@ -232,7 +232,7 @@ class Chart extends Component { } = this.props; let { yFormat } = this.props; const legendDirection = mode === 'time-comparison' && isViewportWide ? 'row' : 'column'; - const chartDirection = ( mode === 'item-comparison' ) && isViewportWide ? 'row' : 'column'; + const chartDirection = mode === 'item-comparison' && isViewportWide ? 'row' : 'column'; const chartHeight = this.getChartHeight(); const legend = ( @@ -267,7 +267,7 @@ class Chart extends Component { } return (
- { mode !== 'block' && + { mode !== 'block' && (
{ title } { isViewportWide && legendDirection === 'row' && legend } @@ -301,7 +301,7 @@ class Chart extends Component { />
- } + ) }
) }
- { ( ! isViewportWide || mode === 'block' ) &&
{ legend }
} + { ( ! isViewportWide || mode === 'block' ) && ( +
{ legend }
+ ) }
); diff --git a/plugins/woocommerce-admin/packages/components/src/chart/style.scss b/plugins/woocommerce-admin/packages/components/src/chart/style.scss index d4529ace24b..1bc09df1034 100644 --- a/plugins/woocommerce-admin/packages/components/src/chart/style.scss +++ b/plugins/woocommerce-admin/packages/components/src/chart/style.scss @@ -57,7 +57,7 @@ padding: 0; width: 100%; display: flex; - align-items: center; + align-items: center; justify-content: center; .components-spinner { margin: 0; diff --git a/plugins/woocommerce-admin/packages/date/src/index.js b/plugins/woocommerce-admin/packages/date/src/index.js index 57858c8d8aa..c4501bd9b8f 100644 --- a/plugins/woocommerce-admin/packages/date/src/index.js +++ b/plugins/woocommerce-admin/packages/date/src/index.js @@ -490,15 +490,14 @@ export function getDateFormatsForInterval( interval, ticks = 0 ) { } /** - * Gutenberg's moment instance is loaded with i18n values. If the locale isn't english - * we can use that data and enhance it with additional translations + * Gutenberg's moment instance is loaded with i18n values, which are + * PHP date formats, ie 'LLL: "F j, Y g:i a"'. Override those with translations + * of moment style js formats. */ export function loadLocaleData() { - const { date, l10n } = wcSettings; - const { userLocale, weekdaysShort } = l10n; - - // Keep the default Momentjs English settings for any English - if ( ! userLocale.match( /en_/ ) ) { + const { userLocale, weekdaysShort } = wcSettings.l10n; + // Don't update if the wp locale hasn't been set yet, like in unit tests, for instance. + if ( 'en' !== moment.locale() ) { moment.updateLocale( userLocale, { longDateFormat: { L: __( 'MM/DD/YYYY', 'wc-admin' ), @@ -507,17 +506,6 @@ export function loadLocaleData() { LLLL: __( 'dddd, D MMMM YYYY LT', 'wc-admin' ), LT: __( 'HH:mm', 'wc-admin' ), }, - calendar: { - lastDay: __( '[Yesterday at] LT', 'wc-admin' ), - lastWeek: __( '[Last] dddd [at] LT', 'wc-admin' ), - nextDay: __( '[Tomorrow at] LT', 'wc-admin' ), - nextWeek: __( 'dddd [at] LT', 'wc-admin' ), - sameDay: __( '[Today at] LT', 'wc-admin' ), - sameElse: __( 'L', 'wc-admin' ), - }, - week: { - dow: Number( date.dow ), - }, weekdaysMin: weekdaysShort, } ); } diff --git a/plugins/woocommerce-admin/packages/date/test/index.js b/plugins/woocommerce-admin/packages/date/test/index.js index 5460be4b3c5..80ae76ae364 100644 --- a/plugins/woocommerce-admin/packages/date/test/index.js +++ b/plugins/woocommerce-admin/packages/date/test/index.js @@ -455,28 +455,23 @@ describe( 'getRangeLabel', () => { describe( 'loadLocaleData', () => { beforeEach( () => { // Reset to default settings - wcSettings.date.dow = 0; wcSettings.l10n = { userLocale: 'en_US', weekdaysShort: [ 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat' ], }; } ); - it( 'should leave default momentjs data unchanged for english languages', () => { - loadLocaleData(); - expect( moment.locale() ).toBe( 'en' ); - } ); - - it( "should load locale data on user locale other than 'en-*'", () => { - wcSettings.date.dow = 5; + it( 'should load locale data on user locale', () => { wcSettings.l10n = { userLocale: 'fr_FR', weekdaysShort: [ 'dim', 'lun', 'mar', 'mer', 'jeu', 'ven', 'sam' ], }; + // initialize locale. Gutenberg normaly does this, but not in test environment. + moment.locale( 'fr_FR', {} ); + loadLocaleData(); expect( moment.localeData().weekdaysMin() ).toEqual( wcSettings.l10n.weekdaysShort ); - expect( moment.localeData().firstDayOfWeek() ).toBe( wcSettings.date.dow ); } ); } );