Refactor styles for dark mode support across components and update RE… #141
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Build and Release | |
| on: | |
| push: | |
| branches: [ main ] | |
| pull_request: | |
| branches: [ main ] | |
| release: | |
| types: [ published ] | |
| env: | |
| REGISTRY: ghcr.io | |
| IMAGE_NAME: ${{ github.repository }} | |
| jobs: | |
| test-frontend: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v4 | |
| - name: Set up Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| cache-dependency-path: frontend/package-lock.json | |
| - name: Install frontend dependencies | |
| working-directory: ./frontend | |
| run: npm ci | |
| - name: Run frontend linting | |
| working-directory: ./frontend | |
| run: npm run lint | |
| - name: Run frontend type checking | |
| working-directory: ./frontend | |
| run: npm run type-check | |
| - name: Build frontend | |
| working-directory: ./frontend | |
| run: npm run build | |
| test-backend: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v4 | |
| - name: Set up Go | |
| uses: actions/setup-go@v4 | |
| with: | |
| go-version: '1.24' | |
| cache-dependency-path: backend/go.sum | |
| - name: Install backend dependencies | |
| working-directory: ./backend | |
| run: go mod download | |
| - name: Run backend tests | |
| working-directory: ./backend | |
| run: go test ./... | |
| - name: Run backend linting | |
| working-directory: ./backend | |
| run: | | |
| go fmt ./... | |
| go vet ./... | |
| - name: Build backend | |
| working-directory: ./backend | |
| run: go build -o tsflow-backend ./main.go | |
| build-and-push: | |
| runs-on: ubuntu-latest | |
| needs: [test-frontend, test-backend] | |
| permissions: | |
| contents: read | |
| packages: write | |
| id-token: write | |
| attestations: write | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v4 | |
| - name: Set up Docker Buildx | |
| uses: docker/setup-buildx-action@v3 | |
| - name: Convert repository name to lowercase | |
| run: | | |
| echo "IMAGE_NAME_LOWER=${GITHUB_REPOSITORY,,}" >> ${GITHUB_ENV} | |
| - name: Log in to Container Registry | |
| if: github.event_name != 'pull_request' | |
| uses: docker/login-action@v3 | |
| with: | |
| registry: ${{ env.REGISTRY }} | |
| username: ${{ github.actor }} | |
| password: ${{ secrets.GH_TOKEN }} | |
| - name: Extract metadata | |
| id: meta | |
| uses: docker/metadata-action@v5 | |
| with: | |
| images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME_LOWER }} | |
| tags: | | |
| type=ref,event=branch | |
| type=ref,event=pr | |
| type=sha | |
| type=semver,pattern={{version}} | |
| type=semver,pattern={{major}}.{{minor}} | |
| type=semver,pattern=v{{version}} | |
| type=semver,pattern=v{{major}}.{{minor}} | |
| type=raw,value=latest,enable={{is_default_branch}} | |
| - name: Build and push Docker image | |
| id: build | |
| uses: docker/build-push-action@v5 | |
| with: | |
| context: . | |
| platforms: linux/amd64,linux/arm64 | |
| push: ${{ github.event_name != 'pull_request' }} | |
| tags: ${{ steps.meta.outputs.tags }} | |
| labels: ${{ steps.meta.outputs.labels }} | |
| cache-from: type=gha | |
| cache-to: type=gha,mode=max | |
| - name: Generate artifact attestation | |
| if: github.event_name != 'pull_request' | |
| uses: actions/attest-build-provenance@v1 | |
| with: | |
| subject-name: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME_LOWER }} | |
| subject-digest: ${{ steps.build.outputs.digest }} | |
| push-to-registry: true | |
| release: | |
| runs-on: ubuntu-latest | |
| needs: [build-and-push] | |
| if: github.event_name == 'release' | |
| permissions: | |
| contents: write | |
| steps: | |
| - name: Checkout repository | |
| uses: actions/checkout@v4 | |
| - name: Set up Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| cache-dependency-path: frontend/package-lock.json | |
| - name: Set up Go | |
| uses: actions/setup-go@v4 | |
| with: | |
| go-version: '1.24' | |
| cache-dependency-path: backend/go.sum | |
| - name: Build frontend | |
| working-directory: ./frontend | |
| run: | | |
| npm ci | |
| npm run build | |
| - name: Build backend binaries | |
| working-directory: ./backend | |
| run: | | |
| go mod download | |
| # Build for multiple platforms | |
| GOOS=linux GOARCH=amd64 go build -o ../dist/tsflow-linux-amd64 ./main.go | |
| GOOS=linux GOARCH=arm64 go build -o ../dist/tsflow-linux-arm64 ./main.go | |
| GOOS=darwin GOARCH=amd64 go build -o ../dist/tsflow-darwin-amd64 ./main.go | |
| GOOS=darwin GOARCH=arm64 go build -o ../dist/tsflow-darwin-arm64 ./main.go | |
| GOOS=windows GOARCH=amd64 go build -o ../dist/tsflow-windows-amd64.exe ./main.go | |
| - name: Create release archives | |
| run: | | |
| mkdir -p release | |
| # Create frontend build archive | |
| cd frontend | |
| tar -czf ../release/tsflow-frontend-${{ github.ref_name }}.tar.gz dist/ | |
| cd .. | |
| # Create combined archive with frontend + backend binaries | |
| mkdir -p tsflow-${{ github.ref_name }} | |
| cp -r frontend/dist tsflow-${{ github.ref_name }}/ | |
| cp -r dist/* tsflow-${{ github.ref_name }}/ | |
| cp docker-compose.yml tsflow-${{ github.ref_name }}/ | |
| cp README.md tsflow-${{ github.ref_name }}/ | |
| tar -czf release/tsflow-${{ github.ref_name }}.tar.gz tsflow-${{ github.ref_name }}/ | |
| # Generate checksums | |
| cd release | |
| sha256sum *.tar.gz > checksums.txt | |
| cd .. | |
| - name: Convert repository name to lowercase | |
| run: | | |
| echo "IMAGE_NAME_LOWER=${GITHUB_REPOSITORY,,}" >> ${GITHUB_ENV} | |
| - name: Upload release assets | |
| uses: softprops/action-gh-release@v1 | |
| with: | |
| files: | | |
| release/*.tar.gz | |
| release/checksums.txt | |
| body: | | |
| ## TSFlow ${{ github.ref_name }} | |
| A modern web application for visualizing and analyzing network traffic flows within Tailscale networks. | |
| ### 🐳 Docker Installation (Recommended) | |
| **Quick Start:** | |
| ```bash | |
| # Run with Docker | |
| docker run -d \ | |
| -p 8080:8080 \ | |
| -e TAILSCALE_API_KEY=your-api-key \ | |
| -e TAILSCALE_TAILNET=your-tailnet \ | |
| -e ENVIRONMENT=production \ | |
| --name tsflow \ | |
| ${{ env.REGISTRY }}/${{ env.IMAGE_NAME_LOWER }}:${{ github.ref_name }} | |
| ``` | |
| **Docker Compose:** | |
| ```bash | |
| # Download and extract release | |
| wget https://github.com/${{ github.repository }}/releases/download/${{ github.ref_name }}/tsflow-${{ github.ref_name }}.tar.gz | |
| tar -xzf tsflow-${{ github.ref_name }}.tar.gz | |
| cd tsflow-${{ github.ref_name }} | |
| # Edit docker-compose.yml with your credentials | |
| # Run with Docker Compose | |
| docker-compose up -d | |
| ``` | |
| ### 📦 Manual Installation | |
| **Binary Installation:** | |
| 1. Download the appropriate binary for your platform from the assets below | |
| 2. Download the frontend build: `tsflow-frontend-${{ github.ref_name }}.tar.gz` | |
| 3. Extract frontend: `tar -xzf tsflow-frontend-${{ github.ref_name }}.tar.gz` | |
| 4. Set environment variables (see `env.example`) | |
| 5. Run the binary: `./tsflow-<platform>` | |
| **Supported Platforms:** | |
| - Linux (amd64, arm64) | |
| - macOS (amd64, arm64) | |
| - Windows (amd64) | |
| ### 🛠 Development Setup | |
| ```bash | |
| git clone https://github.com/${{ github.repository }}.git | |
| cd tsflow | |
| # Backend | |
| cd backend && go mod download && go run main.go & | |
| # Frontend | |
| cd frontend && npm install && npm run build | |
| ``` | |
| ### 📋 What's Included | |
| - **Go Backend**: High-performance API server with Tailscale integration | |
| - **React Frontend**: Modern web interface with real-time visualization | |
| - **Docker Support**: Production-ready containerization | |
| - **Multi-platform Binaries**: Native builds for all major platforms | |
| ### 🚀 Features | |
| - Real-time network topology visualization | |
| - Comprehensive traffic analytics and filtering | |
| - Device management and monitoring | |
| - No CORS issues (backend handles all API calls) | |
| - Production-ready architecture | |
| draft: false | |
| prerelease: false | |
| env: | |
| GH_TOKEN: ${{ secrets.GH_TOKEN }} |