"join group" => "follow"

web/components/groups/groups-button.tsx

@@ -107,7 +107,7 @@ export function JoinOrLeaveGroupButton(props: {
         onClick={firebaseLogin}
         className={clsx('btn btn-sm', small && smallStyle, className)}
       >
-        Login to Join
+        Login to follow
       </button>
     )
   }
@@ -132,7 +132,7 @@ export function JoinOrLeaveGroupButton(props: {
         )}
         onClick={withTracking(onLeaveGroup, 'leave group')}
       >
-        Leave
+        Unfollow
       </button>
     )
   }
@@ -144,7 +144,7 @@ export function JoinOrLeaveGroupButton(props: {
       className={clsx('btn btn-sm', small && smallStyle, className)}
       onClick={withTracking(onJoinGroup, 'join group')}
     >
-      Join
+      Follow
     </button>
   )
 }

web/pages/group/[...slugs]/index.tsx

@@ -52,6 +52,7 @@ import { Post } from 'common/post'
 import { Spacer } from 'web/components/layout/spacer'
 import { usePost } from 'web/hooks/use-post'
 import { useAdmin } from 'web/hooks/use-admin'
+import { track } from '@amplitude/analytics-browser'
 
 export const getStaticProps = fromPropz(getStaticPropz)
 export async function getStaticPropz(props: { params: { slugs: string[] } }) {
@@ -659,22 +660,25 @@ function JoinGroupButton(props: {
   user: User | null | undefined
 }) {
   const { group, user } = props
-  function addUserToGroup() {
-    if (user) {
-      toast.promise(joinGroup(group, user.id), {
-        loading: 'Joining group...',
-        success: 'Joined group!',
-        error: "Couldn't join group, try again?",
-      })
-    }
+
+  const follow = async () => {
+    track('join group')
+    const userId = user ? user.id : (await firebaseLogin()).user.uid
+
+    toast.promise(joinGroup(group, userId), {
+      loading: 'Following group...',
+      success: 'Followed',
+      error: "Couldn't follow group, try again?",
+    })
   }
+
   return (
     <div>
       <button
-        onClick={user ? addUserToGroup : firebaseLogin}
+        onClick={follow}
         className={'btn-md btn-outline btn whitespace-nowrap normal-case'}
       >
-        {user ? 'Join group' : 'Login to join group'}
+        Follow
       </button>
     </div>
   )