ColumnTime.js (1601B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 "use strict"; 6 7 const { 8 Component, 9 } = require("resource://devtools/client/shared/vendor/react.mjs"); 10 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js"); 11 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs"); 12 13 /** 14 * Renders the "Time" column of a message. 15 */ 16 class ColumnTime extends Component { 17 static get propTypes() { 18 return { 19 item: PropTypes.object.isRequired, 20 }; 21 } 22 23 shouldComponentUpdate(nextProps) { 24 return ( 25 this.props.item.type !== nextProps.item.type || 26 this.props.item.timeStamp !== nextProps.item.timeStamp 27 ); 28 } 29 30 /** 31 * Format a DOMHighResTimeStamp (in microseconds) as HH:mm:ss.SSS 32 * 33 * @param {number} highResTimeStamp 34 */ 35 formatTime(highResTimeStamp) { 36 const date = new Date(highResTimeStamp / 1000); 37 const hh = date.getHours().toString().padStart(2, "0"); 38 const mm = date.getMinutes().toString().padStart(2, "0"); 39 const ss = date.getSeconds().toString().padStart(2, "0"); 40 const mmm = date.getMilliseconds().toString().padStart(3, "0"); 41 return `${hh}:${mm}:${ss}.${mmm}`; 42 } 43 44 render() { 45 const label = this.formatTime(this.props.item.timeStamp); 46 47 return dom.td( 48 { 49 className: "message-list-column message-list-time", 50 title: label, 51 }, 52 label 53 ); 54 } 55 } 56 57 module.exports = ColumnTime;