Merge branch 'apple-music' of https://github.com/statsfm/web into apple-music

Author: netlob

src/pages/import.tsx

@@ -22,6 +22,7 @@ import Dropzone from 'react-dropzone';
 import { MdFileUpload, MdWarning } from 'react-icons/md';
 import { BlobReader, TextWriter, ZipReader } from '@zip.js/zip.js';
 import { Button } from '@/components/Button';
+import { Platform } from '@/utils/statsfm';
 
 type Props = {};
 
@@ -36,7 +37,7 @@ export const getServerSideProps: GetServerSideProps<SSRProps> = async (ctx) => {
 };
 
 interface ImportService {
-  id: string;
+  id: Platform;
   name: string;
   enabled: boolean;
   acceptFiles: Accept;
@@ -58,7 +59,7 @@ const ImportPage: NextPage<Props> = () => {
 
   const services: ImportService[] = [
     {
-      id: 'spotify',
+      id: Platform.SPOTIFY,
       name: 'Spotify',
       enabled: true,
       acceptFiles: {
@@ -137,15 +138,32 @@ const ImportPage: NextPage<Props> = () => {
         }
       },
     },
-    // {
-    //   id: 'applemusic',
-    //   name: 'Apple Music',
-    //   enabled: false,
-    //   acceptFiles: {
-    //     'text/csv': ['.csv'],
-    //   },
-    //   handleFileUpload: async () => {},
-    // },
+    {
+      id: Platform.APPLEMUSIC,
+      name: 'Apple Music',
+      enabled: true,
+      acceptFiles: {
+        'text/csv': ['.csv'],
+      },
+      handleFileUpload: async (files) => {
+        toaster.message('Processing files...');
+        // eslint-disable-next-line no-restricted-syntax
+        for await (const file of files) {
+          const content = await file.text();
+          setUploadedFiles((oldList) => [
+            ...oldList,
+            {
+              name: file.name,
+              addedAt: new Date(),
+              contentType: file.type,
+              status: UploadedFilesStatus.Ready,
+              data: content,
+              service: Platform.APPLEMUSIC,
+            },
+          ]);
+        }
+      },
+    },
   ];
 
   const uploadFiles = async () => {
@@ -167,16 +185,25 @@ const ImportPage: NextPage<Props> = () => {
       uploadedFile.status = UploadedFilesStatus.Uploading;
       const oldUrl = api.options.http.apiUrl;
       try {
-        api.options.http.apiUrl = 'https://import.stats.fm/api';
+        api.options.http.apiUrl =
+          process.env.NEXT_PUBLIC_API_URL_IMPORT ??
+          'https://import.stats.fm/api';
         // eslint-disable-next-line no-await-in-loop
-        await api.me.import({
-          name: uploadedFile.name,
-          contentType: 'application/json',
-          data: JSON.stringify(uploadedFile.data),
-          key: 'files',
-        });
+        await api.me.import(
+          {
+            name: uploadedFile.name,
+            contentType: uploadedFile.contentType,
+            data:
+              uploadedFile.service === Platform.SPOTIFY
+                ? JSON.stringify(uploadedFile.data)
+                : uploadedFile.data,
+            key: 'files',
+          },
+          // eslint-disable-next-line @typescript-eslint/no-use-before-define
+          importService.id
+        );
 
-        event('IMPORT_upload_file');
+        event(`IMPORT_${uploadedFile.service}_upload_file`);
         uploadedFile.status = UploadedFilesStatus.Uploaded;
       } catch (e: any) {
         uploadedFile.status = UploadedFilesStatus.Failed;

src/utils/imports.ts

@@ -1,6 +1,7 @@
 import { z } from 'zod';
 import type { event } from 'nextjs-google-analytics';
 import type { SetStateAction } from 'react';
+import { Platform } from '@statsfm/statsfm.js';
 
 export const IMPORT_STATUS = {
   '-1': 'Errored!',
@@ -108,15 +109,17 @@ export function isJSONParsable(input: string) {
   }
 }
 
-export type UploadedImportFile<T extends any[] = any[]> = {
+export type UploadedImportFile = {
   name: string;
   addedAt: Date;
   status: UploadedFilesStatus;
+  service: Platform;
 } & (
   | { status: UploadedFilesStatus.Error; error: string }
   | {
       status: Exclude<UploadedFilesStatus, UploadedFilesStatus.Error>;
-      data: T;
+      data: any;
+      contentType: string;
     }
 );
 
@@ -132,7 +135,7 @@ export const SpotifyImport = {
       file.name.match(/StreamingHistory_music_[0-9][0-9]?.json/g) ||
       file.name.match(/StreamingHistory[0-9][0-9]?.json/g)
     ) {
-      utils.event('IMPORT_selected_spotify_account_data');
+      utils.event('IMPORT_SPOTIFY_selected_spotify_account_data');
       utils.setUploadedFiles((oldList) => [
         ...oldList,
         {
@@ -142,12 +145,13 @@ export const SpotifyImport = {
           status: UploadedFilesStatus.Error,
           error:
             'You are trying to upload the streaming history files from the "Account data" package, we do not support these files.',
+          service: Platform.SPOTIFY,
         },
       ]);
     } else {
       const fileText = file.content;
       if (!isJSONParsable(fileText)) {
-        utils.event('IMPORT_selected_invalid_file');
+        utils.event('IMPORT_SPOTIFY_selected_invalid_file');
         utils.setUploadedFiles((oldList) => [
           ...oldList,
           {
@@ -156,6 +160,7 @@ export const SpotifyImport = {
             uploaded: false,
             status: UploadedFilesStatus.Error,
             error: 'The file you selected is not a valid json file.',
+            service: Platform.SPOTIFY,
           },
         ]);
         return;
@@ -165,7 +170,7 @@ export const SpotifyImport = {
       try {
         spotifyStreams = await spotifyImportFileSchema.parseAsync(jsonStreams);
       } catch (e: any) {
-        utils.event('IMPORT_selected_invalid_file');
+        utils.event('IMPORT_SPOTIFY_selected_invalid_file');
         utils.setUploadedFiles((oldList) => [
           ...oldList,
           {
@@ -174,6 +179,7 @@ export const SpotifyImport = {
             uploaded: false,
             status: UploadedFilesStatus.Error,
             error: 'The file you selected does not contain valid data.',
+            service: Platform.SPOTIFY,
           },
         ]);
         return;
@@ -201,6 +207,8 @@ export const SpotifyImport = {
           uploaded: false,
           status: UploadedFilesStatus.Ready,
           data: validStreams,
+          service: Platform.SPOTIFY,
+          contentType: 'application/json',
         },
       ]);
     }

yarn.lock

@@ -854,8 +854,8 @@
   integrity sha512-LwzQKA4vzIct1zNZzBmRKI9QuNpLgTQMEjsQLf3BXuGYb3QPTP4Yjf6mkdX+X1mYttZ808QpOwAzZjv28kq7DA==
 
 "@statsfm/statsfm.js@https://github.com/statsfm/statsfm.js#apple-music-build":
-  version "2.1.8"
-  resolved "https://github.com/statsfm/statsfm.js#538f0e7291f04cd2fe0921a85ef5c86a916dfce8"
+  version "2.1.11"
+  resolved "https://github.com/statsfm/statsfm.js#176b64d2b2f1f3d5a8cdc567342f4bd41cbfe0d6"
   dependencies:
     file-type "16"
     isomorphic-unfetch "^3.1.0"