feat: GitHub Login

[johnnyhuy]

PR Type

Enhancement, Tests, Documentation

---

Description

• Added GitHub authentication provider to the SignInPage component in the frontend.
• Implemented GitHub authentication logic in the backend, including OAuth provider factory and signInResolver.
• Created tests for GitHub authentication flow, mocking GitHub OAuth endpoints and verifying the auth process.
• Added example configurations for GitHub authentication in both development and production environments.
• Documented authentication strategies, including GitHub and Guest, with configuration examples and additional scopes.
• Updated dependencies to support GitHub authentication and testing.

---

Changes walkthrough 📝

	Relevant files
Enhancement	App.tsx Add GitHub authentication provider to SignInPage component packages/app/src/App.tsx Added GitHub authentication provider to the SignInPage component. Imported githubAuthApiRef from @backstage/core-plugin-api. +16/-1    auth.ts Implement GitHub authentication logic in backend                  packages/backend/src/auth.ts Implemented GitHub authentication logic. Created githubAuth module with OAuth provider factory. Added signInResolver to handle GitHub user data. +54/-0    index.ts Integrate GitHub authentication module into backend            packages/backend/src/index.ts Added githubAuth module to backend initialization. +2/-1
Tests	auth.test.ts Add tests for GitHub authentication flow                                  packages/backend/src/auth.test.ts Created tests for GitHub authentication flow. Mocked GitHub OAuth endpoints using msw. Implemented test to complete GitHub auth flow. +100/-0
Configuration changes	app-config.example.yaml Add example GitHub auth configuration for development        app-config.example.yaml Added example configuration for GitHub authentication in development mode. +17/-0    app-config.production.yaml Add GitHub auth configuration for production                          app-config.production.yaml Added configuration for GitHub authentication in production mode. +10/-0
Documentation	auth.md Document GitHub and Guest authentication strategies            docs/auth.md Documented authentication strategies including GitHub and Guest. Provided configuration examples and additional scopes for GitHub auth. +110/-0
Dependencies	package.json Update dependencies for GitHub authentication and testing packages/backend/package.json Added new dependencies for GitHub authentication and testing. +9/-2

---

💡 PR-Agent usage:
Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

[echohello-codium-ai-pr-agent]

PR Review 🔍

⏱️ Estimated effort to review [1-5]	3, because the PR involves multiple files across the frontend and backend, including authentication logic, tests, and configuration changes. The complexity of OAuth integration and the need to ensure security and functionality in authentication flows require careful review.
🧪 Relevant tests	Yes
⚡ Possible issues	Possible Bug: The signInResolver in 'packages/backend/src/auth.ts' throws an error if the username is not found in the profile. This could be problematic if the GitHub profile does not include a username, leading to failed authentication attempts.
	Security Concern: Ensure that the client secrets and tokens are securely handled and not exposed in logs or error messages.
🔒 Security concerns	No

[echohello-codium-ai-pr-agent]

PR Code Suggestions ✨

Category	Suggestion	Score
Security	Use environment variables for sensitive configuration data to enhance security and flexibility Consider using environment variables for sensitive data such as clientId and clientSecret in the GitHub authentication configuration to enhance security and make the configuration more flexible across different environments. packages/backend/src/auth.ts [57-60] -clientId: 'github-client-id', -clientSecret: 'github-client-secret', +clientId: process.env.GITHUB_CLIENT_ID, +clientSecret: process.env.GITHUB_CLIENT_SECRET, Suggestion importance[1-10]: 10 Why: Using environment variables for sensitive data is a best practice for security and flexibility, making this suggestion highly valuable.	10
Possible issue	Add error handling for external HTTP requests in the authentication flow tests It's recommended to handle potential exceptions when performing HTTP requests to external services. This can be done by wrapping the request in a try-catch block to ensure that any network or parsing errors are gracefully handled. packages/backend/src/auth.test.ts [79-82] -const startResponse = await request(server) - .get('/api/auth/github/start?env=development') - .expect(302); +let startResponse; +try { + startResponse = await request(server) + .get('/api/auth/github/start?env=development') + .expect(302); +} catch (error) { + console.error('Failed to start GitHub auth flow:', error); +} Suggestion importance[1-10]: 9 Why: Adding error handling for external HTTP requests is crucial for robustness and reliability, especially in tests that depend on external services.	9
Enhancement	Enhance the robustness of the username existence check in the GitHub authentication module To ensure that the username is always present in the fullProfile, consider adding a more specific check for its existence or a default value. This can prevent runtime errors if the username is unexpectedly missing. packages/backend/src/auth.ts [32-33] -if (!result.fullProfile.username) { +if (!result.fullProfile?.username) { throw new Error('Username not found in profile'); } Suggestion importance[1-10]: 8 Why: Enhancing the robustness of the username existence check is important to prevent potential runtime errors, making the code more reliable.	8
Best practice	Improve type safety by specifying a type for the props parameter in the SignInPage component Consider using a more specific type for the props parameter in the SignInPage component to ensure type safety and better developer experience. TypeScript can help catch type-related errors at compile time, improving the reliability of the code. packages/app/src/App.tsx [67-81] -SignInPage: props => ( +SignInPage: (props: SignInProps) => ( <SignInPage {...props} auto providers={[ 'guest', { id: 'github-auth-provider', title: 'GitHub', message: 'Sign in using GitHub', apiRef: githubAuthApiRef, }, ]} /> ), Suggestion importance[1-10]: 7 Why: Specifying a type for the props parameter improves type safety and developer experience, but it is a minor enhancement rather than a critical fix.	7