ref: Update TOS to work for service less users.

src/App.jsx

@@ -25,6 +25,7 @@
 const PullRequestPage = lazy(() => import('./pages/PullRequestPage'))
 const RepoPage = lazy(() => import('./pages/RepoPage'))
 const SyncProviderPage = lazy(() => import('./pages/SyncProviderPage'))
+const TermsOfService = lazy(() => import('pages/TermsOfService'))
 
 const HomePageRedirect = () => {
   const { provider } = useParams()
@@ -60,6 +61,11 @@
         <SyncProviderPage />
       </BaseLayout>
     </SentryRoute>
+    <SentryRoute path="/terms" exact>
+      <BaseLayout>
+        <TermsOfService />
+      </BaseLayout>
+    </SentryRoute>
     {config.IS_SELF_HOSTED && (
       <SentryRoute path="/admin/:provider">
         <BaseLayout>

src/App.spec.jsx

@@ -276,6 +276,16 @@ describe('App', () => {
         },
       },
     ],
+    [
+      {
+        testLabel: 'TOSPage',
+        pathname: '/terms',
+        expected: {
+          page: /TermsOfService/i,
+          location: '/terms',
+        },
+      },
+    ],
   ]
 
   describe.each(cloudFullRouterCases)(

src/layouts/BaseLayout/BaseLayout.jsx

@@ -17,7 +17,6 @@
 const LimitedHeader = lazy(() => import('layouts/LimitedHeader'))
 const DefaultOrgSelector = lazy(() => import('pages/DefaultOrgSelector'))
 const InstallationHelpBanner = lazy(() => import('./InstallationHelpBanner'))
-const TermsOfService = lazy(() => import('pages/TermsOfService'))
 
 const FullPageLoader = () => (
   <div className="mt-16 flex flex-1 items-center justify-center">
@@ -36,11 +35,7 @@
   const { isImpersonating } = useImpersonate()
 
   if (showAgreeToTerms && !isFullExperience) {
-    return (
-      <Suspense fallback={null}>
-        <TermsOfService />
-      </Suspense>
-    )
+    return <Redirect to="/terms" />
   }
 
   if (redirectToSyncPage && !isFullExperience) {

src/layouts/BaseLayout/BaseLayout.spec.jsx

@@ -17,7 +17,6 @@ jest.mock('services/impersonate')
 jest.mock('shared/featureFlags')
 jest.mock('shared/GlobalTopBanners', () => () => 'GlobalTopBanners')
 jest.mock('./InstallationHelpBanner', () => () => 'InstallationHelpBanner')
-jest.mock('pages/TermsOfService', () => () => 'TermsOfService')
 jest.mock('pages/DefaultOrgSelector', () => () => 'DefaultOrgSelector')
 
 const mockOwner = {
@@ -167,9 +166,6 @@ describe('BaseLayout', () => {
       graphql.query('Seats', (_, res, ctx) =>
         res(ctx.status(200), ctx.data({}))
       ),
-      graphql.query('TermsOfService', (_, res, ctx) =>
-        res(ctx.status(200), ctx.data({}))
-      ),
       graphql.query('UseMyOrganizations', (_, res, ctx) =>
         res(
           ctx.status(200),
@@ -218,9 +214,6 @@ describe('BaseLayout', () => {
 
         const defaultOrg = screen.queryByText(/DefaultOrgSelector/)
         expect(defaultOrg).not.toBeInTheDocument()
-
-        const termsOfService = screen.queryByText(/TermsOfService/)
-        expect(termsOfService).not.toBeInTheDocument()
       })
     })
 
@@ -239,9 +232,6 @@ describe('BaseLayout', () => {
 
         const defaultOrg = screen.queryByText(/DefaultOrgSelector/)
         expect(defaultOrg).not.toBeInTheDocument()
-
-        const termsOfService = screen.queryByText(/TermsOfService/)
-        expect(termsOfService).not.toBeInTheDocument()
       })
     })
 
@@ -261,22 +251,7 @@ describe('BaseLayout', () => {
 
         const defaultOrg = screen.queryByText(/DefaultOrgSelector/)
         expect(defaultOrg).not.toBeInTheDocument()
-
-        const termsOfService = screen.queryByText(/TermsOfService/)
-        expect(termsOfService).not.toBeInTheDocument()
-      })
-    })
-
-    it(`renders the ${expectedPage}`, async () => {
-      setup({ termsOfServicePage: true, currentUser: loggedInUser })
-
-      render(<BaseLayout>hello</BaseLayout>, {
-        wrapper: wrapper(),
       })
-
-      expect(await screen.findByText(expectedMatcher)).toBeTruthy()
-      const tos = screen.getByText(expectedMatcher)
-      expect(tos).toBeInTheDocument()
     })
   })
 
@@ -308,6 +283,23 @@ describe('BaseLayout', () => {
     })
   })
 
+  describe('user has not accepted terms of service', () => {
+    it('redirects the user to /terms', async () => {
+      setup({
+        termsOfServicePage: true,
+        internalUser: {
+          termsAgreement: false,
+        },
+      })
+
+      render(<BaseLayout>hello</BaseLayout>, {
+        wrapper: wrapper(),
+      })
+
+      await waitFor(() => expect(testLocation.pathname).toBe('/terms'))
+    })
+  })
+
   describe('user has not synced with providers', () => {
     it('redirects the user to /sync', async () => {
       setup({

src/layouts/BaseLayout/hooks/useUserAccessGate.js

@@ -79,7 +79,7 @@
     !isGuest &&
     !config.IS_SELF_HOSTED
   ) {
-    showAgreeToTerms = userData?.termsAgreement === false
+    showAgreeToTerms = internalUser?.termsAgreement === false
   }
 
   const onSyncPage = currentRoute.path === '/sync'

src/layouts/BaseLayout/hooks/useUserAccessGate.spec.tsx

@@ -160,6 +160,30 @@ const internalUserHasSyncedProviders = {
   ],
 }
 
+const internalUserWithSignedTOS = {
+  email: userSignedInIdentity.email,
+  name: userSignedInIdentity.name,
+  externalId: '123',
+  owners: [
+    {
+      service: 'github',
+    },
+  ],
+  termsAgreement: true,
+}
+
+const internalUserWithUnsignedTOS = {
+  email: userSignedInIdentity.email,
+  name: userSignedInIdentity.name,
+  externalId: '123',
+  owners: [
+    {
+      service: 'github',
+    },
+  ],
+  termsAgreement: false,
+}
+
 type InternalUser =
   | typeof internalUserNoSyncedProviders
   | typeof internalUserHasSyncedProviders
@@ -249,7 +273,7 @@ describe('useUserAccessGate', () => {
       'signed TOS',
       {
         user: loggedInUser,
-        internalUser: internalUserHasSyncedProviders,
+        internalUser: internalUserWithSignedTOS,
         termsOfServicePage: true,
         isSelfHosted: false,
         defaultOrgSelectorPage: false,
@@ -361,7 +385,7 @@ describe('useUserAccessGate', () => {
       'unsigned TOS',
       {
         user: loggedInUnsignedUser,
-        internalUser: internalUserHasSyncedProviders,
+        internalUser: internalUserWithUnsignedTOS,
         termsOfServicePage: true,
         isSelfHosted: false,
         defaultOrgSelectorPage: false,

src/pages/TermsOfService/TermsOfService.jsx

@@ -1,11 +1,15 @@
 import { zodResolver } from '@hookform/resolvers/zod'
+import gt from 'lodash/gt'
 import PropType from 'prop-types'
 import { useEffect } from 'react'
 import { useForm } from 'react-hook-form'
+import { Redirect } from 'react-router-dom'
 import { z } from 'zod'
 
 import umbrellaSvg from 'assets/svg/umbrella.svg'
-import { useUser } from 'services/user'
+import { useInternalUser } from 'services/user'
+import { useFlags } from 'shared/featureFlags'
+import { loginProviderToShortName } from 'shared/utils/loginProviders'
 import A from 'ui/A'
 import Button from 'ui/Button'
 import TextInput from 'ui/TextInput'
@@ -18,8 +22,8 @@
   tos: z.literal(true),
 })
 
-function isDisabled({ isValid, isDirty }) {
-  return (!isValid && isDirty) || !isDirty
+function isDisabled({ isValid, isDirty, isMutationLoading }) {
+  return (!isValid && isDirty) || !isDirty || isMutationLoading
 }
 
 function EmailInput({ register, marketingEmailMessage, showEmailRequired }) {
@@ -61,7 +65,7 @@
       resolver: zodResolver(FormSchema),
       mode: 'onChange',
     })
-  const { mutate } = useSaveTermsAgreement({
+  const { mutate, isLoading: isMutationLoading } = useSaveTermsAgreement({
     onSuccess: ({ data }) => {
       if (data?.saveTermsAgreement?.error) {
         setError('apiError', data?.saveTermsAgreement?.error)
@@ -70,12 +74,18 @@
     },
     onError: (error) => setError('apiError', error),
   })
-  const { data: currentUser, isLoading: userIsLoading } = useUser()
+  const { data: currentUser, isLoading: userIsLoading } = useInternalUser()
+  const hasSynced = gt(currentUser?.owners?.length, 0)
+
+  const { termsOfServicePage } = useFlags({
+    termsOfServicePage: false,
+  })
 
   const onSubmit = (data) => {
     mutate({
       businessEmail: data?.marketingEmail || currentUser?.email,
       termsAgreement: true,
+      marketingConsent: data?.marketingConsent,
     })
   }
 
@@ -93,6 +103,18 @@
 
   if (userIsLoading) return null
 
+  if (!termsOfServicePage || currentUser?.termsAgreement) {
+    if (hasSynced) {
+      const service = currentUser?.owners?.[0]?.service
+      const owner = currentUser?.owners?.[0]?.username
+      if (service) {
+        const provider = loginProviderToShortName(service)
+        return <Redirect to={`/${provider}/${owner}`} />
+      }
+    }
+    return <Redirect to="/sync" />
+  }
+
   return (
     <div className="mx-auto w-full max-w-[38rem] text-sm text-ds-gray-octonary">
       <div className="mt-14 flex gap-2">
@@ -177,7 +199,7 @@
         )}
         <div className="mt-3 flex justify-end">
           <Button
-            disabled={isDisabled(formState)}
+            disabled={isDisabled(formState, isMutationLoading)}
             type="submit"
             hook="user signed tos"
           >