feat(artist): sync data from table

chiptus · chiptus · commit db5273d7276e · 2025-09-27T16:20:06.000+03:00
diff --git a/src/hooks/queries/artists/useArtists.ts b/src/hooks/queries/artists/useArtists.ts
@@ -4,6 +4,7 @@ import type { Database } from "@/integrations/supabase/types";
 
 export type Artist = Database["public"]["Tables"]["artists"]["Row"] & {
   artist_music_genres: { music_genre_id: string }[] | null;
+  soundcloud_followers?: number;
 };
 
 // Query key factory
@@ -34,7 +35,27 @@ async function fetchArtists(): Promise<Artist[]> {
     throw new Error("Failed to fetch artists");
   }
 
-  return data || [];
+  const { data: soundcloudData, error: soundcloudError } = await supabase
+    .from("soundcloud")
+    .select("artist_id, followers_count");
+
+  if (soundcloudError) {
+    console.error("Error fetching soundcloud data:", soundcloudError);
+    throw new Error("Failed to fetch soundcloud data");
+  }
+
+  const soundcloudMap = new Map(
+    soundcloudData?.map((sc) => [sc.artist_id, sc.followers_count]) || [],
+  );
+
+  return (
+    data.map((artist) => {
+      return {
+        ...artist,
+        soundcloud_followers: soundcloudMap.get(artist.id) || 0,
+      };
+    }) || []
+  );
 }
 
 // Hook
diff --git a/src/integrations/supabase/types.ts b/src/integrations/supabase/types.ts
@@ -159,10 +159,8 @@ export type Database = {
           estimated_date: string | null;
           id: string;
           image_url: string | null;
-          last_soundcloud_sync: string | null;
           name: string;
           slug: string;
-          soundcloud_followers: number | null;
           soundcloud_url: string | null;
           spotify_url: string | null;
           stage: string | null;
@@ -178,10 +176,8 @@ export type Database = {
           estimated_date?: string | null;
           id?: string;
           image_url?: string | null;
-          last_soundcloud_sync?: string | null;
           name: string;
           slug: string;
-          soundcloud_followers?: number | null;
           soundcloud_url?: string | null;
           spotify_url?: string | null;
           stage?: string | null;
@@ -197,10 +193,8 @@ export type Database = {
           estimated_date?: string | null;
           id?: string;
           image_url?: string | null;
-          last_soundcloud_sync?: string | null;
           name?: string;
           slug?: string;
-          soundcloud_followers?: number | null;
           soundcloud_url?: string | null;
           spotify_url?: string | null;
           stage?: string | null;
@@ -637,6 +631,59 @@ export type Database = {
           },
         ];
       };
+      soundcloud: {
+        Row: {
+          artist_id: string;
+          created_at: string | null;
+          display_name: string | null;
+          followers_count: number | null;
+          id: string;
+          last_sync: string | null;
+          playlist_title: string | null;
+          playlist_url: string | null;
+          soundcloud_id: number | null;
+          soundcloud_url: string;
+          updated_at: string | null;
+          username: string | null;
+        };
+        Insert: {
+          artist_id: string;
+          created_at?: string | null;
+          display_name?: string | null;
+          followers_count?: number | null;
+          id?: string;
+          last_sync?: string | null;
+          playlist_title?: string | null;
+          playlist_url?: string | null;
+          soundcloud_id?: number | null;
+          soundcloud_url: string;
+          updated_at?: string | null;
+          username?: string | null;
+        };
+        Update: {
+          artist_id?: string;
+          created_at?: string | null;
+          display_name?: string | null;
+          followers_count?: number | null;
+          id?: string;
+          last_sync?: string | null;
+          playlist_title?: string | null;
+          playlist_url?: string | null;
+          soundcloud_id?: number | null;
+          soundcloud_url?: string;
+          updated_at?: string | null;
+          username?: string | null;
+        };
+        Relationships: [
+          {
+            foreignKeyName: "soundcloud_artist_id_fkey";
+            columns: ["artist_id"];
+            isOneToOne: true;
+            referencedRelation: "artists";
+            referencedColumns: ["id"];
+          },
+        ];
+      };
       stages: {
         Row: {
           archived: boolean;
diff --git a/src/pages/admin/ArtistsManagement/BulkEditor/BulkActionsToolbar.tsx b/src/pages/admin/ArtistsManagement/BulkEditor/BulkActionsToolbar.tsx
@@ -2,7 +2,6 @@ import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { CheckSquare, Square } from "lucide-react";
 import { ArchiveButton } from "../components/ArchiveButton";
-import { SoundCloudSyncButton } from "../components/SoundCloudSyncButton";
 
 interface BulkActionsToolbarProps {
   selectedCount: number;
@@ -40,8 +39,6 @@ export function BulkActionsToolbar({
         </>
       )}
 
-      <SoundCloudSyncButton />
-
       <Button variant="outline" size="sm" onClick={onSelectAll}>
         {allSelected ? (
           <>
diff --git a/src/pages/admin/ArtistsManagement/components/BulkEditorHeader.tsx b/src/pages/admin/ArtistsManagement/components/BulkEditorHeader.tsx
@@ -2,6 +2,7 @@ import { CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 import { Grid3X3, Plus, Copy } from "lucide-react";
 import { Link } from "react-router-dom";
+import { SoundCloudSyncButton } from "./SoundCloudSyncButton";
 
 interface BulkEditorHeaderProps {
   onAddArtist: () => void;
@@ -13,9 +14,11 @@ export function BulkEditorHeader({ onAddArtist }: BulkEditorHeaderProps) {
       <CardTitle className="flex items-center justify-between">
         <div className="flex items-center gap-3">
           <Grid3X3 className="h-5 w-5 text-blue-600" />
-          <span>Artists Management</span>
+          <span>Artists</span>
         </div>
         <div className="flex items-center gap-2">
+          <SoundCloudSyncButton />
+
           <Link to="/admin/artists/duplicates">
             <Button
               variant="outline"
diff --git a/src/pages/admin/ArtistsManagement/components/BulkEditorTable.tsx b/src/pages/admin/ArtistsManagement/components/BulkEditorTable.tsx
@@ -1,6 +1,6 @@
 import { Table, TableBody } from "@/components/ui/table";
 import type { Artist } from "@/hooks/queries/artists/useArtists";
-import type { SortConfig } from "../hooks/useArtistSorting";
+import type { SortConfig, SortingKey } from "../hooks/useArtistSorting";
 import { BulkEditorTableHeader } from "./BulkEditorTableHeader";
 import { BulkEditorTableRow } from "./BulkEditorTableRow";
 
@@ -9,7 +9,7 @@ interface BulkEditorTableProps {
   selectedIds: Set<string>;
   sortConfig: SortConfig;
   searchTerm: string;
-  onSort: (key: keyof Artist | "genres") => void;
+  onSort: (key: SortingKey) => void;
   onSelectAll: () => void;
   onSelectArtist: (artistId: string, isSelected: boolean) => void;
 }
diff --git a/src/pages/admin/ArtistsManagement/components/BulkEditorTableHeader.tsx b/src/pages/admin/ArtistsManagement/components/BulkEditorTableHeader.tsx
@@ -1,14 +1,13 @@
 import { TableHeader, TableRow, TableHead } from "@/components/ui/table";
 import { Checkbox } from "@/components/ui/checkbox";
-import type { Artist } from "@/hooks/queries/artists/useArtists";
-import type { SortConfig } from "../hooks/useArtistSorting";
+import type { SortConfig, SortingKey } from "../hooks/useArtistSorting";
 
 interface BulkEditorTableHeaderProps {
   selectedCount: number;
   totalCount: number;
   onSelectAll: () => void;
   sortConfig: SortConfig;
-  onSort: (key: keyof Artist | "genres") => void;
+  onSort: (key: SortingKey) => void;
 }
 
 export function BulkEditorTableHeader({
@@ -18,7 +17,7 @@ export function BulkEditorTableHeader({
   sortConfig,
   onSort,
 }: BulkEditorTableHeaderProps) {
-  function getSortIndicator(key: keyof Artist | "genres") {
+  function getSortIndicator(key: SortingKey) {
     if (sortConfig?.key !== key) return null;
     return sortConfig.direction === "asc" ? " ↑" : " ↓";
   }
diff --git a/src/pages/admin/ArtistsManagement/components/SoundCloudSyncButton.tsx b/src/pages/admin/ArtistsManagement/components/SoundCloudSyncButton.tsx
@@ -26,7 +26,10 @@ export function SoundCloudSyncButton({ className }: SoundCloudSyncButtonProps) {
       ) : (
         <Music className="h-3 w-3 mr-1" />
       )}
-      {syncMutation.isPending ? "Syncing..." : "Sync SoundCloud"}
+
+      <span className="hidden md:block">
+        {syncMutation.isPending ? "Syncing..." : "Sync SoundCloud"}
+      </span>
     </Button>
   );
 }
diff --git a/src/pages/admin/ArtistsManagement/hooks/useArtistSorting.ts b/src/pages/admin/ArtistsManagement/hooks/useArtistSorting.ts
@@ -1,15 +1,17 @@
 import { useState, useMemo } from "react";
 import type { Artist } from "@/hooks/queries/artists/useArtists";
 
+export type SortingKey = keyof Omit<Artist, "artist_music_genres"> | "genres";
+
 export type SortConfig = {
-  key: keyof Artist | "genres";
+  key: SortingKey;
   direction: "asc" | "desc";
 } | null;
 
 export function useArtistSorting() {
   const [sortConfig, setSortConfig] = useState<SortConfig>(null);
 
-  function handleSort(key: keyof Artist | "genres") {
+  function handleSort(key: SortingKey) {
     setSortConfig((current) => {
       if (current?.key === key) {
         return current.direction === "asc" ? { key, direction: "desc" } : null;
@@ -40,8 +42,8 @@ export function useArtistSorting() {
           aValue = a.artist_music_genres?.length || 0;
           bValue = b.artist_music_genres?.length || 0;
         } else {
-          aValue = a[sortConfig.key];
-          bValue = b[sortConfig.key];
+          aValue = a[sortConfig.key] || null;
+          bValue = b[sortConfig.key] || null;
         }
 
         // Handle null/undefined values
diff --git a/supabase/functions/_shared/soundcloud-api/auth.ts b/supabase/functions/_shared/soundcloud-api/auth.ts
@@ -1,50 +1,83 @@
 import { SoundCloudTokenResponseSchema } from "./schemas.ts";
 
+let cachedToken: {
+  token: string;
+  expiresAt: number;
+  refreshToken: string;
+} | null = null;
+
 export async function getSoundCloudAccessToken(
   clientId: string,
   clientSecret: string,
 ): Promise<string> {
+  if (
+    cachedToken &&
+    cachedToken.expiresAt > Date.now() + 60 * 1000 // 1 minute buffer
+  ) {
+    console.log("[getSoundCloudAccessToken] Using cached access token");
+    return cachedToken.token;
+  }
+
   console.log("[getSoundCloudAccessToken] Requesting access token...");
 
   const tokenUrl = "https://api.soundcloud.com/oauth2/token";
-
-  const response = await fetch(tokenUrl, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded",
-      Authorization: `Basic ${btoa(`${clientId}:${clientSecret}`)}`,
-    },
-    body: "grant_type=client_credentials",
-  });
-
-  if (!response.ok) {
-    const errorBody = await response
-      .text()
-      .catch(() => "Unable to read error response");
-    console.error("[getSoundCloudAccessToken] Failed to get access token:", {
-      status: response.status,
-      statusText: response.statusText,
-      body: errorBody,
+  try {
+    const response = await fetch(tokenUrl, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded",
+        Authorization: `Basic ${btoa(`${clientId}:${clientSecret}`)}`,
+      },
+      body: "grant_type=client_credentials",
     });
-    throw new Error(
-      `Failed to get SoundCloud access token: ${response.statusText}`,
-    );
-  }
 
-  const rawData = await response.json();
-
-  // Validate the token response structure
-  try {
-    const tokenData = SoundCloudTokenResponseSchema.parse(rawData);
     console.log(
-      "[getSoundCloudAccessToken] Successfully obtained and validated access token",
+      `[getSoundCloudAccessToken] Token response status: ${response.status} ${response.statusText}`,
     );
-    return tokenData.access_token;
-  } catch (validationError) {
-    console.error("[getSoundCloudAccessToken] Invalid token response format:", {
-      error: validationError,
-      rawData: JSON.stringify(rawData).slice(0, 200) + "...",
+
+    if (!response.ok) {
+      const errorBody = await response
+        .text()
+        .catch(() => "Unable to read error response");
+      console.error("[getSoundCloudAccessToken] Failed to get access token:", {
+        status: response.status,
+        statusText: response.statusText,
+        body: errorBody,
+      });
+      throw new Error(
+        `Failed to get SoundCloud access token: ${response.statusText}`,
+      );
+    }
+
+    const rawData = await response.json();
+
+    // Validate the token response structure
+    try {
+      const tokenData = SoundCloudTokenResponseSchema.parse(rawData);
+      console.log(
+        "[getSoundCloudAccessToken] Successfully obtained and validated access token",
+      );
+      const token = tokenData.access_token;
+      const expiresIn = tokenData.expires_in || 60; // Default to 1 minute if not provided
+      const expiresAt = Date.now() + expiresIn * 1000;
+
+      // Cache the token
+      cachedToken = { token, expiresAt, refreshToken: tokenData.refresh_token };
+      return token;
+    } catch (validationError) {
+      console.error(
+        "[getSoundCloudAccessToken] Invalid token response format:",
+        {
+          error: validationError,
+          rawData: JSON.stringify(rawData).slice(0, 200) + "...",
+        },
+      );
+      throw new Error("Invalid access token response from SoundCloud");
+    }
+  } catch (error) {
+    console.error("[getSoundCloudAccessToken] Error obtaining access token:", {
+      error,
     });
-    throw new Error("Invalid access token response from SoundCloud");
+    throw error;
   }
 }
diff --git a/supabase/functions/_shared/soundcloud-api/schemas.ts b/supabase/functions/_shared/soundcloud-api/schemas.ts
@@ -49,9 +49,10 @@ export const SoundCloudPlaylistSchema = z.object({
 
 export const SoundCloudTokenResponseSchema = z.object({
   access_token: z.string(),
-  token_type: z.string().optional(),
-  expires_in: z.number().optional(),
-  scope: z.string().optional(),
+  token_type: z.string(),
+  expires_in: z.number(),
+  scope: z.string(),
+  refresh_token: z.string(),
 });
 
 export const SoundCloudErrorResponseSchema = z.object({
diff --git a/supabase/functions/sync-artist-data/index.ts b/supabase/functions/sync-artist-data/index.ts
diff --git a/supabase/functions/sync-artist-data/processor.ts b/supabase/functions/sync-artist-data/processor.ts
diff --git a/supabase/functions/sync-artist-data/soundcloud-api.ts b/supabase/functions/sync-artist-data/soundcloud-api.ts
diff --git a/supabase/migrations/20250913000001_add_soundcloud_playlist_url.sql b/supabase/migrations/20250913000001_add_soundcloud_playlist_url.sql
diff --git a/supabase/seed.sql b/supabase/seed.sql
