Merge branch 'master' into feat/i18n

components/Button.tsx

@@ -1,4 +1,4 @@
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 import React, { PropsWithChildren, ReactNode, useMemo } from "react";
 import { Text, TouchableOpacity, View } from "react-native";
 import { Loader } from "./Loader";
@@ -43,6 +43,8 @@ export const Button: React.FC<PropsWithChildren<ButtonProps>> = ({
     }
   }, [color]);
 
+  const lightHapticFeedback = useHaptic("light");
+
   return (
     <TouchableOpacity
       className={`
@@ -54,7 +56,7 @@ export const Button: React.FC<PropsWithChildren<ButtonProps>> = ({
       onPress={() => {
         if (!loading && !disabled && onPress) {
           onPress();
-          Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+          lightHapticFeedback();
         }
       }}
       disabled={disabled || loading}

components/PlayButton.tsx

@@ -32,8 +32,8 @@ import Animated, {
 import { Button } from "./Button";
 import { SelectedOptions } from "./ItemContent";
 import { chromecastProfile } from "@/utils/profiles/chromecast";
-import * as Haptics from "expo-haptics";
 import { useTranslation } from "react-i18next";
+import { useHaptic } from "@/hooks/useHaptic";
 
 interface Props extends React.ComponentProps<typeof Button> {
   item: BaseItemDto;
@@ -66,6 +66,7 @@ export const PlayButton: React.FC<Props> = ({
   const widthProgress = useSharedValue(0);
   const colorChangeProgress = useSharedValue(0);
   const [settings] = useSettings();
+  const lightHapticFeedback = useHaptic("light");
 
   const goToPlayer = useCallback(
     (q: string, bitrateValue: number | undefined) => {
@@ -81,7 +82,7 @@ export const PlayButton: React.FC<Props> = ({
   const onPress = useCallback(async () => {
     if (!item) return;
 
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
 
     const queryParams = new URLSearchParams({
       itemId: item.Id!,

components/RoundButton.tsx

@@ -6,7 +6,7 @@ import {
   TouchableOpacity,
   TouchableOpacityProps,
 } from "react-native";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 
 interface Props extends TouchableOpacityProps {
   onPress?: () => void;
@@ -29,10 +29,11 @@ export const RoundButton: React.FC<PropsWithChildren<Props>> = ({
 }) => {
   const buttonSize = size === "large" ? "h-10 w-10" : "h-9 w-9";
   const fillColorClass = fillColor === "primary" ? "bg-purple-600" : "";
+  const lightHapticFeedback = useHaptic("light");
 
   const handlePress = () => {
     if (hapticFeedback) {
-      Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+      lightHapticFeedback();
     }
     onPress?.();
   };

components/downloads/EpisodeCard.tsx

@@ -1,5 +1,5 @@
 import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 import React, { useCallback, useMemo } from "react";
 import { TouchableOpacity, TouchableOpacityProps, View } from "react-native";
 import {
@@ -26,6 +26,7 @@ export const EpisodeCard: React.FC<EpisodeCardProps> = ({ item, ...props }) => {
   const { deleteFile } = useDownload();
   const { openFile } = useDownloadedFileOpener();
   const { showActionSheetWithOptions } = useActionSheet();
+  const successHapticFeedback = useHaptic("success");
 
   const base64Image = useMemo(() => {
     return storage.getString(item.Id!);
@@ -41,7 +42,7 @@ export const EpisodeCard: React.FC<EpisodeCardProps> = ({ item, ...props }) => {
   const handleDeleteFile = useCallback(() => {
     if (item.Id) {
       deleteFile(item.Id);
-      Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
+      successHapticFeedback();
     }
   }, [deleteFile, item.Id]);
 

components/downloads/MovieCard.tsx

@@ -3,7 +3,7 @@ import {
   useActionSheet,
 } from "@expo/react-native-action-sheet";
 import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 import React, { useCallback, useMemo } from "react";
 import { TouchableOpacity, View } from "react-native";
 
@@ -28,6 +28,7 @@ export const MovieCard: React.FC<MovieCardProps> = ({ item }) => {
   const { deleteFile } = useDownload();
   const { openFile } = useDownloadedFileOpener();
   const { showActionSheetWithOptions } = useActionSheet();
+  const successHapticFeedback = useHaptic("success");
 
   const handleOpenFile = useCallback(() => {
     openFile(item);
@@ -43,7 +44,7 @@ export const MovieCard: React.FC<MovieCardProps> = ({ item }) => {
   const handleDeleteFile = useCallback(() => {
     if (item.Id) {
       deleteFile(item.Id);
-      Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
+      successHapticFeedback();
     }
   }, [deleteFile, item.Id]);
 

components/home/LargeMovieCarousel.tsx

@@ -22,7 +22,7 @@ import { itemRouter, TouchableItemRouter } from "../common/TouchableItemRouter";
 import { Loader } from "../Loader";
 import { Gesture, GestureDetector } from "react-native-gesture-handler";
 import { useRouter, useSegments } from "expo-router";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 
 interface Props extends ViewProps {}
 
@@ -128,6 +128,7 @@ const RenderItem: React.FC<{ item: BaseItemDto }> = ({ item }) => {
   const [api] = useAtom(apiAtom);
   const router = useRouter();
   const screenWidth = Dimensions.get("screen").width;
+  const lightHapticFeedback = useHaptic("light");
 
   const uri = useMemo(() => {
     if (!api) return null;
@@ -153,7 +154,7 @@ const RenderItem: React.FC<{ item: BaseItemDto }> = ({ item }) => {
   const handleRoute = useCallback(() => {
     if (!from) return;
     const url = itemRouter(item, from);
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
     // @ts-ignore
     if (url) router.push(url);
   }, [item, from]);

components/settings/OtherSettings.tsx

@@ -181,6 +181,15 @@ export const OtherSettings: React.FC = () => {
           }
         />
       </ListItem>
+
+      <ListItem title="Disable Haptic Feedback">
+        <Switch
+          value={settings.disableHapticFeedback}
+          onValueChange={(value) =>
+            updateSettings({ disableHapticFeedback: value })
+          }
+        />
+      </ListItem>
     </ListGroup>
   );
 };

components/settings/QuickConnect.tsx

@@ -7,8 +7,8 @@ import {
   BottomSheetView,
 } from "@gorhom/bottom-sheet";
 import { getQuickConnectApi } from "@jellyfin/sdk/lib/utils/api";
-import * as Haptics from "expo-haptics";
 import { useTranslation } from "react-i18next";
+import { useHaptic } from "@/hooks/useHaptic";
 import { useAtom } from "jotai";
 import React, { useCallback, useRef, useState } from "react";
 import { Alert, View, ViewProps } from "react-native";
@@ -24,6 +24,8 @@ export const QuickConnect: React.FC<Props> = ({ ...props }) => {
   const [user] = useAtom(userAtom);
   const [quickConnectCode, setQuickConnectCode] = useState<string>();
   const bottomSheetModalRef = useRef<BottomSheetModal>(null);
+  const successHapticFeedback = useHaptic("success");
+  const errorHapticFeedback = useHaptic("error");
 
   const { t } = useTranslation();
 
@@ -46,16 +48,16 @@ export const QuickConnect: React.FC<Props> = ({ ...props }) => {
           userId: user?.Id,
         });
         if (res.status === 200) {
-          Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
+          successHapticFeedback();
           Alert.alert(t("home.settings.quick_connect.success"), t("home.settings.quick_connect.quick_connect_autorized"));
           setQuickConnectCode(undefined);
           bottomSheetModalRef?.current?.close();
         } else {
-          Haptics.notificationAsync(Haptics.NotificationFeedbackType.Error);
+          errorHapticFeedback();
           Alert.alert(t("home.settings.quick_connect.error"), t("home.settings.quick_connect.invalid_code"));
         }
       } catch (e) {
-        Haptics.notificationAsync(Haptics.NotificationFeedbackType.Error);
+        errorHapticFeedback();
         Alert.alert(t("home.settings.quick_connect.error"), t("home.settings.quick_connect.invalid_code"));
       }
     }

components/settings/StorageSettings.tsx

@@ -4,7 +4,7 @@ import { useDownload } from "@/providers/DownloadProvider";
 import { clearLogs } from "@/utils/log";
 import { useQuery } from "@tanstack/react-query";
 import * as FileSystem from "expo-file-system";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 import { View } from "react-native";
 import * as Progress from "react-native-progress";
 import { toast } from "sonner-native";
@@ -15,6 +15,8 @@ import { useTranslation } from "react-i18next";
 export const StorageSettings = () => {
   const { deleteAllFiles, appSizeUsage } = useDownload();
   const { t } = useTranslation();
+  const successHapticFeedback = useHaptic("success");
+  const errorHapticFeedback = useHaptic("error");
 
   const { data: size, isLoading: appSizeLoading } = useQuery({
     queryKey: ["appSize", appSizeUsage],
@@ -31,9 +33,9 @@ export const StorageSettings = () => {
   const onDeleteClicked = async () => {
     try {
       await deleteAllFiles();
-      Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
+      successHapticFeedback();
     } catch (e) {
-      Haptics.notificationAsync(Haptics.NotificationFeedbackType.Error);
+      errorHapticFeedback();
       toast.error(t("home.settings.toasts.error_deleting_files"));
     }
   };

components/video-player/controls/Controls.tsx

@@ -29,7 +29,7 @@ import {
   BaseItemDto,
   MediaSourceInfo,
 } from "@jellyfin/sdk/lib/generated-client";
-import * as Haptics from "expo-haptics";
+import { useHaptic } from "@/hooks/useHaptic";
 import { Image } from "expo-image";
 import { useLocalSearchParams, useRouter } from "expo-router";
 import { useAtom } from "jotai";
@@ -157,10 +157,12 @@ export const Controls: React.FC<Props> = ({
     isVlc
   );
 
+  const lightHapticFeedback = useHaptic("light");
+
   const goToPreviousItem = useCallback(() => {
     if (!previousItem || !settings) return;
 
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
 
     const previousIndexes: previousIndexes = {
       subtitleIndex: subtitleIndex ? parseInt(subtitleIndex) : undefined,
@@ -198,7 +200,7 @@ export const Controls: React.FC<Props> = ({
   const goToNextItem = useCallback(() => {
     if (!nextItem || !settings) return;
 
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
 
     const previousIndexes: previousIndexes = {
       subtitleIndex: subtitleIndex ? parseInt(subtitleIndex) : undefined,
@@ -326,7 +328,7 @@ export const Controls: React.FC<Props> = ({
   const handleSkipBackward = useCallback(async () => {
     if (!settings?.rewindSkipTime) return;
     wasPlayingRef.current = isPlaying;
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
     try {
       const curr = progress.value;
       if (curr !== undefined) {
@@ -344,7 +346,7 @@ export const Controls: React.FC<Props> = ({
   const handleSkipForward = useCallback(async () => {
     if (!settings?.forwardSkipTime) return;
     wasPlayingRef.current = isPlaying;
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
     try {
       const curr = progress.value;
       if (curr !== undefined) {
@@ -361,7 +363,7 @@ export const Controls: React.FC<Props> = ({
 
   const toggleIgnoreSafeAreas = useCallback(() => {
     setIgnoreSafeAreas((prev) => !prev);
-    Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+    lightHapticFeedback();
   }, []);
 
   const memoizedRenderBubble = useCallback(() => {
@@ -440,7 +442,7 @@ export const Controls: React.FC<Props> = ({
         const gotoItem = await getItemById(api, itemId);
         if (!settings || !gotoItem) return;
 
-        Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+        lightHapticFeedback();
 
         const previousIndexes: previousIndexes = {
           subtitleIndex: subtitleIndex ? parseInt(subtitleIndex) : undefined,
@@ -584,7 +586,7 @@ export const Controls: React.FC<Props> = ({
               )}
               <TouchableOpacity
                 onPress={async () => {
-                  Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
+                  lightHapticFeedback();
                   router.back();
                 }}
                 className="aspect-square flex flex-col bg-neutral-800/90 rounded-xl items-center justify-center p-2"