Added data-action tracking to all the login buttons

Author: samejr

apps/webapp/app/routes/login._index/route.tsx

@@ -67,12 +67,22 @@ export default function LoginPage() {
             <Fieldset>
               <div className="flex flex-col gap-y-2">
                 {data.showGithubAuth && (
-                  <Button type="submit" variant="primary/large" fullWidth>
+                  <Button
+                    type="submit"
+                    variant="primary/large"
+                    fullWidth
+                    data-action="continue with github"
+                  >
                     <NamedIcon name={"github"} className={"mr-1.5 h-4 w-4"} />
                     Continue with GitHub
                   </Button>
                 )}
-                <LinkButton to="/login/magic" variant="secondary/large" fullWidth>
+                <LinkButton
+                  to="/login/magic"
+                  variant="secondary/large"
+                  fullWidth
+                  data-action="continue with email"
+                >
                   <NamedIcon
                     name={"envelope"}
                     className={"mr-1.5 h-4 w-4 text-dimmed transition group-hover:text-bright"}

apps/webapp/app/routes/login.magic/route.tsx

@@ -101,12 +101,17 @@ export default function LoginMagicLinkPage() {
                         variant="tertiary/small"
                         LeadingIcon="arrow-left"
                         leadingIconClassName="text-dimmed group-hover:text-bright transition"
+                        data-action="re-enter email"
                       >
                         Re-enter email
                       </Button>
                     }
                     confirmButton={
-                      <LinkButton to="/login" variant="tertiary/small">
+                      <LinkButton
+                        to="/login"
+                        variant="tertiary/small"
+                        data-action="log in using another option"
+                      >
                         Log in using another option
                       </LinkButton>
                     }
@@ -139,6 +144,7 @@ export default function LoginMagicLinkPage() {
                     variant="primary/medium"
                     disabled={isLoading}
                     fullWidth
+                    data-action="send a magic link"
                   >
                     <NamedIcon
                       name={isLoading ? "spinner-white" : "envelope"}
@@ -164,6 +170,7 @@ export default function LoginMagicLinkPage() {
                   variant={"tertiary/small"}
                   LeadingIcon={"arrow-left"}
                   leadingIconClassName="text-dimmed group-hover:text-bright transition"
+                  data-action="all login options"
                 >
                   All login options
                 </LinkButton>