railbird/react-native-video
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(example): update MultiValueControl types (#4003)

Browse Source
This commit is contained in:
Kamil Moskała 2024-07-15 10:13:21 +02:00 committed by GitHub
parent 39cf477ceb
commit 38bcfa2f6a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 15 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
examples/basic/src/MultiValueControl.tsx
View File

@ -1,5 +1,4 @@
import React, {FunctionComponent} from 'react'; import React from 'react';
import { import {
StyleSheet, StyleSheet,
Text, Text,
@ -9,8 +8,6 @@ import {
} from 'react-native'; } from 'react-native';
import {ResizeMode} from 'react-native-video'; import {ResizeMode} from 'react-native-video';
export type MultiValueControlPropType = number | string | ResizeMode;
/* /*
* MultiValueControl displays a list clickable text view * MultiValueControl displays a list clickable text view
*/ */
@ -21,12 +18,14 @@ interface MultiValueControlType<T> {
// The selected value in values // The selected value in values
selected?: T; selected?: T;
// callback to press onPress // callback to press onPress
onPress: (arg: MultiValueControlPropType) => void; onPress: (arg: T) => void;
} }
const MultiValueControl: FunctionComponent< const MultiValueControl = <T extends number | string | ResizeMode>({
MultiValueControlType<MultiValueControlPropType> values,
> = ({values, selected, onPress}) => { selected,
onPress,
}: MultiValueControlType<T>) => {
const selectedStyle: TextStyle = StyleSheet.flatten([ const selectedStyle: TextStyle = StyleSheet.flatten([
styles.option, styles.option,
{fontWeight: 'bold'}, {fontWeight: 'bold'},
@ -39,7 +38,7 @@ const MultiValueControl: FunctionComponent<
return ( return (
<View style={styles.container}> <View style={styles.container}>
{values.map((value: MultiValueControlPropType) => { {values.map(value => {
const _style = value === selected ? selectedStyle : unselectedStyle; const _style = value === selected ? selectedStyle : unselectedStyle;
return ( return (
<TouchableOpacity <TouchableOpacity

18
examples/basic/src/components/Overlay.tsx
View File

@ -9,9 +9,7 @@ import {
samplePoster, samplePoster,
textTracksSelectionBy, textTracksSelectionBy,
} from '../constants'; } from '../constants';
import MultiValueControl, { import MultiValueControl from '../MultiValueControl.tsx';
MultiValueControlPropType,
} from '../MultiValueControl.tsx';
import { import {
AudioTrack, AudioTrack,
EnumValues, EnumValues,
@ -204,22 +202,16 @@ const _Overlay = forwardRef<VideoRef, Props>((props, ref) => {
ref.current?.seek(position); ref.current?.seek(position);
}; };
const onRateSelected = (value: MultiValueControlPropType) => { const onRateSelected = (value: number) => {
if (typeof value === 'number') {
setRate(value); setRate(value);
}
}; };
const onVolumeSelected = (value: MultiValueControlPropType) => { const onVolumeSelected = (value: number) => {
if (typeof value === 'number') {
setVolume(value); setVolume(value);
}
}; };
const onResizeModeSelected = (value: MultiValueControlPropType) => { const onResizeModeSelected = (value: EnumValues<ResizeMode>) => {
if (typeof value === 'string') { setResizeMode(value);
setResizeMode(value as EnumValues<ResizeMode>);
}
}; };
const toggleCache = () => setUseCache(!useCache); const toggleCache = () => setUseCache(!useCache);