-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Domains: Remove unused domains/kracken-ui/max-characters-filter
feature flag
#95564
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -8,22 +8,19 @@ import PropTypes from 'prop-types'; | |
import { createRef, Component } from 'react'; | ||
import FormInputCheckbox from 'calypso/components/forms/form-checkbox'; | ||
import FormFieldset from 'calypso/components/forms/form-fieldset'; | ||
import FormTextInput from 'calypso/components/forms/form-text-input'; | ||
import TokenField from 'calypso/components/token-field'; | ||
import ValidationFieldset from 'calypso/signup/validation-fieldset'; | ||
|
||
const HANDLED_FILTER_KEYS = [ 'tlds', 'maxCharacters', 'exactSldMatchesOnly' ]; | ||
const HANDLED_FILTER_KEYS = [ 'tlds', 'exactSldMatchesOnly' ]; | ||
|
||
export class DropdownFilters extends Component { | ||
static propTypes = { | ||
availableTlds: PropTypes.array, | ||
filters: PropTypes.shape( { | ||
maxCharacters: PropTypes.string, | ||
exactSldMatchesOnly: PropTypes.bool, | ||
tlds: PropTypes.array, | ||
} ).isRequired, | ||
lastFilters: PropTypes.shape( { | ||
maxCharacters: PropTypes.string, | ||
exactSldMatchesOnly: PropTypes.bool, | ||
tlds: PropTypes.array, | ||
} ).isRequired, | ||
|
@@ -41,7 +38,6 @@ export class DropdownFilters extends Component { | |
|
||
state = { | ||
showPopover: false, | ||
showOverallValidationError: false, | ||
}; | ||
|
||
constructor( props ) { | ||
|
@@ -65,32 +61,10 @@ export class DropdownFilters extends Component { | |
getFiltercounts() { | ||
return ( | ||
( this.props.lastFilters.tlds?.length || 0 ) + | ||
( this.props.lastFilters.exactSldMatchesOnly && 1 ) + | ||
( this.props.lastFilters.maxCharacters !== '' && 1 ) | ||
( this.props.lastFilters.exactSldMatchesOnly && 1 ) | ||
); | ||
} | ||
|
||
getMaxCharactersValidationErrors() { | ||
const { | ||
filters: { maxCharacters }, | ||
translate, | ||
} = this.props; | ||
const isValid = /^-?\d*$/.test( maxCharacters ); | ||
return ! isValid ? [ translate( 'Value must be a whole number' ) ] : null; | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This method only checked if |
||
|
||
getOverallValidationErrors() { | ||
const isValid = this.getMaxCharactersValidationErrors() === null; | ||
const { showOverallValidationError } = this.state; | ||
return ! isValid && showOverallValidationError | ||
? [ this.props.translate( 'Please correct any errors above' ) ] | ||
: null; | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Since |
||
|
||
hasValidationErrors() { | ||
return this.getOverallValidationErrors() !== null; | ||
} | ||
|
||
updateFilterValues = ( name, value ) => { | ||
this.props.onChange( { | ||
[ name ]: value, | ||
|
@@ -107,21 +81,13 @@ export class DropdownFilters extends Component { | |
}; | ||
|
||
handleFiltersReset = () => { | ||
this.setState( { showOverallValidationError: false }, () => { | ||
this.togglePopover( { discardChanges: false } ); | ||
this.props.onReset( 'tlds', 'maxCharacters', 'exactSldMatchesOnly' ); | ||
} ); | ||
this.togglePopover( { discardChanges: false } ); | ||
this.props.onReset( 'tlds', 'exactSldMatchesOnly' ); | ||
}; | ||
handleFiltersSubmit = () => { | ||
if ( this.hasValidationErrors() ) { | ||
this.setState( { showOverallValidationError: true } ); | ||
return; | ||
} | ||
|
||
this.setState( { showOverallValidationError: false }, () => { | ||
this.togglePopover( { discardChanges: false } ); | ||
this.hasFiltersChanged() && this.props.onSubmit(); | ||
} ); | ||
handleFiltersSubmit = () => { | ||
this.togglePopover( { discardChanges: false } ); | ||
this.hasFiltersChanged() && this.props.onSubmit(); | ||
}; | ||
|
||
hasFiltersChanged() { | ||
|
@@ -180,14 +146,13 @@ export class DropdownFilters extends Component { | |
|
||
renderPopover() { | ||
const { | ||
filters: { maxCharacters, exactSldMatchesOnly }, | ||
filters: { exactSldMatchesOnly }, | ||
popoverId, | ||
translate, | ||
showTldFilter, | ||
} = this.props; | ||
|
||
const isExactMatchFilterEnabled = config.isEnabled( 'domains/kracken-ui/exact-match-filter' ); | ||
const isLengthFilterEnabled = config.isEnabled( 'domains/kracken-ui/max-characters-filter' ); | ||
|
||
return ( | ||
<Popover | ||
|
@@ -202,27 +167,6 @@ export class DropdownFilters extends Component { | |
{ ...( isWithinBreakpoint( '>660px' ) && { relativePosition: { left: -238 } } ) } | ||
hideArrow | ||
> | ||
{ isLengthFilterEnabled && ( | ||
<ValidationFieldset | ||
className="search-filters__text-input-fieldset" | ||
errorMessages={ this.getMaxCharactersValidationErrors() } | ||
> | ||
<FormLabel className="search-filters__label" htmlFor="search-filters-max-characters"> | ||
{ translate( 'Max Characters' ) }: | ||
</FormLabel> | ||
<FormTextInput | ||
className="search-filters__input" | ||
id="search-filters-max-characters" | ||
min="1" | ||
name="maxCharacters" | ||
onChange={ this.handleOnChange } | ||
placeholder="14" | ||
type="number" | ||
value={ maxCharacters } | ||
/> | ||
</ValidationFieldset> | ||
) } | ||
|
||
{ showTldFilter && ( | ||
<ValidationFieldset className="search-filters__tld-filters"> | ||
<TokenField | ||
|
@@ -260,10 +204,7 @@ export class DropdownFilters extends Component { | |
) } | ||
</FormFieldset> | ||
|
||
<ValidationFieldset | ||
className="search-filters__buttons-fieldset" | ||
errorMessages={ this.getOverallValidationErrors() } | ||
> | ||
<ValidationFieldset className="search-filters__buttons-fieldset"> | ||
<div className="search-filters__buttons"> | ||
<Button onClick={ this.handleFiltersReset }>{ translate( 'Clear' ) }</Button> | ||
<Button primary onClick={ this.handleFiltersSubmit }> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This only ever changed to
true
whenhasValidationErrors
returnedtrue
, which doesn't happen anymore. So this state property can be removed.