Automate Chrome Web Store publishing (#10)

* Add OAuth token refresh utility

- Create helper script to simplify getting GitHub refresh tokens
- Update release workflow to use semantic versioning
- Improve options page styling and token setup flow

* Tighten README and update storage docs

Condensed README sections to be more skimmable - the accessibility
and setup sections were way too verbose. Also updated storage capacity
from 100 to 2000 items throughout docs and config since we increased
that limit.

Added note about NPM registry communication in privacy policy since
that's not obvious to users.

* Add OAuth script to gitignore

* Remove unnecessary web_accessible_resources from manifest

Author: jonmartin721

.github/workflows/release.yml

@@ -52,7 +52,8 @@ jobs:
             icons \
             shared \
             LICENSE \
-            README.md
+            README.md \
+            CHANGELOG.md
 
       - name: Create Release
         uses: softprops/action-gh-release@v2
@@ -61,3 +62,13 @@ jobs:
           generate_release_notes: true
           draft: false
           prerelease: false
+
+      - name: Publish to Chrome Web Store
+        uses: mnao305/chrome-extension-upload@v5.0.0
+        with:
+          file-path: devwatch-github-v${{ steps.get_version.outputs.VERSION }}.zip
+          extension-id: ${{ secrets.CHROME_EXTENSION_ID }}
+          client-id: ${{ secrets.CHROME_CLIENT_ID }}
+          client-secret: ${{ secrets.CHROME_CLIENT_SECRET }}
+          refresh-token: ${{ secrets.CHROME_REFRESH_TOKEN }}
+          publish: true

.gitignore

@@ -6,6 +6,8 @@ dist/
 *.zip
 temp-package/
 .env
+client_secret*.json
+scripts/get-refresh-token.js
 .vscode/
 *.crx
 *.pem

CONTRIBUTING.md

@@ -77,6 +77,7 @@ Only maintainers can create releases. If you're a maintainer, follow this proces
    - Run all tests
    - Build the extension
    - Create a GitHub release with the zip file
+   - Automatically publish to Chrome Web Store
 
 ### Version Guidelines
 

PRIVACY.md

@@ -29,7 +29,7 @@ GitHub Devwatch collects and stores the following data **locally on your device
    - Synced across your Chrome browsers if you're signed into Chrome
 
 4. **Activity Data**
-   - Recent activity from your watched repositories (last 100 items)
+   - Recent activity from your watched repositories (up to 2000 items)
    - Cached locally for offline viewing
    - Automatically cleaned up when storage limits are approached
 
@@ -68,13 +68,22 @@ This extension communicates with GitHub's API (api.github.com) to fetch reposito
 - GitHub's privacy policy and terms of service apply to these interactions
 - See GitHub's privacy policy at: https://docs.github.com/en/site-policy/privacy-policies/github-privacy-statement
 
+### NPM Registry (Optional)
+
+When you add a repository by NPM package name, the extension communicates with the NPM registry (registry.npmjs.org):
+
+- This is entirely optional and only happens when you use the "Add by NPM package" feature
+- Used to look up the GitHub repository associated with an NPM package
+- No authentication or personal data is sent to NPM
+- NPM's privacy policy applies to these interactions
+
 ### No Other Third Parties
 
 GitHub Devwatch does **NOT**:
 - Use advertising networks
 - Use analytics services
 - Connect to any servers we operate
-- Share data with any third-party services
+- Share data with any other third-party services
 
 ## Permissions Explained
 

README.md

@@ -2,7 +2,7 @@
 
 Track GitHub activity across multiple repos. Get notifications for new PRs, issues, and releases without constantly refreshing.
 
-[![Chrome Web Store](https://img.shields.io/badge/Chrome-Web_Store-green?logo=google-chrome)](https://chrome.google.com/webstore)
+[![Chrome Web Store](https://img.shields.io/badge/Chrome-Web_Store-green?logo=google-chrome)](https://chromewebstore.google.com/detail/github-devwatch/dbgjgcaphfcfgppicmbiafcgcabikjch)
 [![License](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
 [![CI](https://github.com/jonmartin721/devwatch-github/workflows/CI/badge.svg)](https://github.com/jonmartin721/devwatch-github/actions)
 [![codecov](https://codecov.io/gh/jonmartin721/devwatch-github/branch/main/graph/badge.svg)](https://codecov.io/gh/jonmartin721/devwatch-github)
@@ -25,11 +25,13 @@ Track GitHub activity across multiple repos. Get notifications for new PRs, issu
 
 ### From Chrome Web Store (Recommended)
 
-1. Visit the Chrome Web Store (coming soon)
+1. Visit the [Chrome Web Store](https://chromewebstore.google.com/detail/github-devwatch/dbgjgcaphfcfgppicmbiafcgcabikjch)
 2. Click "Add to Chrome"
 3. Grant permissions when prompted
 4. Follow the guided setup wizard on first launch
 
+**GitHub Token Permissions**: You'll need a [Personal Access Token](https://github.com/settings/tokens/new) with `repo` (for private repos) or `public_repo` (for public only).
+
 ### Manual Installation (For Development)
 
 1. Clone this repository
@@ -49,19 +51,16 @@ cd devwatch-github
 ## Quick Setup
 
 ### First-Time Setup
-When you first install the extension, an **interactive setup wizard** guides you through:
 
-1. **Welcome** - Overview of features and capabilities
-2. **GitHub Token** - Create and validate your personal access token with step-by-step instructions
-3. **Add Repositories** - Select which repositories to monitor
-4. **Activity Preferences** - Choose which types of activity to track (PRs, Issues, Releases)
-5. **Done!** - Start monitoring immediately
+An interactive wizard guides you through:
+1. Create a GitHub token
+2. Add repositories to watch
+3. Choose activity types (PRs, Issues, Releases)
 
-The entire setup takes about 2 minutes and requires no prior configuration knowledge.
+Takes about 2 minutes. No configuration knowledge needed.
 
 <div align="center">
   <img src="screenshots/onboarding-welcome.png" alt="Interactive setup wizard welcome screen" width="500">
-  <br><em>Interactive setup wizard guides you through configuration</em>
 </div>
 
 ### Ongoing Use
@@ -74,25 +73,13 @@ The entire setup takes about 2 minutes and requires no prior configuration knowl
 ## How to Use
 
 ### Popup Interface
-- **Tabs**: Filter between All/PRs/Issues/Releases
-- **Search**: Filter activities by keyword
-- **Refresh**: Manually check for new activity
-- **Archive**: View previously read activities
-- **Activity Items**: Click to open in GitHub
+Filter by type (All/PRs/Issues/Releases), search activities, refresh manually, or browse the archive. Click any item to open in GitHub.
 
 ### Settings Page
-- **GitHub Token**: Secure storage of your personal access token
-- **Watched Repositories**: Add/remove repositories, import from GitHub
-- **Activity Filters**: Choose what types of activity to monitor
-- **Feed Management**: Control how long items are stored (up to 2000 items, optional time-based expiry)
-- **Check Interval**: Configure how often to check for updates
-- **Notifications**: Toggle browser notifications on/off
-- **Theme**: Choose dark, light, or system theme
-- **Backup/Restore**: Export and import your settings
+Manage your GitHub token, watched repositories, activity filters, check interval, notifications, and theme. Export/import settings for backup.
 
 <div align="center">
   <img src="screenshots/settings-page.png" alt="Settings page for configuring repositories" width="600">
-  <br><em>Settings page with repository management</em>
 </div>
 
 ## Typical Workflow
@@ -110,39 +97,19 @@ The extension keeps up to 2000 items in your local history, so you can always ch
 
 ## Accessibility
 
-GitHub Devwatch is built with accessibility in mind to ensure everyone can use it effectively:
-
-### WCAG 2.1 Level A Compliance
-- **Form Labels**: All form inputs have proper visible labels for screen readers
-- **Keyboard Navigation**: Full keyboard support with intuitive shortcuts
-- **Focus Management**: Proper focus indicators and logical tab order
-- **ARIA Landmarks**: Semantic HTML with proper ARIA roles and labels
-- **Screen Reader Support**: Descriptive labels and live region announcements
-
-### Keyboard Shortcuts
-- **R** - Refresh activity
-- **S** - Toggle search
-- **A** - Toggle archive view
-- **Escape** - Close modals and search
-- **Arrow Keys** - Navigate between filter tabs
-- **Enter/Space** - Activate buttons and links
+Full WCAG 2.1 Level A compliance with keyboard navigation, screen reader support, and ARIA landmarks.
 
-### Testing & Validation
-- Automated accessibility testing with axe-core
-- Manual testing with NVDA and JAWS screen readers
-- Keyboard-only navigation verified
-- Focus trap implementation in modals
+**Keyboard Shortcuts**: R (refresh), S (search), A (archive), Escape (close), Arrow keys (navigate tabs)
 
-For accessibility issues or suggestions, please [open an issue](https://github.com/jonmartin721/devwatch-github/issues).
+Tested with NVDA/JAWS screen readers and axe-core. [Report accessibility issues](https://github.com/jonmartin721/devwatch-github/issues).
 
 ## Privacy & Security
 
-Your GitHub token is encrypted and stays securely on your machine. The extension only communicates with GitHub's API - no analytics, no tracking, no third-party services.
+Your GitHub token is encrypted and stays on your machine. The extension only communicates with GitHub's API - no analytics, no tracking, no third-party services.
 
-- **Encrypted Storage** - Tokens are encrypted using industry-standard AES-GCM encryption and stored locally in Chrome's secure storage with session caching for optimal performance
-- **Local Storage Only** - All data stays on your machine, never sent to third-party servers
-- **API-Only Communication** - Only talks to GitHub's official API
-- **No Third Parties** - Zero external servers or analytics services
+- **Encrypted Storage** - Tokens use AES-GCM encryption in Chrome's secure storage
+- **Local Only** - All data stays on your machine, never sent to third parties
+- **GitHub API Only** - No external servers or analytics services
 - **Minimal Permissions** - Token used exclusively for fetching repository activity
 - **Open Source** - Review the entire codebase, raise issues, or submit fixes
 
@@ -225,14 +192,13 @@ Contributions welcome! Submit issues or pull requests. See [CONTRIBUTING.md](CON
 
 ## Roadmap
 
-Features I'm considering (no promises on timeline - this is a side project):
+This is a side project for me, so I work on it when time allows - but I'd love to see contributions! Here are some features I'm considering:
 - **Comment notifications** - Track new comments on issues and PRs
 - **Mention tracking** - Get notified when you're mentioned
 - **Multiple GitHub accounts** - Switch between different accounts
-- **Custom notification filters** - Advanced filtering rules
+- **GitHub OAuth** - Simplified authentication with one-click login
 - **Internationalization** - Support for multiple languages
 - **Dashboard view** - Full-page dashboard for all activity
-- **Integration with other platforms** - GitLab, Bitbucket support
 
 If any of these sound useful, open an issue or submit a PR!
 

options/options.css

@@ -1309,6 +1309,35 @@ body.dark-mode .notification-toggle input:checked + .toggle-slider {
   font-weight: 600;
 }
 
+.changelog-footer {
+  margin-top: 20px;
+  padding-top: 16px;
+  border-top: 1px solid var(--border-color);
+  text-align: center;
+}
+
+.changelog-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  color: var(--link-color);
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+  padding: 8px 16px;
+  border-radius: 8px;
+  transition: all 0.2s ease;
+}
+
+.changelog-link:hover {
+  background: var(--bg-secondary);
+  text-decoration: none;
+}
+
+.changelog-link svg {
+  flex-shrink: 0;
+}
+
 .help-footer {
   margin-top: 48px;
   padding-top: 24px;

options/options.js

@@ -1059,7 +1059,19 @@ async function loadVersionAndChangelog() {
 
     const changelogContent = document.getElementById('changelogContent');
     if (changelogContent) {
-      changelogContent.innerHTML = changelogHtml;
+      changelogContent.innerHTML = changelogHtml + `
+        <div class="changelog-footer">
+          <a href="https://github.com/jonmartin721/devwatch-github/blob/main/CHANGELOG.md"
+             target="_blank"
+             rel="noopener noreferrer"
+             class="changelog-link">
+            <svg width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
+              <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
+            </svg>
+            View full changelog on GitHub
+          </a>
+        </div>
+      `;
     }
   } catch (error) {
     console.error('Error loading version/changelog:', error);

package-lock.json

@@ -28,7 +28,7 @@ export const RATE_LIMIT_CONFIG = {
 // Storage Configuration
 export const STORAGE_CONFIG = {
   MAX_WATCHED_REPOS: 50,
-  MAX_ACTIVITIES_STORED: 100,
+  MAX_ACTIVITIES_STORED: 2000,
   MAX_STORAGE_SIZE: 1024 * 1024, // 1MB
   CLEANUP_DAYS: 30, // days to keep old data
   STORAGE_QUOTA_CHECK_INTERVAL: 10000 // 10 seconds

shared/config.js

@@ -5,6 +5,7 @@
 
 import { getSyncItems, getLocalItems } from './storage-helpers.js';
 import { STORAGE_KEYS, STORAGE_DEFAULTS } from './storage-helpers.js';
+import { STORAGE_CONFIG } from './config.js';
 
 /**
  * Centralized state manager with reactive updates
@@ -277,9 +278,8 @@ class StateManager {
     const currentActivities = this.getState('allActivities');
     const newActivities = [...activities, ...currentActivities];
 
-    // Keep only the most recent activities (2000 limit to stay under Chrome storage quota)
-    const maxActivities = 2000;
-    const trimmedActivities = newActivities.slice(0, maxActivities);
+    // Keep only the most recent activities to stay under Chrome storage quota
+    const trimmedActivities = newActivities.slice(0, STORAGE_CONFIG.MAX_ACTIVITIES_STORED);
 
     await this.setState({ allActivities: trimmedActivities });
   }