hooks useHighlightInput.tsx

85.71% Statements 6/7

50% Branches 2/4

100% Functions 2/2

85.71% Lines 6/7

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23  
 
 
 
 
 
19x
6x
 
6x
18x
 
 
 
 
 
 
18x
 
 
6x
 
  import { palette } from "@palette";
 
/**
 * The goal is to show red borders to the empty inputs, without making them required and
 * hence disabling navigation.
 */
export const useHighlightInput = (shouldHighlightInput: boolean) => {
  const errorColor = palette.filled?.red;
 
  const highlightInputStyles = (customCondition: () => boolean): any => {
    Iif (shouldHighlightInput && customCondition()) {
      return {
        ".MuiInputBase-root": {
          border: `2px solid ${errorColor} !important`,
        },
      };
    }
    return {};
  };
 
  return { highlightInputStyles };
};