refactor: remove input nested ternary

Author: cooper-joe

components/input/src/input/input.js

@@ -219,6 +219,8 @@ export class Input extends Component {
         const exceedsMaximum = showCounter && valueLength > maxChars
         const counterId = showCounter && name ? `${name}-counter` : undefined
 
+        const showClearButton = clearable && value?.length > 0
+
         const endItemsEnd = statusIcon ? '38px' : '8px'
 
         return (
@@ -265,17 +267,17 @@ export class Input extends Component {
                         'read-only': readOnly,
                     })}
                 />
-                {showCounter ? (
+                {showCounter && (
                     <span className="input-end-items">
-                        {clearable && value?.length ? (
+                        {showClearButton && (
                             <button
                                 type="button"
                                 onClick={this.handleClear}
                                 className="clear-button"
                             >
                                 <IconCross16 color={colors.white} />
                             </button>
-                        ) : null}
+                        )}
                         <span
                             id={counterId}
                             className={cx('character-counter', {
@@ -286,15 +288,16 @@ export class Input extends Component {
                             {valueLength}/{maxChars}
                         </span>
                     </span>
-                ) : clearable && value?.length ? (
+                )}
+                {!showCounter && showClearButton && (
                     <button
                         type="button"
                         onClick={this.handleClear}
                         className="clear-button"
                     >
                         <IconCross16 color={colors.white} />
                     </button>
-                ) : null}
+                )}
                 <StatusIcon
                     error={error}
                     valid={valid}