@messenger-box/platform-mobile 0.0.1-alpha.219 → 0.0.1-alpha.222

package/lib/screens/inbox/components/MessageInput.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-declare type MessageInputProps = {
-    channelId?: string;
-    handleSend: (message: string, files: any) => Promise<void>;
-};
-export declare const MessageInput: React.ForwardRefExoticComponent<MessageInputProps & React.RefAttributes<unknown>>;
-export {};

package/lib/screens/inbox/components/MessageItem.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-import { IPost } from '@messenger-box/core';
-export interface AlertMessageAttachmentsInterface {
-    title: string;
-    isTitleHtml: boolean;
-    icon: string;
-    callToAction: {
-        title: string;
-        link: string;
-    };
-}
-export declare function MessageItem({ message, channelId, currentUser, totalCount, onOpen, }: {
-    message: IPost;
-    channelId: number;
-    currentUser: any;
-    totalCount: number;
-    onOpen: () => void;
-}): JSX.Element;

package/lib/screens/inbox/components/PlainMessage.d.ts

@@ -1,5 +0,0 @@
-interface IPlainMessageProps {
-    message: string;
-}
-export declare const PlainMessage: ({ message }: IPlainMessageProps) => JSX.Element;
-export {};

package/src/screens/inbox/components/CommonMessage.tsx

@@ -1,52 +0,0 @@
-import * as React from 'react';
-import { Avatar, Box, Flex, Icon, Text, HStack } from 'native-base';
-import { Ionicons } from '@expo/vector-icons';
-import { formatDistance } from 'date-fns';
-import { FilesList } from './FilesList';
-import { IPost } from '@messenger-box/core';
-import { IAuthUser } from '@pubngo-stack/core';
-import { startCase } from 'lodash';
-
-interface ICommonMessageProps {
-    message: IPost;
-    currentUser: IAuthUser;
-}
-
-export const CommonMessage = (props: ICommonMessageProps) => {
-    const { message, currentUser } = props;
-    return (
-        <Box mb="7">
-            <HStack space={2}>
-                <Avatar backgroundColor="grey" source={{ uri: message?.author?.picture || undefined }}>
-                    {startCase(message?.author?.username?.charAt(0))}
-                </Avatar>
-                <Box>
-                    <HStack width={'80%'} justifyContent={'space-between'} alignItems={'center'}>
-                        <HStack space={2}>
-                            <Text fontSize="14px" color="gray.600" fontWeight={'bold'}>
-                                {message?.author?.familyName && message?.author?.givenName
-                                    ? message?.author?.givenName + ' ' + message?.author?.familyName
-                                    : message?.author?.username}
-                            </Text>
-                            <Text fontSize="14px" color="gray.500" ml="10px">
-                                {formatDistance(new Date(message?.createdAt), new Date(), {
-                                    includeSeconds: true,
-                                    addSuffix: true,
-                                })}
-                            </Text>
-                        </HStack>
-                        {currentUser?.id !== message?.author?.id && (
-                            <Box ml="8px">
-                                <Icon as={Ionicons} name={'flag'} color="gray.600" size="sm" />
-                            </Box>
-                        )}
-                    </HStack>
-                    <Text fontSize="14px" mt="5px">
-                        {message?.message}
-                    </Text>
-                    {message.files?.totalCount ? <FilesList uploaded files={message?.files?.data} /> : null}
-                </Box>
-            </HStack>
-        </Box>
-    );
-};

package/src/screens/inbox/components/FilesList.tsx

@@ -1,41 +0,0 @@
-import React, { useMemo } from 'react';
-import { Image as ReactNativeImage } from 'react-native';
-import { Box, HStack, Image } from 'native-base';
-
-interface FilesListProps {
-    files: any;
-    uploaded?: boolean;
-}
-
-export function FilesList({ files, uploaded = false }: FilesListProps) {
-    return (
-        <HStack space={2} mt={2}>
-            <FilesList.FilesView files={files} uploaded={uploaded}/>
-        </HStack>
-    );
-}
-
-FilesList.FilesView = function MessageItemFiles({ files = [], uploaded }: { files: any[]; uploaded?: boolean }) {
-    if (!files.length) {
-        return null;
-    }
-    return (
-        <Box>
-            {files.map((file) => {
-                const url = useMemo(() => (uploaded ? file.url : ReactNativeImage.resolveAssetSource(file).uri), [file, uploaded]);
-                return (
-                    <Image
-                        alt={'image'}
-                        mr={2}
-                        height="16"
-                        width="16"
-                        source={{
-                            uri: url,
-                            scale: 0.2,
-                        }}
-                    />
-                );
-            })}
-        </Box>
-    );
-};

package/src/screens/inbox/components/MessageInput.tsx

@@ -1,88 +0,0 @@
-import { TextField, View, Image, Pressable, HStack, VStack, Toast } from 'native-base';
-import { FontAwesome } from '@expo/vector-icons';
-import * as ImagePicker from 'expo-image-picker';
-import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
-import React, { forwardRef, useImperativeHandle, useState, useCallback } from 'react';
-import { FilesList } from './FilesList';
-import axios from 'axios';
-
-type MessageInputProps = {
-    channelId?: string;
-    handleSend: (message: string, files: any) => Promise<void>;
-};
-
-export const MessageInput = forwardRef(function MessageInput({ handleSend: handleSendProp }: MessageInputProps) {
-    const [message, setMessage] = useState('');
-    const [sending, setSending] = useState(false);
-    const [files, setFiles] = useState<File[]>([]);
-    const [showKeyboard, setShowKeyboard] = useState(false);
-
-    const handleSend = useCallback(() => {
-        setSending(true);
-        handleSendProp(message, files)
-            .then(() => {
-                setMessage('');
-                setFiles([]);
-            })
-            .finally(() => setSending(false));
-    }, [files, handleSendProp, message]);
-
-    const onSelectImages = async () => {
-        // No permissions request is necessary for launching the image library
-        await ImagePicker.requestMediaLibraryPermissionsAsync();
-        let result = await ImagePicker.launchImageLibraryAsync({
-            mediaTypes: ImagePicker.MediaTypeOptions.Images,
-            allowsEditing: true,
-            aspect: [4, 3],
-            quality: 1,
-        });
-
-        if (!result.cancelled) {
-            axios
-                .get((result as any).uri, {
-                    responseType: 'blob',
-                })
-                .then((res: any) => {
-                    let file = res.data._data;
-                    file.uri = (result as any).uri;
-                    setFiles(files.concat(file));
-                });
-        }
-    };
-
-    return (
-        <KeyboardAwareScrollView
-            keyboardDismissMode="on-drag"
-            keyboardShouldPersistTaps={'always'}
-            onKeyboardWillShow={(frames) => {
-                setShowKeyboard(true);
-            }}
-            onKeyboardWillHide={(frames) => {
-                setShowKeyboard(false);
-            }}
-            scrollEnabled={!showKeyboard}
-            style={{ position: 'absolute', left: 0, right: 0, bottom: showKeyboard ? 300 : 0 }}
-        >
-            <VStack bg={'white'} alignContent="center" p={5}>
-                <View>
-                    <TextField
-                        placeholder="Message..."
-                        borderColor="gray.400"
-                        value={sending ? '' : message}
-                        onChange={(e) => setMessage(e.nativeEvent.text)}
-                        fontSize={14}
-                    />
-                </View>
-                {files.length ? (
-                    <View mb={4} flexDirection="row">
-                        <FilesList files={files} />
-                    </View>
-                ) : null}
-                <HStack alignContent="center" justifyContent="space-between">
-                    <FontAwesome onPress={onSelectImages} size={20} style={{ marginRight: 5 }} name="file-image-o" />
-                    <FontAwesome onPress={handleSend} size={20} name="send" />
-                </HStack>
-            </VStack>
-        </KeyboardAwareScrollView>
-    );
-});

package/src/screens/inbox/components/MessageItem.tsx

@@ -1,80 +0,0 @@
-import React from 'react';
-import { Box, Button, HStack, Icon, Text, useColorModeValue } from 'native-base';
-import { Ionicons } from '@expo/vector-icons';
-import { useNavigation } from '@react-navigation/native';
-import { IPost, IPostTypeEnum } from '@messenger-box/core';
-import { PlainMessage } from './PlainMessage';
-import { CommonMessage } from './CommonMessage';
-
-export interface AlertMessageAttachmentsInterface {
-    title: string;
-    isTitleHtml: boolean;
-    icon: string;
-    callToAction: {
-        title: string;
-        link: string;
-    };
-}
-
-export function MessageItem({
-    message,
-    channelId,
-    currentUser,
-    totalCount,
-    onOpen,
-}: {
-    message: IPost;
-    channelId: number;
-    currentUser: any;
-    totalCount: number;
-    onOpen: () => void;
-}) {
-    if (typeof message === 'string') {
-        return <PlainMessage message={message} />;
-    }
-
-    const { type } = message;
-
-    if (!type || type === IPostTypeEnum.Simple) {
-        return <CommonMessage message={message} currentUser={currentUser} />;
-    }
-
-    if (type === IPostTypeEnum.ALERT) {
-        const { attachment } = message?.propsConfiguration?.contents as {
-            attachment: AlertMessageAttachmentsInterface;
-        };
-        let action: string = '';
-        let actionId: any = '';
-        const icon = 'information-circle';
-        if (attachment.callToAction.link.includes('my-reservation-details')) {
-            action = 'm-reservation-detail';
-            actionId = attachment?.callToAction?.link.split('/').pop();
-        }
-        const color = useColorModeValue('white', 'gray.800');
-        const bgColor = useColorModeValue('gray.800', 'white');
-        const navigation = useNavigation<any>();
-
-        return (
-            <Box borderWidth={1} borderRadius={20} backgroundColor={bgColor} my={2} p={3} opacity={0.7}>
-                <HStack space={2} alignItems={'center'}>
-                    <Icon as={Ionicons} name={icon} color={'white'} />
-                    <Text color={color} width={'45%'} numberOfLines={3}>
-                        {attachment?.title}
-                    </Text>
-                    {attachment.callToAction ? (
-                        <Button
-                            variant={'outline'}
-                            size={'sm'}
-                            borderColor={color}
-                            onPress={() => navigation.navigate(action, { reservationId: actionId })}
-                        >
-                            <Text color={color}>{attachment.callToAction.title}</Text>
-                        </Button>
-                    ) : null}
-                </HStack>
-            </Box>
-        );
-    }
-
-    return null;
-}

package/src/screens/inbox/components/PlainMessage.tsx

@@ -1,16 +0,0 @@
-import React from 'react';
-import { Flex, Text } from 'native-base';
-
-interface IPlainMessageProps {
-    message: string;
-}
-
-export const PlainMessage = ({ message }: IPlainMessageProps) => {
-    return (
-        <Flex w="full" justifyContent={'center'} mb="7">
-            <Text fontSize="14px" fontWeight={'bold'}>
-                {message}
-            </Text>
-        </Flex>
-    );
-};