diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 00000000..86c0445f --- /dev/null +++ b/Dockerfile @@ -0,0 +1,20 @@ +# Используем базовый образ Node.js +FROM node:14-alpine + +# Устанавливаем рабочую директорию +WORKDIR / + +# Копируем файлы package.json и package-lock.json +COPY package*.json ./ + +# Устанавливаем зависимости +RUN npm ci + +# Копируем остальные файлы +COPY . . + +# Устанавливаем TypeScript и другие зависимости +RUN npm install -g typescript @types/node ts-node + +# Запускаем приложение +CMD npm run start \ No newline at end of file diff --git a/Dockerfile.json-server b/Dockerfile.json-server new file mode 100644 index 00000000..c25a6b53 --- /dev/null +++ b/Dockerfile.json-server @@ -0,0 +1,14 @@ +# Используем базовый образ Node.js +FROM node:14-alpine + +# Устанавливаем рабочую директорию +WORKDIR /app + +# Копируем файл data.json +COPY data.json . + +# Устанавливаем json-server +RUN npm install -g json-server + +# Запускаем JSON Server +CMD ["npm", "run", "json-server"] \ No newline at end of file diff --git a/README.md b/README.md index 2d661d05..c0a08b1c 100644 --- a/README.md +++ b/README.md @@ -4,3 +4,31 @@ ### Описание Веб-приложение для прослушивания музыки. + +### Технологии +* React +* Typescript +* React Router DOM +* Ant Design +* Styled Components +* Tailwind CSS +* Json Server + +### Что было реализовано + +* Регистрация и авторизация с сохранением данных в localStorage +* Сайдбар +* Прослушивание музыки +* Поиск музыки +* Страница группы +* Страница альбома +* Страница пользователя с добавленными треками + +### Как запустить + + `npm install` + `npm run start` - запустить веб-приложение на порту 5000 + +### Как запустить json-server + + `npm run json-server` \ No newline at end of file diff --git a/data.json b/data.json index 856ecc8a..38b2340b 100644 --- a/data.json +++ b/data.json @@ -1,510 +1,464 @@ { - "songs": [ - { - "id": "1", - "song_name": "Smells Like Poop", - "band_id": "1", - "band_name": "Nevroz", - "albumid": "1", - "album_name": "Album 1", - "source": "http://localhost:3001/songs_sources/nirvana.mp3", - "cover": "https://cdn1.ozone.ru/s3/multimedia-t/6893834213.jpg", - "playlists": [ - "1", - "2" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "2", - "song_name": "Song 3", - "band_id": "1", - "band_name": "Nevroz", - "albumid": "1", - "album_name": "Album 1", - "source": "http://localhost:3001/songs_sources/blur.mp3", - "cover": "https://lastfm.freetls.fastly.net/i/u/ar0/101e39a435244b05cbf9d3af6ddf8c74.jpg", - "playlists": [ - "2" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "3", - "song_name": "Ругань из-за Стёпы", - "band_id": "2", - "band_name": "noizemchik", - "albumid": "2", - "album_name": "Ругань из-за Стёпы", - "source": "http://localhost:3001/songs_sources/noizemc.mp3", - "cover": "https://sun9-11.userapi.com/impg/yfCwuWXI6NkFVC2HvMlegM2qWLlenkeiiRyvNQ/jpH8m1wlLqs.jpg?size=604x604&quality=95&sign=60a1d1877b49631fb6078db88715fc88&c_uniq_tag=UKrig2vg02reyBH_ML0OKeqt5gm_2jpwEXD7NJBUXoQ&type=album" - , - "playlists": [ - "1", "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "4", - "song_name": "Хот вилз", - "band_id": "1", - "band_name": "DSPD", - "albumid": "1", - "album_name": "Album 1", - "source": "http://localhost:3001/songs_sources/hotweelz.mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "1", "2" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "5", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "http://localhost:3001/songs_sources/kemstal.mp3", - "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "6", - "song_name": "American Idiotus", - "band_id": "3", - "band_name": "Red Day", - "albumid": "3", - "album_name": "Album 3", - "source": "http://localhost:3001/songs_sources/greenday.mp3", - "cover": "https://avatars.yandex.net/get-music-content/32236/d3846188.a.1001691-1/m1000x1000?webp=false", - "playlists": [ - "2", "3" - ], - "genreid": "1", - "genre_name": "Rock" - - }, - { - "id": "7", - "song_name": "Ulyanofication'", - "band_id": "1", - "band_name": "Yellow Warm Russian Tomatoes", - "albumid": "1", - "album_name": "Album 1", - "source": "http://localhost:3001/songs_sources/pepers.mp3", - "cover": "https://avatars.mds.yandex.net/i?id=8d01018aa8cac0da9845314da42e050ab8e61713-12569754-images-thumbs&n=13", - "playlists": [ - "2" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "8", - "song_name": "СУМАСШЕДШИЙ ПОЕЗД!!!!", - "band_id": "2", - "band_name": "СТАРИНА ОЗЗИ ОЗБОРН (МУЗЫКА ДЬЯВОЛА)", - "albumid": "2", - "album_name": "Ругань из-за Стёпы", - "source": "http://localhost:3001/songs_sources/ozzy.mp3", - "cover": "https://avatars.mds.yandex.net/i?id=95adb2fda305e542621b7d9757d70ddd_l-4937470-images-thumbs&n=13" - , - "playlists": [ - "1", "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "9", - "song_name": "Downstairs to Heaven", - "band_id": "3", - "band_name": "AC/DC", - "albumid": "3", - "album_name": "Album 3", - "source": "http://localhost:3001/songs_sources/acdc.mp3", - "cover": "https://avatars.mds.yandex.net/get-entity_search/509339/292583724/S600xU", - "playlists": [ - "2", "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "10", - "song_name": "Ай воз мэйд фор лавин ю беби", - "band_id": "3", - "band_name": "KISS", - "albumid": "3", - "album_name": "Album 3", - "source": "http://localhost:3001/songs_sources/kiss.mp3", - "cover": "https://avatars.dzeninfra.ru/get-zen_doc/10073791/pub_64ab1cf9ec43747a7a73a3e0_64ab1d726ba4132c8f8b37b6/scale_1200", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "11", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "http://localhost:3001/songs_sources/kemstal.mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "12", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "13", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "14", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "15", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "18", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "19", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "/src/songs/DSPD feat. даня хренников - Кем я стал_(audio-lord.ru).mp3", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "20", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "source_path", - "cover": "https://sun9-11.userapi.com/impg/yfCwuWXI6NkFVC2HvMlegM2qWLlenkeiiRyvNQ/jpH8m1wlLqs.jpg?size=604x604&quality=95&sign=60a1d1877b49631fb6078db88715fc88&c_uniq_tag=UKrig2vg02reyBH_ML0OKeqt5gm_2jpwEXD7NJBUXoQ&type=album", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "21", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "source_path", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "22", - "song_name": "Кем я стал", - "band_id": "3", - "band_name": "DSPD", - "albumid": "3", - "album_name": "Album 3", - "source": "source_path", - "cover": "https://sun9-11.userapi.com/impg/yfCwuWXI6NkFVC2HvMlegM2qWLlenkeiiRyvNQ/jpH8m1wlLqs.jpg?size=604x604&quality=95&sign=60a1d1877b49631fb6078db88715fc88&c_uniq_tag=UKrig2vg02reyBH_ML0OKeqt5gm_2jpwEXD7NJBUXoQ&type=album", - "playlists": [ - "3" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "23", - "song_name": "Song 3", - "band_id": "1", - "band_name": "Nevroz", - "albumid": "1", - "album_name": "Album 1", - "source": "source_path", - "cover": "https://cdn1.ozone.ru/s3/multimedia-t/6893834213.jpg", - "playlists": [ - "2" - ], - "genreid": "1", - "genre_name": "Rock" - }, - { - "id": "24", - "song_name": "Song 3", - "band_id": "1", - "band_name": "Nevroz", - "albumid": "1", - "album_name": "Album 1", - "source": "source_path", - "cover": "https://cdn1.ozone.ru/s3/multimedia-t/6893834213.jpg", - "playlists": [ - "2" - ], - "genreid": "1", - "genre_name": "Rock" - } - - ], - "albums": [ - { - "id": "1", - "name": "Album 1", - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=false", - "year": 1999, - "genres": [ - "Post-Punk", - "Indie" - ] - }, - { - "id": "2", - "name": "Album 2", - "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", - "year": 2020, - "genres": [ - "Post-Punk", - "Indie" - ] - }, - { - "id": "3", - "name": "Album 3", - "year": 2021, - "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", - "genres": [ - "Post-Punk", - "Punk" - ] - } - ], - - "bands": [ - { - "id": "1", - "name": "Nevroz", - "city": "Москва", - "country": "Россия", - "years": "2018-2020", - "genres": [ - "Post-Punk", - "Indie" - ], - "description": "Nevroz — это коллектив, созданный в 2018 году в Москве. Группа специализируется на написании песен на русском языке и исполнении в жанре Post-Punk и Indie. В состав коллектива входят вокалистка, басист, гитарист и ударник. Несколько песен группы стали популярными в интернете, а также коллектив неоднократно выступал на различных мероприятиях в Москве.", - "photo": "photo_path" - }, - { - "id": "3", - "name": "noizemchik", - "city": "Калининград", - "country": "Россия", - "years": "2020-", - "genres": [ - "Rock", - "Punk" - ], - "description": "noizemchik — это коллектив, созданный в 2020 году в Калининграде. Группа специализируется на написании песен на русском языке и исполнении в жанре Rock и Панк. В состав коллектива входят вокалист, гитарист, басист и барабанщик. Несколько песен группы стали популярными в интернете, а также коллектив неоднократно выступал на различных мероприятиях в Калининграде и других городах.", - "photo": "photo_path" - }, - { - "id": "5", - "name": "DSPD", - "city": "Москва", - "country": "Россия", - "years": "2019-", - "genres": [ - "Rock", - "Punk" - ], - "description": "DSPD — это коллектив, созданный в 2019 году в Москве. Группа специализируется на написании песен на русском языке и исполнении в жанре Rock и Панк. В состав коллектива входят вокалист, гитарист, басист и барабанщик. Несколько песень группы стали популярными в интернете, а также коллектив неоднократно выступал на различных мероприятиях в Москве и других городах.", - "photo": "photo_path" - } - ], - "genres": [ - {"id": "1", "name": "Post-Punk"}, - {"id": "2", "name": "Rock"}, - {"id": "3", "name": "Punk"}, - {"id": "4", "name": "Indie"} - ], - "playlists": [ - { - "id": "1", - "name": "Playlist 1", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "description": "Плейлист прикольный", - "genres": [ - "Post-Punk", - "Indie" - ] - - }, - { - "id": "2", - "name": "Playlist 2", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", - "description": "Плейлист прикольный 2", - "genres": [ - "Rock" - ] - - }, - { - "id": "3", - "name": "Playlist 3", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "description": "Плейлист прикольный 3", - "genres": [ - "Indie" - ] - - }, - { - "id": "1", - "name": "Playlist 1", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "description": "Плейлист прикольный", - "genres": [ - "Post-Punk", - "Indie" - ] - - }, - { - "id": "3", - "name": "Playlist 3", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "description": "Плейлист прикольный 3", - "genres": [ - "Post-Punk" - ] - - }, - { - "id": "1", - "name": "Playlist 1", - "songs": [], - "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", - "description": "Плейлист прикольный", - "genres": [ - "Rock", - "Indie" - ] - - } - ], - "users": [ - { - "id": "1", - "name": "Амид Девилинкович", - "email": "email", - "password": "password", - "photo": "photo_path", - "favorite_songs": [ - "1", "2", "3" - ] - } - ], - "advertisements": [ - { - "id": "1", - "name": "Advert 1", - "photo": "https://sun9-15.userapi.com/impg/5IS2PMmTs9YGUuo2CGNDm3KxKbe6T7205_PT6A/-VHlhuPWlGk.jpg?size=1640x856&quality=95&sign=77953363d2f78b014aff77f540f7bfa0&type=album" - } - - ] -} + "songs": [ + { + "id": "1", + "song_name": "Smells Like Poop", + "band_id": "1", + "band_name": "Nevroz", + "albumid": "1", + "album_name": "Album 1", + "source": "http://localhost:3001/songs_sources/nirvana.mp3", + "cover": "https://cdn1.ozone.ru/s3/multimedia-t/6893834213.jpg", + "playlists": [ + "1", + "2" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "2", + "song_name": "Song 3", + "band_id": "2", + "band_name": "Blur", + "albumid": "1", + "album_name": "Album 1", + "source": "http://localhost:3001/songs_sources/blur.mp3", + "cover": "https://lastfm.freetls.fastly.net/i/u/ar0/101e39a435244b05cbf9d3af6ddf8c74.jpg", + "playlists": [ + "2" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "3", + "song_name": "Ругань из-за Стёпы", + "band_id": "3", + "band_name": "noize mc", + "albumid": "2", + "album_name": "Ругань из-за Стёпы", + "source": "http://localhost:3001/songs_sources/noizemc.mp3", + "cover": "https://sun9-11.userapi.com/impg/yfCwuWXI6NkFVC2HvMlegM2qWLlenkeiiRyvNQ/jpH8m1wlLqs.jpg?size=604x604&quality=95&sign=60a1d1877b49631fb6078db88715fc88&c_uniq_tag=UKrig2vg02reyBH_ML0OKeqt5gm_2jpwEXD7NJBUXoQ&type=album", + "playlists": [ + "1", + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "4", + "song_name": "Хот вилз", + "band_id": "5", + "band_name": "DSPD", + "albumid": "1", + "album_name": "Album 1", + "source": "http://localhost:3001/songs_sources/hotweelz.mp3", + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "playlists": [ + "1", + "2" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "5", + "song_name": "Кем я стал", + "band_id": "5", + "band_name": "DSPD", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/kemstal.mp3", + "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "6", + "song_name": "American Idiotus", + "band_id": "3", + "band_name": "Red Day", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/greenday.mp3", + "cover": "https://avatars.yandex.net/get-music-content/32236/d3846188.a.1001691-1/m1000x1000?webp=false", + "playlists": [ + "2", + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "7", + "song_name": "Ulyanofication", + "band_id": "1", + "band_name": "RHCP", + "albumid": "1", + "album_name": "Album 1", + "source": "http://localhost:3001/songs_sources/pepers.mp3", + "cover": "https://avatars.yandex.net/get-music-content/42108/916a66bd.a.21862-1/m1000x1000", + "playlists": [ + "2" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "8", + "song_name": "СУМАСШЕДШИЙ ПОЕЗД!!!!", + "band_id": "4", + "band_name": "Ozzy Osbourne", + "albumid": "2", + "album_name": "Ругань из-за Стёпы", + "source": "http://localhost:3001/songs_sources/ozzy.mp3", + "cover": "https://avatars.mds.yandex.net/i?id=95adb2fda305e542621b7d9757d70ddd_l-4937470-images-thumbs&n=13", + "playlists": [ + "1", + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "9", + "song_name": "Downstairs to Heaven", + "band_id": "3", + "band_name": "AC/DC", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/acdc.mp3", + "cover": "https://avatars.yandex.net/get-music-content/13663712/7796821b.a.33691089-1/m1000x1000", + "playlists": [ + "2", + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "10", + "song_name": "Ай воз мэйд фор лавин ю беби", + "band_id": "3", + "band_name": "KISS", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/kiss.mp3", + "cover": "https://avatars.yandex.net/get-music-content/2810397/594156f4.a.85617-3/m1000x1000", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "11", + "song_name": "Танцевать (feat. мухи мрут)", + "band_id": "5", + "band_name": "DSPD", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/dance.mp3", + "cover": "https://avatars.yandex.net/get-music-content/10930741/76e980d5.a.27465446-1/m1000x1000", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "12", + "song_name": "Небо падает вниз", + "band_id": "6", + "band_name": "нет пути", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/noway.mp3", + "cover": "https://avatars.yandex.net/get-music-content/8096180/0c820616.a.25211644-1/m1000x1000", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "13", + "song_name": "Гаснет пламя", + "band_id": "7", + "band_name": "Crazy Boy", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/flame.mp3", + "cover": "https://avatars.yandex.net/get-music-content/6255016/09ca7466.a.23604055-1/m1000x1000", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + }, + { + "id": "14", + "song_name": "Ферстлав", + "band_id": "7", + "band_name": "Crazy Boy", + "albumid": "3", + "album_name": "Album 3", + "source": "http://localhost:3001/songs_sources/firstlove.mp3", + "cover": "https://avatars.yandex.net/get-music-content/6214856/ae258804.a.23324210-1/m1000x1000", + "playlists": [ + "3" + ], + "genreid": "1", + "genre_name": "Rock" + } + ], + "albums": [ + { + "id": "1", + "name": "Album 1", + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=false", + "year": 1999, + "genres": [ + "Post-Punk", + "Indie" + ], + "bandid": "1" + }, + { + "id": "2", + "name": "Album 2", + "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", + "year": 2020, + "genres": [ + "Post-Punk", + "Indie" + ], + "bandid": "5" + }, + { + "id": "3", + "name": "Album 3", + "year": 2021, + "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", + "genres": [ + "Post-Punk", + "Punk" + ], + "bandid": "3" + } + ], + "bands": [ + { + "id": "1", + "name": "Nevroz", + "city": "Москва", + "country": "Россия", + "years": "2018-2020", + "genres": [ + "Post-Punk", + "Indie" + ], + "description": "Nevroz — это коллектив, созданный в 2018 году в Москве. Группа специализируется на написании песен на русском языке и исполнении в жанре Post-Punk и Indie. В состав коллектива входят вокалистка, басист, гитарист и ударник. Несколько песен группы стали популярными в интернете, а также коллектив неоднократно выступал на различных мероприятиях в Москве.", + "photo": "https://avatars.yandex.net/get-music-content/5496390/06f54371.p.9262/m1000x1000" + }, + { + "id": "2", + "name": "Blur", + "city": "Лондон", + "country": "Великобритания", + "years": "1998-", + "genres": [ + "Rock", + "Punk" + ], + "description": "Blur — это британская рок-группа, сформированная в 1988 году в Лондоне. Группа является одной из основных групп бритпоп-движения, она выпустила восемь студийных альбомов, имеет множество хитов и является одной из самых успешных британских рок-групп 1990-х годов.", + "photo": "https://avatars.yandex.net/get-music-content/32236/7b077fe9.p.36807/m1000x1000" + }, + { + "id": "3", + "name": "noize mc", + "city": "Калининград", + "country": "Россия", + "years": "2020-", + "genres": [ + "Rock", + "Punk" + ], + "description": "noizemchik — это коллектив, созданный в 2020 году в Калининграде. Группа специализируется на написании песен на русском языке и исполнении в жанре Rock и Панк. В состав коллектива входят вокалист, гитарист, басист и барабанщик. Несколько песен группы стали популярными в интернете, а также коллектив неоднократно выступал на различных мероприятиях в Калининграде и других городах.", + "photo": "https://avatars.yandex.net/get-music-content/10103188/57ac2da0.p.160970/m1000x1000" + }, + { + "id": "4", + "name": "Ozzy Osbourne", + "city": "Москва", + "country": "Россия", + "years": "1980-", + "genres": [ + "Rock", + "Punk" + ], + "description": "Старый добрый Оззи Озборн ОУУУУ ДААА рокенроллллл", + "photo": "https://avatars.yandex.net/get-music-content/42108/d803cb79.p.3274/m1000x1000" + }, + { + "id": "5", + "name": "DSPD", + "city": "Ульяновск", + "country": "Россия", + "years": "2019-", + "genres": [ + "Rock", + "Punk" + ], + "description": "DSPD — это коллектив, созданный в 2019 году в Ульяновске, изначально состоящий из одного человека: 16-летнего Долгова Дмитрия. Группа специализируется на написании песен на русском языке и исполнении в жанре Рок и Поп-панк. Сейчас в состав коллектива входят вокалист (Дима) и гитарист (Даня). А еще Дима сделал этот курсач!", + "photo": "https://sun9-12.userapi.com/impg/KdOpbLpgHbAGso6x6yYt9hcPOyNS15ru4twqZg/FXY8tAEOSwo.jpg?size=1280x1280&quality=95&sign=13979d395da57623ee370d413d24dac3&type=album" + }, + { + "id": "6", + "name": "нет пути", + "city": "Ульяновск", + "country": "Россия", + "years": "2023-2023", + "genres": [ + "Rock", + "Punk" + ], + "description": "нет пути - это группа, записавшая всего одну песню, а все потому, что Даня и Витя не сошлись во вкусах. Теперь Даня в группе DSPD у Димы!!!", + "photo": "https://sun9-80.userapi.com/impg/ZUXnTxRO7KtApWirBnAxpph9zD1uF5O1ZI3FBA/uy5ZcMBRvuM.jpg?size=1000x1000&quality=95&sign=3ef9d90bc8cfb2307e7f90b820dc2cb2&type=album" + }, + { + "id": "7", + "name": "Crazy Boy", + "city": "Ульяновск", + "country": "Россия", + "years": "2020-", + "genres": [ + "Rock", + "Punk" + ], + "description": "Андрей Crazy Boy - молодой энтузиаст из Ульяновска, в котором так и кипит жажда деятельности. Пусть в его треках плохой текст, рифма, да и вообще всё что угодно - он делает это от души.....", + "photo": "https://sun9-62.userapi.com/impg/3orK7BWBrArY5ogpYj6mdvaodhKnUte2o3p41A/xFTEOb8cHl4.jpg?size=2560x1440&quality=95&sign=9d4856fbdf1defa41a94207ea3985e0c&type=album" + } + ], + "genres": [ + { + "id": "1", + "name": "Post-Punk" + }, + { + "id": "2", + "name": "Rock" + }, + { + "id": "3", + "name": "Punk" + }, + { + "id": "4", + "name": "Indie" + } + ], + "playlists": [ + { + "id": "1", + "name": "Playlist 1", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "description": "Плейлист прикольный", + "genres": [ + "Post-Punk", + "Indie" + ] + }, + { + "id": "2", + "name": "Playlist 2", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/6058982/7e431a83.a.23910092-1/m1000x1000?webp=false", + "description": "Плейлист прикольный 2", + "genres": [ + "Rock" + ] + }, + { + "id": "3", + "name": "Playlist 3", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "description": "Плейлист прикольный 3", + "genres": [ + "Indie" + ] + }, + { + "id": "1", + "name": "Playlist 1", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "description": "Плейлист прикольный", + "genres": [ + "Post-Punk", + "Indie" + ] + }, + { + "id": "3", + "name": "Playlist 3", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "description": "Плейлист прикольный 3", + "genres": [ + "Post-Punk" + ] + }, + { + "id": "1", + "name": "Playlist 1", + "songs": [], + "cover": "https://avatars.yandex.net/get-music-content/10129881/f3cf1afc.a.30561322-1/m1000x1000?webp=falseh", + "description": "Плейлист прикольный", + "genres": [ + "Rock", + "Indie" + ] + } + ], + "users": [ + { + "id": "1", + "name": "Амид Девилинкович", + "email": "email@mail.ru", + "password": "password", + "photo": "https://steamuserimages-a.akamaihd.net/ugc/5072773634763560590/7D8EFFF884BAD1D365C5B05FBB77F7E1B2E1655D/?imw=512&imh=288&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=true", + "favorite_songs": [] + }, + { + "id": "e01d", + "name": "Аришинскаяя", + "email": "arina.gracheva.2015@gmail.com", + "password": "i6d-3JV-mug-iL3", + "photo": "https://i.ytimg.com/vi/bAUDgdDX034/maxresdefault.jpg", + "favorite_songs": [] + }, + { + "id": "d9f6", + "name": "Кукумбер Кукумберович", + "email": "cucumber@gmail.com", + "password": "cucumber", + "photo": "https://main-cdn.sbermegamarket.ru/big2/hlr-system/-21/401/557/724/261/38/100050923600b0.png", + "favorite_songs": [] + } + ], + "advertisements": [ + { + "id": "1", + "name": "Advert 1", + "photo": "https://sun9-15.userapi.com/impg/5IS2PMmTs9YGUuo2CGNDm3KxKbe6T7205_PT6A/-VHlhuPWlGk.jpg?size=1640x856&quality=95&sign=77953363d2f78b014aff77f540f7bfa0&type=album" + } + ] +} \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 00000000..ab184dea --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,15 @@ +services: + frontend: + build: . + ports: + - "5000:5000" + volumes: + - .:/app + - ./node_modules:/app/node_modules + + json-server: + build: + context: . + dockerfile: Dockerfile.json-server + ports: + - "3001:3001" diff --git a/package-lock.json b/package-lock.json index eca48890..7e59b6c9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,12 +22,15 @@ "@types/styled-components": "^5.1.34", "antd": "^5.20.1", "axios": "^1.7.4", + "body-parser": "^1.20.3", "node-fetch": "^2.6.7", "react": "^18.3.1", "react-audio-player-component": "^1.2.4", "react-dom": "^18.3.1", "react-dotenv": "^0.1.3", + "react-easy-crop": "^5.1.0", "react-google-recaptcha": "^3.1.0", + "react-helmet": "^6.1.0", "react-router-dom": "^6.26.2", "react-scripts": "5.0.1", "styled-components": "^6.1.12", @@ -48,7 +51,9 @@ "@storybook/react-webpack5": "^8.2.9", "@storybook/test": "^8.2.9", "@types/node-fetch": "^2.6.11", + "@types/react-avatar-editor": "^13.0.3", "@types/react-google-recaptcha": "^2.1.9", + "@types/react-helmet": "^6.1.11", "eslint-plugin-storybook": "^0.8.0", "prop-types": "^15.8.1", "storybook": "^8.2.9", @@ -9512,6 +9517,16 @@ "csstype": "^3.0.2" } }, + "node_modules/@types/react-avatar-editor": { + "version": "13.0.3", + "resolved": "https://registry.npmjs.org/@types/react-avatar-editor/-/react-avatar-editor-13.0.3.tgz", + "integrity": "sha512-icRAOKLKjkIsExFAiFSquztByJwpyTKEgnBRYSuLG2V81bM3LtQZi7hRS+Hr+4AXreq0yNRjVZiMOVeEeh6DLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-dom": { "version": "18.3.0", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz", @@ -9531,6 +9546,16 @@ "@types/react": "*" } }, + "node_modules/@types/react-helmet": { + "version": "6.1.11", + "resolved": "https://registry.npmjs.org/@types/react-helmet/-/react-helmet-6.1.11.tgz", + "integrity": "sha512-0QcdGLddTERotCXo3VFlUSWO3ztraw8nZ6e3zJSgG7apwV5xt+pJUS8ewPBqT4NYB1optGLprNQzFleIY84u/g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-transition-group": { "version": "4.4.11", "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.11.tgz", @@ -11323,9 +11348,9 @@ "license": "MIT" }, "node_modules/body-parser": { - "version": "1.20.2", - "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.2.tgz", - "integrity": "sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==", + "version": "1.20.3", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.3.tgz", + "integrity": "sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==", "license": "MIT", "dependencies": { "bytes": "3.1.2", @@ -11336,7 +11361,7 @@ "http-errors": "2.0.0", "iconv-lite": "0.4.24", "on-finished": "2.4.1", - "qs": "6.11.0", + "qs": "6.13.0", "raw-body": "2.5.2", "type-is": "~1.6.18", "unpipe": "1.0.0" @@ -11382,6 +11407,21 @@ "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", "license": "MIT" }, + "node_modules/body-parser/node_modules/qs": { + "version": "6.13.0", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz", + "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==", + "license": "BSD-3-Clause", + "dependencies": { + "side-channel": "^1.0.6" + }, + "engines": { + "node": ">=0.6" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/bonjour-service": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.1.tgz", @@ -15791,6 +15831,39 @@ "node": ">= 0.10.0" } }, + "node_modules/express/node_modules/body-parser": { + "version": "1.20.2", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.2.tgz", + "integrity": "sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==", + "license": "MIT", + "dependencies": { + "bytes": "3.1.2", + "content-type": "~1.0.5", + "debug": "2.6.9", + "depd": "2.0.0", + "destroy": "1.2.0", + "http-errors": "2.0.0", + "iconv-lite": "0.4.24", + "on-finished": "2.4.1", + "qs": "6.11.0", + "raw-body": "2.5.2", + "type-is": "~1.6.18", + "unpipe": "1.0.0" + }, + "engines": { + "node": ">= 0.8", + "npm": "1.2.8000 || >= 1.4.16" + } + }, + "node_modules/express/node_modules/bytes": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz", + "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==", + "license": "MIT", + "engines": { + "node": ">= 0.8" + } + }, "node_modules/express/node_modules/debug": { "version": "2.6.9", "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", @@ -15800,6 +15873,18 @@ "ms": "2.0.0" } }, + "node_modules/express/node_modules/iconv-lite": { + "version": "0.4.24", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", + "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", + "license": "MIT", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/express/node_modules/ms": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", @@ -21373,6 +21458,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/normalize-wheel": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/normalize-wheel/-/normalize-wheel-1.0.1.tgz", + "integrity": "sha512-1OnlAPZ3zgrk8B91HyRj+eVv+kS5u+Z0SCsak6Xil/kmgEia50ga7zfkumayonZrImffAxPU/5WcyGhzetHNPA==", + "license": "BSD-3-Clause" + }, "node_modules/npm-run-path": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz", @@ -24971,6 +25062,20 @@ "url": "https://github.com/prettier/prettier?sponsor=1" } }, + "node_modules/react-easy-crop": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/react-easy-crop/-/react-easy-crop-5.1.0.tgz", + "integrity": "sha512-UsYeF/N7zoqtfOSD+2xSt1nRaoBYCI2YLkzmq+hi+aVepS4/bAMhbrLwJtDAP60jsVzWRiQCX7JG+ZtfWcHsiw==", + "license": "MIT", + "dependencies": { + "normalize-wheel": "^1.0.1", + "tslib": "^2.0.1" + }, + "peerDependencies": { + "react": ">=16.4.0", + "react-dom": ">=16.4.0" + } + }, "node_modules/react-element-to-jsx-string": { "version": "15.0.0", "resolved": "https://registry.npmjs.org/react-element-to-jsx-string/-/react-element-to-jsx-string-15.0.0.tgz", @@ -25000,6 +25105,12 @@ "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg==", "license": "MIT" }, + "node_modules/react-fast-compare": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz", + "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==", + "license": "MIT" + }, "node_modules/react-google-recaptcha": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-3.1.0.tgz", @@ -25013,6 +25124,21 @@ "react": ">=16.4.1" } }, + "node_modules/react-helmet": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz", + "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==", + "license": "MIT", + "dependencies": { + "object-assign": "^4.1.1", + "prop-types": "^15.7.2", + "react-fast-compare": "^3.1.1", + "react-side-effect": "^2.1.0" + }, + "peerDependencies": { + "react": ">=16.3.0" + } + }, "node_modules/react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -25142,6 +25268,15 @@ "node": ">=10" } }, + "node_modules/react-side-effect": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.2.tgz", + "integrity": "sha512-PVjOcvVOyIILrYoyGEpDN3vmYNLdy1CajSFNt4TDsVQC5KpTijDvWVoR+/7Rz2xT978D8/ZtFceXxzsPwZEDvw==", + "license": "MIT", + "peerDependencies": { + "react": "^16.3.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", diff --git a/package.json b/package.json index 07137a41..1d442c10 100644 --- a/package.json +++ b/package.json @@ -17,12 +17,15 @@ "@types/styled-components": "^5.1.34", "antd": "^5.20.1", "axios": "^1.7.4", + "body-parser": "^1.20.3", "node-fetch": "^2.6.7", "react": "^18.3.1", "react-audio-player-component": "^1.2.4", "react-dom": "^18.3.1", "react-dotenv": "^0.1.3", + "react-easy-crop": "^5.1.0", "react-google-recaptcha": "^3.1.0", + "react-helmet": "^6.1.0", "react-router-dom": "^6.26.2", "react-scripts": "5.0.1", "styled-components": "^6.1.12", @@ -76,7 +79,9 @@ "@storybook/react-webpack5": "^8.2.9", "@storybook/test": "^8.2.9", "@types/node-fetch": "^2.6.11", + "@types/react-avatar-editor": "^13.0.3", "@types/react-google-recaptcha": "^2.1.9", + "@types/react-helmet": "^6.1.11", "eslint-plugin-storybook": "^0.8.0", "prop-types": "^15.8.1", "storybook": "^8.2.9", diff --git a/public/default-avatar.png b/public/default-avatar.png new file mode 100644 index 00000000..53767ac8 Binary files /dev/null and b/public/default-avatar.png differ diff --git a/public/songs_sources/dance.mp3 b/public/songs_sources/dance.mp3 new file mode 100644 index 00000000..a2033211 Binary files /dev/null and b/public/songs_sources/dance.mp3 differ diff --git a/public/songs_sources/firstlove.mp3 b/public/songs_sources/firstlove.mp3 new file mode 100644 index 00000000..525d1200 Binary files /dev/null and b/public/songs_sources/firstlove.mp3 differ diff --git a/public/songs_sources/flame.mp3 b/public/songs_sources/flame.mp3 new file mode 100644 index 00000000..5f7394d4 Binary files /dev/null and b/public/songs_sources/flame.mp3 differ diff --git a/public/songs_sources/noway.mp3 b/public/songs_sources/noway.mp3 new file mode 100644 index 00000000..be29a62d Binary files /dev/null and b/public/songs_sources/noway.mp3 differ diff --git a/public/user-avatars/default-avatar.png b/public/user-avatars/default-avatar.png new file mode 100644 index 00000000..53767ac8 Binary files /dev/null and b/public/user-avatars/default-avatar.png differ diff --git a/routes.ts b/routes.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/API/api.ts b/src/API/api.ts index c0b6e6cf..feafcee4 100644 --- a/src/API/api.ts +++ b/src/API/api.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { IAdvertisement, IGenre, IPlaylist, ISong } from "../models/IModels"; +import { IAdvertisement, IGenre, IPlaylist, ISong, IAlbum } from "../models/IModels"; const localhost = process.env.REACT_APP_DATABASE; @@ -58,7 +58,67 @@ export async function getBand(id: string) { return await axios.get(`${localhost}bands/` + id); } +export async function getAlbumsByBand(id: string) { + const response = await getAlbums(); + return response.data.filter((album: IAlbum) => album.bandid === id); +} + +export async function getSongsByBand(id: string) { + const response = await getSongs(); + return response.data.filter((song: ISong) => song.band_id === id); +} + export async function getBands() { return await axios.get(`${localhost}bands/`); +} + +export async function getUser(id: string){ + return await axios.get( `${localhost}users/${id}`); +} + +export async function getUsers(){ + return await axios.get( `${localhost}users`); +} + +export async function getUserByEmail(email: string){ + return await axios.get( `${localhost}users?email=${email}`); +} + +export async function getFavoriteSongs(userid: string) { + const response = await getUser(userid); + const user = response.data; + const favoriteSongs = await Promise.all(user.favorite_songs.map((songId: string) => getSong(songId))); + return favoriteSongs.map(songResponse => songResponse.data); +} + +export async function createUser(user: any) { + return await axios.post(`${localhost}users`, user); +} + +export async function updateUser(user: any) { + console.log(`put ${localhost}users/${user.id}`, user); + return await axios.put(`${localhost}users/${user.id}`, user); +} + +export async function addFavoriteSong(userId: string, songId: string) { + let user = await (await getUser(userId)).data; + user.favorite_songs.push(songId); + return await axios.put(`${localhost}users/${userId}`, user); +} + +export async function removeFavoriteSong(userId: string, songId: string) { + let user = await (await getUser(userId)).data; + user.favorite_songs = user.favorite_songs.filter((song: string) => song !== songId); + return await axios.put(`${localhost}users/${userId}`, user); +} + +export async function filterSongsByName(name: string) { + const response = await getSongs(); + return response.data.filter((song: ISong) => song.song_name.toLowerCase().includes(name.toLowerCase())); +} + +export async function filterSongsByGenre(genre: string) { + const response = await getSongs(); + return response.data.filter((song: ISong) => song.genre_name.includes(genre)); } \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index e4135245..c690b6ed 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -13,6 +13,9 @@ import { VolumeProvider } from './contexts/VolumeContexts/VolumeProvider'; import { SideBlockProvider } from './contexts/SideBlockContexts/SideBlockProvider'; import { useState } from 'react'; import { IAdvertisement } from './models/IModels'; +import { BandPage } from './pages/BandPage'; +import { CurrentPlaylistProvider } from './contexts/SongContexts/CurrentPlaylistProvider'; +import { AlbumPage } from './pages/AlbumPage'; function App() { @@ -20,20 +23,32 @@ function App() {
+ - - }> - } /> - } /> - } /> - - - + + }> + + } /> + } /> + } /> + }> + + } > + } /> + + }> + } /> + + + + + +
diff --git a/src/components/layoutComponents/AdBlock.tsx b/src/components/layoutComponents/AdBlock.tsx index 4d5e339d..dc12fe89 100644 --- a/src/components/layoutComponents/AdBlock.tsx +++ b/src/components/layoutComponents/AdBlock.tsx @@ -1,7 +1,4 @@ -import React, { ReactElement, useEffect } from "react"; import { IAdvertisement, IAlbum, IBand, ISong } from "../../models/IModels"; -import { AdCard } from "../cardComponents/AdCard"; -import { getAds } from "../../API/api"; import { useSideBlockContext } from '../../contexts/SideBlockContexts/SideBlockProvider'; import { InformationTemplate } from "../menuComponents/Templates/informationTemplate"; diff --git a/src/components/layoutComponents/Header.tsx b/src/components/layoutComponents/Header.tsx index b0bfbd46..78387b2a 100644 --- a/src/components/layoutComponents/Header.tsx +++ b/src/components/layoutComponents/Header.tsx @@ -1,14 +1,16 @@ import React from 'react'; -import { Button } from 'antd'; +import { Avatar, Button } from 'antd'; import { UserOutlined } from '@ant-design/icons'; import { Link } from 'react-router-dom'; export function Header() { + const defaultAvatar = 'http://localhost:3001/default-avatar.png'; return (
😈 DEVIL music - - + + {localStorage.getItem('user') ? + : }
); diff --git a/src/components/layoutComponents/Layout.tsx b/src/components/layoutComponents/Layout.tsx index 63c8134d..3c754ed1 100644 --- a/src/components/layoutComponents/Layout.tsx +++ b/src/components/layoutComponents/Layout.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from 'antd'; import { UserOutlined } from '@ant-design/icons'; -import { Link, Outlet } from 'react-router-dom'; +import { Link, Outlet, useLocation } from 'react-router-dom'; import { IPlaylist, ISong, IAlbum, IGenre, IAdvertisement } from '../../models/IModels'; import { CurrentTrack } from '../songComponents/CurrentTrack'; import { AdBlock } from './AdBlock'; @@ -10,17 +10,26 @@ import { Header } from './Header'; import { MenuBlock } from './MenuBlock'; import { useEffect, useRef } from 'react'; import { usePlayingContext } from '../../contexts/SongContexts/PlayingProvider'; - +import { useCurrentSongContext } from '../../contexts/SongContexts/SongContextProvider'; +import { useCurrentPlaylistContext } from '../../contexts/SongContexts/CurrentPlaylistProvider'; +import { getSong } from '../../API/api'; export function Layout() { + const { songId } = useCurrentSongContext(); + const { playlist } = useCurrentPlaylistContext(); + return ( - <> -
-
+
+
-
-
+
+ {songId && playlist.length > 0 && ( + s.id === songId) ?? playlist[0]} songs={playlist} /> + )} +