383 lines
15 KiB
TypeScript
383 lines
15 KiB
TypeScript
// Metro module 9687 (f9688).
|
|
import * as Module19 from "react";
|
|
import { useMemo } from "react";
|
|
import { Pressable, View, StyleSheet } from "react-native";
|
|
import UploadAttachmentStore from "../../../../stores/UploadAttachmentStore";
|
|
import { ALAssetsType, DeviceMediaType } from "../../../device/native/DeviceConstants";
|
|
import * as _ReanimatedRexport from "../../../reanimated/ReanimatedRexport";
|
|
import ReanimatedRexport, { useSharedValue, useAnimatedStyle } from "../../../reanimated/ReanimatedRexport";
|
|
import { createStyles, createStyleProperties } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { hexWithOpacity } from "../../../../utils/ColorUtils";
|
|
import * as _native from "../../../../design/void/native";
|
|
import { ThumbnailImage } from "../../../../design/void/native";
|
|
import Module9630 from "../../../../_bundle/Module9630";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import { useStateFromStoresObject } from "../../../../_bundle/Module589";
|
|
import { doesImageMatchUpload } from "../../../../lib/uploader/UploadUtils";
|
|
import NativeMenuActionCreators from "../../../native_menu/native/NativeMenuActionCreators";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import { getTimeFormat } from "../../../../utils/native/TimeUtils";
|
|
import { getType } from "../../../../utils/native/UploadUtils";
|
|
import { Caption } from "../../../media/native/Caption";
|
|
import Module9690 from "../../../../_bundle/Module9690";
|
|
import * as _timing from "../../../../design/animation/reanimated/timing/timing";
|
|
import useWindowDimensions_native from "../../../screen/useWindowDimensions.native";
|
|
import { CameraIcon } from "../../../../design/components/Icon/native/redesign/generated/CameraIcon";
|
|
import { ImageIcon } from "../../../../design/components/Icon/native/redesign/generated/ImageIcon";
|
|
import { AttachmentIcon } from "../../../../design/components/Icon/native/redesign/generated/AttachmentIcon";
|
|
function $mk83097($env) {
|
|
return () => {
|
|
let borderBottomRightRadius;
|
|
const r7 = $env;
|
|
const r11 = r7[2];
|
|
const r10 = r11 !== 0 ? Math.floor((r11 - 1) / r7[1]) : 0;
|
|
const r13 = Math;
|
|
const r19 = r7[0];
|
|
const r20 = r7[1];
|
|
const r22 = r13.floor(r19 / r20);
|
|
let marginLeft = 4;
|
|
const r24 = {
|
|
borderTopLeftRadius: r19 === 0 ? 16 : 4,
|
|
borderTopRightRadius: (r11 >= r20 ? r19 === r20 - 1 : r19 === r11 - 1) ? 16 : 4,
|
|
borderBottomLeftRadius: null,
|
|
borderBottomRightRadius: null,
|
|
marginLeft: null
|
|
};
|
|
const borderBottomLeftRadius = r22 === r10 ? r19 % r20 == 0 ? 16 : 4 : 4;
|
|
L16: {
|
|
r24.borderBottomLeftRadius = borderBottomLeftRadius;
|
|
if (r19 !== r11 - 1) {
|
|
const r33 = r11 % r20;
|
|
borderBottomRightRadius = 4;
|
|
if (r33 == 0) {
|
|
break L16;
|
|
}
|
|
borderBottomRightRadius = r19 === (r10 - 1) * r20 + r20 - 1 ? 16 : 4;
|
|
} else {
|
|
borderBottomRightRadius = 16;
|
|
}
|
|
}
|
|
r24.borderBottomRightRadius = borderBottomRightRadius;
|
|
if (r19 % r20 == 0) {
|
|
marginLeft = 0;
|
|
}
|
|
r24.marginLeft = marginLeft;
|
|
return r24;
|
|
};
|
|
}
|
|
let AnimatedComponent, useStyles, MediaKeyboardImage, MediaKeyboardDummy, styleProperties, __initData, MediaKeyboardSpecialButton;
|
|
const NewCaption = function NewCaption(props) {
|
|
const { label, style, textStyle } = props;
|
|
const styles = useStyles();
|
|
return <View style={[styles.labelContainer, style]}>
|
|
<_native.Icon source={Module9630} style={styles.icon} />
|
|
<Text style={textStyle} color="text-overlay-light" variant="text-xs/bold">{label}</Text>
|
|
</View>;
|
|
};
|
|
MediaKeyboardImage = function MediaKeyboardImage(props) {
|
|
let r72, accessibilityLabel, disableWhenReachedLimit2, disabled2, index, numItemsPerRow, onLongPress2, onPress2, size2, styles, totalNumItems2, type, uploadCount, uploadLimit2;
|
|
let draftType, item, channelId, onPressItem, onLongPressItem, includedUploadIds, image, isIncluded;
|
|
L6: {
|
|
draftType = props.draftType;
|
|
item = props.item;
|
|
index = props.index;
|
|
totalNumItems2 = props.totalNumItems;
|
|
numItemsPerRow = props.numItemsPerRow;
|
|
size2 = props.size;
|
|
channelId = props.channelId;
|
|
onPressItem = props.onPressItem;
|
|
onLongPressItem = props.onLongPressItem;
|
|
disabled2 = props.disabled;
|
|
includedUploadIds = props.includedUploadIds;
|
|
uploadLimit2 = props.uploadLimit;
|
|
disableWhenReachedLimit2 = props.disableWhenReachedLimit;
|
|
image = void 0;
|
|
isIncluded = void 0;
|
|
styles = useStyles();
|
|
const node = item.node;
|
|
image = node.image;
|
|
type = node.type;
|
|
const stateFromStoresObject = useStateFromStoresObject([UploadAttachmentStore], () => {
|
|
const r2 = {
|
|
upload: UploadAttachmentStore.findUpload(channelId, draftType, (a0) => doesImageMatchUpload(image, a0) && (includedUploadIds == null || includedUploadIds.includes(a0.id))),
|
|
uploadCount: null
|
|
};
|
|
let uploadCount = includedUploadIds?.length;
|
|
if (uploadCount == null) {
|
|
uploadCount = UploadAttachmentStore.getUploadCount(channelId, draftType);
|
|
}
|
|
r2.uploadCount = uploadCount;
|
|
return r2;
|
|
}, [channelId, draftType, image, includedUploadIds]);
|
|
const upload = stateFromStoresObject.upload;
|
|
uploadCount = stateFromStoresObject.uploadCount;
|
|
isIncluded = upload != null;
|
|
const memo = useMemo(() => ({
|
|
onPress: () => {
|
|
NativeMenuActionCreators.hideNativeMenu();
|
|
onPressItem({
|
|
channelId,
|
|
item,
|
|
isIncluded
|
|
});
|
|
},
|
|
onLongPress: () => {
|
|
NativeMenuActionCreators.hideNativeMenu();
|
|
if (onLongPressItem != null) {
|
|
onLongPressItem({
|
|
channelId,
|
|
item,
|
|
isIncluded
|
|
});
|
|
}
|
|
}
|
|
}), [channelId, item, isIncluded, onPressItem, onLongPressItem]);
|
|
onPress2 = memo.onPress;
|
|
onLongPress2 = memo.onLongPress;
|
|
if (ALAssetsType.PHOTO !== type && DeviceMediaType.IMAGE !== type) {
|
|
if (ALAssetsType.VIDEO !== type) {
|
|
const VIDEO = DeviceMediaType.VIDEO;
|
|
accessibilityLabel = void 0;
|
|
if (VIDEO !== type) {
|
|
break L6;
|
|
}
|
|
}
|
|
accessibilityLabel = intl.string(t.FlNoSV);
|
|
} else {
|
|
accessibilityLabel = intl.string(t.SkfkEJ);
|
|
}
|
|
}
|
|
L13: {
|
|
if (ALAssetsType.VIDEO !== type && DeviceMediaType.VIDEO !== type) {
|
|
if (ALAssetsType.PHOTO !== type) {
|
|
const IMAGE = DeviceMediaType.IMAGE;
|
|
r72 = null;
|
|
if (IMAGE !== type) {
|
|
break L13;
|
|
}
|
|
}
|
|
const type2 = getType(image.uri);
|
|
r72 = null;
|
|
if (type2 !== "image/gif") {
|
|
break L13;
|
|
}
|
|
r72 = <Caption style={styles.mediaKeyboardItemLabelContainer} label="GIF" />;
|
|
} else {
|
|
r72 = <NewCaption label={getTimeFormat(image.playableDuration)} />;
|
|
}
|
|
}
|
|
const disabled3 = isIncluded ? !isIncluded : uploadCount >= uploadLimit2 && disableWhenReachedLimit2 || disabled2;
|
|
let env17407;
|
|
const r111 = <ReanimatedRexport.View style={styles.checkIconContainer}>
|
|
<_native.Icon source={Module9690} disableColor={false} color={styles.checkIcon.color} style={styles.checkIcon} />
|
|
</ReanimatedRexport.View>;
|
|
const r112 = env17407 = {};
|
|
env17407[0] = index;
|
|
env17407[1] = numItemsPerRow;
|
|
env17407[2] = totalNumItems2;
|
|
return <Pressable accessibilityRole="button" accessibilityLabel={accessibilityLabel} accessibilityState={{
|
|
selected: isIncluded
|
|
}} onPress={onPress2} onLongPress={onLongPress2} disabled={disabled3} style={[styles.imageContainer, disabled3 ? styles.imageDisabled : void 0, useMemo($mk83097(r112), [index, numItemsPerRow, totalNumItems2])]}>
|
|
<ThumbnailImage resizeMode="cover" resizeMethod="resize" style={[styles.image, {
|
|
height: size2,
|
|
width: size2
|
|
}]} source={{
|
|
uri: image.uri,
|
|
width: size2,
|
|
height: size2,
|
|
cache: "force-cache"
|
|
}} localImageSource={{
|
|
uri: image.uri,
|
|
width: size2,
|
|
height: size2
|
|
}} />
|
|
{r72}
|
|
{isIncluded ? <View style={[styles.selectedOverlay, {
|
|
height: size2,
|
|
width: size2
|
|
}]} /> : null}
|
|
{isIncluded ? r111 : null}
|
|
</Pressable>;
|
|
};
|
|
MediaKeyboardDummy = function MediaKeyboardDummy(props) {
|
|
const { size: size2, isFirstInRow } = props;
|
|
const styles = useStyles();
|
|
return <View style={[styles.imageContainer, isFirstInRow ? !isFirstInRow : {
|
|
marginLeft: 4
|
|
}]}>
|
|
<View style={[styles.image, {
|
|
height: size2,
|
|
width: size2
|
|
}]} />
|
|
</View>;
|
|
};
|
|
MediaKeyboardSpecialButton = function MediaKeyboardSpecialButton(props) {
|
|
let env17409;
|
|
const { size: size2, onPress: onPress2, disabled: disabled2, accessibilityLabel, children, index, totalNumItems: totalNumItems2, numItemsPerRow } = props;
|
|
const styles = useStyles();
|
|
const sharedValue = useSharedValue(0);
|
|
const r27 = styleProperties();
|
|
const { backgroundColor, pressedBackgroundColor } = r27;
|
|
const h = function h() {
|
|
return {
|
|
backgroundColor: _timing.withTiming(_ReanimatedRexport.interpolateColor(sharedValue.get(), [0, 1], [backgroundColor, pressedBackgroundColor]), {
|
|
duration: 200,
|
|
easing: _ReanimatedRexport.Easing.out(_ReanimatedRexport.Easing.quad)
|
|
})
|
|
};
|
|
};
|
|
h.__closure = {
|
|
withTiming: _timing.withTiming,
|
|
interpolateColor: _ReanimatedRexport.interpolateColor,
|
|
pressed: sharedValue,
|
|
backgroundColor,
|
|
pressedBackgroundColor,
|
|
Easing: _ReanimatedRexport.Easing
|
|
};
|
|
h.__workletHash = 15924448581794;
|
|
h.__initData = __initData;
|
|
const animatedStyle = useAnimatedStyle(h);
|
|
const r42 = env17409 = {};
|
|
env17409[0] = index;
|
|
env17409[1] = numItemsPerRow;
|
|
env17409[2] = totalNumItems2;
|
|
return <AnimatedComponent disabled={disabled2} accessibilityRole="button" accessibilityLabel={accessibilityLabel} onPressIn={() => {
|
|
sharedValue.set(1);
|
|
}} onPressOut={() => {
|
|
sharedValue.set(0);
|
|
}} onPress={onPress2} style={[animatedStyle, styles.imageContainer, styles.specialButton, {
|
|
width: size2,
|
|
height: size2
|
|
}, useMemo($mk83097(r42), [index, numItemsPerRow, totalNumItems2]), disabled2 ? styles.disabled : void 0]}>{children}</AnimatedComponent>;
|
|
};
|
|
AnimatedComponent = ReanimatedRexport.createAnimatedComponent(Pressable);
|
|
useStyles = createStyles({
|
|
container: {
|
|
flexDirection: "row",
|
|
paddingHorizontal: 12,
|
|
alignItems: "center"
|
|
},
|
|
image: {
|
|
backgroundColor: Module712.colors.MOBILE_KEYBOARD_PANEL_BACKGROUND
|
|
},
|
|
imageContainer: {
|
|
borderRadius: Module712.radii.xs,
|
|
overflow: "hidden",
|
|
position: "relative"
|
|
},
|
|
labelContainer: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.PRIMARY_700, 0.6),
|
|
borderRadius: Module712.radii.xs,
|
|
paddingHorizontal: 5,
|
|
paddingVertical: 4,
|
|
position: "absolute",
|
|
left: 8,
|
|
bottom: 8
|
|
},
|
|
mediaKeyboardItemLabelContainer: {
|
|
right: 10
|
|
},
|
|
icon: {
|
|
width: 12,
|
|
height: 12,
|
|
tintColor: Module712.colors.WHITE,
|
|
marginEnd: 4
|
|
},
|
|
checkIcon: {
|
|
width: 14,
|
|
height: 14,
|
|
color: Module712.colors.BACKGROUND_BRAND
|
|
},
|
|
checkIconContainer: {
|
|
width: 24,
|
|
height: 24,
|
|
position: "absolute",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
right: 6,
|
|
top: 6,
|
|
borderRadius: Module712.radii.round,
|
|
backgroundColor: Module712.colors.WHITE,
|
|
borderWidth: 1,
|
|
borderColor: hexWithOpacity(Module712.unsafe_rawColors.BLACK, 0.1)
|
|
},
|
|
selectedOverlay: {
|
|
...StyleSheet.absoluteFillObject,
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: hexWithOpacity(Module712.unsafe_rawColors.BLACK, 0.3)
|
|
},
|
|
specialButton: {
|
|
flexDirection: "column",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
gap: 8
|
|
},
|
|
disabled: {
|
|
opacity: 0.4
|
|
},
|
|
imageDisabled: {
|
|
opacity: 0.2
|
|
}
|
|
});
|
|
styleProperties = createStyleProperties({
|
|
backgroundColor: Module712.colors.CONTROL_SECONDARY_BACKGROUND_DEFAULT,
|
|
pressedBackgroundColor: Module712.colors.CONTROL_SECONDARY_BACKGROUND_ACTIVE
|
|
});
|
|
__initData = {
|
|
code: "function MediaKeyboardItemTsx1(){const{withTiming,interpolateColor,pressed,backgroundColor,pressedBackgroundColor,Easing}=this.__closure;return{backgroundColor:withTiming(interpolateColor(pressed.get(),[0,1],[backgroundColor,pressedBackgroundColor]),{duration:200,easing:Easing.out(Easing.quad)})};}"
|
|
};
|
|
const r134 = Module19.memo(function({ items, channel, draftType: draftType2, onPressItem: onPressItem2, onLongPressItem: onLongPressItem2, rowIndex, totalNumItems, numPerRow, includedUploadIds: includedUploadIds2, uploadLimit, disableWhenReachedLimit, handleCameraPress, handleAttachPress, handleViewAllPhotosPress, disabled }) {
|
|
const styles = useStyles();
|
|
const size = (useWindowDimensions_native().width - (24 + 4 * (numPerRow - 1))) / numPerRow;
|
|
let c17410_12 = {
|
|
camera: {
|
|
text: t.uje3P9,
|
|
onPress: handleCameraPress,
|
|
Icon: CameraIcon
|
|
},
|
|
allphotos: {
|
|
text: t.Zmm6dN,
|
|
onPress: handleViewAllPhotosPress,
|
|
Icon: ImageIcon
|
|
},
|
|
attach: {
|
|
text: t["8Hvr3+"],
|
|
onPress: handleAttachPress,
|
|
Icon: AttachmentIcon
|
|
}
|
|
};
|
|
return <View style={styles.container}>
|
|
{items.map((a0, a1) => {
|
|
if (a0 == null) {
|
|
return <MediaKeyboardDummy key={a1} size={size} isFirstInRow={a1 === 0} />;
|
|
}
|
|
if ("type" in a0 && ["allphotos", "attach", "camera"].includes(a0.type)) {
|
|
const r35 = c17410_12[a0.type];
|
|
return <MediaKeyboardSpecialButton key={a1} size={size} onPress={r35.onPress} disabled={disabled} accessibilityLabel={intl.string(r35.text)} index={rowIndex * numPerRow + a1} totalNumItems={totalNumItems} numItemsPerRow={numPerRow}>
|
|
<r35.Icon color={Module712.colors.ICON_SUBTLE} size="lg" />
|
|
</MediaKeyboardSpecialButton>;
|
|
}
|
|
return <MediaKeyboardImage key={a1} channelId={channel.id} draftType={draftType2} index={rowIndex * numPerRow + a1} totalNumItems={totalNumItems} numItemsPerRow={numPerRow} item={a0} includedUploadIds={includedUploadIds2} uploadLimit={uploadLimit} disableWhenReachedLimit={disableWhenReachedLimit} size={size} onPressItem={onPressItem2} onLongPressItem={onLongPressItem2} disabled={disabled} />;
|
|
})}
|
|
</View>;
|
|
});
|
|
export default r134;
|
|
export const PARENT_PADDING = 24;
|
|
export const CHILD_PADDING = 4;
|
|
export const SEPARATOR_SIZE = 4;
|
|
export function isMediaCameraNode(a0) {
|
|
return "type" in a0 && a0.type === "camera";
|
|
}
|
|
export function isAttachFilesNode(a0) {
|
|
return "type" in a0 && a0.type === "attach";
|
|
}
|
|
export function isViewAllPhotosNode(a0) {
|
|
return "type" in a0 && a0.type === "allphotos";
|
|
}
|
|
export function isSpecialMediaGridNode(a0) {
|
|
return "type" in a0 && ["allphotos", "attach", "camera"].includes(a0.type);
|
|
}
|