@wf-financing/ui 1.3.2 → 1.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wf-financing/ui",
-  "version": "1.3.2",
+  "version": "1.4.0",
   "exports": {
     ".": {
       "import": "./dist/index.es.js",
@@ -37,7 +37,7 @@
     "react-aria": "^3.41.1",
     "react-intl": "^6.2.5",
     "styled-components": "^6.1.19",
-    "@wf-financing/embedded-types": "0.2.6"
+    "@wf-financing/embedded-types": "0.3.0"
   },
   "peerDependencies": {
     "@wayflyer/flyui": "202.1.0"

package/src/api/dismissCta.ts

@@ -0,0 +1,11 @@
+import { MockedModeType } from '@wf-financing/embedded-types';
+
+import { getHeadlessSdkInstance } from './getHeadlessSdkInstance';
+
+export const dismissCta = async (companyToken: string, mockedMode?: MockedModeType) => {
+  const sdk = await getHeadlessSdkInstance(companyToken, mockedMode);
+
+  if (!mockedMode) {
+    await sdk.dismissCta();
+  }
+};

package/src/api/index.ts

@@ -0,0 +1,4 @@
+export { dismissCta } from './dismissCta';
+export { fetchCtaBanner } from './ctaBanner';
+export { startHostedApplication } from './startHostedApplication';
+export { continueHostedApplication } from './continueHostedApplication';

package/src/components/banner/CloseButton.tsx

@@ -1,13 +1,23 @@
 import { Button, Flex } from '@wayflyer/flyui';
 import { IconX16Line } from '@wayflyer/flyui-icons/16/line';
 
-import { usePartnerContext } from '../../hooks';
+import { usePartnerContext, useDismissCta } from '../../hooks';
 
 export const CloseButton = () => {
   const { onWidgetClose: closeWidget } = usePartnerContext();
+  const dismissCta = useDismissCta();
+
+  const handleCloseWidget = () => {
+    closeWidget();
+    dismissCta.mutate(undefined, {
+      onError: (error) => {
+        console.error('Failed to dismiss CTA', error);
+      },
+    });
+  };
 
   return (
-    <Button onClick={closeWidget} variant="Tertiary">
+    <Button onClick={handleCloseWidget} variant="Tertiary">
       <Flex padding="2">
         <IconX16Line />
       </Flex>

package/src/hooks/index.ts

@@ -3,4 +3,5 @@ export { useCtaBanner } from './useCtaBanner';
 export { useStartHostedApplication } from './useStartHostedApplication';
 export { useDetectSmallScreen } from './useDetectSmallScreen';
 export { useContinueHostedApplication } from './useContinueHostedApplication';
+export { useDismissCta } from './useDismissCta';
 export { useRemoveInerted } from './useRemoveInerted';

package/src/hooks/useContinueHostedApplication.ts

@@ -1,6 +1,6 @@
 import { useMutation } from '@tanstack/react-query';
 
-import { continueHostedApplication } from '../api/continueHostedApplication';
+import { continueHostedApplication } from '../api';
 import { usePartnerContext } from './usePartnerContext';
 
 export const useContinueHostedApplication = () => {

package/src/hooks/useCtaBanner.ts

@@ -1,6 +1,6 @@
 import { useQuery } from '@tanstack/react-query';
 
-import { fetchCtaBanner } from '../api/ctaBanner';
+import { fetchCtaBanner } from '../api';
 import { usePartnerContext } from './usePartnerContext';
 
 export const useCtaBanner = () => {

package/src/hooks/useDismissCta.ts

@@ -0,0 +1,12 @@
+import { useMutation } from '@tanstack/react-query';
+
+import { dismissCta } from '../api';
+import { usePartnerContext } from './usePartnerContext';
+
+export const useDismissCta = () => {
+  const { companyToken, mockedMode } = usePartnerContext();
+
+  return useMutation({
+    mutationFn: () => dismissCta(companyToken, mockedMode),
+  });
+};

package/src/hooks/useStartHostedApplication.ts

@@ -1,6 +1,6 @@
 import { useMutation } from '@tanstack/react-query';
 
-import { startHostedApplication } from '../api/startHostedApplication';
+import { startHostedApplication } from '../api';
 import { usePartnerContext } from './usePartnerContext';
 
 export const useStartHostedApplication = () => {