Wes/oauth start

docs/APIDOCUMENTATION.md

@@ -188,6 +188,28 @@
 
 ---
 
+#### oAuthStart({ member })
+
+<details>
+ <summary>Called when a user clicks an oauth login button</summary>
+
+##### Parameters
+
+> | name     | type     | data type | description |
+> | -------- | -------- | --------- | ----------- |
+> | `member` | required | object    |             |
+
+##### Responses
+
+> | http code | content-type       | response                                                                   |
+> | --------- | ------------------ | -------------------------------------------------------------------------- |
+> | `200`     | `application/json` | `{}`                                                                       |
+> | `40#`     | `application/json` | `{"response": {"status": 40#, "data": { "message": "Test message here"}}}` |
+
+</details>
+
+---
+
 #### createSupportTicket(ticket)
 
 <details>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mxenabled/connect-widget",
   "description": "A simple ui library for React",
-  "version": "0.15.5",
+  "version": "0.0.0-semantic-release",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
   "type": "module",

src/const/apiProviderMock.ts

@@ -20,6 +20,7 @@ export const apiValue: ApiContextTypes = {
   loadInstitutions: () => Promise.resolve(SEARCHED_INSTITUTIONS),
   loadPopularInstitutions: () => Promise.resolve(FAVORITE_INSTITUTIONS),
   loadInstitutionByGuid: () => Promise.resolve(institutionData.institution),
+  oAuthStart: () => Promise.resolve(),
   updateMFA: () => Promise.resolve(member.member),
   loadJob: () => Promise.resolve(JOB_DATA),
   runJob: () => Promise.resolve(member.member),

src/context/ApiContext.tsx

@@ -61,6 +61,7 @@ export type ApiContextTypes = {
     memberGuid: string,
     config: ClientConfigType,
   ) => Promise<OAuthWindowURIResponseType>
+  oAuthStart?: ({ member }: { member: object }) => Promise<void>
   //MFA
   updateMFA: (
     member: object,
@@ -119,6 +120,7 @@ export const defaultApiValue: ApiContextTypes = {
   loadOAuthState: () => Promise.resolve({} as OAuthStateResponseType),
   loadOAuthStates: () => Promise.resolve([] as OAuthStateResponseType[]),
   getOAuthWindowURI: () => Promise.resolve({} as OAuthWindowURIResponseType),
+  oAuthStart: () => Promise.resolve(),
   // Support
   createSupportTicket: () => Promise.resolve(),
   //Job

src/utilities/testingLibrary.tsx

@@ -11,12 +11,13 @@ import { WidgetDimensionObserver } from 'src/components/app/WidgetDimensionObser
 import { PostMessageContext } from 'src/ConnectWidget'
 import { AnalyticContext } from 'src/Connect'
 import { initialState } from 'src/services/mockedData'
-import { ApiProvider } from 'src/context/ApiContext'
-import { apiValue } from 'src/const/apiProviderMock'
+import { ApiContextTypes, ApiProvider } from 'src/context/ApiContext'
+import { apiValue as apiValueMock } from 'src/const/apiProviderMock'
 
 // This type interface extends the default options for render from RTL, as well
 // as allows the user to specify other things such as initialState, store.
 interface ExtendedRenderOptions extends Omit<RenderOptions, 'queries'> {
+  apiValue?: ApiContextTypes
   onAnalyticsEvent?: () => void
   preloadedState?: Partial<RootState>
   store?: AppStore
@@ -32,10 +33,12 @@ interface ExtendedRenderOptions extends Omit<RenderOptions, 'queries'> {
   If you want to include global redux store.
 */
 export const AllTheProviders = ({
+  apiValue = apiValueMock,
   children,
   onAnalyticsEvent = () => {},
   store,
 }: {
+  apiValue?: ApiContextTypes
   children: React.ReactNode
   onAnalyticsEvent?: () => void
   store: AppStore
@@ -63,6 +66,7 @@ export const AllTheProviders = ({
 const renderWithUser = (
   ui: ReactElement,
   {
+    apiValue = apiValueMock,
     preloadedState = initialState,
     store = createReduxStore(preloadedState),
     onAnalyticsEvent,
@@ -72,7 +76,12 @@ const renderWithUser = (
   return {
     ...render(ui, {
       wrapper: (props) => (
-        <AllTheProviders onAnalyticsEvent={onAnalyticsEvent} store={store} {...props} />
+        <AllTheProviders
+          apiValue={apiValue}
+          onAnalyticsEvent={onAnalyticsEvent}
+          store={store}
+          {...props}
+        />
       ),
       ...options,
     }),

src/views/oauth/OAuthDefault.js

@@ -19,8 +19,11 @@ import { getDelay } from 'src/utilities/getDelay'
 import useAnalyticsPath from 'src/hooks/useAnalyticsPath'
 import useAnalyticsEvent from 'src/hooks/useAnalyticsEvent'
 import { AnalyticEvents, PageviewInfo } from 'src/const/Analytics'
+import { useApi } from 'src/context/ApiContext'
 
 export const OAuthDefault = (props) => {
+  const { api } = useApi()
+
   useAnalyticsPath(...PageviewInfo.CONNECT_OAUTH_INSTRUCTIONS, {
     institution_guid: props.institution.guid,
     institution_name: props.institution.name,
@@ -72,8 +75,11 @@ export const OAuthDefault = (props) => {
               institution_guid: props.institution.guid,
               institution_name: props.institution.name,
               member_guid: sha256(props.currentMember.guid),
-              rawInstitution: props.institution,
             })
+            api?.oAuthStart({
+              member: props.currentMember,
+            })
+
             props.onSignInClick()
           }}
           role="link"

src/views/oauth/__tests__/OAuthDefault-test.tsx

@@ -5,14 +5,16 @@ import { expect, vi } from 'vitest'
 import userEvent from '@testing-library/user-event'
 import { AnalyticEvents, defaultEventMetadata } from 'src/const/Analytics'
 import { sha256 } from 'js-sha256'
+import { ApiContextTypes } from 'src/context/ApiContext'
 
 describe('<OAuthDefault />', () => {
-  it('sends an analytics event onClick and calls onSignInClick', async () => {
+  it('sends an analytics event onClick, calls oAuthStart, and calls onSignInClick', async () => {
     const onSignInClick = vi.fn()
 
     const onAnalyticsEvent = vi.fn()
 
     const institution = { guid: 'testGuid', name: 'testName', testProp: 'testValue' }
+    const member = { guid: 'testGuid' }
 
     const store = createTestReduxStore({
       connect: {
@@ -21,15 +23,20 @@ describe('<OAuthDefault />', () => {
       },
     })
 
+    const apiValue = {
+      oAuthStart: vi.fn(),
+    } as unknown as ApiContextTypes
+
     render(
       <OAuthDefault
-        currentMember={{ guid: 'testGuid' }}
+        currentMember={member}
         institution={institution}
         onSignInClick={onSignInClick}
         selectedInstructionalData={{}}
         setIsLeavingUrl={() => {}}
       />,
       {
+        apiValue,
         onAnalyticsEvent,
         store,
       },
@@ -46,9 +53,11 @@ describe('<OAuthDefault />', () => {
         institution_guid: institution.guid,
         institution_name: institution.name,
         member_guid: sha256(institution.guid),
-        rawInstitution: institution,
         widgetType: defaultEventMetadata.widgetType,
       }),
     )
+    expect(apiValue.oAuthStart).toHaveBeenCalledWith({
+      member,
+    })
   })
 })