From 9fcb6a34b7ed92ac53d0c73f66246db22f2007f4 Mon Sep 17 00:00:00 2001 From: tapframe Date: Wed, 3 Sep 2025 15:06:05 +0530 Subject: [PATCH] changed default hero to carousal --- app.json | 6 +- src/components/home/HeroCarousel.tsx | 2 +- src/hooks/useSettings.ts | 2 +- src/screens/HomeScreenSettings.tsx | 157 ++++++++++++++++++--------- 4 files changed, 111 insertions(+), 56 deletions(-) diff --git a/app.json b/app.json index b450e6c49..41a07842c 100644 --- a/app.json +++ b/app.json @@ -2,7 +2,7 @@ "expo": { "name": "Nuvio", "slug": "nuvio", - "version": "0.6.0-beta.6", + "version": "0.6.0-beta.7", "orientation": "default", "icon": "./assets/ios/AppIcon.appiconset/Icon-App-60x60@3x.png", "userInterfaceStyle": "dark", @@ -16,7 +16,7 @@ "ios": { "supportsTablet": true, "icon": "./assets/ios/AppIcon.appiconset/Icon-App-60x60@3x.png", - "buildNumber": "6", + "buildNumber": "7", "infoPlist": { "NSAppTransportSecurity": { "NSAllowsArbitraryLoads": true @@ -46,7 +46,7 @@ "WAKE_LOCK" ], "package": "com.nuvio.app", - "versionCode": 6, + "versionCode": 7, "architectures": [ "arm64-v8a", "armeabi-v7a", diff --git a/src/components/home/HeroCarousel.tsx b/src/components/home/HeroCarousel.tsx index 8a49bab70..0876d353a 100644 --- a/src/components/home/HeroCarousel.tsx +++ b/src/components/home/HeroCarousel.tsx @@ -19,7 +19,7 @@ interface HeroCarouselProps { const { width } = Dimensions.get('window'); const CARD_WIDTH = Math.min(width * 0.8, 480); -const CARD_HEIGHT = Math.round(CARD_WIDTH * 9 / 16) + 270; // further increased space for text/actions +const CARD_HEIGHT = Math.round(CARD_WIDTH * 9 / 16) + 290; // slight increase for text/actions const HeroCarousel: React.FC = ({ items, loading = false }) => { const navigation = useNavigation>(); diff --git a/src/hooks/useSettings.ts b/src/hooks/useSettings.ts index 1b8e27cf8..8b2f3bf28 100644 --- a/src/hooks/useSettings.ts +++ b/src/hooks/useSettings.ts @@ -81,7 +81,7 @@ export const DEFAULT_SETTINGS: AppSettings = { preferredPlayer: 'internal', showHeroSection: true, featuredContentSource: 'catalogs', - heroStyle: 'legacy', + heroStyle: 'carousel', selectedHeroCatalogs: [], // Empty array means all catalogs are selected logoSourcePreference: 'metahub', // Default to Metahub as first source tmdbLanguagePreference: 'en', // Default to English diff --git a/src/screens/HomeScreenSettings.tsx b/src/screens/HomeScreenSettings.tsx index 4edd94398..96f52dab1 100644 --- a/src/screens/HomeScreenSettings.tsx +++ b/src/screens/HomeScreenSettings.tsx @@ -178,6 +178,44 @@ const HomeScreenSettings: React.FC = () => { ); + // Compact segmented control for nicer toggles + const SegmentedControl = ({ + options, + value, + onChange + }: { + options: { label: string; value: string }[]; + value: string; + onChange: (val: string) => void; + }) => ( + + {options.map((opt, idx) => { + const selected = value === opt.value; + return ( + onChange(opt.value)} + activeOpacity={0.85} + style={[ + styles.segment, + idx === 0 && styles.segmentFirst, + idx === options.length - 1 && styles.segmentLast, + selected && { backgroundColor: colors.primary }, + ]} + > + + {opt.label} + + + ); + })} + + ); + // Format selected catalogs text const getSelectedCatalogsText = useCallback(() => { if (!settings.selectedHeroCatalogs || settings.selectedHeroCatalogs.length === 0) { @@ -274,61 +312,33 @@ const HomeScreenSettings: React.FC = () => { {settings.showHeroSection && ( <> - - handleUpdateSetting('heroStyle', 'legacy')} - label="Legacy Hero (banner)" + + Hero Layout + handleUpdateSetting('heroStyle', val as any)} /> - - - Original full-width banner with overlayed info and actions. - - + Full-width banner or swipeable cards - - handleUpdateSetting('heroStyle', 'carousel')} - label="New Card Carousel" + + Featured Source + handleUpdateSetting('featuredContentSource', val as any)} /> - - - A beautiful, swipeable carousel of featured cards with smooth animations. - - - - - { - console.log('Selected TMDB source'); - handleUpdateSetting('featuredContentSource', 'tmdb'); - }} - label="TMDB Trending Movies" - /> - - - Featured content will be sourced from TMDB's trending movies API. This provides a variety of popular and recent content, even if not available in your catalogs. - - - - - - { - console.log('Selected Catalogs source'); - handleUpdateSetting('featuredContentSource', 'catalogs'); - }} - label="Installed Catalogs" - /> - - - Featured content will be sourced from your enabled catalogs. This ensures that featured content is available to stream from your installed add-ons. - - + {settings.featuredContentSource === 'catalogs' && ( + navigation.navigate('HeroCatalogs')} + style={[styles.manageLink, { backgroundColor: isDarkMode ? colors.elevation1 : 'rgba(0,0,0,0.04)' }]} + activeOpacity={0.8} + > + Manage selected catalogs + + + )} )} @@ -481,6 +491,51 @@ const styles = StyleSheet.create({ fontSize: 14, lineHeight: 20, }, + segmentContainer: { + flexDirection: 'row', + borderRadius: 10, + padding: 4, + gap: 6, + marginTop: 8, + }, + segment: { + flex: 1, + borderRadius: 8, + paddingVertical: 10, + alignItems: 'center', + justifyContent: 'center', + }, + segmentFirst: { + }, + segmentLast: { + }, + segmentCard: { + marginHorizontal: 16, + marginTop: 12, + padding: 16, + borderRadius: 12, + backgroundColor: 'rgba(255,255,255,0.05)' + }, + segmentTitle: { + fontSize: 12, + fontWeight: '700', + letterSpacing: 0.6, + opacity: 0.9, + }, + segmentHint: { + marginTop: 8, + fontSize: 12, + opacity: 0.7, + }, + manageLink: { + marginTop: 10, + paddingHorizontal: 12, + paddingVertical: 10, + borderRadius: 10, + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', + }, savedIndicator: { position: 'absolute', top: Platform.OS === 'android' ? (StatusBar.currentHeight || 0) + 60 : 90,