Add utilsProvider to storybook

Author: Kubit

src/hooks/useInput/__tests__/useInput.test.ts

@@ -1,14 +1,15 @@
 import { act, renderHook } from '@testing-library/react-hooks';
 import React, { ChangeEvent } from 'react';
 
+import { FormatNumber } from '@/components';
 import * as validationsProvider from '@/provider/validations/validationsProvider';
 
 import { useInput } from '../useInput';
 
 describe('useInput Hook', () => {
   it('useInput - on internal change should call parent onChange', () => {
     const onChange = jest.fn();
-    const formatNumber = { style: 'decimal' };
+    const formatNumber = { style: 'decimal' } as FormatNumber;
     const ref = React.createRef<HTMLInputElement | undefined>();
     const currentValue = '123234';
     const regex = new RegExp('^[0-9]*$');
@@ -43,7 +44,7 @@ describe('useInput Hook', () => {
   });
   it('useInput - on internal blur should call parent onBlur', () => {
     const onBlur = jest.fn();
-    const formatNumber = { style: 'decimal' };
+    const formatNumber = { style: 'decimal' } as FormatNumber;
     const { result } = renderHook(() => useInput({ onBlur, formatNumber }));
 
     act(() => {

src/storybook/index.ts

@@ -1 +1,2 @@
 export * from './components';
+export * from './provider/utilsProvider/utilsProvider';

src/storybook/provider/utilsProvider/utilsProvider.tsx

@@ -0,0 +1,91 @@
+import React from 'react';
+
+import { UtilsProvider } from '@/provider';
+import { DateFormatOptions } from '@/provider/utils/types';
+import { FormatWeekdayOptionType } from '@/types';
+import {
+  formatDate,
+  getAddDays,
+  getAddMonths,
+  getAddYears,
+  getAllMonthNames,
+  getAllWeekdayNames,
+  getSubDays,
+  getSubMonths,
+  getSubYears,
+  isAfter,
+  isBefore,
+  isDatesEqual,
+  transformDate,
+} from '@/utils/date';
+
+//delete on kubit
+const folder = {
+  santander: 'santander',
+  modelbank: 'mb',
+  santander_black: 'santander',
+  modelbank_cc: 'mb',
+  santander_cc: 'santander',
+};
+//delete on kubit
+
+export const UtilsProviderDocStorybook = ({
+  children,
+  theme,
+}: {
+  children: JSX.Element;
+  theme: string;
+}): JSX.Element => {
+  return (
+    <UtilsProvider
+      assets={{
+        baseHost: `https://assets.dev.openbank.com/web/${folder[theme]}/icons/`,
+        iconsBaseHost: `https://assets.dev.openbank.com/web/${folder[theme]}/icons/`,
+        illutrationsBaseHost: `https://assets.dev.openbank.com/web/${folder[theme]}/illustrations/`,
+      }}
+      dateHelpers={{
+        isAfter: (date1: Date, date2: Date) => {
+          return isAfter(date1, date2);
+        },
+        isBefore: (date1: Date, date2: Date) => {
+          return isBefore(date1, date2);
+        },
+        isDatesEqual: (firsDate: string | number | Date, secondDate: string | number | Date) => {
+          return isDatesEqual(firsDate, secondDate);
+        },
+        getAddDays: (date: Date, days: number) => {
+          return getAddDays(date, days);
+        },
+        getAddMonths: (date: Date, months: number) => {
+          return getAddMonths(date, months);
+        },
+        getAddYears: (date: Date, years: number) => {
+          return getAddYears(date, years);
+        },
+        getSubDays: (date: Date, days: number) => {
+          return getSubDays(date, days);
+        },
+        getSubMonths: (date: Date, months: number) => {
+          return getSubMonths(date, months);
+        },
+        getSubYears: (date: Date, years: number) => {
+          return getSubYears(date, years);
+        },
+        getAllMonthName: () => {
+          return getAllMonthNames();
+        },
+        getAllWeekdayName: (weekdayFormat: FormatWeekdayOptionType, isSundayFirst: boolean) => {
+          return getAllWeekdayNames(weekdayFormat, isSundayFirst);
+        },
+      }}
+      formatDate={(date: Date, format: string | DateFormatOptions) => {
+        return formatDate(date, format);
+      }}
+      transformDate={(date: string | number, format: string | undefined) => {
+        return transformDate(date, format);
+      }}
+    >
+      {children}
+    </UtilsProvider>
+  );
+};