// Metro module 9693 (f9694).
import { memo } from "react";
import { ActivityIndicator, Image as Image2, View } from "react-native";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import DeviceMedia from "../../../device/native/DeviceMedia";
import { Text } from "../../../../design/components/Text/native/Text";
import { intl, t } from "../../../../intl/index.native";
import { Button } from "../../../../design/components/Button/native/Button.native";
import Module9694 from "../../../../_bundle/Module9694";
const useStyles = createStyles({
  container: {
    padding: Module712.space.PX_16,
    height: 280,
    alignItems: "center"
  },
  label: {
    textAlign: "center",
    marginBottom: 16
  },
  buttonWrapper: {
    marginBottom: Module712.space.PX_32,
    height: Module712.space.PX_48
  },
  loadingSpinner: {
    color: Module712.colors.BACKGROUND_SURFACE_HIGHEST,
    margin: Module712.space.PX_16
  }
});
const r56 = memo(function MediaKeyboardFooter(props) {
  const { disabled, onViewAll } = props;
  const styles = useStyles();
  return DeviceMedia.useHasReachedEnd() ? <View style={styles.container}>
    <Text variant="text-sm/normal" style={styles.label}>
      {intl.string(t.mKSwAW)}
    </Text>
    <View style={styles.buttonWrapper}>
      <Button variant="primary" size="sm" onPress={onViewAll} text={intl.string(t.ZT24In)} disabled={disabled} />
    </View>
    <Image2 source={Module9694} />
  </View> : <ActivityIndicator style={styles.loadingSpinner} size="large" color={styles.loadingSpinner.color} />;
});
export default r56;
export const FOOTER_HEIGHT = 280;