Wiki X Contributor (WXC)

Explore and analyze Wikimedia contributors and their activity across all projects.

Wiki X Contributor is a modern web dashboard that lets anyone look up a Wikimedia contributor by username and instantly visualize their editing history, project contributions, and activity patterns across Wikipedia, Wikidata, Commons, and all Wikimedia projects.

---

🎯 Purpose

The Wikimedia ecosystem has hundreds of thousands of contributors editing across dozens of projects. Understanding a contributor's impact — how many edits they've made, which projects they're active on, and how their activity has changed over time — is difficult to piece together from raw wiki pages.

Wiki X Contributor solves this by pulling data from the Wikimedia APIs and presenting it in a clean, visual dashboard that anyone can use — whether you're a community organizer reviewing contributor activity, a researcher studying editing patterns, or a contributor exploring your own history.

✨ Features

• 🔍 Smart Search — Autocomplete-powered username search with live suggestions from the Wikimedia API
• 📊 Rich Visualizations — Edits over time charts, per-project breakdowns, and activity heatmaps
• 📋 Contributor Profiles — Registration date, total edits, active projects, and membership duration
• 📁 Project Breakdown — Detailed table of contributions across all Wikimedia projects
• 🏆 Top Contributions — See the most-edited pages for any contributor
• 📥 Export — Download the entire dashboard as a PNG image with one click
• 🌗 Dark & Light Mode — Full theme support with system preference detection
• 🌐 Multilingual — Language selection in settings
• 📱 Responsive — Works seamlessly on desktop, tablet, and mobile
• ⚡ Offline Detection — Banner notification when internet connection is lost

📖 How to Use

1. Search for a contributor — Type any Wikimedia username in the search bar at the top. Autocomplete suggestions will appear as you type.
2. Select a user — Click a suggestion or press Enter to load their profile.
3. Explore the dashboard — Once loaded, you'll see:
   • Header — Username, registration date, membership duration, and active project count
   • Stats cards — Total edits, active projects, and top project at a glance
   • Edits over time — A line chart showing monthly editing activity
   • Project breakdown — A bar chart and table showing contributions per Wikimedia project
   • Activity heatmap — A GitHub-style heatmap of daily editing activity
   • Top contributions — The pages the contributor has edited the most
4. Filter results — Use the date range and project filters to narrow the data
5. Export — Click the Export button to download the entire dashboard as a PNG image
6. Settings — Click the ⚙️ gear icon to switch between dark/light mode or change language

🛠️ Tech Stack

Layer	Technology
Framework	React 18 + TypeScript
Build Tool	Vite 5
Styling	Tailwind CSS 3
UI Components	shadcn/ui (Radix primitives)
Charts	Recharts
Data Fetching	TanStack React Query
Routing	React Router v6
API	Wikimedia REST & Action APIs

🚀 Getting Started

Prerequisites

• Node.js 18+ or Bun

Installation

# Clone the repository
git clone <repository-url>
cd wiki-x-contributor

# Install dependencies
npm install    # or: bun install

# Start the development server
npm run dev    # or: bun dev

The app will be available at http://localhost:5173.

Build for Production

npm run build
npm run preview

📂 Project Structure

src/
├── components/           # UI components
│   ├── ui/               # shadcn/ui primitives
│   ├── TopNavbar.tsx      # Navigation bar with search autocomplete
│   ├── ContributorHeader.tsx  # User profile header
│   ├── StatsCards.tsx     # Summary stat cards
│   ├── Charts.tsx         # Edits over time & project breakdown charts
│   ├── ActivityHeatmap.tsx    # GitHub-style activity heatmap
│   ├── ProjectsTable.tsx  # Detailed project contribution table
│   ├── TopContributions.tsx   # Most-edited pages list
│   ├── DashboardFilters.tsx   # Date range, project filter, export
│   └── WelcomeState.tsx   # Landing state before search
├── hooks/
│   ├── useContributorData.ts    # Data fetching & transformation
│   └── useContributorContext.tsx # Global username state
├── lib/
│   └── wikimedia-api.ts   # Wikimedia API integration
├── pages/
│   ├── Index.tsx          # Main dashboard page
│   └── Settings.tsx       # Theme & language settings
└── main.tsx

🌐 APIs Used

Wiki X Contributor uses the following public Wikimedia APIs (no authentication required):

• CentralAuth — Global user info and merged accounts across all wikis
• MediaWiki Action API — User contributions and edit history
• All Users API — Username autocomplete suggestions

📄 License

This project is open source under the MIT License.

---

Built with ❤️ for the Wikimedia community.