]> source.dussan.org Git - sonarqube.git/commitdiff
SONAR-7709 Help users to not enter wrong date periods
authorStas Vilchik <stas.vilchik@sonarsource.com>
Tue, 10 Oct 2017 14:56:47 +0000 (16:56 +0200)
committerStas Vilchik <stas.vilchik@sonarsource.com>
Wed, 11 Oct 2017 10:02:21 +0000 (12:02 +0200)
server/sonar-web/src/main/js/apps/issues/components/App.js
server/sonar-web/src/main/js/apps/issues/sidebar/CreationDateFacet.js
server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityDateInput.js
server/sonar-web/src/main/js/apps/projectActivity/components/__tests__/__snapshots__/ProjectActivityDateInput-test.js.snap
server/sonar-web/src/main/js/apps/quality-profiles/changelog/ChangelogSearch.tsx
server/sonar-web/src/main/js/components/controls/DateInput.tsx

index f6616f229edfc075884984ea53250fc107b841e1..984aedca11c0b56dd23f9508e7d0314cd5b4fe6b 100644 (file)
@@ -420,7 +420,7 @@ export default class App extends React.PureComponent {
         if (this.mounted) {
           this.setState({ loading: false });
         }
-        return Promise.reject();
+        return [];
       }
     );
   }
@@ -518,29 +518,32 @@ export default class App extends React.PureComponent {
   };
 
   fetchFacet = (facet /*: string */) => {
-    return this.fetchIssues({ ps: 1, facets: mapFacet(facet) }).then(({ facets, ...other }) => {
-      if (this.mounted) {
-        this.setState(state => ({
-          facets: { ...state.facets, ...parseFacets(facets) },
-          referencedComponents: {
-            ...state.referencedComponents,
-            ...keyBy(other.components, 'uuid')
-          },
-          referencedLanguages: {
-            ...state.referencedLanguages,
-            ...keyBy(other.languages, 'key')
-          },
-          referencedRules: {
-            ...state.referencedRules,
-            ...keyBy(other.rules, 'key')
-          },
-          referencedUsers: {
-            ...state.referencedUsers,
-            ...keyBy(other.users, 'login')
-          }
-        }));
-      }
-    });
+    return this.fetchIssues({ ps: 1, facets: mapFacet(facet) }).then(
+      ({ facets, ...other }) => {
+        if (this.mounted) {
+          this.setState(state => ({
+            facets: { ...state.facets, ...parseFacets(facets) },
+            referencedComponents: {
+              ...state.referencedComponents,
+              ...keyBy(other.components, 'uuid')
+            },
+            referencedLanguages: {
+              ...state.referencedLanguages,
+              ...keyBy(other.languages, 'key')
+            },
+            referencedRules: {
+              ...state.referencedRules,
+              ...keyBy(other.rules, 'key')
+            },
+            referencedUsers: {
+              ...state.referencedUsers,
+              ...keyBy(other.users, 'login')
+            }
+          }));
+        }
+      },
+      () => {}
+    );
   };
 
   isFiltered = () => {
index 461d3405d14ab82ec46dcec68d749f1328f19c2b..edc61cf799daf457427b886dec3b86f76110ad4a 100644 (file)
@@ -228,6 +228,7 @@ export default class CreationDateFacet extends React.PureComponent {
         <DateInput
           className="search-navigator-date-facet-selection-dropdown-left"
           inputClassName="search-navigator-date-facet-selection-input"
+          maxDate={createdBefore ? toShortNotSoISOString(createdBefore) : '+0'}
           onChange={this.handlePeriodChangeAfter}
           placeholder={translate('from')}
           value={createdAfter ? toShortNotSoISOString(createdAfter) : undefined}
@@ -235,6 +236,7 @@ export default class CreationDateFacet extends React.PureComponent {
         <DateInput
           className="search-navigator-date-facet-selection-dropdown-right"
           inputClassName="search-navigator-date-facet-selection-input"
+          minDate={createdAfter ? toShortNotSoISOString(createdAfter) : undefined}
           onChange={this.handlePeriodChangeBefore}
           placeholder={translate('to')}
           value={createdBefore ? toShortNotSoISOString(createdBefore) : undefined}
index edd3ca20dc7bd2fb6d3ec7dbb3e5ec0cdcebf5d3..a277fb95856093c5d87f5fa233d04ad9993cd09b 100644 (file)
@@ -49,18 +49,20 @@ export default class ProjectActivityDateInput extends React.PureComponent {
       <div>
         <DateInput
           className="little-spacer-right"
+          maxDate={this.formatDate(this.props.to) || '+0'}
           name="from"
-          value={this.formatDate(this.props.from)}
-          placeholder={translate('from')}
           onChange={this.handleFromDateChange}
+          placeholder={translate('from')}
+          value={this.formatDate(this.props.from)}
         />
         {'—'}
         <DateInput
           className="little-spacer-left"
+          minDate={this.formatDate(this.props.from)}
           name="to"
-          value={this.formatDate(this.props.to)}
-          placeholder={translate('to')}
           onChange={this.handleToDateChange}
+          placeholder={translate('to')}
+          value={this.formatDate(this.props.to)}
         />
         <button
           className="spacer-left"
index a25f91ca43f8612e9c687553db9ad7bed650bb0e..5967a6968c2d6502d38094d811249497e16d8413 100644 (file)
@@ -5,7 +5,7 @@ exports[`should render correctly the date inputs 1`] = `
   <DateInput
     className="little-spacer-right"
     format="yy-mm-dd"
-    maxDate="+0"
+    maxDate="2016-12-27"
     name="from"
     onChange={[Function]}
     placeholder="from"
@@ -16,6 +16,7 @@ exports[`should render correctly the date inputs 1`] = `
     className="little-spacer-left"
     format="yy-mm-dd"
     maxDate="+0"
+    minDate="2016-10-27"
     name="to"
     onChange={[Function]}
     placeholder="to"
index 288529c6c633d090275796df8f95a2101624ac0a..de47bc42a0d2809fc20ccfd89a1de6fa61e91c2b 100644 (file)
@@ -31,11 +31,11 @@ interface Props {
 }
 
 export default class ChangelogSearch extends React.PureComponent<Props> {
-  handleResetClick(event: React.SyntheticEvent<HTMLElement>) {
+  handleResetClick = (event: React.SyntheticEvent<HTMLElement>) => {
     event.preventDefault();
     event.currentTarget.blur();
     this.props.onReset();
-  }
+  };
 
   formatDate = (date?: string) => (date ? toShortNotSoISOString(date) : undefined);
 
@@ -43,19 +43,21 @@ export default class ChangelogSearch extends React.PureComponent<Props> {
     return (
       <div className="display-inline-block" id="quality-profile-changelog-form">
         <DateInput
+          maxDate={this.formatDate(this.props.toDate) || '+0'}
           name="since"
-          value={this.formatDate(this.props.fromDate)}
-          placeholder={translate('from')}
           onChange={this.props.onFromDateChange}
+          placeholder={translate('from')}
+          value={this.formatDate(this.props.fromDate)}
         />
         {' — '}
         <DateInput
+          minDate={this.formatDate(this.props.fromDate)}
           name="to"
-          value={this.formatDate(this.props.toDate)}
-          placeholder={translate('to')}
           onChange={this.props.onToDateChange}
+          placeholder={translate('to')}
+          value={this.formatDate(this.props.toDate)}
         />
-        <button className="spacer-left" onClick={this.handleResetClick.bind(this)}>
+        <button className="spacer-left" onClick={this.handleResetClick}>
           {translate('reset_verb')}
         </button>
       </div>
index e36762151499aba914bc1bdc6507e9d9fd398583..5a0c0911f614fd4c979cfa76d4742c4393a0c182 100644 (file)
@@ -30,6 +30,7 @@ interface Props {
   inputClassName?: string;
   // see http://api.jqueryui.com/datepicker/#option-maxDate for details
   maxDate?: Date | string | number;
+  minDate?: Date | string | number;
   name: string;
   onChange: (value?: string) => void;
   placeholder: string;
@@ -48,6 +49,17 @@ export default class DateInput extends React.PureComponent<Props> {
     this.attachDatePicker();
   }
 
+  componentDidUpdate(prevProps: Props) {
+    if ($.fn && ($.fn as any).datepicker && this.input) {
+      if (prevProps.maxDate !== this.props.maxDate) {
+        ($(this.input) as any).datepicker('option', { maxDate: this.props.maxDate });
+      }
+      if (prevProps.minDate !== this.props.minDate) {
+        ($(this.input) as any).datepicker('option', { minDate: this.props.minDate });
+      }
+    }
+  }
+
   handleChange = () => {
     const { value } = this.input;
     this.props.onChange(value);
@@ -65,6 +77,7 @@ export default class DateInput extends React.PureComponent<Props> {
       changeMonth: true,
       changeYear: true,
       maxDate: this.props.maxDate,
+      minDate: this.props.minDate,
       onSelect: this.handleChange
     };