89 lines
3.3 KiB
TypeScript
89 lines
3.3 KiB
TypeScript
// Metro module 9612 (f9613).
|
|
import { useMemo, useCallback } from "react";
|
|
import { View } from "react-native";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { isAndroid } from "../../../utils/PlatformUtils";
|
|
import { useIsFavoriteGIF } from "../FavoriteGIFHooks";
|
|
import { gifUrlKey, removeFavoriteGIF, addFavoriteGIF } from "../../../actions/GIFPickerActionCreators";
|
|
import useWindowDimensions_native from "../../screen/useWindowDimensions.native";
|
|
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
|
|
import ToastActionCreators from "../../toast/native/ToastActionCreators";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import { GifIcon } from "../../../design/components/Icon/native/redesign/generated/GifIcon";
|
|
import { Button } from "../../../design/components/Button/native/Button.native";
|
|
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
|
|
import FastImage from "../../../components_native/common/FastImage";
|
|
const useStyles = createStyles({
|
|
contentWrapper: {
|
|
paddingHorizontal: Module712.space.PX_16,
|
|
paddingBottom: isAndroid() ? Module712.space.PX_16 : 0
|
|
},
|
|
gifContainer: {
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
marginTop: Module712.space.PX_8
|
|
},
|
|
gifImage: {
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: Module712.colors.BORDER_SUBTLE
|
|
},
|
|
favoriteButtonContainer: {
|
|
flex: 1,
|
|
flexDirection: "row",
|
|
alignItems: "stretch",
|
|
width: "100%",
|
|
marginTop: Module712.space.PX_16
|
|
}
|
|
});
|
|
export default function GIFPickerItemActionSheet(props) {
|
|
let callback, callback2;
|
|
const item = props.item;
|
|
callback = void 0;
|
|
callback2 = void 0;
|
|
const styles = useStyles();
|
|
const isFavoriteGIF = useIsFavoriteGIF(gifUrlKey(item.url));
|
|
const windowDimensions_native = useWindowDimensions_native();
|
|
const { width, height } = windowDimensions_native;
|
|
const memo = useMemo(() => {
|
|
const r24 = Math.min((width - 2 * Module712.space.PX_16) / item.width, 0.5 * height / item.height);
|
|
return {
|
|
width: item.width * r24,
|
|
height: item.height * r24
|
|
};
|
|
}, [item.width, item.height, width, height]);
|
|
callback = useCallback(() => {
|
|
ActionSheetActionCreators.hideActionSheet();
|
|
}, []);
|
|
callback2 = useCallback(() => {
|
|
callback();
|
|
if (isFavoriteGIF) {
|
|
removeFavoriteGIF(item.url);
|
|
ToastActionCreators.open({
|
|
key: "REMOVED_FROM_FAVORITES",
|
|
content: intl.string(t.in1rga),
|
|
IconComponent: GifIcon
|
|
});
|
|
} else {
|
|
addFavoriteGIF(item);
|
|
ToastActionCreators.open({
|
|
key: "ADDED_TO_FAVORITES",
|
|
content: intl.string(t.okQonm),
|
|
IconComponent: GifIcon
|
|
});
|
|
}
|
|
}, [callback, isFavoriteGIF, item]);
|
|
return <BottomSheet startExpanded>
|
|
<View style={styles.contentWrapper}>
|
|
<View style={styles.gifContainer}>
|
|
<FastImage style={[styles.gifImage, memo]} source={{
|
|
uri: item.src
|
|
}} />
|
|
<View style={styles.favoriteButtonContainer}>
|
|
{useCallback(() => <Button variant={isFavoriteGIF ? "destructive" : "primary"} onPress={callback2} text={isFavoriteGIF ? intl.string(t["5/NS74"]) : intl.string(t.nIH0v8)} grow />, [callback2, isFavoriteGIF])()}
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</BottomSheet>;
|
|
};
|