Merge pull request #90 from pct-org/feature/improvements

Feature/improvements
pct-org · Oct 14, 2020 · e062eac · e062eac
2 parents ce51d13 + d4b9298
commit e062eac
Show file tree

Hide file tree

Showing 26 changed files with 291 additions and 337 deletions.
diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -6,7 +6,7 @@ import com.android.build.OutputFile
 
 project.ext.react = [
         entryFile: "index.js",
-        enableHermes: false
+        enableHermes: true
 ]
 
 apply from: "../../node_modules/react-native/react.gradle"

diff --git a/android/build.gradle b/android/build.gradle
@@ -16,7 +16,7 @@ buildscript {
     }
 
     dependencies {
-        classpath 'com.android.tools.build:gradle:4.0.1'
+        classpath 'com.android.tools.build:gradle:4.0.2'
         classpath 'com.google.gms:google-services:4.3.2'
 
         // NOTE: Do not place your application dependencies here; they belong

diff --git a/app/mobile/components/ItemOptions/ItemOptions.js b/app/mobile/components/ItemOptions/ItemOptions.js
@@ -138,7 +138,7 @@ export const ItemOptions = ({
                 disabled
                 icon={'content-copy'}
                 label={i18n.t('Copy to phone')}
-                subLabel={'Item needs to be downloaded for this to become available'} />
+                labelLine2={'Item needs to be downloaded for this to become available'} />
             </OptionsGroup>
           </>
         )}

diff --git a/app/mobile/components/OptionsItem/OptionsItemInner.js b/app/mobile/components/OptionsItem/OptionsItemInner.js
@@ -16,19 +16,17 @@ export const styles = StyleSheet.create({
     marginRight: dimensions.UNIT,
   },
 
-  labels: {
+  labelsContainer: {
     flex: 1,
   },
 
-  label: {},
-
-  subLabels: {
+  labels: {
     flexDirection: 'row',
   },
 
 })
 
-export const SettingsItem = ({ label, subLabel, subLabelLine2, icon, disabled, loading, downloading }) => {
+export const SettingsItem = ({ label, labelLine2, subLabel, subLabelLine2, icon, disabled, loading, downloading }) => {
   return (
     <>
       {loading && (
@@ -73,21 +71,39 @@ export const SettingsItem = ({ label, subLabel, subLabelLine2, icon, disabled, l
           } />
       )}
 
-      <View style={styles.labels}>
-        <Typography
-          emphasis={
-            disabled
-              ? 'low'
-              : 'high'
-          }
-          style={styles.label}
-          variant={'overline'}>
-          {label}
-        </Typography>
+      <View style={styles.labelsContainer}>
+        {(label || subLabel) && (
+          <View style={styles.labels}>
+            <Typography
+              style={{
+                flex: 1,
+              }}
+              emphasis={
+                disabled
+                  ? 'low'
+                  : 'high'
+              }
+              variant={'overline'}>
+              {label}
+            </Typography>
 
-        {(subLabel || subLabelLine2) && (
-          <View style={styles.subLabels}>
             {subLabel && (
+              <Typography
+                emphasis={
+                  disabled
+                    ? 'low'
+                    : 'medium'
+                }
+                variant={'captionSmall'}>
+                {subLabel}
+              </Typography>
+            )}
+          </View>
+        )}
+
+        {(labelLine2 || subLabelLine2) && (
+          <View style={styles.labels}>
+            {labelLine2 && (
               <Typography
                 style={{
                   flex: 1,
@@ -98,7 +114,7 @@ export const SettingsItem = ({ label, subLabel, subLabelLine2, icon, disabled, l
                     : 'medium'
                 }
                 variant={'captionSmall'}>
-                {subLabel}
+                {labelLine2}
               </Typography>
             )}
 

diff --git a/app/mobile/components/OptionsItemTorrent/OptionsItemTorrent.js b/app/mobile/components/OptionsItemTorrent/OptionsItemTorrent.js
@@ -35,14 +35,23 @@ export const OptionsItemTorrent = ({
     return !(download.torrentType === torrent.type && download.quality === torrent.quality)
   }, [download, disabled])
 
-  const itemSubLabel = React.useMemo(() => {
+  const labelLine2 = React.useMemo(() => {
     if (!isItemDisabled && download?.status === constants.STATUS_DOWNLOADING) {
       return download.timeRemaining
     }
 
     return `${torrent.provider} - ${torrent.sizeString}`
   }, [download, isItemDisabled])
 
+  const subLabel = React.useMemo(() => {
+    if (!isItemDisabled && download?.status === constants.STATUS_DOWNLOADING) {
+      return `${download.numPeers} peer${download.numPeers > 1 ? 's' : ''}`
+    }
+
+    return null
+
+  }, [download, isItemDisabled])
+
   const subLabelLine2 = React.useMemo(() => {
     if (!isItemDisabled && download?.status === constants.STATUS_DOWNLOADING) {
       return `${download.progress}% / ${download.speed}`
@@ -96,7 +105,8 @@ export const OptionsItemTorrent = ({
         ].includes(download.status)
       }
       label={torrent.quality}
-      subLabel={itemSubLabel}
+      labelLine2={labelLine2}
+      subLabel={subLabel}
       subLabelLine2={subLabelLine2}
       onPress={handleOnTorrentClick()}
     />

diff --git a/app/mobile/screens/Home/HomeScreen.js b/app/mobile/screens/Home/HomeScreen.js
@@ -48,7 +48,7 @@ export const styles = StyleSheet.create({
 })
 
 export const Home = ({ navigation }) => {
-  const { data: moviesData, fetchMore: moviesFetchMore } = useQuery(
+  const { data: moviesData, fetchMore: moviesFetchMore} = useQuery(
     MoviesQuery,
     {
       variables: {

diff --git a/app/mobile/screens/Mode/ModeScreen.js b/app/mobile/screens/Mode/ModeScreen.js
@@ -8,10 +8,11 @@ import { getDefaultHeaderHeight } from 'react-navigation-collapsible/lib/src/uti
 import i18n from 'modules/i18n'
 import colors from 'modules/colors'
 import dimensions from 'modules/dimensions'
+import constants from 'modules/constants'
 import useBackButton from 'modules/hooks/useBackButton'
 import { MoviesModeQuery } from 'modules/GraphQL/MoviesGraphQL'
-import ShowsQuery from 'modules/GraphQL/ShowsGraphQL'
-import BookmarksQuery from 'modules/GraphQL/BookmarksGraphQL'
+import { ShowsModeQuery } from 'modules/GraphQL/ShowsGraphQL'
+import { BookmarksModeQuery } from 'modules/GraphQL/BookmarksGraphQL'
 import fetchMoreUpdateQuery from 'modules/GraphQL/helpers/fetchMoreUpdateQuery'
 
 import Card from 'components/Card'
@@ -39,33 +40,45 @@ const styles = StyleSheet.create({
   },
 })
 
-export const getQuery = (mode) => {
+export const useMode = (mode) => React.useMemo(() => {
   switch (mode) {
-    case 'movies':
+    case constants.MODE_MOVIES:
       return MoviesModeQuery
-    case 'shows':
-      return ShowsQuery
-    case 'bookmarks':
-      return BookmarksQuery
+
+    case constants.MODE_SHOWS:
+      return ShowsModeQuery
+
+    case constants.MODE_BOOKMARKS:
+      return BookmarksModeQuery
+
+    default:
+      return null
   }
-}
+}, [mode])
 
 export const Mode = ({ mode, navigation }) => {
   const flatListRef = useRef(null)
-  const [query, setQuery] = useState(null)
+  const modeQuery = useMode(mode)
+  const [sort, setSorting] = useState(undefined)
+  const [filter, setFilter] = useState(undefined)
+  const [query, setQuery] = useState(undefined)
+
   const [executeQuery, { loading, data, fetchMore }] = useLazyQuery(
-    getQuery(mode),
+    modeQuery,
     {
       variables: {
         offset: 0,
         query,
+        sort,
+        filter,
       },
     },
   )
 
   useBackButton(() => {
-    if (query?.trim()?.length > 0 && navigation.isFocused()) {
+    if ((query?.trim()?.length > 0 || filter) && navigation.isFocused()) {
       setQuery(null)
+      setFilter(undefined)
 
       return true
     }
@@ -134,7 +147,7 @@ export const Mode = ({ mode, navigation }) => {
         ListEmptyComponent={renderNothingFound}
         ListHeaderComponent={() => (
           <View style={{
-            marginTop: 50 + dimensions.STATUSBAR_HEIGHT + dimensions.UNIT,
+            marginTop: dimensions.STATUSBAR_HEIGHT + +dimensions.SEARCH_BAR_HEIGHT + dimensions.UNIT,
           }} />
         )}
         ListFooterComponent={() => <View style={{ width: dimensions.UNIT * 2 }} />}
@@ -157,7 +170,11 @@ export const Mode = ({ mode, navigation }) => {
       <SearchBar
         flatListRef={flatListRef}
         searchedQuery={query}
-        search={setQuery} />
+        search={setQuery}
+        mode={mode}
+        setSorting={setSorting}
+        setFilter={setFilter}
+      />
 
     </View>
   )