diff --git a/app/actions/actionsTypes.ts b/app/actions/actionsTypes.ts index 75f42588c..f65a6d8b3 100644 --- a/app/actions/actionsTypes.ts +++ b/app/actions/actionsTypes.ts @@ -46,7 +46,8 @@ export const APP = createRequestTypes('APP', [ 'INIT', 'INIT_LOCAL_SETTINGS', 'SET_MASTER_DETAIL', - 'SET_NOTIFICATION_PRESENCE_CAP' + 'SET_NOTIFICATION_PRESENCE_CAP', + 'SET_INTERNET_TYPE' ]); export const MESSAGES = createRequestTypes('MESSAGES', ['REPLY_BROADCAST']); export const CREATE_CHANNEL = createRequestTypes('CREATE_CHANNEL', [...defaultTypes]); diff --git a/app/actions/app.ts b/app/actions/app.ts index 8747fda56..bafcc46ec 100644 --- a/app/actions/app.ts +++ b/app/actions/app.ts @@ -1,4 +1,5 @@ import { Action } from 'redux'; +import { NetInfoStateType } from '@react-native-community/netinfo'; import { RootEnum } from '../definitions'; import { APP } from './actionsTypes'; @@ -16,7 +17,11 @@ interface ISetNotificationPresenceCap extends Action { show: boolean; } -export type TActionApp = IAppStart & ISetMasterDetail & ISetNotificationPresenceCap; +interface ISetInternetType extends Action { + internetType: NetInfoStateType; +} + +export type TActionApp = IAppStart & ISetMasterDetail & ISetNotificationPresenceCap & ISetInternetType; interface Params { root: RootEnum; @@ -62,3 +67,10 @@ export function setNotificationPresenceCap(show: boolean): ISetNotificationPrese show }; } + +export function setInternetType(internetType: NetInfoStateType): ISetInternetType { + return { + type: APP.SET_INTERNET_TYPE, + internetType + }; +} diff --git a/app/containers/message/Audio.tsx b/app/containers/message/Audio.tsx index 3ab079e92..9eac3a908 100644 --- a/app/containers/message/Audio.tsx +++ b/app/containers/message/Audio.tsx @@ -18,19 +18,18 @@ import ActivityIndicator from '../ActivityIndicator'; import { withDimensions } from '../../dimensions'; import { TGetCustomEmoji } from '../../definitions/IEmoji'; import { IAttachment, IUserMessage } from '../../definitions'; -import { TSupportedThemes } from '../../theme'; +import { TSupportedThemes, useTheme } from '../../theme'; import { MediaTypes, downloadMediaFile, searchMediaFileAsync } from '../../lib/methods/handleMediaDownload'; import EventEmitter from '../../lib/methods/helpers/events'; import { PAUSE_AUDIO } from './constants'; -import { isAutoDownloadEnabled } from '../../lib/methods/autoDownloadPreference'; +import { fetchAutoDownloadEnabled } from '../../lib/methods/autoDownloadPreference'; interface IButton { loading: boolean; paused: boolean; - theme: TSupportedThemes; disabled?: boolean; onPress: () => void; - toDownload: boolean; + cached: boolean; } interface IMessageAudioProps { @@ -49,7 +48,7 @@ interface IMessageAudioState { currentTime: number; duration: number; paused: boolean; - toDownload: boolean; + cached: boolean; } const mode = { @@ -94,24 +93,25 @@ const formatTime = (seconds: number) => moment.utc(seconds * 1000).format('mm:ss const BUTTON_HIT_SLOP = { top: 12, right: 12, bottom: 12, left: 12 }; -const Button = React.memo(({ loading, paused, onPress, disabled, theme, toDownload }: IButton) => { - const customIconName = () => { - if (toDownload) { - return 'arrow-down-circle'; - } - return paused ? 'play-filled' : 'pause-filled'; - }; +const Button = React.memo(({ loading, paused, onPress, disabled, cached }: IButton) => { + const { colors } = useTheme(); + + let customIconName: 'arrow-down-circle' | 'play-filled' | 'pause-filled' = 'arrow-down-circle'; + if (cached) { + customIconName = paused ? 'play-filled' : 'pause-filled'; + } return ( + background={Touchable.SelectableBackgroundBorderless()} + > {loading ? ( ) : ( - + )} ); @@ -131,7 +131,7 @@ class MessageAudio extends React.Component { - const { toDownload } = this.state; - return toDownload ? this.startDownload() : this.togglePlayPause(); + const { cached } = this.state; + return cached ? this.togglePlayPause() : this.startDownload(); }; playPause = async () => { @@ -340,7 +341,7 @@ class MessageAudio extends React.Component -