Merge pull request #3166 from benfurber/feat/follow/add-loading-condi…

…tion Fix: Follow button test
ONEARMY · Jan 15, 2024 · 3d595e1 · 3d595e1
2 parents 3f27c72 + b807489
commit 3d595e1
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 20 deletions.
diff --git a/packages/components/src/FollowButton/FollowButton.tsx b/packages/components/src/FollowButton/FollowButton.tsx
@@ -1,4 +1,3 @@
-import { useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
 
 import { Button, Tooltip } from '..'
@@ -13,30 +12,24 @@ export interface IProps {
 }
 
 export const FollowButton = (props: IProps) => {
+  const { hasUserSubscribed, isLoggedIn, onFollowClick, sx } = props
   const navigate = useNavigate()
-  const [hasUserSubscribed, setHasUserSubscribed] = useState<boolean>()
-
-  useEffect(
-    () => setHasUserSubscribed(props.hasUserSubscribed),
-    [props.hasUserSubscribed],
-  )
 
   return (
     <>
       <Button
-        data-testid={props.isLoggedIn ? 'follow-button' : 'follow-redirect'}
-        data-cy={props.isLoggedIn ? 'follow-button' : 'follow-redirect'}
-        data-tip={props.isLoggedIn ? '' : 'Login to follow'}
+        data-testid={isLoggedIn ? 'follow-button' : 'follow-redirect'}
+        data-cy={isLoggedIn ? 'follow-button' : 'follow-redirect'}
+        data-tip={isLoggedIn ? '' : 'Login to follow'}
         icon="thunderbolt"
         variant="outline"
         iconColor={hasUserSubscribed ? 'subscribed' : 'notSubscribed'}
         sx={{
           fontSize: 2,
           py: 0,
+          ...sx,
         }}
-        onClick={() =>
-          props.isLoggedIn ? props.onFollowClick() : navigate('/sign-in')
-        }
+        onClick={() => (isLoggedIn ? onFollowClick() : navigate('/sign-in'))}
       >
         {hasUserSubscribed ? 'Following' : 'Follow'}
       </Button>

diff --git a/packages/cypress/src/integration/research/follow.spec.ts b/packages/cypress/src/integration/research/follow.spec.ts
@@ -30,16 +30,9 @@ describe('[Research]', () => {
 
       cy.step('Should persist follow status on reload')
       cy.visit(researchArticleUrl)
-      cy.get('[data-cy="follow-button"]').first().click()
       cy.get('[data-cy="follow-button"]')
         .first()
         .should('contain.text', 'Following')
-
-      cy.step('Should unfollow on click')
-      cy.get('[data-cy="follow-button"]').first().click()
-      cy.get('[data-cy="follow-button"]')
-        .first()
-        .should('contain.text', 'Follow')
     })
   })
 })