diff --git a/apps/expo/package.json b/apps/expo/package.json index 82c6678..067987c 100644 --- a/apps/expo/package.json +++ b/apps/expo/package.json @@ -30,7 +30,9 @@ "@tamagui/babel-plugin": "^1.91.4", "@tamagui/config": "^1.91.4", "@tamagui/metro-plugin": "^1.91.4", + "@tamagui/toast": "1.91.4", "@tanstack/react-query": "^5.22.2", + "burnt": "^0.12.2", "class-variance-authority": "^0.7.0", "expo": "~50.0.13", "expo-av": "~13.10.5", diff --git a/apps/expo/src/app/_layout.tsx b/apps/expo/src/app/_layout.tsx index 78ccc46..c9a1a6d 100644 --- a/apps/expo/src/app/_layout.tsx +++ b/apps/expo/src/app/_layout.tsx @@ -5,6 +5,7 @@ import { useFonts } from "expo-font"; import { SplashScreen, Stack } from "expo-router"; import FontAwesome from "@expo/vector-icons/FontAwesome"; import { DarkTheme, ThemeProvider } from "@react-navigation/native"; +import { ToastProvider, ToastViewport } from "@tamagui/toast"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { TamaguiProvider, Theme, useTheme } from "tamagui"; import tamaguiConfig from "tamagui.config"; @@ -106,11 +107,14 @@ function RootLayoutNav() { return ( - - - - - + + + + + + + + ); diff --git a/apps/expo/src/components/item/item.tsx b/apps/expo/src/components/item/item.tsx index 0b1cd53..380f0c9 100644 --- a/apps/expo/src/components/item/item.tsx +++ b/apps/expo/src/components/item/item.tsx @@ -5,7 +5,7 @@ import ContextMenu from "react-native-context-menu-view"; import { useRouter } from "expo-router"; import { Image, Text, View } from "tamagui"; -import { useDownloadManager } from "~/hooks/DownloadManagerContext"; +// import { useDownloadManager } from "~/hooks/DownloadManagerContext"; import { usePlayerStore } from "~/stores/player/store"; export interface ItemData { @@ -19,7 +19,7 @@ export interface ItemData { export default function Item({ data }: { data: ItemData }) { const resetVideo = usePlayerStore((state) => state.resetVideo); const router = useRouter(); - const { startDownload } = useDownloadManager(); + // const { startDownload } = useDownloadManager(); const { title, type, year, posterUrl } = data; @@ -41,10 +41,10 @@ export default function Item({ data }: { data: ItemData }) { e: NativeSyntheticEvent, ) => { console.log(e.nativeEvent.name); - startDownload( - "https://samplelib.com/lib/preview/mp4/sample-5s.mp4", - "mp4", - ).catch(console.error); + // startDownload( + // "https://samplelib.com/lib/preview/mp4/sample-5s.mp4", + // "mp4", + // ).catch(console.error); }; return ( diff --git a/apps/expo/src/hooks/DownloadManagerContext.tsx b/apps/expo/src/hooks/DownloadManagerContext.tsx index b33457a..fc7958a 100644 --- a/apps/expo/src/hooks/DownloadManagerContext.tsx +++ b/apps/expo/src/hooks/DownloadManagerContext.tsx @@ -2,6 +2,7 @@ import type { ReactNode } from "react"; import React, { createContext, useContext, useEffect, useState } from "react"; import * as FileSystem from "expo-file-system"; import * as MediaLibrary from "expo-media-library"; +import { useToastController } from "@tamagui/toast"; import { loadDownloadHistory, saveDownloadHistory } from "~/settings"; @@ -42,6 +43,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ children, }) => { const [downloads, setDownloads] = useState([]); + const toastController = useToastController(); useEffect(() => { const initializeDownloads = async () => { @@ -58,7 +60,16 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ void saveDownloadHistory(downloads.slice(0, 10)); }, [downloads]); - const startDownload = async (url: string, type: "mp4" | "hls") => { + const startDownload = async ( + url: string, + type: "mp4" | "hls", + headers?: Record, + ) => { + toastController.show("Download started", { + burntOptions: { preset: "none" }, + native: true, + }); + const newDownload: DownloadItem = { id: `download-${Date.now()}-${Math.random().toString(16).slice(2)}`, filename: url.split("/").pop() ?? "unknown", @@ -74,7 +85,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ setDownloads((currentDownloads) => [newDownload, ...currentDownloads]); if (type === "mp4") { - await downloadMP4(url, newDownload.id); + await downloadMP4(url, newDownload.id, headers ?? {}); } else if (type === "hls") { // HLS stuff later } @@ -88,7 +99,11 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ ); }; - const downloadMP4 = async (url: string, downloadId: string) => { + const downloadMP4 = async ( + url: string, + downloadId: string, + headers: Record, + ) => { let lastBytesWritten = 0; let lastTimestamp = Date.now(); @@ -126,7 +141,7 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ const downloadResumable = FileSystem.createDownloadResumable( url, fileUri, - {}, + { headers }, callback, ); @@ -161,8 +176,16 @@ export const DownloadManagerProvider: React.FC<{ children: ReactNode }> = ({ isFinished: true, }); console.log("File saved to media library and original deleted"); + toastController.show("Download finished", { + burntOptions: { preset: "done" }, + native: true, + }); } catch (error) { console.error("Error saving file to media library:", error); + toastController.show("Download failed", { + burntOptions: { preset: "error" }, + native: true, + }); } }; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b081df4..aebba18 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -62,9 +62,15 @@ importers: '@tamagui/metro-plugin': specifier: ^1.91.4 version: 1.91.4(@babel/core@7.23.9)(react-dom@18.2.0)(react-native-reanimated@3.6.2)(react-native-safe-area-context@4.8.2)(react-native-svg@14.1.0)(react-native@0.73.5)(react@18.2.0)(tailwindcss@3.4.1)(typescript@5.3.3) + '@tamagui/toast': + specifier: 1.91.4 + version: 1.91.4(react-native@0.73.5)(react@18.2.0) '@tanstack/react-query': specifier: ^5.22.2 version: 5.22.2(react@18.2.0) + burnt: + specifier: ^0.12.2 + version: 0.12.2(expo@50.0.13)(react-dom@18.2.0)(react-native@0.73.5)(react@18.2.0) class-variance-authority: specifier: ^0.7.0 version: 0.7.0 @@ -4745,6 +4751,29 @@ packages: resolution: {integrity: sha512-mr7y7CulY4QAkGDhpCzZwNbHBsCDsVFMtnmwTZdQzJ8HzoDKx7MOFDywstBjL8TjSu5HeO1ExF3JrLzCrhpwCA==} dev: false + /@tamagui/toast@1.91.4(react-native@0.73.5)(react@18.2.0): + resolution: {integrity: sha512-04EMrFPhFYaFopaSw6SiJKpwtOlXyq/Qb4Q0ox+ksFs5FQdHD99pB/DnsAZDQXziz8WuQQFOsH+/lM16loCMng==} + peerDependencies: + react: '*' + react-native: '*' + dependencies: + '@tamagui/animate-presence': 1.91.4(react@18.2.0) + '@tamagui/compose-refs': 1.91.4(react@18.2.0) + '@tamagui/constants': 1.91.4(react@18.2.0) + '@tamagui/core': 1.91.4(react@18.2.0) + '@tamagui/create-context': 1.91.4(react@18.2.0) + '@tamagui/dismissable': 1.91.4(react@18.2.0) + '@tamagui/helpers': 1.91.4(react@18.2.0) + '@tamagui/polyfill-dev': 1.91.4 + '@tamagui/portal': 1.91.4(react-native@0.73.5)(react@18.2.0) + '@tamagui/stacks': 1.91.4(react@18.2.0) + '@tamagui/text': 1.91.4(react-native@0.73.5)(react@18.2.0) + '@tamagui/use-controllable-state': 1.91.4(react@18.2.0) + '@tamagui/visually-hidden': 1.91.4(react@18.2.0) + react: 18.2.0 + react-native: 0.73.5(@babel/core@7.23.9)(@babel/preset-env@7.23.9)(react@18.2.0) + dev: false + /@tamagui/toggle-group@1.91.4(@types/react@18.2.52)(immer@10.0.3)(react-native@0.73.5)(react@18.2.0): resolution: {integrity: sha512-5ynNkWDIt8bsdMaWuLMW/KCTwG5kHFRTN1xKWsjqfqKP5wjYhUKros+OhCu51E+Odw9CIsIh7glqRzrAjruMjg==} peerDependencies: @@ -6058,6 +6087,22 @@ packages: semver: 7.5.4 dev: true + /burnt@0.12.2(expo@50.0.13)(react-dom@18.2.0)(react-native@0.73.5)(react@18.2.0): + resolution: {integrity: sha512-bbZjGN4Om7dykr8ZcLb0tTO5L2becMR+HIez1ySUGgG/rvK+ePgBEuBA6lMOZqOTsUXhIKFUBH0sCXQ25fq5SA==} + peerDependencies: + expo: '*' + react: '*' + react-native: '*' + dependencies: + expo: 50.0.13(@babel/core@7.23.9)(@react-native/babel-preset@0.73.21) + react: 18.2.0 + react-native: 0.73.5(@babel/core@7.23.9)(@babel/preset-env@7.23.9)(react@18.2.0) + sf-symbols-typescript: 1.0.0 + sonner: 0.3.5(react-dom@18.2.0)(react@18.2.0) + transitivePeerDependencies: + - react-dom + dev: false + /bytes@3.0.0: resolution: {integrity: sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==} engines: {node: '>= 0.8'} @@ -12130,6 +12175,11 @@ packages: resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==} dev: false + /sf-symbols-typescript@1.0.0: + resolution: {integrity: sha512-DkS7q3nN68dEMb4E18HFPDAvyrjDZK9YAQQF2QxeFu9gp2xRDXFMF8qLJ1EmQ/qeEGQmop4lmMM1WtYJTIcCMw==} + engines: {node: '>=10'} + dev: false + /sha.js@2.4.11: resolution: {integrity: sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==} hasBin: true @@ -12271,6 +12321,16 @@ packages: smart-buffer: 4.2.0 dev: true + /sonner@0.3.5(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-yIwaQ4dftMvFApuruto2t7wGyyaPRpj5qYBWYJIz4Z7uGcVn0IfqI/hWN0JyJN4izNbZFuCYZISf3fOGnvSlNQ==} + peerDependencies: + react: ^18.0.0 + react-dom: ^18.0.0 + dependencies: + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false + /sort-keys@2.0.0: resolution: {integrity: sha512-/dPCrG1s3ePpWm6yBbxZq5Be1dXGLyLn9Z791chDC3NFrpkVbWGzkBwPN1knaciexFXgRJ7hzdnwZ4stHSDmjg==} engines: {node: '>=4'}