SayaMusic

A music player Telegram Mini App — stream trending YouTube music without leaving Telegram.

---

Features

• Home — trending YouTube feed with infinite scroll and live search
• Player — persistent mini player with full queue management
• Playlists — create and sync playlists via Supabase
• Profile — Telegram identity + Google OAuth login
• Animations — smooth tab transitions with Framer Motion

---

Tech Stack

• Frontend — React 18, TypeScript, Vite + SWC
• Styling — Tailwind CSS, shadcn/ui (Radix UI)
• State — Zustand, TanStack Query v5
• Backend — Supabase (Postgres + Auth + RLS)
• API — YouTube Data API v3
• Platform — Telegram WebApp SDK
• Tests — Vitest, Playwright

---

Quick Start

git clone https://github.com/SexyDark/SayaMusic.git
cd SayaMusic
npm install
npm run dev

Create a .env.local file:

VITE_SUPABASE_URL=your_project_url
VITE_SUPABASE_ANON_KEY=your_anon_key

---

Project Structure

src/
├── components/     HomeTab, PlaylistTab, ProfileTab, MiniPlayer, BottomNav
├── hooks/          usePlayerStore (Zustand)
├── lib/            youtube.ts, telegram.ts, theme.ts
├── pages/          Index.tsx, NotFound.tsx
└── integrations/   supabase client + types

---

Telegram Setup

1. Create a bot via @BotFather
2. Run /newapp and set your deployed URL
3. The app calls WebApp.ready() and expand() on mount
4. User info is read from initDataUnsafe.user

Community