PR#448: Halp: don't repeat the dates in the request list - fedora-hubs

fedora-hubs

#448 Halp: don't repeat the dates in the request list

Merged 6 years ago by abompard. Opened 6 years ago by abompard.

abompard/fedora-hubs fix/halp-date into develop

Halp: don't repeat the dates in the request list

Aurélien Bompard • 6 years ago

b261e0a

hubs/static/client/app/widgets/halp/RequestList.js

file added

+53

		`@@ -0,0 +1,53 @@`
		`+ import React from 'react';`
		`+ import PropTypes from 'prop-types';`
		`+ import {`
		`+ defineMessages,`
		`+ FormattedMessage,`
		`+ injectIntl,`
		`+ } from 'react-intl';`
		`+ import Request from './Request';`
		`+`
		`+`
		`+ const messages = defineMessages({`
		`+ no_request: {`
		`+ id: "hubs.widgets.halp.no_request",`
		`+ defaultMessage: "No request for now."`
		`+ },`
		`+ });`
		`+`
		`+`
		`+ class RequestList extends React.Component {`
		`+ render() {`
		`+ let content;`
		`+ if (this.props.requests.length === 0) {`
		`+ content = (`
		`+ <p className="no-request">`
		`+ <FormattedMessage {...messages.no_request} />`
		`+ </p>`
		`+ );`
		`+ } else {`
		`+ let previousDate = null;`
		`+ content = this.props.requests.map((request, idx) => {`
		`+ const showDate = previousDate === null ? true : (`
		`+ this.props.intl.formatRelative(request.date * 1000) !==`
		`+ this.props.intl.formatRelative(previousDate * 1000)`
		`+ );`
		`+ previousDate = request.date;`
		`+ return (`
		`+ <Request`
		`+ request={request}`
		`+ showdate={showDate}`
		`+ onZoomRequest={this.props.onZoomRequest}`
		`+ key={idx} />`
		`+ );`
		`+ });`
		`+ }`
		`+ return (`
		`+ <div className="RequestList">`
		`+ {content}`
		`+ </div>`
		`+ );`
		`+ }`
		`+ }`
		`+`
		`+ export default injectIntl(RequestList);`

hubs/static/client/app/widgets/halp/Widget.js

file modified

+5 -29

		`@@ -11,17 +11,13 @@`
		`import HubsList from './HubsList';`
		`import ModalRequest from './ModalRequest';`
		`import ModalAllRequests from './ModalAllRequests';`
		`- import Request from './Request';`
		`+ import RequestList from './RequestList';`
		`import WidgetChrome from '../../components/WidgetChrome';`
		`import Spinner from "../../components/Spinner";`
		`import "./halp.css";`


		`const messages = defineMessages({`
		`- no_request: {`
		`- id: "hubs.widgets.halp.no_request",`
		`- defaultMessage: "No request for now."`
		`- },`
		`view_more: {`
		`id: "hubs.widgets.halp.view_more",`
		`defaultMessage: "View more"`
		`@@ -132,27 +128,6 @@`
		`}`

		`render() {`
		`- let requestNodes;`
		`- if (this.state.requests.length === 0) {`
		`- requestNodes = (`
		`- <p className="no-request">`
		`- <FormattedMessage {...messages.no_request} />`
		`- </p>`
		`- );`
		`- } else {`
		`- let previousDate = null;`
		`- requestNodes = this.state.requests.map(function(request, idx) {`
		`- const showDate = (request.date !== previousDate);`
		`- previousDate = request.date;`
		`- return (`
		`- <Request`
		`- request={request}`
		`- showdate={showDate}`
		`- onZoomRequest={this.zoomOnRequest}`
		`- key={idx} />`
		`- );`
		`- }.bind(this));`
		`- }`
		`let hubs = this.props.widget.config.hubs \|\| [];`
		`hubs = hubs.map(function(hub) {`
		`return {`
		`@@ -173,9 +148,10 @@`
		`{ this.state.isLoading ?`
		`<Spinner />`
		`:`
		`- <div className="requests">`
		`- {requestNodes}`
		`- </div>`
		`+ <RequestList`
		`+ requests={this.state.requests}`
		`+ onZoomRequest={this.zoomOnRequest}`
		`+ />`
		`}`
		`<div className="view-more text-muted">`
		`<button className="btn btn-secondary" onClick={this.openAllRequests}>`

hubs/static/client/app/widgets/halp/__tests__/RequestList.test.js

file added

+55

		`@@ -0,0 +1,55 @@`
		`+ /* eslint-env jasmine, jest */`
		`+`
		`+`
		`+ import React from 'react';`
		`+ import ReactDOM from 'react-dom';`
		`+ import { IntlProvider } from 'react-intl';`
		`+ import { mount } from 'enzyme';`
		`+`
		`+ import RequestList from '../RequestList';`
		`+`
		`+`
		`+ describe('RequestList', () => {`
		`+ const requests = [`
		`+ {"author": {`
		`+ "avatar": "https://seccdn.libravatar.org/avatar/2b820632db285cd534651e5f0da285d7c0a0a1bf600da16e19063163ce21db31?s=32&d=retro",`
		`+ "name":"mizmo",`
		`+ "url":"/mizmo/"`
		`+ },`
		`+ "channel": "#fedora-hubs",`
		`+ "context_url": "https://meetbot.fedoraproject.org/fedora-hubs/2017-11-07/hubs-devel.2017-11-07-14.01.log.html#l-44",`
		`+ "date": 1510063822.0,`
		`+ "hub": "abompard",`
		`+ "hubs": ["abompard"],`
		`+ "meeting_topic": "hubs-devel",`
		`+ "text": "We need people to work on hubs, see https://pagure.io/fedora-hubs/issue/390",`
		`+ "urls": ["https://pagure.io/fedora-hubs/issue/390"]`
		`+ }, {`
		`+ "author": {`
		`+ "avatar": "https://seccdn.libravatar.org/avatar/f0c54afccefcf4bc888e0d37618a8598602a668e4ffc2e433b551ca19fc164d8?s=32&d=retro",`
		`+ "name": "abompard",`
		`+ "url": "/abompard/"`
		`+ },`
		`+ "channel": "#fedora-hubs",`
		`+ "context_url": "https://meetbot.fedoraproject.org/fedora-hubs/2017-11-07/hubs-devel.2017-11-07-14.01.log.html#l-33",`
		`+ "date": 1510063568.0,`
		`+ "hub": "abompard",`
		`+ "hubs": ["abompard"],`
		`+ "meeting_topic": "hubs-devel",`
		`+ "text": "We need people to work on hubs, see https://pagure.io/fedora-hubs/issue/390",`
		`+ "urls": ["https://pagure.io/fedora-hubs/issue/390"]`
		`+ }`
		`+ ];`
		`+`
		`+ it("should not repeat the dates", () => {`
		`+ const component = mount(`
		`+ <IntlProvider locale="en">`
		`+ <RequestList requests={requests} />`
		`+ </IntlProvider>`
		`+ );`
		`+ expect(component).toBeTruthy();`
		`+ expect(component.find(".date")).toBeTruthy();`
		`+ expect(component.find(".date")).toHaveLength(1);`
		`+ });`
		`+ })`
		`+`

hubs/static/client/app/widgets/halp/halp.css

file modified

+3 -3

		`@@ -28,12 +28,12 @@`
		`.widget-halp .Spinner {`
		`margin: 0 auto;`
		`}`
		`- .widget-halp .requests {`
		`+ .widget-halp .RequestList {`
		`}`
		`- .widget-halp .requests .no-request {`
		`+ .widget-halp .RequestList .no-request {`
		`margin-top: 10px;`
		`}`
		`- .widget-halp .requests .date {`
		`+ .widget-halp .RequestList .date {`
		`text-transform: uppercase;`
		`font-size: 110%;`
		`margin-top: 10px;`