Merge pull request #3 from Infinite-Null/testing

Testing
Infinite-Null · May 11, 2024 · 272d81f · 272d81f
2 parents b8cbdfc + a02b7d4
commit 272d81f
Show file tree

Hide file tree

Showing 76 changed files with 477 additions and 462 deletions.
diff --git a/Api/Playlist.js b/Api/Playlist.js
@@ -4,7 +4,7 @@ async function getPlaylistData(id){
   let config = {
     method: 'get',
     maxBodyLength: Infinity,
-    url: `https://jiosavan-api-with-playlist.vercel.app/api/playlists?id=${id}`,
+    url: `https://jiosavan-api-with-playlist.vercel.app/api/playlists?id=${id}&limit=100000`,
     headers: { },
   };
   try {

diff --git a/App.tsx b/App.tsx
@@ -18,15 +18,15 @@ function App(){
     ...DefaultTheme,
     colors: {
       ...DefaultTheme.colors,
-      primary: '#8EBBFF',
+      primary: '#6CC04A',
       text: '#F4F5FC',
       textSecondary: '#CCCCCC',
       white : "white",
       spacing : 10,
       headingSize:width * 0.085,
       fontSize:width * 0.045,
       disabled:'rgb(131,131,131)',
-      background:'black',
+      background:'#101010',
     },
   };
   useEffect(()=>{

diff --git a/Component/Album/AlbumDetails.jsx b/Component/Album/AlbumDetails.jsx
@@ -37,7 +37,7 @@ export const AlbumDetails = ({name,releaseData,liked,Data}) => {
   const theme = useTheme()
   const width = Dimensions.get('window').width
   return (
-    <LinearGradient start={{x: 0, y: 0}} end={{x: 0, y: 1}} colors={['rgba(44,44,44,0)', 'rgb(0,0,0)', theme.colors.background]} style={{
+    <LinearGradient start={{x: 0, y: 0}} end={{x: 0, y: 1}} colors={['rgba(44,44,44,0)', 'rgb(23,23,23)', theme.colors.background]} style={{
       padding:10,
       alignItems:"center",
       justifyContent:"space-between",

diff --git a/Component/Discover/BundleEachMomentanGenres.jsx b/Component/Discover/BundleEachMomentanGenres.jsx
@@ -4,7 +4,7 @@ import { EachMomentsandGenres } from "./EachMomentsandGenres";
 export const BundleEachMomentanGenres = ({list, color}) => {
   return (
     <View style={{gap:10}}>
-      {list.map((e,i)=> <EachMomentsandGenres text={e} key={i} color={color[i]}/>)}
+      {list.map((e,i)=> <EachMomentsandGenres text={e} key={i} color={color[i]} showLeftColor={true}/>)}
     </View>
   );
 };
diff --git a/Component/Discover/DiscoverRouteHeading.jsx b/Component/Discover/DiscoverRouteHeading.jsx
diff --git a/Component/Discover/EachLanguageCard.jsx b/Component/Discover/EachLanguageCard.jsx
@@ -8,7 +8,7 @@ export const EachLanguageCard = ({language}) => {
     <Pressable onPress={()=>{
       navigation.navigate("LanguageDetail",{language:language.toLowerCase()})
     }} style={{
-      backgroundColor:"rgb(42,41,41)",
+      backgroundColor:"rgba(43,47,44,0.84)",
       padding:15,
       borderRadius:10,
       alignItems:"center",

diff --git a/Component/Discover/EachMomentsandGenres.jsx b/Component/Discover/EachMomentsandGenres.jsx
@@ -2,26 +2,27 @@ import { Pressable, View } from "react-native";
 import { PlainText } from "../Global/PlainText";
 import { useNavigation } from "@react-navigation/native";
 
-export const EachMomentsandGenres = ({text, color}) => {
+export const EachMomentsandGenres = ({text, color, showLeftColor, style}) => {
   const navigation = useNavigation()
   return (
     <Pressable onPress={()=>{
       navigation.navigate("ShowPlaylistofType",{Searchtext:text.toLowerCase()})
     }} style={{
-      backgroundColor:"rgb(42,41,41)",
+      backgroundColor:"rgba(43,47,44,0.84)",
       borderRadius:10,
       paddingRight:10,
       alignItems:"center",
       justifyContent:"flex-start",
       flexDirection:'row',
+      ...style,
     }}>
-      <View style={{
-        borderRadius:10,
-        width:10,
-        height:50,
-        backgroundColor:color,
-        marginRight:10,
-      }}/>
+      {showLeftColor && <View style={{
+        borderRadius: 10,
+        width: 10,
+        height: 50,
+        backgroundColor: color,
+        marginRight: 10,
+      }} />}
       <PlainText text={text}/>
     </Pressable>
   );

diff --git a/Component/Discover/LargeBentooCard.jsx b/Component/Discover/LargeBentooCard.jsx
diff --git a/Component/Global/Heading.jsx b/Component/Global/Heading.jsx
@@ -26,9 +26,10 @@ export const Heading = ({text, style, nospace}) => {
    <>
      {!nospace && <Spacer/>}
      <Text numberOfLines={2} style={{
-       fontWeight:600,
+       fontWeight:900,
        color:theme.colors.text,
        fontSize:Size,
+       fontFamily:'roboto',
        ...style,
      }}>{text}</Text>
      {!nospace && <Spacer/>}

diff --git a/Component/Global/HorizontalScrollSongs.jsx b/Component/Global/HorizontalScrollSongs.jsx
@@ -1,11 +1,11 @@
-import { TrendingSongLayout } from "../../Layout/TrendingSongLayout";
 import { EachSongCard } from "./EachSongCard";
 import { Dimensions, ScrollView, View } from "react-native";
 import { useEffect, useState } from "react";
 import { getPlaylistData } from "../../Api/Playlist";
 import { LoadingComponent } from "./Loading";
 import { Heading } from "./Heading";
 import FormatArtist from "../../Utils/FormatArtists";
+import { Spacer } from "./Spacer";
 
 export const HorizontalScrollSongs = ({id}) => {
   const width = Dimensions.get("window").width
@@ -28,13 +28,20 @@ export const HorizontalScrollSongs = ({id}) => {
   }, []);
   return ( <>
       {id && <>
-        <Heading text={Loading ? "Please Wait..." : Data?.data?.name}/>
+        <Spacer/>
+        <Spacer/>
+        <Heading text={Loading ? "Please Wait..." : Data?.data?.name} nospace={true}/>
+        <Spacer/>
         {!Loading && <ScrollView horizontal={true} showsHorizontalScrollIndicator={false}>
           <View>
-            {Data?.data?.songs?.slice(0,4)?.map((e,i)=><EachSongCard index={i} isFromPlaylist={true} Data={Data} artist={FormatArtist(e?.artists?.primary)} language={e?.language} playlist={true} artistID={e?.primary_artists_id} key={i} duration={e?.duration} image={e?.image[2]?.url} id={e?.id} width={width * 0.85} title={e?.name}  url={e?.downloadUrl} titleandartistwidth={width * 0.5}/>)}
+            {Data?.data?.songs?.slice(0,4)?.map((e,i)=><View style={{marginBottom:7}}>
+              <EachSongCard index={i} isFromPlaylist={true} Data={Data} artist={FormatArtist(e?.artists?.primary)} language={e?.language} playlist={true} artistID={e?.primary_artists_id} key={i} duration={e?.duration} image={e?.image[2]?.url} id={e?.id} width={width * 0.80} title={e?.name}  url={e?.downloadUrl} titleandartistwidth={width * 0.5}/>
+            </View>)}
           </View>
           <View>
-            {Data?.data?.songs?.slice(4,8)?.map((e,i)=><EachSongCard index={i + 4} Data={Data} isFromPlaylist={true}  artist={FormatArtist(e?.artists?.primary)} language={e?.language} playlist={true} artistID={e?.primary_artists_id} key={i} duration={e?.duration} image={e?.image[2]?.url} id={e?.id} width={width * 0.85} title={e?.name}  url={e?.downloadUrl} titleandartistwidth={width * 0.5}/>)}
+            {Data?.data?.songs?.slice(4,8)?.map((e,i)=><View style={{marginBottom:7}}>
+              <EachSongCard index={i + 4} Data={Data} isFromPlaylist={true}  artist={FormatArtist(e?.artists?.primary)} language={e?.language} playlist={true} artistID={e?.primary_artists_id} key={i} duration={e?.duration} image={e?.image[2]?.url} id={e?.id} width={width * 0.80} title={e?.name}  url={e?.downloadUrl} titleandartistwidth={width * 0.5}/>
+            </View>)}
           </View>
           </ScrollView>}
         {Loading && <View style={{

diff --git a/Component/Global/PlainText.jsx b/Component/Global/PlainText.jsx
@@ -27,6 +27,7 @@ export const PlainText = ({text,style, numberOfLine}) => {
       fontSize:Size,
       fontWeight:500,
       paddingRight:10,
+      fontFamily:'roboto',
       ...style,
     }}>{text}</Text>
   );

diff --git a/Component/Global/SearchBar.jsx b/Component/Global/SearchBar.jsx
@@ -1,41 +1,43 @@
-import { Dimensions, TextInput, View } from "react-native";
-import Feather from "react-native-vector-icons/Feather";
+import { Dimensions, Pressable, TextInput, View } from "react-native";
 import { useTheme } from "@react-navigation/native";
+import Entypo from "react-native-vector-icons/Entypo";
 
-export const SearchBar = ({onChange}) => {
+export const SearchBar = ({onChange, navigation}) => {
   const width = Dimensions.get("window").width
   const theme = useTheme()
   return (
     <View style={{
       flexDirection:"row",
       gap:2,
       alignItems:"center",
-      height:50,
+      height:60,
       marginHorizontal:10,
-
     }}>
       <View style={{
         flex:1,
-        paddingHorizontal:10,
-        backgroundColor:"rgb(29,33,47)",
+        paddingHorizontal:5,
+        backgroundColor:"rgba(0,0,0,0)",
         borderTopLeftRadius:10,
         borderBottomLeftRadius:10}}>
-        <TextInput style={{
+        <TextInput cursorColor={"rgb(255,255,255)"} placeholder={"Type to search..."} style={{
           color:"white",
+          fontSize:25,
+          fontFamily:"roboto",
         }} onChangeText={onChange} autoFocus={true}/>
       </View>
-        <View style={{
-          backgroundColor:theme.colors.primary,
-          height:50,
+        <Pressable onPress={()=>{
+          navigation.goBack()
+        }} style={{
+          backgroundColor:"white",
+          height:43,
           justifyContent:"center",
-          width:50,
-          borderTopRightRadius:10,
-          borderBottomRightRadius:10,
+          width:43,
+          borderRadius:100000,
           elevation:10,
           alignItems:"center",
         }}>
-          <Feather name={"search"} size={width * 0.045} color={"black"}/>
-        </View>
+          <Entypo name={"cross"} size={width * 0.045} color={"black"}/>
+        </Pressable>
     </View>
   );
 };
diff --git a/Component/Global/SmallText.jsx b/Component/Global/SmallText.jsx
@@ -24,6 +24,7 @@ export const SmallText = ({text, color, style, maxLine, selectable}) => {
     <Text selectable={selectable} numberOfLines={maxLine ? maxLine : 2} style={{
       color:(!color) ? theme.colors.textSecondary : color,
       fontSize:Size,
+      fontFamily:'roboto',
       ...style,
     }}>{text}</Text>
   );

diff --git a/Component/Global/Tabs/EachTabs.jsx b/Component/Global/Tabs/EachTabs.jsx
@@ -1,24 +1,39 @@
-import { Dimensions, Pressable, Text } from "react-native";
+import { Dimensions, Pressable, Text, View } from "react-native";
 import Animated, {ZoomIn, ZoomOut} from "react-native-reanimated";
 import {memo} from "react";
 import { useTheme } from "@react-navigation/native";
 
 function EachTabs({item,isActive,index,setActive}) {
     const theme = useTheme()
     const width = Dimensions.get('window').width
-    return <Pressable style={{padding:10 , alignItems:"center"}} onPress={()=>{
+    return <Pressable style={{padding:7, alignItems:"center"}} onPress={()=>{
         setActive(index)
     }}>
-        <Text style={{
-            color:isActive ? theme.colors.primary : theme.colors.textSecondary,
-            fontSize:width * 0.04,
-        }}>{item}</Text>
+        {!isActive &&   <View style={{
+            borderRadius:100000000000,
+            paddingVertical:7,
+        }}>
+            <Text style={{
+                color:theme.colors.textSecondary,
+                fontSize:width * 0.04,
+                fontFamily:"roboto",
+                fontWeight:700,
+                paddingHorizontal:10,
+            }}>{item}</Text>
+        </View>}
         {isActive &&  <Animated.View entering={ZoomIn.duration(300)} exiting={ZoomOut.duration(300)} style={{
-            width:width * 0.02,
-            height:width * 0.02,
+            // width:width * 0.02,
+            // height:width * 0.02,
             backgroundColor:theme.colors.primary,
             borderRadius:100000000000,
-        }}/>}
+            paddingVertical:7,
+        }}><Text style={{
+            color:isActive ? "black" : theme.colors.textSecondary,
+            fontSize:width * 0.04,
+            fontFamily:"roboto",
+            fontWeight:700,
+            paddingHorizontal:10,
+        }}>{item}</Text></Animated.View>}
     </Pressable>
 }
 export default memo(EachTabs)
diff --git a/Component/Global/Tabs/Tabs.jsx b/Component/Global/Tabs/Tabs.jsx
@@ -3,7 +3,7 @@ import EachTabs from "./EachTabs";
 import {memo} from "react";
 
  function Tabs({tabs,state,setState}) {
-   return <View style={{flexDirection:'row', flexWrap:"wrap", gap:10, paddingHorizontal:10}}>
+   return <View style={{flexDirection:'row', flexWrap:"wrap", gap:0, paddingHorizontal:2}}>
       {tabs.map((e,i)=>{
          if(state === i) return <EachTabs index={i} item={e} isActive={true} setActive={setState} key={i}/>
          else return <EachTabs index={i} item={e} isActive={false} setActive={setState} key={i}/>