import React, { useState, useEffect } from 'react';
import { Linking, Share, Dimensions } from 'react-native';
import { DescriptionContainer, ShareContainer } from './styles';
import { AtomCardContainer } from 'native/atoms/CardContainer';
import { AtomBody } from 'native/atoms/Typography/Body';
import { MoleculeInputCopy } from 'native/molecules/InputCopy';
import { AtomButtonIcon } from 'native/atoms/Buttons/Icon';
import { AtomIcon } from 'native/atoms/Icon';

export interface IInviteProps {
	description?: string;
	iconDescription?: string;
	message?: string;
	link?: string;
	socialList?: string;
}

export const OrganismsInviteFriend = ({
	description = 'Earn points for inviting your friends to be part of the MyCooler experience.',
	iconDescription = 'earn_invite',
	message = 'Message share',
	link = '',
	socialList = '',
}: IInviteProps) => {
	const [linkBase, setLinkBase] = useState<string>(link);
	const [socialListcomponent, setSocialListcomponent] = useState<string[]>([]);
	const [postContent, setPostContent] = useState<string>(message);

	const WIDTH = Dimensions.get('window').width;

	const inviteFunction = (social: string) => {
		let url = '';
		switch (social) {
			case 'whatsapp':
				url = 'https://wa.me/?text=' + splitHttpContent() + ' ' + linkBase;
				break;
			case 'facebook':
				let facebookParameters = [];
				facebookParameters.push('u=' + encodeURI(linkBase));
				facebookParameters.push('quote=' + encodeURI(postContent));
				url =
					'https://www.facebook.com/sharer/sharer.php?' +
					facebookParameters.join('&');
				break;
			case 'telegram':
				url =
					'https://t.me/share/url?url=' +
					linkBase +
					'&text=' +
					splitHttpContent();
				break;
			case 'twitter':
				url =
					'https://twitter.com/intent/tweet?text=' +
					splitHttpContent() +
					' ' +
					linkBase;
				break;
			case 'share':
				onShare();
				break;
		}

		if (social !== 'share') {
			Linking.openURL(url);
		}
	};

	const onShare = async () => {
		if (linkBase !== '') {
			try {
				await Share.share({
					message: splitHttpContent(),
					url: linkBase,
				});
			} catch (error: any) {
				alert(error.message);
			}
		}
	};

	const splitHttpContent = (): string => {
		return postContent.includes('http')
			? postContent.split('http')[0]
			: postContent;
	};

	useEffect(() => {
		setLinkBase(link);
		setSocialListcomponent(socialList.replace(/\s/g, '').split(','));
		setPostContent(message);
	}, [link, socialList, message]);

	const Icons = socialListcomponent?.map((element) => {
		if (element !== '') {
			return (
				<AtomButtonIcon
					key={element}
					testID='element'
					onPress={() => inviteFunction(element)}
					width={WIDTH > 400 ? '50px' : '40px'}
					icon={element}
					text=''
					disabled={false}
					color='primary'
					shape='circle'
					styles={{ margin: '5px' }}
				/>
			);
		}
	});
	return (
		<AtomCardContainer managePadding='15px 25px' height='auto' width='100%'>
			<DescriptionContainer>
				<AtomIcon name={iconDescription} size={50} />
				<AtomBody
					styles={{ marginLeft: '15px', marginRight: '15px' }}
					text={description}
					weight='regular'
					size='medium'
					align='left'
				/>
			</DescriptionContainer>
			<MoleculeInputCopy
				value={linkBase}
				disabled={true}
				readOnly={true}
				selectTextOnFocus={false}
			/>
			<ShareContainer>{Icons}</ShareContainer>
		</AtomCardContainer>
	);
};
