{"id":29964954,"url":"https://github.com/franc-dev/donate-artist","last_synced_at":"2025-09-25T18:22:50.994Z","repository":{"id":307308959,"uuid":"1029052667","full_name":"Franc-dev/donate-artist","owner":"Franc-dev","description":null,"archived":false,"fork":false,"pushed_at":"2025-07-30T14:23:52.000Z","size":157,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-30T16:43:00.265Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://donate-artist.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Franc-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-30T13:00:36.000Z","updated_at":"2025-07-30T14:23:56.000Z","dependencies_parsed_at":"2025-07-30T16:43:03.168Z","dependency_job_id":"5044ed70-d126-458b-841c-64dccfa78d03","html_url":"https://github.com/Franc-dev/donate-artist","commit_stats":null,"previous_names":["franc-dev/donate-artist"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/Franc-dev/donate-artist","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Franc-dev%2Fdonate-artist","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Franc-dev%2Fdonate-artist/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Franc-dev%2Fdonate-artist/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Franc-dev%2Fdonate-artist/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Franc-dev","download_url":"https://codeload.github.com/Franc-dev/donate-artist/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Franc-dev%2Fdonate-artist/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268635345,"owners_count":24281946,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-03T02:00:12.545Z","response_time":2577,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-08-04T01:08:27.253Z","updated_at":"2025-09-25T18:22:45.957Z","avatar_url":"https://github.com/Franc-dev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Artist Battle Platform - Updated\n\nA dynamic artist battle platform where users can vote for their favorite artists and support them with donations.\n\n## Recent Updates\n\n### ✅ Removed Hardcoded Data\n- **Store**: Removed all hardcoded artist and battle data from `stores/app-store.ts`\n- **Dynamic Loading**: Added `loadArtists()` and `loadCurrentBattle()` functions\n- **Data Service**: Created `lib/data-service.ts` for API integration\n- **Loading States**: Added proper loading and error states throughout the app\n\n### ✅ Removed Yellow Colors\n- **Artist Card**: Replaced yellow gradient with indigo-purple gradient for featured artists\n- **Global Styles**: Updated color scheme to remove yellow tones\n- **Consistent Theme**: All UI elements now use a cohesive color palette\n\n### ✅ Name Required (No Anonymous)\n- **Intro Modal**: Users must provide their name and email before participating\n- **Donation Modal**: Name and email are required fields (marked with *)\n- **User Creation**: Automatic user creation when first interacting with the platform\n- **Validation**: Proper form validation for required fields\n\n### ✅ Nice Intro Modal\n- **Welcome Screen**: Beautiful intro modal with platform features\n- **User Onboarding**: Collects user information before allowing participation\n- **Feature Highlights**: Shows voting, donations, and battle tracking features\n- **Smooth UX**: Seamless transition from intro to main platform\n\n### ✅ Fixed Voting System\n- **Multiple Votes**: Users can now vote twice for each artist (upvote + downvote)\n- **Vote Tracking**: Proper tracking of individual vote types per artist\n- **User Authentication**: Requires user login before voting\n- **Real-time Updates**: Vote counts update immediately\n\n### ✅ Angular UI (No Rounded Corners)\n- **Global CSS**: Set `--radius: 0` to remove all rounded corners\n- **Components**: Updated all components to use angular styling\n- **Consistent Design**: All buttons, cards, and modals now have sharp corners\n- **Modern Look**: Clean, angular design throughout the platform\n\n## Features\n\n### 🎵 Artist Battles\n- Dynamic artist loading from API\n- Real-time battle statistics\n- Countdown timer for battle end\n- Battle status tracking\n\n### 🗳️ Voting System\n- Upvote and downvote for each artist\n- Multiple votes allowed per artist\n- Real-time vote counting\n- User vote history tracking\n\n### 💰 Donation System\n- M-Pesa and Pesapal payment integration\n- Required user information\n- Donation tracking and history\n- Real-time donation statistics\n\n### 👤 User Management\n- User registration via intro modal\n- User profile tracking\n- Vote and donation history\n- Personalized experience\n\n## Technical Stack\n\n- **Framework**: Next.js 14 with TypeScript\n- **State Management**: Zustand with persistence\n- **Styling**: Tailwind CSS with custom components\n- **UI Components**: Custom component library\n- **Payment**: PayHero integration (M-Pesa \u0026 Pesapal)\n\n## Getting Started\n\n1. **Install Dependencies**\n   ```bash\n   npm install\n   # or\n   pnpm install\n   ```\n\n2. **Environment Setup**\n   ```bash\n   cp .env.example .env.local\n   # Configure your PayHero API keys\n   ```\n\n3. **Run Development Server**\n   ```bash\n   npm run dev\n   # or\n   pnpm dev\n   ```\n\n4. **Load Sample Data**\n   - Click the \"Load Sample Data\" button in the bottom-right corner\n   - This will populate the platform with sample artists and battles\n\n## API Integration\n\nThe platform is designed to work with your backend API. Update the `DataService` class in `lib/data-service.ts` to connect to your actual API endpoints:\n\n```typescript\nstatic async loadArtists(): Promise\u003cArtist[]\u003e {\n  const response = await fetch('/api/artists')\n  return response.json()\n}\n\nstatic async loadCurrentBattle(): Promise\u003cBattle | null\u003e {\n  const response = await fetch('/api/battles/current')\n  return response.json()\n}\n```\n\n## File Structure\n\n```\n├── app/\n│   └── page.tsx                 # Main application page\n├── components/\n│   ├── admin-panel.tsx          # Sample data loader\n│   ├── artist-comparison.tsx    # Artist battle interface\n│   ├── donation-modal.tsx       # Donation form\n│   ├── intro-modal.tsx          # User onboarding\n│   └── ui/                      # Reusable UI components\n├── lib/\n│   ├── data-service.ts          # API integration layer\n│   └── payhero-service.ts       # Payment integration\n├── stores/\n│   └── app-store.ts             # Global state management\n├── types/\n│   └── index.ts                 # TypeScript type definitions\n└── styles/\n    └── globals.css              # Global styles and components\n```\n\n## Key Components\n\n### IntroModal\n- User onboarding and registration\n- Required name and email collection\n- Platform feature introduction\n\n### ArtistComparison\n- Main battle interface\n- Voting system with multiple votes\n- Artist information display\n- Social media links\n\n### DonationModal\n- Payment form with validation\n- M-Pesa and Pesapal integration\n- Required user information\n- Donation tracking\n\n### AdminPanel\n- Development tool for loading sample data\n- Easy testing and demonstration\n\n## State Management\n\nThe app uses Zustand for state management with the following key stores:\n\n- **Artists**: Dynamic artist data\n- **Current Battle**: Active battle information\n- **Votes**: User voting history\n- **Donations**: Donation tracking\n- **Current User**: User profile and preferences\n- **UI State**: Modal states and UI interactions\n\n## Styling\n\n- **Angular Design**: No rounded corners throughout\n- **Color Scheme**: Indigo, purple, and slate colors\n- **Responsive**: Mobile-first design\n- **Accessibility**: Proper contrast and focus states\n\n## Future Enhancements\n\n- [ ] Real-time notifications\n- [ ] Artist profile pages\n- [ ] Battle history\n- [ ] Social sharing\n- [ ] Advanced analytics\n- [ ] Admin dashboard\n- [ ] Multi-language support\n\n## Contributing\n\n1. Fork the repository\n2. Create a feature branch\n3. Make your changes\n4. Test thoroughly\n5. Submit a pull request\n\n## License\n\nThis project is licensed under the MIT License. ","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffranc-dev%2Fdonate-artist","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffranc-dev%2Fdonate-artist","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffranc-dev%2Fdonate-artist/lists"}