Skip to content

Implement OAuth2 authentication and base UI components for LeetHub 3.0#100

Open
akashsingh062 wants to merge 1 commit into
raphaelheinz:mainfrom
akashsingh062:main
Open

Implement OAuth2 authentication and base UI components for LeetHub 3.0#100
akashsingh062 wants to merge 1 commit into
raphaelheinz:mainfrom
akashsingh062:main

Conversation

@akashsingh062

Copy link
Copy Markdown

Pull Request: Porting Premium Features, PAT Auth, Dynamic Manual Sync & Modern UI Redesign

Summary

This Pull Request introduces significant enhancements, modern UI updates, and stability improvements to the extension. It ports critical features including Personal Access Token (PAT) authentication, a dynamic manual sync button inside LeetCode, background fetch proxy to bypass CORS, and complete removal of jQuery and Semantic UI dependencies in favor of clean vanilla CSS and JavaScript.

All storage keys (leethub_token, leethub_hook, etc.) and event variables are fully compatible and backward-compliant with the original repository codebase.


Key Features & Changes

1. 🔑 Personal Access Token (PAT) Authentication

  • Added a connect option on the options popup allowing users to authenticate via GitHub Personal Access Tokens (PAT) with the repo scope.
  • Provides a frictionless onboarding experience for users who do not wish to register a custom OAuth App.

2. ⚡ Dynamic Manual Sync Button (LeetCode Integration)

  • Injects a sleek manual sync button next to the bookmark icon (with a console submit button fallback).
  • Interactive States: Displays live status indicators (spinning blue loader during sync, green checkmark for success, red cross for error).
  • File Version Suffixes: Right-clicking the button opens a prompt allowing users to append a custom suffix to the file name (e.g. -dfs, -bfs) to support saving multiple solutions for the same problem.

3. 🛡️ Background Proxy fetching (CORS Resolve)

  • Configured a new background service worker message handler (crossFetch) in background.js to proxy GitHub API requests and token generation.
  • Resolves MV3 CORS blocks when calling APIs from content script injection contexts.

4. ⚙️ Automated Env Configurations

  • Added setup-env.js script to manage OAuth App client configurations.
  • Running npm run setup automatically builds .env and .env.example templates and patches client credentials into the source files.

5. 🎨 Modern UI Redesign & Cleanups

  • Dependency Removal: Completely removed Semantic UI and jQuery dependencies from popup and welcome templates. The extension now utilizes lightweight, native DOM selectors.
  • Glassmorphic Aesthetics: Modern dark variables, animated toggle switches, custom variable pills, and accordion animations have been added.
  • Custom Commit Messages: Users can customize their commit messages using dynamic pills ({time}, {space}, {date}, {problemName}, {difficulty}, {language}, and {problemTopic}).

📈 Testing & Verification

  • Checked with npm run format and npm run lint.
  • The codebase compiles with zero console exceptions, syntax errors, or warning traces.
Screenshot 2026-06-22 152638 Screenshot 2026-06-22 152728 Screenshot 2026-06-22 152843 Screenshot 2026-06-22 152857

@akashsingh062

Copy link
Copy Markdown
Author
Screenshot 2026-06-22 153759 Screenshot 2026-06-22 153825

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant