Skip to content

Commit

Permalink
Domains: Use ISO8601 format for dates
Browse files Browse the repository at this point in the history 
Previously, we've returned localized strings from the backend for those
dates. This had several disadvantages, the biggest being: messing up the
parsing with non-en locales and missing the time part of the
registration date.
Now, we use the ISO8601 format that should prevent those issues. We rely
on i18n-calypso to provide locale-specific date format - one that's accurate
for the current locale, not just USA.
  • Loading branch information
@klimeryk
klimeryk authored Apr 28, 2017
1 parent 98c6d5c commit e57f8dc
Show file tree
Hide file tree
Showing 10 changed files with 106 additions and 86 deletions.
7 changes: 3 additions & 4 deletions client/lib/domains/assembler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,9 @@ function createDomainObjects( dataTransferObject ) {

domains = dataTransferObject.map( ( domain ) => {
return {
autoRenewalDate: domain.auto_renewal_date,
autoRenewalMoment: domain.auto_renewal_date && i18n.moment( domain.auto_renewal_date ),
currentUserCanManage: domain.current_user_can_manage,
expirationMoment: domain.expiry ? i18n.moment( domain.expiry ) : null,
expirationMoment: domain.expiry && i18n.moment( domain.expiry ),
expired: domain.expired,
expirySoon: domain.expiry_soon,
googleAppsSubscription: assembleGoogleAppsSubscription( domain.google_apps_subscription ),
Expand All @@ -37,8 +37,7 @@ function createDomainObjects( dataTransferObject ) {
privateDomain: domain.private_domain,
pendingTransfer: domain.pending_transfer,
registrar: domain.registrar,
registrationDate: domain.registration_date,
registrationMoment: domain.registration_date && i18n.moment( domain.registration_date, 'MMMM D, YYYY', 'en' ).locale( false ),
registrationMoment: domain.registration_date && i18n.moment( domain.registration_date ),
hasZone: domain.has_zone,
pointsToWpcom: domain.points_to_wpcom,
type: getDomainType( domain )
Expand Down
5 changes: 2 additions & 3 deletions client/lib/domains/test/assembler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,9 @@ describe( 'assembler', () => {
wpcom_domain: true
} ),
redirectDomainObject = {
autoRenewalDate: undefined,
autoRenewalMoment: undefined,
currentUserCanManage: undefined,
expirationMoment: null,
expirationMoment: undefined,
expired: undefined,
expirySoon: undefined,
googleAppsSubscription: undefined,
Expand All @@ -48,7 +48,6 @@ describe( 'assembler', () => {
privateDomain: undefined,
pendingTransfer: undefined,
registrar: undefined,
registrationDate: undefined,
registrationMoment: undefined,
type: domainTypes.SITE_REDIRECT,
hasZone: undefined,
Expand Down
18 changes: 11 additions & 7 deletions client/lib/wpcom-undocumented/lib/site.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,14 +83,18 @@ function UndocumentedSite( id, wpcom ) {
}

UndocumentedSite.prototype.domains = function( callback ) {
return this.wpcom.req.get( '/sites/' + this._id + '/domains', function( error, response ) {
if ( error ) {
callback( error );
return;
}
return this.wpcom.req.get(
`/sites/${ this._id }/domains`,
{ apiVersion: '1.2' },
function( error, response ) {
if ( error ) {
callback( error );
return;
}

callback( null, response );
} );
callback( null, response );
}
);
};

UndocumentedSite.prototype.postFormatsList = function( callback ) {
Expand Down
46 changes: 24 additions & 22 deletions client/my-sites/upgrades/domain-management/edit/mapped-domain.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,40 +1,41 @@
/**
* External dependencies
*/
const React = require( 'react' );
import React from 'react';
import { localize } from 'i18n-calypso';

/**
* Internal dependencies
*/
const analyticsMixin = require( 'lib/mixins/analytics' ),
Card = require( 'components/card/compact' ),
Header = require( './card/header' ),
Property = require( './card/property' ),
SubscriptionSettings = require( './card/subscription-settings' ),
VerticalNav = require( 'components/vertical-nav' ),
VerticalNavItem = require( 'components/vertical-nav/item' ),
DomainWarnings = require( 'my-sites/upgrades/components/domain-warnings' ),
paths = require( 'my-sites/upgrades/paths' );
import analyticsMixin from 'lib/mixins/analytics';
import Card from 'components/card/compact';
import Header from './card/header';
import Property from './card/property';
import SubscriptionSettings from './card/subscription-settings';
import VerticalNav from 'components/vertical-nav';
import VerticalNavItem from 'components/vertical-nav/item';
import DomainWarnings from 'my-sites/upgrades/components/domain-warnings';
import paths from 'my-sites/upgrades/paths';

const MappedDomain = React.createClass( {
mixins: [ analyticsMixin( 'domainManagement', 'edit' ) ],

getAutoRenewalOrExpirationDate() {
const domain = this.props.domain;
const { domain, translate } = this.props;

if ( domain.isAutoRenewing ) {
return (
<Property label={ this.translate( 'Mapping renews on' ) }>
{ domain.autoRenewalDate }
<Property label={ translate( 'Mapping renews on' ) }>
{ domain.autoRenewalMoment.format( 'LL' ) }
</Property>
);
}

const expirationMessage = domain.expirationMoment && domain.expirationMoment.format( 'MMMM D, YYYY' ) ||
<em>{ this.translate( 'Never Expires', { context: 'Expiration detail for a mapped domain' } ) }</em>;
const expirationMessage = domain.expirationMoment && domain.expirationMoment.format( 'LL' ) ||
<em>{ translate( 'Never Expires', { context: 'Expiration detail for a mapped domain' } ) }</em>;

return (
<Property label={ this.translate( 'Mapping expires on' ) }>
<Property label={ translate( 'Mapping expires on' ) }>
{ expirationMessage }
</Property>
);
Expand All @@ -48,7 +49,7 @@ const MappedDomain = React.createClass( {
return <DomainWarnings
domain={ this.props.domain }
selectedSite={ this.props.selectedSite }
ruleWhiteList={ [ 'wrongNSMappedDomains' ] }/>;
ruleWhiteList={ [ 'wrongNSMappedDomains' ] } />;
},

render() {
Expand All @@ -67,8 +68,8 @@ const MappedDomain = React.createClass( {
<Header { ...this.props } />

<Card>
<Property label={ this.translate( 'Type', { context: 'A type of domain.' } ) }>
{ this.translate( 'Mapped Domain' ) }
<Property label={ this.props.translate( 'Type', { context: 'A type of domain.' } ) }>
{ this.props.translate( 'Mapped Domain' ) }
</Property>

{ this.getAutoRenewalOrExpirationDate() }
Expand Down Expand Up @@ -97,7 +98,7 @@ const MappedDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'Email' ) }
{ this.props.translate( 'Email' ) }
</VerticalNavItem>
);
},
Expand All @@ -110,10 +111,11 @@ const MappedDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'DNS Records' ) }
{ this.props.translate( 'DNS Records' ) }
</VerticalNavItem>
);
}
} );

module.exports = MappedDomain;
export { MappedDomain };
export default localize( MappedDomain );
42 changes: 22 additions & 20 deletions client/my-sites/upgrades/domain-management/edit/registered-domain.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
* External dependencies
*/
import React from 'react';
import { localize } from 'i18n-calypso';

/**
* Internal dependencies
Expand All @@ -22,19 +23,19 @@ const RegisteredDomain = React.createClass( {
mixins: [ analyticsMixin( 'domainManagement', 'edit' ) ],

getAutoRenewalOrExpirationDate() {
const domain = this.props.domain;
const { domain, translate } = this.props;

if ( domain.isAutoRenewing ) {
return (
<Property label={ this.translate( 'Renews on' ) }>
{ domain.autoRenewalDate }
<Property label={ translate( 'Renews on' ) }>
{ domain.autoRenewalMoment.format( 'LL' ) }
</Property>
);
}

return (
<Property label={ this.translate( 'Expires on' ) }>
{ domain.expirationMoment.format( 'MMMM D, YYYY' ) }
<Property label={ translate( 'Expires on' ) }>
{ domain.expirationMoment.format( 'LL' ) }
</Property>
);
},
Expand All @@ -54,14 +55,15 @@ const RegisteredDomain = React.createClass( {
getPrivacyProtection() {
const { hasPrivacyProtection, privateDomain, name, pendingTransfer } = this.props.domain,
{ slug } = this.props.selectedSite,
{ translate } = this.props,
privacyPath = paths.domainManagementContactsPrivacy( slug, name ),
transferPath = paths.domainManagementTransferOut( slug, name );

if ( pendingTransfer ) {
return this.getLabel( {
status: 'is-warning',
icon: 'notice',
message: this.translate( 'Pending Transfer', {
message: translate( 'Pending Transfer', {
context: 'An icon label when domain is pending transfer.'
} )
} );
Expand All @@ -73,7 +75,7 @@ const RegisteredDomain = React.createClass( {
status: 'is-success',
icon: 'lock',
href: privacyPath,
message: this.translate( 'On', {
message: translate( 'On', {
context: 'An icon label when Privacy Protection is enabled.'
} )
} );
Expand All @@ -83,7 +85,7 @@ const RegisteredDomain = React.createClass( {
status: 'is-warning',
icon: 'notice',
href: transferPath,
message: this.translate( 'Disabled for Transfer', {
message: translate( 'Disabled for Transfer', {
context: 'An icon label when Privacy Protection is temporarily disabled for transfer.'
} )
} );
Expand All @@ -93,7 +95,7 @@ const RegisteredDomain = React.createClass( {
status: 'is-warning',
icon: 'notice',
href: privacyPath,
message: this.translate( 'None', {
message: translate( 'None', {
context: 'An icon label when Privacy Protection is not purchased by the user.'
} )
} );
Expand Down Expand Up @@ -146,7 +148,7 @@ const RegisteredDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'Email' ) }
{ this.props.translate( 'Email' ) }
</VerticalNavItem>
);
},
Expand All @@ -163,7 +165,7 @@ const RegisteredDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'Name Servers and DNS' ) }
{ this.props.translate( 'Name Servers and DNS' ) }
</VerticalNavItem>
);
},
Expand All @@ -180,7 +182,7 @@ const RegisteredDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'Contacts and Privacy' ) }
{ this.props.translate( 'Contacts and Privacy' ) }
</VerticalNavItem>
);
},
Expand All @@ -193,13 +195,13 @@ const RegisteredDomain = React.createClass( {

return (
<VerticalNavItem path={ path }>
{ this.translate( 'Transfer Domain' ) }
{ this.props.translate( 'Transfer Domain' ) }
</VerticalNavItem>
);
},

render() {
const domain = this.props.domain;
const { domain, translate } = this.props;

return (
<div>
Expand All @@ -208,17 +210,17 @@ const RegisteredDomain = React.createClass( {
<Header { ...this.props } />

<Card>
<Property label={ this.translate( 'Type', { context: 'A type of domain.' } ) }>
{ this.translate( 'Registered Domain' ) }
<Property label={ translate( 'Type', { context: 'A type of domain.' } ) }>
{ translate( 'Registered Domain' ) }
</Property>

<Property label={ this.translate( 'Registered on' ) }>
{ domain.registrationDate }
<Property label={ translate( 'Registered on' ) }>
{ domain.registrationMoment.format( 'LL' ) }
</Property>

{ this.getAutoRenewalOrExpirationDate() }

<Property label={ this.translate( 'Privacy Protection' ) }>
<Property label={ translate( 'Privacy Protection' ) }>
{ this.getPrivacyProtection() }
</Property>

Expand All @@ -235,4 +237,4 @@ const RegisteredDomain = React.createClass( {
}
} );

export default RegisteredDomain;
export default localize( RegisteredDomain );
37 changes: 19 additions & 18 deletions client/my-sites/upgrades/domain-management/edit/site-redirect.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,37 +1,38 @@
/**
* External dependencies
*/
const React = require( 'react' );
import React from 'react';
import { localize } from 'i18n-calypso';

/**
* Internal dependencies
*/
const analyticsMixin = require( 'lib/mixins/analytics' ),
Card = require( 'components/card/compact' ),
Header = require( './card/header' ),
Property = require( './card/property' ),
SubscriptionSettings = require( './card/subscription-settings' ),
VerticalNav = require( 'components/vertical-nav' ),
VerticalNavItem = require( 'components/vertical-nav/item' ),
paths = require( 'my-sites/upgrades/paths' );
import analyticsMixin from 'lib/mixins/analytics';
import Card from 'components/card/compact';
import Header from './card/header';
import Property from './card/property';
import SubscriptionSettings from './card/subscription-settings';
import VerticalNav from 'components/vertical-nav';
import VerticalNavItem from 'components/vertical-nav/item';
import paths from 'my-sites/upgrades/paths';

const SiteRedirect = React.createClass( {
mixins: [ analyticsMixin( 'domainManagement', 'edit' ) ],

getAutoRenewalOrExpirationDate() {
const domain = this.props.domain;
const { domain, translate } = this.props;

if ( domain.isAutoRenewing ) {
return (
<Property label={ this.translate( 'Redirect renews on' ) }>
{ domain.autoRenewalDate }
<Property label={ translate( 'Redirect renews on' ) }>
{ domain.autoRenewalMoment.format( 'LL' ) }
</Property>
);
}

return (
<Property label={ this.translate( 'Redirect expires on' ) }>
{ domain.expirationMoment.format( 'MMMM D, YYYY' ) }
<Property label={ translate( 'Redirect expires on' ) }>
{ domain.expirationMoment.format( 'LL' ) }
</Property>
);
},
Expand All @@ -47,8 +48,8 @@ const SiteRedirect = React.createClass( {
<Header { ...this.props } />

<Card>
<Property label={ this.translate( 'Type', { context: 'A type of domain.' } ) }>
{ this.translate( 'Site Redirect' ) }
<Property label={ this.props.translate( 'Type', { context: 'A type of domain.' } ) }>
{ this.props.translate( 'Site Redirect' ) }
</Property>

{ this.getAutoRenewalOrExpirationDate() }
Expand All @@ -68,10 +69,10 @@ const SiteRedirect = React.createClass( {
siteRedirectNavItem() {
return (
<VerticalNavItem path={ paths.domainManagementRedirectSettings( this.props.selectedSite.slug, this.props.domain.name ) }>
{ this.translate( 'Redirect Settings' ) }
{ this.props.translate( 'Redirect Settings' ) }
</VerticalNavItem>
);
}
} );

module.exports = SiteRedirect;
export default localize( SiteRedirect );
Loading

0 comments on commit e57f8dc

Please sign in to comment.