Merge pull request #186 from mykhailodanilenko/feature/safari-video-s…

…pacing-fix Small fixes
OwnTube-tv · Oct 10, 2024 · a140d85 · a140d85
2 parents be3cfa5 + 8fa17ed
commit a140d85
Show file tree

Hide file tree

Showing 8 changed files with 47 additions and 25 deletions.
diff --git a/OwnTube.tv/components/VideoControlsOverlay/VideoControlsOverlay.tsx b/OwnTube.tv/components/VideoControlsOverlay/VideoControlsOverlay.tsx
@@ -3,7 +3,7 @@ import { Pressable, StyleSheet, View } from "react-native";
 import { useTheme } from "@react-navigation/native";
 import { Typography } from "../Typography";
 import { getHumanReadableDuration } from "../../utils";
-import { Link, useLocalSearchParams, useNavigation } from "expo-router";
+import { Link, useLocalSearchParams, useRouter } from "expo-router";
 import { VolumeControl } from "./components/VolumeControl";
 import * as Device from "expo-device";
 import { DeviceType } from "expo-device";
@@ -73,7 +73,7 @@ export const VideoControlsOverlay = ({
   const { backend } = useLocalSearchParams<RootStackParams[ROUTES.VIDEO]>();
   const { t } = useTranslation();
   const { colors } = useTheme();
-  const navigation = useNavigation();
+  const router = useRouter();
   const [isSeekBarFocused, setIsSeekBarFocused] = useState(false);
 
   const centralIconName = useMemo(() => {
@@ -89,6 +89,14 @@ export const VideoControlsOverlay = ({
 
   const isMobile = Device.deviceType !== DeviceType.DESKTOP;
 
+  const handlePressBack = () => {
+    if (router.canGoBack()) {
+      router.back();
+    } else {
+      router.navigate({ pathname: `/`, params: { backend } });
+    }
+  };
+
   return (
     // @ts-expect-error web cursor options not included in React Native core
     <Pressable style={[styles.overlay, { cursor: isVisible ? "auto" : "none" }]} onPress={onOverlayPress}>
@@ -106,7 +114,7 @@ export const VideoControlsOverlay = ({
               style={[styles.topControlsContainer, ...(isMobile ? [{ paddingTop: spacing.lg }] : [{ height: 360 }])]}
             >
               <View style={styles.topLeftControls} pointerEvents="box-none">
-                <PlayerButton onPress={navigation.goBack} icon="Arrow-Left" />
+                <PlayerButton onPress={handlePressBack} icon="Arrow-Left" />
                 <View style={styles.videoInfoContainer}>
                   <Link href={{ pathname: ROUTES.CHANNEL, params: { backend, channel: channel?.handle } }}>
                     <Typography

diff --git a/OwnTube.tv/components/VideoView/VideoView.web.tsx b/OwnTube.tv/components/VideoView/VideoView.web.tsx
@@ -264,11 +264,7 @@ const VideoView = ({
         handleShare={handleShare}
         handleOpenSettings={handleOpenSettings}
       >
-        <div
-          style={{ position: "relative", cursor: "pointer" }}
-          ref={videoRef}
-          data-testid={`${testID}-video-playback`}
-        />
+        <div style={{ position: "fixed", cursor: "pointer" }} ref={videoRef} data-testid={`${testID}-video-playback`} />
         {isMobile && isControlsVisible && <View style={styles.opacityOverlay} />}
       </VideoControlsOverlay>
     </View>

diff --git a/OwnTube.tv/components/ViewHistory.tsx b/OwnTube.tv/components/ViewHistory.tsx
@@ -108,9 +108,9 @@ export const ViewHistory = () => {
           style={styles.sectionListContainer}
           renderItem={renderItem}
           sections={sections}
-          renderSectionHeader={({ section: { title } }) => (
+          renderSectionHeader={({ section: { titleKey } }) => (
             <Typography style={styles.sectionHeader} color={colors.theme900} fontWeight="Bold" fontSize="sizeLg">
-              {title}
+              {t(titleKey)}
             </Typography>
           )}
           ItemSeparatorComponent={() => <Spacer height={spacing.xl} />}

diff --git a/OwnTube.tv/locales/en.json b/OwnTube.tv/locales/en.json
@@ -107,5 +107,11 @@
   },
   "retryQuestion": "Retry?",
   "videoFailedToLoad": "Video failed to load.",
+  "today": "Today",
+  "yesterday": "Yesterday",
+  "lastWeek": "Last Week",
+  "lastMonth": "Last Month",
+  "lastYear": "Last Year",
+  "olderThanAYear": "Older than a year",
   "showMore": "Show more"
 }
diff --git a/OwnTube.tv/locales/ru.json b/OwnTube.tv/locales/ru.json
@@ -107,5 +107,11 @@
   },
   "retryQuestion": "Попробовать еще раз?",
   "videoFailedToLoad": "Невозможно загрузить видео.",
+  "today": "Сегодня",
+  "yesterday": "Вчера",
+  "lastWeek": "На прошлой неделе",
+  "lastMonth": "В прошлом месяце",
+  "lastYear": "В прошлом году",
+  "olderThanAYear": "Старше года",
   "showMore": "Показать еще"
 }
diff --git a/OwnTube.tv/locales/uk.json b/OwnTube.tv/locales/uk.json
@@ -107,5 +107,11 @@
   },
   "retryQuestion": "Спробувати ще раз?",
   "videoFailedToLoad": "Неможливо завантажити відео.",
+  "today": "Сьогодні",
+  "yesterday": "Вчора",
+  "lastWeek": "Минулого тижня",
+  "lastMonth": "Минулого місяця",
+  "lastYear": "Минулого року",
+  "olderThanAYear": "Старші року",
   "showMore": "Показати ще"
 }
diff --git a/OwnTube.tv/public/featured-instances.json5 b/OwnTube.tv/public/featured-instances.json5
@@ -132,9 +132,9 @@
     logoUrl: "https://urbanists.video/static-extra/logo.svg",
   },
   {
-    name: "Pony.Tube",
-    description: "Pony.Tube is a PeerTube-enabled video streaming platform using P2P (Pony-to-Pony) technology to deliver the best pony videos directly to you.\n\nWe are a video sharing site that seeks to provide a haven for pony content that you may have issues uploading on larger sites like YouTube or you fear may be taken down for any reason. We seek to be entirely free of cost and free of ads.",
-    hostname: "pony.tube",
-    logoUrl: "https://pony.tube/client/assets/images/logo.svg?e0dbd40f0ab79f76a7794d48a5187fe59fd65dda",
+    name: "Swebbtube",
+    description: "Svensk Webbtelevision är ett medborgarfinansierat initiativ för att skapa en regelbunden och allsidig nyhets- och informationsförmedling som ger uttryck för ett breddat utbud av ämnen och perspektiv samt granskning av för demokratin grundläggande skeenden. Därför tror vi på en fri och öppen debatt där olika åsikter får komma till uttryck.",
+    hostname: "swebbtube.se",
+    logoUrl: "https://swebbtube.se/client/assets/images/logo.svg?cec19af8690344cefefeecddc5a123f4ebd980c9",
   },
 ]
diff --git a/OwnTube.tv/utils/grouping.ts b/OwnTube.tv/utils/grouping.ts
@@ -10,35 +10,35 @@ import {
 
 export const groupHistoryEntriesByTime = (
   entries: ViewHistoryEntry[],
-): Array<{ title: string; data: ViewHistoryEntry[] }> => {
+): Array<{ titleKey: string; data: ViewHistoryEntry[] }> => {
   return entries.reduce(
     (groups, entry) => {
       const date = new Date(entry.lastViewedAt);
-      let title = "";
+      let titleKey = "";
 
       if (isToday(date)) {
-        title = "Today";
+        titleKey = "today";
       } else if (isYesterday(date)) {
-        title = "Yesterday";
+        titleKey = "yesterday";
       } else if (differenceInCalendarDays(new Date(), date) <= 7) {
-        title = "Last Week";
+        titleKey = "lastWeek";
       } else if (differenceInCalendarMonths(new Date(), date) <= 1) {
-        title = "Last Month";
+        titleKey = "lastMonth";
       } else if (differenceInCalendarYears(new Date(), date) <= 1) {
-        title = "Last Year";
+        titleKey = "lastYear";
       } else {
-        title = "Older than a year";
+        titleKey = "olderThanAYear";
       }
 
-      const group = groups.find((g) => g.title === title);
+      const group = groups.find((g) => g.titleKey === titleKey);
       if (group) {
         group.data.push(entry);
       } else {
-        groups.push({ title, data: [entry] });
+        groups.push({ titleKey, data: [entry] });
       }
 
       return groups;
     },
-    [] as Array<{ title: string; data: ViewHistoryEntry[] }>,
+    [] as Array<{ titleKey: string; data: ViewHistoryEntry[] }>,
   );
 };