Fix frontend tests for GitHub token documentation changes

frontend/__tests__/routes/settings.test.tsx

@@ -95,7 +95,10 @@ describe("Settings Screen", () => {
 
       await waitFor(() => {
         screen.getByTestId("github-token-input");
-        screen.getByTestId("github-token-help-anchor");
+        // Check for GitHub link instead of the help anchor
+        screen.getByRole("link", { name: "GitHub" });
+        // Check for documentation link
+        screen.getByRole("link", { name: "documentation" });
         screen.getByTestId("language-input");
         screen.getByTestId("enable-analytics-switch");
       });
@@ -237,10 +240,12 @@ describe("Settings Screen", () => {
 
       await waitFor(() => {
         const input = screen.queryByTestId("github-token-input");
-        const helpAnchor = screen.queryByTestId("github-token-help-anchor");
+        const githubLink = screen.queryByText("GitHub");
+        const documentationLink = screen.queryByText("documentation");
 
         expect(input).not.toBeInTheDocument();
-        expect(helpAnchor).not.toBeInTheDocument();
+        expect(githubLink).not.toBeInTheDocument();
+        expect(documentationLink).not.toBeInTheDocument();
       });
     });
 

frontend/src/routes/account-settings.tsx

@@ -410,12 +410,31 @@ function AccountSettings() {
                   placeholder={isGitHubTokenSet ? "**********" : ""}
                 />
 
-                <HelpLink
+                <p className="text-xs">
-                  testId="github-token-help-anchor"
+                  Generate a token on{" "}
-                  text="Get your token"
+                  <b>
-                  linkText="here"
+                    <a
-                  href="https://github.com/settings/tokens/new?description=openhands-app&scopes=repo,user,workflow"
+                      href="https://github.com/settings/tokens/new?description=openhands-app&scopes=repo,user,workflow"
-                />
+                      target="_blank"
+                      className="underline underline-offset-2"
+                      rel="noopener noreferrer"
+                    >
+                      GitHub
+                    </a>{" "}
+                  </b>
+                  or see the{" "}
+                  <b>
+                    <a
+                      href="https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token"
+                      target="_blank"
+                      className="underline underline-offset-2"
+                      rel="noopener noreferrer"
+                    >
+                      documentation
+                    </a>
+                  </b>
+                  .
+                </p>
               </>
             )}