# GitHub Actions Radar

A web application that displays GitHub Actions workflow runs across multiple repositories and organizations in a unified dashboard.

## Features

- 📊 **Unified Dashboard**: View workflow runs from multiple repositories in one place
- 🔍 **Filtering**: Filter by status (success, failure, in progress) and repository
- 📈 **Statistics**: Overview of total runs, success rate, and current activity
- 🔄 **Real-time Updates**: Refresh workflow run data with a single click
- 🎨 **Clean UI**: Modern, responsive interface with status indicators
- ⚙️ **Easy Configuration**: Simple setup for GitHub tokens and repositories

## Setup

### Prerequisites

- Node.js (v16 or higher)
- npm or yarn
- GitHub Personal Access Token

### Installation

1. Clone the repository:
```bash
git clone <repository-url>
cd radar
```

2. Install dependencies:
```bash
npm install
```

3. Start the development server:
```bash
npm run dev
```

4. Open your browser to `http://localhost:3000`

### Configuration

1. **Create configuration file**: Copy `config.example.json` to `config.json`
2. **GitHub Token Setup**:
   - Go to [GitHub Settings > Developer settings > Personal access tokens](https://github.com/settings/tokens)
   - Click "Generate new token (classic)"
   - Give it a descriptive name like "GitHub Actions Radar"
   - Select the following permissions:
     - `repo` (Full control of private repositories)
     - `actions:read` (Read access to actions and workflows)
   - Click "Generate token"
   - Copy the token and paste it in `config.json`
3. **Add repositories**: List the repositories you want to monitor in the `repositories` array
4. **Configure cache (optional)**: Set cache timeout in minutes (defaults to 5 minutes if not specified)

Example `config.json`:
```json
{
  "github": {
    "token": "ghp_your_github_token_here",
    "repositories": [
      {
        "owner": "facebook",
        "name": "react"
      },
      {
        "owner": "your-org",
        "name": "your-repo"
      }
    ]
  },
  "server": {
    "port": 3001,
    "host": "0.0.0.0"
  },
  "cache": {
    "timeoutMinutes": 5
  }
}
```

## Usage

### Dashboard Features

- **Status Cards**: Quick overview of total runs, successes, failures, and in-progress workflows
- **Filters**: Use the dropdown filters to focus on specific statuses or repositories
- **Workflow Cards**: Each card shows:
  - Repository name and run number
  - Branch and commit information
  - Actor (who triggered the run)
  - Time since the run started
  - Direct link to GitHub

### Refresh Data

Click the "Refresh" button to fetch the latest workflow runs from all configured repositories.

### Update Configuration

To update your configuration:
1. Edit the `config.json` file
2. Restart the application (the server will automatically reload the configuration)

## Development

### Available Scripts

- `npm run dev` - Start development server (both frontend and backend)
- `npm run server` - Start backend server only
- `npm run build` - Build for production
- `npm run lint` - Run ESLint
- `npm run preview` - Preview production build

### Project Structure

```
src/
├── components/
│   ├── Dashboard.tsx          # Main dashboard component
│   └── CompactWorkflowCard.tsx # Compact workflow run display
├── services/
│   └── api.ts                 # Backend API client
├── types/
│   └── github.ts              # TypeScript interfaces
├── App.tsx                    # Main application component
└── main.tsx                   # Application entry point

server/
├── config.ts                  # Configuration loading
├── github.ts                  # GitHub API integration
└── index.ts                   # Express server
```

### Technology Stack

- **React** - Frontend framework
- **TypeScript** - Type safety
- **Tailwind CSS** - Styling
- **Vite** - Build tool and dev server
- **Express** - Backend server
- **Axios** - HTTP client
- **date-fns** - Date formatting
- **Lucide React** - Icons

## Security

- GitHub tokens are stored in server-side configuration file
- Tokens are only used for API calls to GitHub
- No data is sent to external servers
- All communication is directly with GitHub's API
- Configuration file is excluded from version control

## Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Run tests and linting
5. Submit a pull request

## License

MIT License - see LICENSE file for details