@nordicsemiconductor/pc-nrfconnect-shared 230.0.0 → 231.0.0

package/src/Dropdown/Dropdown.tsx

@@ -57,7 +57,7 @@ export default <T,>({
             className={classNames(
                 'tw-preflight tw-relative tw-text-xs',
                 minWidth ? '' : 'tw-w-full',
-                className
+                className,
             )}
             onBlur={event => {
                 if (!event.currentTarget.contains(event.relatedTarget)) {
@@ -80,8 +80,8 @@ export default <T,>({
                               'tw-bg-gray-700 tw-text-white',
                               size === 'sm'
                                   ? 'tw-h-6 tw-pl-2 tw-pr-1 tw-text-2xs'
-                                  : 'tw-h-8 tw-px-2'
-                          )
+                                  : 'tw-h-8 tw-px-2',
+                          ),
                 )}
                 onClick={() => setIsActive(!isActive)}
                 disabled={disabled}
@@ -94,7 +94,7 @@ export default <T,>({
                 <span
                     className={`mdi mdi-chevron-down ${classNames(
                         isActive && 'tw-rotate-180',
-                        size === 'sm' ? 'tw-text-base' : 'tw-text-lg'
+                        size === 'sm' ? 'tw-text-base' : 'tw-text-lg',
                     )}`}
                 />
             </button>
@@ -118,7 +118,7 @@ export default <T,>({
                 className={`tw-text-while tw-absolute tw-z-10 tw-border-t-2 tw-border-solid tw-border-gray-600 tw-bg-gray-700 tw-p-0 ${classNames(
                     styles.content,
                     minWidth ? '' : 'tw-right-0 tw-w-full',
-                    !isActive && 'tw-hidden'
+                    !isActive && 'tw-hidden',
                 )}`}
             >
                 {items.map(item => (
@@ -126,7 +126,7 @@ export default <T,>({
                         type="button"
                         className={classNames(
                             'tw-bg-transparent tw-clear-both tw-block tw-h-6 tw-w-full tw-whitespace-nowrap tw-border-0 tw-px-2 tw-py-1 tw-text-left tw-font-normal tw-text-white hover:tw-bg-gray-600 focus:tw-bg-gray-600',
-                            size === 'sm' && 'tw-text-2xs'
+                            size === 'sm' && 'tw-text-2xs',
                         )}
                         key={JSON.stringify(item.value)}
                         onClick={() => onClickItem(item)}

package/src/Dropdown/DropdownHelpers.test.ts

@@ -31,7 +31,7 @@ describe('getSelectedDropdownItem', () => {
     it('returns the notFound item if value is not found', () => {
         const notFound = { label: 'not found', value: 'not found' };
         expect(getSelectedDropdownItem(itemList, 'unknown', notFound)).toBe(
-            notFound
+            notFound,
         );
     });
 

package/src/Dropdown/DropdownHelpers.ts

@@ -10,7 +10,7 @@ import { DropdownItem } from './Dropdown';
 export const getSelectedDropdownItem = (
     itemList: DropdownItem[],
     value: unknown,
-    notFound?: DropdownItem
+    notFound?: DropdownItem,
 ) => {
     if (typeof value === 'boolean') value = value ? 'on' : 'off';
 
@@ -18,12 +18,12 @@ export const getSelectedDropdownItem = (
 
     const result = itemList[itemList.findIndex(e => e.value === `${value}`)];
 
-    return result === undefined ? notFound ?? itemList[0] : result;
+    return result === undefined ? (notFound ?? itemList[0]) : result;
 };
 
 export const convertToDropDownItems: <T>(
     data: T[],
-    addAuto?: boolean
+    addAuto?: boolean,
 ) => DropdownItem[] = (data, addAuto = true) => {
     const mappedData = data.map(v => ({
         label: `${v}`,
@@ -36,7 +36,7 @@ export const convertToDropDownItems: <T>(
 };
 
 export const convertToNumberDropDownItems: (
-    data: number[]
+    data: number[],
 ) => NumberDropdownItem[] = data =>
     data.map(v => ({
         label: `${v}`,

package/src/ErrorBoundary/ErrorBoundary.test.tsx

@@ -26,7 +26,7 @@ jest.mocked(generateSystemReport).mockImplementation(
     () =>
         new Promise(res => {
             res(SYSTEM_REPORT);
-        })
+        }),
 );
 
 const Child = () => {
@@ -49,7 +49,7 @@ describe('ErrorBoundary', () => {
         render(
             <ErrorBoundary sendTelemetryEvent={sendTelemetryEvent}>
                 <Child />
-            </ErrorBoundary>
+            </ErrorBoundary>,
         );
         expect(sendTelemetryEvent).toHaveBeenCalled();
     });
@@ -58,7 +58,7 @@ describe('ErrorBoundary', () => {
         render(
             <ErrorBoundary>
                 <Child />
-            </ErrorBoundary>
+            </ErrorBoundary>,
         );
         const errorMessage = screen.getByText('Oops! There was a problem');
         expect(errorMessage).toBeDefined();
@@ -68,7 +68,7 @@ describe('ErrorBoundary', () => {
         render(
             <ErrorBoundary>
                 <Child />
-            </ErrorBoundary>
+            </ErrorBoundary>,
         );
         fireEvent.click(screen.getByText('Restore default settings'));
         await screen.findByText(OKBUTTONTEXT);
@@ -80,7 +80,7 @@ describe('ErrorBoundary', () => {
         render(
             <ErrorBoundary>
                 <Child />
-            </ErrorBoundary>
+            </ErrorBoundary>,
         );
         const report = await screen.findByText(SYSTEM_REPORT);
         expect(report).toBeDefined();

package/src/ErrorBoundary/ErrorBoundary.tsx

@@ -68,15 +68,17 @@ class ErrorBoundary extends React.Component<
             sendTelemetryEvent,
         } = this.props;
 
-        sendTelemetryEvent != null
-            ? sendTelemetryEvent(error.message)
-            : sendErrorReport(error.message);
+        if (sendTelemetryEvent != null) {
+            sendTelemetryEvent(error.message);
+        } else {
+            sendErrorReport(error.message);
+        }
 
         generateSystemReport(
             new Date().toISOString().replace(/:/g, '-'),
             devices,
             selectedDevice,
-            selectedSerialNumber
+            selectedSerialNumber,
         ).then(report => {
             this.setState({ systemReport: report });
         });
@@ -169,7 +171,7 @@ class ErrorBoundary extends React.Component<
                         variant="primary"
                         onClick={() =>
                             openUrl(
-                                'https://devzone.nordicsemi.com/support/add'
+                                'https://devzone.nordicsemi.com/support/add',
                             )
                         }
                     >

package/src/ErrorDialog/ErrorDialog.tsx

@@ -23,7 +23,7 @@ import {
 
 import './error.scss';
 
-const ErrorMessage = ({
+const SingleErrorMessage = ({
     error: { message, detail },
 }: {
     error: ErrorMessage;
@@ -40,7 +40,7 @@ const MultipleErrorMessages = ({ messages }: { messages: ErrorMessage[] }) => (
         <ul>
             {messages.map(message => (
                 <li key={message.message}>
-                    <ErrorMessage error={message} />
+                    <SingleErrorMessage error={message} />
                 </li>
             ))}
         </ul>
@@ -74,12 +74,12 @@ const ErrorDialog = () => {
                         >
                             {label}
                         </DialogButton>
-                    )
+                    ),
                 )
             }
         >
             {messages.length === 1 ? (
-                <ErrorMessage error={messages[0]} />
+                <SingleErrorMessage error={messages[0]} />
             ) : (
                 <MultipleErrorMessages messages={messages} />
             )}

package/src/ErrorDialog/errorDialogSlice.ts

@@ -12,7 +12,7 @@ const appendIfNew = (messages: ErrorMessage[], message: ErrorMessage) => {
     const messageExists = messages.some(
         existingMessage =>
             existingMessage.message === message.message &&
-            existingMessage.detail === message.detail
+            existingMessage.detail === message.detail,
     );
 
     return messageExists ? messages : [...messages, message];
@@ -47,7 +47,7 @@ const slice = createSlice({
             prepare: (
                 message: string,
                 errorResolutions?: ErrorResolutions,
-                detail?: string
+                detail?: string,
             ) => ({
                 payload: { message: { message, detail }, errorResolutions },
             }),
@@ -58,7 +58,7 @@ const slice = createSlice({
                 }: PayloadAction<{
                     message: ErrorMessage;
                     errorResolutions?: ErrorResolutions;
-                }>
+                }>,
             ) => {
                 state.isVisible = true;
                 state.errorResolutions = error.errorResolutions;

package/src/FactoryReset/FactoryResetButton.test.tsx

@@ -42,7 +42,7 @@ describe('FactoryReset', () => {
             <FactoryResetButton
                 label={FACTORY_RESET}
                 resetFn={overrideResetFn}
-            />
+            />,
         );
         fireEvent.click(screen.getByText(FACTORY_RESET));
         await screen.findByText(OK);

package/src/FlashMessage/FlashMessage.tsx

@@ -31,17 +31,17 @@ const LOADER_ANIMATION = (dismissTime: number) =>
         dismissTime - SLIDE_OUT_DURATION_MS
     }ms flash-message-loader linear forwards`;
 
-interface FlashMessageProps {
+const SingleFlashMessage = ({
+    flashMessage,
+}: {
     flashMessage: FlashMessage;
-}
-
-const FlashMessage = ({ flashMessage }: FlashMessageProps) => {
+}) => {
     const { id, message, variant, dismissTime } = flashMessage;
 
     const dispatch = useDispatch();
     const divRef = useRef(null);
     const [fadeoutTimer, setFadeoutTimer] = useState<string>(
-        dismissTime == null ? 'unset' : `${dismissTime}ms`
+        dismissTime == null ? 'unset' : `${dismissTime}ms`,
     );
     const timeoutHandler = useRef<number | undefined>(undefined);
 
@@ -79,7 +79,7 @@ const FlashMessage = ({ flashMessage }: FlashMessageProps) => {
                 variant === 'error' && 'tw-bg-red',
                 variant === 'success' && 'tw-bg-green',
                 variant === 'info' && 'tw-bg-nordicBlue',
-                variant === 'warning' && 'tw-bg-orange'
+                variant === 'warning' && 'tw-bg-orange',
             )}`}
             style={{
                 zIndex: 1000,
@@ -134,7 +134,7 @@ const FlashMessages = () => {
             }}
         >
             {messages.map(flashMessage => (
-                <FlashMessage
+                <SingleFlashMessage
                     key={flashMessage.id}
                     flashMessage={flashMessage}
                 />
@@ -145,7 +145,7 @@ const FlashMessages = () => {
 
 const flashMessageAnimations = (
     initialRender2: boolean,
-    dismissTime2?: number
+    dismissTime2?: number,
 ): string => {
     if (!dismissTime2) {
         return initialRender2 ? SLIDE_IN_ANIMATION : 'unset';

package/src/FlashMessage/FlashMessageSlice.ts

@@ -33,13 +33,13 @@ const slice = createSlice({
     reducers: {
         addNewMessage: (
             state,
-            { payload: message }: PayloadAction<FlashMessagePayload>
+            { payload: message }: PayloadAction<FlashMessagePayload>,
         ) => {
             state.messages.push({ ...message, id: nanoid() });
         },
         removeMessage: (state, { payload: id }: PayloadAction<string>) => {
             state.messages = state.messages.filter(
-                message => message.id !== id
+                message => message.id !== id,
             );
         },
     },
@@ -76,7 +76,7 @@ const newFlashMessage =
                 message,
                 variant,
                 dismissTime,
-            })
+            }),
         );
     };
 

package/src/Group/Group.tsx

@@ -22,7 +22,7 @@ const collapseSection = (element: HTMLDivElement) => {
             element.setAttribute('data-animating', 'true');
             element.style.pointerEvents = 'none';
         },
-        { once: true }
+        { once: true },
     );
 
     // on the next frame (as soon as the previous style change has taken effect),
@@ -41,7 +41,7 @@ const collapseSection = (element: HTMLDivElement) => {
                     element.style.pointerEvents = '';
                     element.setAttribute('data-animating', 'false');
                 },
-                { once: true }
+                { once: true },
             );
         });
     });
@@ -61,7 +61,7 @@ const expandSection = (element: HTMLDivElement) => {
             element.style.pointerEvents = 'none';
             element.setAttribute('data-animating', 'true');
         },
-        { once: true }
+        { once: true },
     );
     element.addEventListener(
         'transitionend',
@@ -71,7 +71,7 @@ const expandSection = (element: HTMLDivElement) => {
             element.style.overflow = '';
             element.setAttribute('data-animating', 'false');
         },
-        { once: true }
+        { once: true },
     );
 };
 
@@ -102,7 +102,7 @@ export const Group = ({
     const getInitialCollapseState = () => {
         if (collapseStatePersistanceId) {
             const persistedState = getPersistedGroupCollapseState(
-                collapseStatePersistanceId
+                collapseStatePersistanceId,
             );
             if (persistedState !== undefined) {
                 return persistedState;
@@ -121,7 +121,7 @@ export const Group = ({
                 className={classNames(
                     'tw-row tw-preflight tw- tw-flex tw-items-center tw-justify-between tw-text-left',
                     headingFullWidth && 'tw-w-full',
-                    !collapsible && ' tw-cursor-default'
+                    !collapsible && ' tw-cursor-default',
                 )}
                 type="button"
                 onClick={() => {
@@ -132,7 +132,7 @@ export const Group = ({
 
                     if (
                         collapsibleDivRef.current.getAttribute(
-                            'data-animating'
+                            'data-animating',
                         ) === 'true'
                     )
                         return;
@@ -149,7 +149,7 @@ export const Group = ({
                     if (collapseStatePersistanceId) {
                         persistGroupCollapseState(
                             collapseStatePersistanceId,
-                            !collapsed
+                            !collapsed,
                         );
                     }
                 }}
@@ -164,7 +164,7 @@ export const Group = ({
                     <span
                         className={classNames(
                             'mdi mdi-chevron-down tw-inline tw-text-xl/3 tw-transition-transform',
-                            !collapsed && 'tw-rotate-180'
+                            !collapsed && 'tw-rotate-180',
                         )}
                     />
                 )}
@@ -184,7 +184,7 @@ export const Group = ({
                 className={classNames(
                     'tw-transition-all',
                     !initStateSet.current && collapsed && 'tw-h-0',
-                    !initStateSet.current && !collapsed && 'tw-h-full'
+                    !initStateSet.current && !collapsed && 'tw-h-full',
                 )}
             >
                 <div
@@ -194,7 +194,7 @@ export const Group = ({
                         gap === 1 && 'tw-gap-1',
                         gap === 2 && 'tw-gap-2',
                         gap === 4 && 'tw-gap-4',
-                        gap === 8 && 'tw-gap-8'
+                        gap === 8 && 'tw-gap-8',
                     )}
                 >
                     {children}

package/src/InlineInput/InlineInput.tsx

@@ -36,7 +36,7 @@ external value and comparing with it to determine whether it has changed.
 
 export const useSynchronisationIfChangedFromOutside = <T,>(
     externalValue: T,
-    setInternalValue: (value: T) => void
+    setInternalValue: (value: T) => void,
 ) => {
     const previousExternalValue = useRef(externalValue);
     useEffect(() => {
@@ -83,7 +83,7 @@ const InlineInput = React.forwardRef<HTMLInputElement, Props>(
             minSize,
             maxLength,
         },
-        ref
+        ref,
     ) => {
         const [internalValue, setInternalValue] = useState(externalValue);
         const [initialValue, setInitialValue] = useState(externalValue);
@@ -175,7 +175,7 @@ const InlineInput = React.forwardRef<HTMLInputElement, Props>(
                         : isValid(internalValue) || 'invalid',
                     disabled && 'disabled',
                     textAlignLeft && 'tw-pl-2 tw-text-left',
-                    className
+                    className,
                 )}
                 size={
                     Math.max(minSize ?? 1, internalValue.length) +
@@ -194,7 +194,7 @@ const InlineInput = React.forwardRef<HTMLInputElement, Props>(
                 maxLength={maxLength}
             />
         );
-    }
+    },
 );
 
 export default InlineInput;

package/src/InlineInput/NumberInlineInput.tsx

@@ -50,7 +50,7 @@ const isValid = (value: number, rangeOrValues: RangeOrValues) =>
 const nextInValues = (
     current: number,
     values: Values,
-    steps: number
+    steps: number,
 ): number | undefined => {
     const currentIndex = values.indexOf(current);
     const newIndex = currentIndex + steps;
@@ -60,7 +60,7 @@ const nextInValues = (
 
 const nextInRange = (current: number, range: Range, steps: number) => {
     const newValue = Number(
-        (current + steps * getStep(range)).toFixed(range.decimals)
+        (current + steps * getStep(range)).toFixed(range.decimals),
     );
 
     if (newValue >= range.min && newValue <= range.max) {
@@ -71,7 +71,7 @@ const nextInRange = (current: number, range: Range, steps: number) => {
 const changeValueStepwise = (
     current: number,
     rangeOrValues: RangeOrValues,
-    steps: number
+    steps: number,
 ) => {
     const nextValue = isValues(rangeOrValues)
         ? nextInValues(current, rangeOrValues, steps)
@@ -103,8 +103,8 @@ const calculateMaxCharactersFromRange = (range: RangeOrValues): number => {
             ...range.map(v =>
                 Number.isFinite(v)
                     ? handleInfinityToString(v).length
-                    : v.toString().length
-            )
+                    : v.toString().length,
+            ),
         );
     }
 
@@ -147,19 +147,19 @@ export default ({
             }
             onKeyboardIncrementAction={() =>
                 handleInfinityToString(
-                    changeValueStepwise(value, range, 1)
+                    changeValueStepwise(value, range, 1),
                 ).toString()
             }
             onKeyboardDecrementAction={() =>
                 handleInfinityToString(
-                    changeValueStepwise(value, range, -1)
+                    changeValueStepwise(value, range, -1),
                 ).toString()
             }
             textAlignLeft={textAlignLeft}
             isValid={newValue => {
                 const validity = isValid(
                     handleInfinityToNumber(newValue),
-                    range
+                    range,
                 );
                 if (onValidityChanged != null) {
                     // Then propagate the validity back to parent
@@ -171,21 +171,21 @@ export default ({
             preventDefaultInvalidStyle={preventDefaultInvalidStyle}
             minSize={
                 preAllocateSize
-                    ? minSize ??
+                    ? (minSize ??
                       Math.max(
                           ...(isValues(range)
                               ? range.map(v =>
                                     Number.isFinite(v)
                                         ? handleInfinityToString(v)
-                                        : v.toString()
+                                        : v.toString(),
                                 )
                               : [range.min, range.max].map(v =>
                                     Number.isFinite(v)
                                         ? v.toFixed(range.decimals)
-                                        : handleInfinityToString(v)
+                                        : handleInfinityToString(v),
                                 )
-                          ).map(v => v.length)
-                      )
+                          ).map(v => v.length),
+                      ))
                     : undefined
             }
             maxLength={calculateMaxCharactersFromRange(range)}

package/src/InlineInput/NumberInputWithDropdown.tsx

@@ -92,7 +92,7 @@ export default ({
                 >
                     <span
                         className={`mdi mdi-chevron-down tw-text-lg ${classNames(
-                            isActive && 'tw-rotate-180'
+                            isActive && 'tw-rotate-180',
                         )}`}
                     />
                 </button>
@@ -116,7 +116,7 @@ export default ({
                 }
                 className={`tw-text-while tw-absolute tw-right-0 tw-z-10 tw-w-full tw-bg-gray-700 tw-p-0 ${classNames(
                     styles.content,
-                    !isActive && 'tw-hidden'
+                    !isActive && 'tw-hidden',
                 )}`}
             >
                 {items.map(item => (

package/src/Link/ExternalLink.tsx

@@ -16,7 +16,7 @@ export default ({ href, label }: { href: string; label?: string }) => (
         href={href}
         title={label ? href : undefined}
         className={classNames(
-            'tw-preflight tw-text-nordicBlue hover:tw-underline'
+            'tw-preflight tw-text-nordicBlue hover:tw-underline',
         )}
         onClick={event => {
             telemetry.sendEvent('Visiting link', { href });

package/src/Link/FileLink.tsx

@@ -23,7 +23,7 @@ export default ({
         onClick={() => openFile(fileLocation)}
         className={classNames(
             'tw-preflight tw-overflow-hidden tw-text-ellipsis tw-text-nordicBlue hover:tw-underline',
-            className
+            className,
         )}
     >
         {label}

package/src/Log/LogEntry.tsx

@@ -41,7 +41,7 @@ function hrefReplacer(str: string) {
                 onKeyPress={() => {}}
             >
                 {href}
-            </a>
+            </a>,
         );
         return '';
     });

package/src/Log/logSlice.ts

@@ -82,7 +82,7 @@ export const setIsLoggingVerbose =
         } catch (e) {
             logger.error(
                 'Failed to enable verbose logging to nRF Util modules.',
-                e
+                e,
             );
         }
         persistIsLoggingVerbose(enable);

package/src/Log/syncLogToStore.ts

@@ -27,7 +27,7 @@ export default (dispatch: AppDispatch) => {
     const LOG_UPDATE_INTERVAL = 400;
     const logListener = setInterval(
         addLogEntriesToStore(dispatch),
-        LOG_UPDATE_INTERVAL
+        LOG_UPDATE_INTERVAL,
     );
 
     return () => {

package/src/MasonryLayout/MasonryLayout.tsx

@@ -72,7 +72,7 @@ const Fillers = ({
                         width: `${width / columns}px`,
                     }}
                 />
-            ) : null
+            ) : null,
         )}
     </>
 );
@@ -185,7 +185,7 @@ export default ({
                 columnHeights: heights,
                 columns: Math.min(
                     metaData.hiddenChildren.filter(v => !v).length,
-                    col
+                    col,
                 ),
                 maxColums: col,
                 hiddenChildren: metaData.hiddenChildren,
@@ -197,7 +197,7 @@ export default ({
                 current.clientWidth >= minWidth
                     ? Math.floor(
                           current.clientWidth /
-                              (minWidth + Number.parseInt(styles.margin, 10))
+                              (minWidth + Number.parseInt(styles.margin, 10)),
                       )
                     : 1;
 
@@ -224,8 +224,10 @@ export default ({
         });
 
         return () => {
-            current && observer.unobserve(current);
-            current && mutationObserver.disconnect();
+            if (current) {
+                observer.unobserve(current);
+                mutationObserver.disconnect();
+            }
         };
     }, [columns, maxHeight, minWidth]);
 
@@ -242,7 +244,7 @@ export default ({
                     columns={columns}
                     minWidth={Math.min(
                         minWidth,
-                        masonryLayoutRef.current?.clientWidth ?? minWidth
+                        masonryLayoutRef.current?.clientWidth ?? minWidth,
                     )}
                     orders={orders}
                 >

package/src/NavBar/NavMenuItem.tsx

@@ -27,7 +27,7 @@ const NavMenuItem: FC<Props> = ({ isSelected, label, disabled }) => {
             className={classNames(
                 'core19-nav-menu-item',
                 isSelected && 'selected',
-                'mr-4'
+                'mr-4',
             )}
             onClick={() => dispatch(setCurrentPane(label))}
             disabled={disabled}