fix(ConfigProvider): exclude prop with undefined value (#6044)

VKCOM · Oct 24, 2023 · b32712f · b32712f
1 parent 9abc817
commit b32712f
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 3 deletions.
diff --git a/packages/vkui/src/components/ConfigProvider/ConfigProvider.test.tsx b/packages/vkui/src/components/ConfigProvider/ConfigProvider.test.tsx
@@ -66,6 +66,7 @@ describe('ConfigProvider', () => {
     });
     it('convert WebviewType.VKAPPS to hasCustomPanelHeaderAfter={true}', () => {
       const config = {
+        platform: undefined,
         appearance: Appearance.LIGHT,
         webviewType: WebviewType.VKAPPS,
         transitionMotionEnabled: false,

diff --git a/packages/vkui/src/components/ConfigProvider/ConfigProvider.tsx b/packages/vkui/src/components/ConfigProvider/ConfigProvider.tsx
@@ -6,7 +6,11 @@ import { useObjectMemo } from '../../hooks/useObjectMemo';
 import { useDOM } from '../../lib/dom';
 import { TokensClassProvider } from '../../lib/tokensClassProvider';
 import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
-import { addClassNameToElement, removeClassNameFromElement } from '../../lib/utils';
+import {
+  addClassNameToElement,
+  excludeKeysWithUndefined,
+  removeClassNameFromElement,
+} from '../../lib/utils';
 import { warnOnce } from '../../lib/warnOnce';
 import {
   ConfigProviderContext,
@@ -32,7 +36,8 @@ export interface ConfigProviderProps extends Partial<ConfigProviderContextInterf
 /**
  * @see https://vkcom.github.io/VKUI/#/ConfigProvider
  */
-export const ConfigProvider = (props: ConfigProviderProps) => {
+export const ConfigProvider = (propsRaw: ConfigProviderProps) => {
+  const props = excludeKeysWithUndefined(propsRaw);
   const parentConfig = useConfigProvider();
 
   const {

diff --git a/packages/vkui/src/lib/utils.test.ts b/packages/vkui/src/lib/utils.test.ts
@@ -1,4 +1,8 @@
-import { addClassNameToElement, removeClassNameFromElement } from './utils';
+import {
+  addClassNameToElement,
+  excludeKeysWithUndefined,
+  removeClassNameFromElement,
+} from './utils';
 
 describe('addClassNameToElement', () => {
   test('adds className to element', () => {
@@ -47,3 +51,12 @@ describe('removeClassNameFromElement', () => {
     expect(div.getAttribute('class')).toEqual('');
   });
 });
+
+describe(excludeKeysWithUndefined, () => {
+  test('should exclude keys with undefined ', () => {
+    expect(excludeKeysWithUndefined({})).toEqual({});
+    expect(excludeKeysWithUndefined({ key1: 1 })).toEqual({ key1: 1 });
+    expect(excludeKeysWithUndefined({ key1: 1, key2: undefined })).toEqual({ key1: 1 });
+    expect(excludeKeysWithUndefined({ key1: 1, key2: null, key3: undefined })).toEqual({ key1: 1, key2: null }); // prettier-ignore
+  });
+});
diff --git a/packages/vkui/src/lib/utils.ts b/packages/vkui/src/lib/utils.ts
@@ -73,3 +73,19 @@ export function removeClassNameFromElement(element: HTMLElement, classNameToRemo
 
   element.setAttribute('class', classNamesArray.join(' '));
 }
+
+type ExcludeKeysWithUndefined<T> = {
+  [P in keyof T]?: Exclude<T[P], undefined>;
+};
+
+export const excludeKeysWithUndefined = <T extends Record<string | number | symbol, any>>(
+  obj: T,
+): ExcludeKeysWithUndefined<T> => {
+  const filteredObj: ExcludeKeysWithUndefined<T> = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key) && obj[key] !== undefined) {
+      filteredObj[key] = obj[key];
+    }
+  }
+  return filteredObj;
+};