Changeset 27660af for frontend


Ignore:
Timestamp:
02/09/26 21:35:51 (5 months ago)
Author:
Filip Gavrilovski <filipgavrilovski28@…>
Branches:
main
Children:
890e036
Parents:
8dd3e22
Message:

update form for publishing music - replace mock search with api calls

Location:
frontend/src
Files:
1 added
2 edited

Legend:

Unmodified
Added
Removed

  • frontend/src/pages/PublishSong.tsx

    r8dd3e22 r27660af  
    22import { Link, useNavigate } from "react-router-dom";
    33import { toast } from "react-toastify";
     4import axiosInstance from "../api/axiosInstance";
    45import { useAuth } from "../context/authContext";
    5 
    6 interface Contributor {
    7         username: string;
    8         fullName: string;
    9         role: string;
    10 }
    11 
    12 interface ArtistSearchResult {
    13         username: string;
    14         fullName: string;
    15         profilePhoto?: string;
    16 }
    17 
    18 interface SongEntry {
    19         title: string;
    20         link: string;
    21         contributors: Contributor[];
    22 }
    23 
    24 const ROLE_OPTIONS = [
    25         { value: "FEATURED", label: "Featured" },
    26         { value: "PRODUCER", label: "Producer" },
    27         { value: "SONGWRITER", label: "Songwriter" },
    28         { value: "COMPOSER", label: "Composer" },
    29         { value: "MIXER", label: "Mixer" },
    30         { value: "ENGINEER", label: "Engineer" },
    31 ];
    32 
    33 const GENRE_OPTIONS = [
    34         "Pop",
    35         "Rock",
    36         "Hip-Hop",
    37         "R&B",
    38         "Electronic",
    39         "Jazz",
    40         "Classical",
    41         "Country",
    42         "Folk",
    43         "Latin",
    44         "Metal",
    45         "Punk",
    46         "Indie",
    47         "Alternative",
    48         "Blues",
    49         "Soul",
    50         "Reggae",
    51         "Funk",
    52         "Disco",
    53         "House",
    54         "Techno",
    55         "Ambient",
    56         "Other",
    57 ];
    58 
    59 // Mock artist search results
    60 const MOCK_ARTISTS: ArtistSearchResult[] = [
    61         { username: "john_doe", fullName: "John Doe" },
    62         { username: "jane_smith", fullName: "Jane Smith" },
    63         { username: "mike_producer", fullName: "Mike the Producer" },
    64         { username: "sarah_vocals", fullName: "Sarah Vocals" },
    65         { username: "alex_beats", fullName: "Alex Beats" },
    66 ];
     6import { GENRE_OPTIONS, ROLE_OPTIONS } from "../utils/consts";
     7import type {
     8        ArtistSearchResult,
     9        Contributor,
     10        SongEntry,
     11} from "../utils/types";
    6712
    6813const MAX_CONTRIBUTORS = 5;
    … …  
    14590                setIsSearching(true);
    14691                try {
    147                         // TODO: replace with api call
    148                         // const response = await axiosInstance.get(`/users/search?type=ARTIST&q=${encodeURIComponent(query)}`);
    149                         // setSearchResults(response.data);
    150 
    151                         // Mock search - filter by name
    152                         await new Promise((resolve) => setTimeout(resolve, 200));
    153                         const filtered = MOCK_ARTISTS.filter(
    154                                 (artist) =>
     92                        const response = await axiosInstance.get(
     93                                `/users/search?type=ARTIST&q=${encodeURIComponent(query)}&limit=5`,
     94                        );
     95
     96                        const filtered = response.data.filter(
     97                                (artist: ArtistSearchResult) =>
    15598                                        artist.fullName.toLowerCase().includes(query.toLowerCase()) ||
    15699                                        artist.username.toLowerCase().includes(query.toLowerCase()),
    … …  
    276219
    277220                        // TODO: replace with api call
    278                         await new Promise((resolve) => setTimeout(resolve, 200));
    279                         const filtered = MOCK_ARTISTS.filter(
    280                                 (artist) =>
     221                        const response = await axiosInstance.get(
     222                                `/users/search?type=ARTIST&q=${encodeURIComponent(query)}&limit=5`,
     223                        );
     224                        const filtered = response.data.filter(
     225                                (artist: ArtistSearchResult) =>
    281226                                        artist.fullName.toLowerCase().includes(query.toLowerCase()) ||
    282227                                        artist.username.toLowerCase().includes(query.toLowerCase()),

  • frontend/src/utils/types.ts

    r8dd3e22 r27660af  
    117117        releaseDate: string;
    118118}
     119
     120export interface Contributor {
     121        username: string;
     122        fullName: string;
     123        role: string;
     124}
     125
     126export interface ArtistSearchResult {
     127        username: string;
     128        fullName: string;
     129        profilePhoto?: string;
     130}
     131
     132export interface SongEntry {
     133        title: string;
     134        link: string;
     135        contributors: Contributor[];
     136}
Note: See TracChangeset for help on using the changeset viewer.