diff --git a/package-lock.json b/package-lock.json
index 290503f1dee..1af31b77e70 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21059,37 +21059,6 @@
"version": "2.1.0",
"license": "MIT"
},
- "node_modules/@react-navigation/bottom-tabs": {
- "version": "7.8.12",
- "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-7.8.12.tgz",
- "integrity": "sha512-efVt5ydHK+b4ZtjmN81iduaO5dPCmzhLBFwjCR8pV4x4VzUfJmtUJizLqTXpT3WatHdeon2gDPwhhoelsvu/JA==",
- "license": "MIT",
- "dependencies": {
- "@react-navigation/elements": "^2.9.2",
- "color": "^4.2.3",
- "sf-symbols-typescript": "^2.1.0"
- },
- "peerDependencies": {
- "@react-navigation/native": "^7.1.25",
- "react": ">= 18.2.0",
- "react-native": "*",
- "react-native-safe-area-context": ">= 4.0.0",
- "react-native-screens": ">= 4.0.0"
- }
- },
- "node_modules/@react-navigation/bottom-tabs/node_modules/color": {
- "version": "4.2.3",
- "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
- "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
- "license": "MIT",
- "dependencies": {
- "color-convert": "^2.0.1",
- "color-string": "^1.9.0"
- },
- "engines": {
- "node": ">=12.5.0"
- }
- },
"node_modules/@react-navigation/core": {
"version": "7.13.6",
"resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-7.13.6.tgz",
@@ -21169,40 +21138,6 @@
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
- "node_modules/@react-navigation/drawer": {
- "version": "7.7.9",
- "resolved": "https://registry.npmjs.org/@react-navigation/drawer/-/drawer-7.7.9.tgz",
- "integrity": "sha512-xmGe0VkB7LW6g20iH7jB6iaCJ/cLZYBQmE7BYsEp1JGJG7tJHofICayXkpKavJwyx6NAWUItWE1HEo/xVaFEog==",
- "license": "MIT",
- "dependencies": {
- "@react-navigation/elements": "^2.9.2",
- "color": "^4.2.3",
- "react-native-drawer-layout": "^4.2.0",
- "use-latest-callback": "^0.2.4"
- },
- "peerDependencies": {
- "@react-navigation/native": "^7.1.25",
- "react": ">= 18.2.0",
- "react-native": "*",
- "react-native-gesture-handler": ">= 2.0.0",
- "react-native-reanimated": ">= 2.0.0",
- "react-native-safe-area-context": ">= 4.0.0",
- "react-native-screens": ">= 4.0.0"
- }
- },
- "node_modules/@react-navigation/drawer/node_modules/color": {
- "version": "4.2.3",
- "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
- "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
- "license": "MIT",
- "dependencies": {
- "color-convert": "^2.0.1",
- "color-string": "^1.9.0"
- },
- "engines": {
- "node": ">=12.5.0"
- }
- },
"node_modules/@react-navigation/elements": {
"version": "2.9.2",
"resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-2.9.2.tgz",
@@ -21248,37 +21183,6 @@
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
- "node_modules/@react-navigation/material-top-tabs": {
- "version": "7.4.9",
- "resolved": "https://registry.npmjs.org/@react-navigation/material-top-tabs/-/material-top-tabs-7.4.9.tgz",
- "integrity": "sha512-oYpdTfa2D1Tn0HJER9dRCR260agKGgYe+ydSHt3RIsJ9sLg8hU7ntKYWo1FnEC/Nsv1/N1u/tRst7ZpQRjjl4A==",
- "license": "MIT",
- "dependencies": {
- "@react-navigation/elements": "^2.9.2",
- "color": "^4.2.3",
- "react-native-tab-view": "^4.2.0"
- },
- "peerDependencies": {
- "@react-navigation/native": "^7.1.25",
- "react": ">= 18.2.0",
- "react-native": "*",
- "react-native-pager-view": ">= 6.0.0",
- "react-native-safe-area-context": ">= 4.0.0"
- }
- },
- "node_modules/@react-navigation/material-top-tabs/node_modules/color": {
- "version": "4.2.3",
- "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
- "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
- "license": "MIT",
- "dependencies": {
- "color-convert": "^2.0.1",
- "color-string": "^1.9.0"
- },
- "engines": {
- "node": ">=12.5.0"
- }
- },
"node_modules/@react-navigation/native": {
"version": "7.1.25",
"resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-7.1.25.tgz",
@@ -21296,38 +21200,6 @@
"react-native": "*"
}
},
- "node_modules/@react-navigation/native-stack": {
- "version": "7.8.6",
- "resolved": "https://registry.npmjs.org/@react-navigation/native-stack/-/native-stack-7.8.6.tgz",
- "integrity": "sha512-eBY92xb4H53c9jiWriKMOZmQ/Tu9w1qcUrgOA/qjQOvJFbgKF9D6y3e4UuBaDQzjWjLEDZLaiwXe8cwXRb46mg==",
- "license": "MIT",
- "dependencies": {
- "@react-navigation/elements": "^2.9.2",
- "color": "^4.2.3",
- "sf-symbols-typescript": "^2.1.0",
- "warn-once": "^0.1.1"
- },
- "peerDependencies": {
- "@react-navigation/native": "^7.1.25",
- "react": ">= 18.2.0",
- "react-native": "*",
- "react-native-safe-area-context": ">= 4.0.0",
- "react-native-screens": ">= 4.0.0"
- }
- },
- "node_modules/@react-navigation/native-stack/node_modules/color": {
- "version": "4.2.3",
- "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
- "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
- "license": "MIT",
- "dependencies": {
- "color-convert": "^2.0.1",
- "color-string": "^1.9.0"
- },
- "engines": {
- "node": ">=12.5.0"
- }
- },
"node_modules/@react-navigation/routers": {
"version": "7.5.2",
"resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-7.5.2.tgz",
@@ -75676,35 +75548,6 @@
"react-native-reanimated": ">=2.8.0"
}
},
- "node_modules/react-native-drawer-layout": {
- "version": "4.2.0",
- "resolved": "https://registry.npmjs.org/react-native-drawer-layout/-/react-native-drawer-layout-4.2.0.tgz",
- "integrity": "sha512-XFGK5RMcVhEqr2F4iH/cTXrcTm1uK3gIBNFPqHNO7rCXuXZTPBbQYA5yc9/Lqgw2KNQ3sAeHKvW6/WoTURo/eA==",
- "license": "MIT",
- "dependencies": {
- "color": "^4.2.3",
- "use-latest-callback": "^0.2.4"
- },
- "peerDependencies": {
- "react": ">= 18.2.0",
- "react-native": "*",
- "react-native-gesture-handler": ">= 2.0.0",
- "react-native-reanimated": ">= 2.0.0"
- }
- },
- "node_modules/react-native-drawer-layout/node_modules/color": {
- "version": "4.2.3",
- "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
- "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
- "license": "MIT",
- "dependencies": {
- "color-convert": "^2.0.1",
- "color-string": "^1.9.0"
- },
- "engines": {
- "node": ">=12.5.0"
- }
- },
"node_modules/react-native-dynamic": {
"version": "1.0.0",
"license": "MIT",
@@ -80868,15 +80711,6 @@
"version": "1.1.0",
"license": "ISC"
},
- "node_modules/sf-symbols-typescript": {
- "version": "2.2.0",
- "resolved": "https://registry.npmjs.org/sf-symbols-typescript/-/sf-symbols-typescript-2.2.0.tgz",
- "integrity": "sha512-TPbeg0b7ylrswdGCji8FRGFAKuqbpQlLbL8SOle3j1iHSs5Ob5mhvMAxWN2UItOjgALAB5Zp3fmMfj8mbWvXKw==",
- "license": "MIT",
- "engines": {
- "node": ">=10"
- }
- },
"node_modules/sha.js": {
"version": "2.4.11",
"license": "(MIT AND BSD-3-Clause)",
@@ -122829,13 +122663,13 @@
"@react-native-community/slider": "4.5.0",
"@react-native-documents/picker": "^10.1.2",
"@react-native-masked-view/masked-view": "^0.3.2",
- "@react-navigation/bottom-tabs": "^7.8.12",
- "@react-navigation/core": "^7.13.6",
- "@react-navigation/drawer": "^7.7.9",
- "@react-navigation/material-top-tabs": "^7.4.9",
- "@react-navigation/native": "^7.1.25",
- "@react-navigation/native-stack": "^7.8.6",
- "@react-navigation/stack": "^7.6.12",
+ "@react-navigation/bottom-tabs": "6.5.11",
+ "@react-navigation/core": "^7.13.3",
+ "@react-navigation/drawer": "6.6.6",
+ "@react-navigation/material-top-tabs": "6.6.5",
+ "@react-navigation/native": "^7.1.14",
+ "@react-navigation/native-stack": "6.9.17",
+ "@react-navigation/stack": "^7.4.2",
"@redux-devtools/remote": "0.8.0",
"@reduxjs/toolkit": "1.6.1",
"@shopify/flash-list": "^1.8.3",
@@ -124440,6 +124274,90 @@
}
}
},
+ "packages/mobile/node_modules/@react-navigation/bottom-tabs": {
+ "version": "6.5.11",
+ "resolved": "https://registry.npmjs.org/@react-navigation/bottom-tabs/-/bottom-tabs-6.5.11.tgz",
+ "integrity": "sha512-CBN/NOdxnMvmjw+AJQI1kltOYaClTZmGec5pQ3ZNTPX86ytbIOylDIITKMfTgHZcIEFQDymx1SHeS++PIL3Szw==",
+ "license": "MIT",
+ "dependencies": {
+ "@react-navigation/elements": "^1.3.21",
+ "color": "^4.2.3",
+ "warn-once": "^0.1.0"
+ },
+ "peerDependencies": {
+ "@react-navigation/native": "^6.0.0",
+ "react": "*",
+ "react-native": "*",
+ "react-native-safe-area-context": ">= 3.0.0",
+ "react-native-screens": ">= 3.0.0"
+ }
+ },
+ "packages/mobile/node_modules/@react-navigation/drawer": {
+ "version": "6.6.6",
+ "resolved": "https://registry.npmjs.org/@react-navigation/drawer/-/drawer-6.6.6.tgz",
+ "integrity": "sha512-DW/oNRisSOGOqvZfCzfhKBxnzT97Teqtg1Gal85g+K3gnVbM1jOBE2PdnYsKU0fULfFtDwvp/QZSbcgjDpr12A==",
+ "license": "MIT",
+ "dependencies": {
+ "@react-navigation/elements": "^1.3.21",
+ "color": "^4.2.3",
+ "warn-once": "^0.1.0"
+ },
+ "peerDependencies": {
+ "@react-navigation/native": "^6.0.0",
+ "react": "*",
+ "react-native": "*",
+ "react-native-gesture-handler": ">= 1.0.0",
+ "react-native-reanimated": ">= 1.0.0",
+ "react-native-safe-area-context": ">= 3.0.0",
+ "react-native-screens": ">= 3.0.0"
+ }
+ },
+ "packages/mobile/node_modules/@react-navigation/elements": {
+ "version": "1.3.31",
+ "resolved": "https://registry.npmjs.org/@react-navigation/elements/-/elements-1.3.31.tgz",
+ "integrity": "sha512-bUzP4Awlljx5RKEExw8WYtif8EuQni2glDaieYROKTnaxsu9kEIA515sXQgUDZU4Ob12VoL7+z70uO3qrlfXcQ==",
+ "license": "MIT",
+ "peerDependencies": {
+ "@react-navigation/native": "^6.0.0",
+ "react": "*",
+ "react-native": "*",
+ "react-native-safe-area-context": ">= 3.0.0"
+ }
+ },
+ "packages/mobile/node_modules/@react-navigation/material-top-tabs": {
+ "version": "6.6.5",
+ "resolved": "https://registry.npmjs.org/@react-navigation/material-top-tabs/-/material-top-tabs-6.6.5.tgz",
+ "integrity": "sha512-ovKc+ltWYJwu3ju5sw1txBTMemlRM85/JceSrkqU++QnL9l0TAPiPxDlO+wJddR1iwi+P6zj5/+QkXR5Ku+trw==",
+ "license": "MIT",
+ "dependencies": {
+ "color": "^4.2.3",
+ "warn-once": "^0.1.0"
+ },
+ "peerDependencies": {
+ "@react-navigation/native": "^6.0.0",
+ "react": "*",
+ "react-native": "*",
+ "react-native-pager-view": ">= 4.0.0",
+ "react-native-tab-view": ">= 3.0.0"
+ }
+ },
+ "packages/mobile/node_modules/@react-navigation/native-stack": {
+ "version": "6.9.17",
+ "resolved": "https://registry.npmjs.org/@react-navigation/native-stack/-/native-stack-6.9.17.tgz",
+ "integrity": "sha512-X8p8aS7JptQq7uZZNFEvfEcPf6tlK4PyVwYDdryRbG98B4bh2wFQYMThxvqa+FGEN7USEuHdv2mF0GhFKfX0ew==",
+ "license": "MIT",
+ "dependencies": {
+ "@react-navigation/elements": "^1.3.21",
+ "warn-once": "^0.1.0"
+ },
+ "peerDependencies": {
+ "@react-navigation/native": "^6.0.0",
+ "react": "*",
+ "react-native": "*",
+ "react-native-safe-area-context": ">= 3.0.0",
+ "react-native-screens": ">= 3.0.0"
+ }
+ },
"packages/mobile/node_modules/@solana-mobile/mobile-wallet-adapter-protocol": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/@solana-mobile/mobile-wallet-adapter-protocol/-/mobile-wallet-adapter-protocol-2.2.5.tgz",
diff --git a/packages/mobile/package.json b/packages/mobile/package.json
index 44ff30910b4..84016ae70c1 100644
--- a/packages/mobile/package.json
+++ b/packages/mobile/package.json
@@ -65,13 +65,13 @@
"@react-native-community/slider": "4.5.0",
"@react-native-documents/picker": "^10.1.2",
"@react-native-masked-view/masked-view": "^0.3.2",
- "@react-navigation/bottom-tabs": "^7.8.12",
- "@react-navigation/core": "^7.13.6",
- "@react-navigation/drawer": "^7.7.9",
- "@react-navigation/material-top-tabs": "^7.4.9",
- "@react-navigation/native": "^7.1.25",
- "@react-navigation/native-stack": "^7.8.6",
- "@react-navigation/stack": "^7.6.12",
+ "@react-navigation/bottom-tabs": "6.5.11",
+ "@react-navigation/core": "^7.13.3",
+ "@react-navigation/drawer": "6.6.6",
+ "@react-navigation/material-top-tabs": "6.6.5",
+ "@react-navigation/native": "^7.1.14",
+ "@react-navigation/native-stack": "6.9.17",
+ "@react-navigation/stack": "^7.4.2",
"@redux-devtools/remote": "0.8.0",
"@reduxjs/toolkit": "1.6.1",
"@shopify/flash-list": "^1.8.3",
diff --git a/packages/mobile/src/components/now-playing-drawer/NowPlayingDrawer.tsx b/packages/mobile/src/components/now-playing-drawer/NowPlayingDrawer.tsx
index c011064b750..d1390303f75 100644
--- a/packages/mobile/src/components/now-playing-drawer/NowPlayingDrawer.tsx
+++ b/packages/mobile/src/components/now-playing-drawer/NowPlayingDrawer.tsx
@@ -277,8 +277,8 @@ export const NowPlayingDrawer = memo(function NowPlayingDrawer(
if (!trackId) {
return
}
- navigation?.push('Track', { trackId })
onClose()
+ navigation?.push('Track', { trackId })
}, [onClose, navigation, trackId])
return (
diff --git a/packages/mobile/src/components/now-playing-drawer/TrackInfo.tsx b/packages/mobile/src/components/now-playing-drawer/TrackInfo.tsx
index 896447a4fa1..ce6d0b7d8f1 100644
--- a/packages/mobile/src/components/now-playing-drawer/TrackInfo.tsx
+++ b/packages/mobile/src/components/now-playing-drawer/TrackInfo.tsx
@@ -1,3 +1,5 @@
+import { useCallback } from 'react'
+
import { useGatedContentAccess } from '@audius/common/hooks'
import type { Track, User } from '@audius/common/models'
import { playerSelectors } from '@audius/common/store'
@@ -7,6 +9,7 @@ import { useSelector } from 'react-redux'
import { LockedStatusBadge, Text } from 'app/components/core'
import { useDrawer } from 'app/hooks/useDrawer'
+import { useNavigation } from 'app/hooks/useNavigation'
import { makeStyles } from 'app/styles'
import type { GestureResponderHandler } from 'app/types/gesture'
@@ -48,6 +51,7 @@ export const TrackInfo = (props: TrackInfoProps) => {
const styles = useStyles()
const { hasStreamAccess } = useGatedContentAccess(track)
const { onClose } = useDrawer('NowPlaying')
+ const navigation = useNavigation()
const isPreviewing = useSelector(getPreviewing)
const shouldShowPreviewLock =
isPreviewing ||
@@ -55,6 +59,11 @@ export const TrackInfo = (props: TrackInfoProps) => {
'usdc_purchase' in track.stream_conditions &&
!hasStreamAccess)
+ const handlePressArtist = useCallback(() => {
+ onClose()
+ navigation?.push('Profile', { id: user?.user_id })
+ }, [navigation, user?.user_id, onClose])
+
if (!user || !track) return null
const { user_id } = user
@@ -77,7 +86,11 @@ export const TrackInfo = (props: TrackInfoProps) => {
) : null}
-
+
)
}
diff --git a/packages/mobile/src/harmony-native/components/Button/BaseButton/BaseButton.tsx b/packages/mobile/src/harmony-native/components/Button/BaseButton/BaseButton.tsx
index 4abab4dbbff..6509d966a0a 100644
--- a/packages/mobile/src/harmony-native/components/Button/BaseButton/BaseButton.tsx
+++ b/packages/mobile/src/harmony-native/components/Button/BaseButton/BaseButton.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useMemo } from 'react'
+import { useCallback } from 'react'
import { Pressable } from 'react-native'
import type { GestureResponderEvent, ViewStyle } from 'react-native'
@@ -98,53 +98,6 @@ export const BaseButton = (props: BaseButtonProps) => {
[onPress, haptics]
)
- // Create animated versions of icon components when animatedProps is present
- const hasAnimatedProps = !!innerProps?.icon?.animatedProps
- const AnimatedLeftIcon = useMemo(
- () =>
- hasAnimatedProps && LeftIconComponent
- ? Animated.createAnimatedComponent(LeftIconComponent)
- : null,
- [hasAnimatedProps, LeftIconComponent]
- )
- const AnimatedRightIcon = useMemo(
- () =>
- hasAnimatedProps && RightIconComponent
- ? Animated.createAnimatedComponent(RightIconComponent)
- : null,
- [hasAnimatedProps, RightIconComponent]
- )
-
- // Extract icon props, separating animatedProps from regular props
- const iconProps = innerProps?.icon
- const { animatedProps, ...restIconProps } = iconProps || {}
-
- const renderIcon = (
- IconComponent: typeof LeftIconComponent,
- AnimatedIcon: React.ComponentType | null
- ) => {
- if (!IconComponent) return null
-
- if (AnimatedIcon && animatedProps) {
- return (
-
- )
- }
-
- return (
-
- )
- }
-
return (
{
) : null}
{isLoading ? (
- ) : (
- renderIcon(LeftIconComponent, AnimatedLeftIcon)
- )}
+ ) : LeftIconComponent ? (
+
+ ) : null}
{childElement}
- {renderIcon(RightIconComponent, AnimatedRightIcon)}
+ {RightIconComponent ? (
+
+ ) : null}
)
diff --git a/packages/mobile/src/screens/app-drawer-screen/AppDrawerScreen.tsx b/packages/mobile/src/screens/app-drawer-screen/AppDrawerScreen.tsx
index 5768c64d589..be26c49c2b9 100644
--- a/packages/mobile/src/screens/app-drawer-screen/AppDrawerScreen.tsx
+++ b/packages/mobile/src/screens/app-drawer-screen/AppDrawerScreen.tsx
@@ -1,4 +1,4 @@
-import { memo, useMemo, useState, useEffect } from 'react'
+import { memo, useMemo, useState } from 'react'
import type { DrawerContentComponentProps } from '@react-navigation/drawer'
import { createDrawerNavigator } from '@react-navigation/drawer'
@@ -35,14 +35,6 @@ const AppStack = memo(function AppStack(props: AppTabScreenProps) {
const drawerNavigation = useNavigation() as any
- // Ensure drawer is closed on mount (fixes issue when switching from new to old architecture)
- useEffect(() => {
- const timer = setTimeout(() => {
- drawerHelpers?.closeDrawer()
- }, 100)
- return () => clearTimeout(timer)
- }, [drawerHelpers])
-
return (