chat 1.0.6 → 3.0.0

package/src/hooks/useCreateRoom/index.ts

@@ -1,34 +0,0 @@
-import { useState, useRef, useEffect } from 'react'
-import { NewRoomModel } from '../../classes/Room/types'
-import Room from '../../classes/Room'
-
-function useCreateRoom<RoomModel extends NewRoomModel>() {
-	const [loading, setLoading] = useState(false)
-	const [error, setError] = useState(null)
-	const roomRef = useRef<RoomModel | null>(null)
-	const recipientsRef = useRef<string[] | null>(null)
-
-	useEffect(() => {
-		const start = async () => {
-			if (loading && roomRef.current && recipientsRef.current) {
-				try {
-					roomRef.current = null
-					recipientsRef.current = null
-					await new Room(roomRef.current).create()
-				} catch (e) {
-					console.error('useCreateRoom hook error:', e)
-				}
-			}
-		}
-		start()
-	}, [loading])
-
-	const create = (room: RoomModel) => {
-		roomRef.current = room
-		setLoading(true)
-	}
-
-	return { create, loading, error }
-}
-
-export default useCreateRoom

package/src/hooks/useCreator/index.ts

@@ -1,33 +0,0 @@
-import { useRef, MutableRefObject } from 'react'
-import { RoomCreatorRef } from '../../components/RoomCreator/types'
-
-/**
- * React hook for managing RoomCreator component in usechat
- *
- * @returns An array with a ref and then convenience functions for the creator
- * [ref, { open, close }]
- *
- * **Required** In order for the methods to work, you must pass creator to sheetRef prop.
- *
- * @example
- * ```javascript
- * export default () => {
- * 	const [creator, { open, close }]
- *
- * 	// ...some other method
- *  const onPress = () => open()
- *
- * 	return <RoomCreator sheetRef={creator} />
- * }
- * ```
- */
-export default (): [
-	MutableRefObject<RoomCreatorRef | undefined>,
-	{ open: () => void; close: () => void }
-] => {
-	const creator = useRef<RoomCreatorRef>()
-	const open = () => creator.current && creator.current.open()
-	const close = () => creator.current && creator.current.close()
-
-	return [creator, { open, close }]
-}

package/src/hooks/useInbox/index.ts

@@ -1,76 +0,0 @@
-import { useFuego } from '@nandorojo/fuego'
-import { useMemo } from 'react'
-import { WhereFilterOp } from '@firebase/firestore-types'
-import { QueryDataHandler } from '@nandorojo/fuego/lib/typescript/hooks/useFuego/types'
-import { OrderByItem } from '@nandorojo/fuego/lib/typescript/FuegoQuery/types'
-import { fuego } from '../../components/ChatProvider/index'
-import { chat } from '../../components/ChatProvider'
-import { ExistingRoomDocument } from '../../classes/Room/types'
-import { InboxModel } from '../../classes/Inbox/types'
-import { UseInboxConfig } from './types'
-import { Room } from '../..'
-
-const orderBy: OrderByItem = ['lastMessage.createdAt', 'desc']
-
-/**
- * React hook to query the chat inbox in realtime. Used with the [Juice.Inbox] component from Juice.
- *
- * @example
- * ```
- * const { data } = useInbox()
- *
- * return <Juice.Inbox rooms={data} />
- * ```
- *
- * @returns
- * { data, loading, path, error } and other values returned by useFuego() hook. Data is properly formatted for rendering.
- */
-export default (
-	config: UseInboxConfig = {},
-	options: QueryDataHandler<ExistingRoomDocument> = {}
-) => {
-	const currentUser = fuego.auth().currentUser as firebase.User
-	const uid = config.uid || (currentUser && currentUser.uid)
-
-	const where: [string, WhereFilterOp, string] = useMemo(() => {
-		// useMemo to avoid re-making the array every render,
-		// since that would refresh the useFuego each time
-		return ['currentMembers', 'array-contains' as WhereFilterOp, uid]
-		// if the uid updates, then it recreates
-		// re: [uid]
-	}, [uid])
-
-	const path = chat.roomsCollection
-	const query = useMemo(
-		() => ({
-			listen: true,
-			where,
-			orderBy,
-			...config,
-			path
-		}),
-		[config, where, path]
-	)
-	const { data, ...response } = useFuego<ExistingRoomDocument>(query, options)
-	const rooms = useMemo(() => {
-		function isListOfRoomDocs(
-			inbox: typeof data
-		): inbox is ExistingRoomDocument[] {
-			return !!(inbox as ExistingRoomDocument[])
-		}
-		if (data && isListOfRoomDocs(data)) {
-			const formatted: InboxModel = data.map(room => ({
-				...room,
-				lastMessage: {
-					...room.lastMessage,
-					createdAt: room.lastMessage.createdAt.toDate()
-				},
-				unreadCount: new Room(room).getUnreadCount()
-			}))
-			return formatted
-		}
-		return []
-	}, [data])
-
-	return { data: rooms, ...response, path }
-}

package/src/hooks/useInbox/types.ts

@@ -1,6 +0,0 @@
-import { FuegoQueryConfig } from '@nandorojo/fuego/lib/typescript/FuegoQuery/types'
-
-export interface UseInboxConfig extends Omit<FuegoQueryConfig, 'path'> {
-	uid?: string
-	listen?: boolean
-}

package/src/hooks/useMessages/index.ts

@@ -1,109 +0,0 @@
-import { useMemo, useCallback, useState, useEffect, useRef } from 'react'
-import { useFuego } from '@nandorojo/fuego'
-import { UseMessagesConfig } from './types'
-import Room from '../../classes/Room'
-import {
-	NewMessageModel,
-	EditMessageModel,
-	MessageModelDocument,
-} from '../../classes/Message/types'
-import Message from '../../classes/Message'
-import {
-	UseQueryConfig,
-	QueryDataHandler,
-} from '@nandorojo/fuego/lib/typescript/hooks/useFuego/types'
-
-const LIMIT = 30
-
-const orderBy: UseQueryConfig['orderBy'] = ['createdAt', 'desc']
-/**
- *	React hook to set up a lisener for a room's messages
- *
- * 	@param { id } the roomId, along with other query options from `useFuego` hook
- *
- *	@returns { data: formattedMessages, loading, error, ref, path, empty, send, edit, fetchMore }
- * data is formatted for rendering.
- */
-export default (
-	{ id, ...config }: UseMessagesConfig,
-	options: QueryDataHandler<MessageModelDocument> = {}
-) => {
-	const { messagesPath: path } = new Room({ id })
-	const [limit, setLimit] = useState(LIMIT)
-	const currentLimit = useRef(limit)
-	const latestFetchMoreId = useRef<null | string>(null)
-	const query = useMemo(
-		() => ({
-			listen: true,
-			orderBy,
-			...config,
-			path,
-			limit,
-		}),
-		[path, config, limit]
-	)
-	useEffect(() => {
-		currentLimit.current = limit
-	}, [limit])
-	const { data, loading, error, ref } = useFuego<MessageModelDocument>(
-		query,
-		options
-	)
-	const send = useCallback(
-		(message: NewMessageModel[]) => {
-			return new Message(message as NewMessageModel[]).formatForSend().send(id)
-		},
-		[id]
-	)
-	const edit = useCallback(
-		(message: EditMessageModel) => {
-			return new Message(message).edit(id)
-		},
-		[id]
-	)
-	const formattedMessages: NewMessageModel[] = useMemo(() => {
-		function isArrayOfMessageDocuments(
-			m: typeof data
-		): m is MessageModelDocument[] {
-			return !!(m as MessageModelDocument[])
-		}
-		if (data && isArrayOfMessageDocuments(data)) {
-			const formatted: NewMessageModel[] = new Message(
-				data
-			).formatForRender() as NewMessageModel[]
-			return formatted
-		}
-		return []
-	}, [data])
-	const fetchMore = () => {
-		const lastMessageId =
-			formattedMessages[formattedMessages.length - 1] &&
-			formattedMessages[formattedMessages.length - 1].id
-		// make sure we don't fetch more if the latest message is unchanged, or if it doesn't even exist
-		if (lastMessageId && lastMessageId !== latestFetchMoreId.current) {
-			latestFetchMoreId.current = lastMessageId
-			setLimit(l => l + LIMIT)
-		}
-	}
-	const empty: boolean = useMemo(
-		() => !(formattedMessages && formattedMessages.length),
-		[formattedMessages]
-	)
-
-	const fetchingMore = loading && formattedMessages.length
-
-	// TODO add reply to message function
-
-	return {
-		data: formattedMessages,
-		loading,
-		error,
-		ref,
-		path,
-		empty,
-		send,
-		edit,
-		fetchMore,
-		fetchingMore,
-	}
-}

package/src/hooks/useMessages/types.ts

@@ -1,6 +0,0 @@
-import { FuegoQueryConfig } from '@nandorojo/fuego/lib/typescript/FuegoQuery/types'
-
-export interface UseMessagesConfig extends Omit<FuegoQueryConfig, 'path'> {
-	id: string
-	listen?: boolean
-}

package/src/hooks/useRoom/index.ts

@@ -1,82 +0,0 @@
-import { useFuego } from '@nandorojo/fuego'
-import Room from '../../classes/Room'
-import {
-	EditRoomModel,
-	RoomPropertiesModel,
-	CreateCallableRoomModel,
-	ExistingRoomDocument,
-	ExistingRoomModel
-} from '../../classes/Room/types'
-import { UseRoomType } from './types'
-import { QueryDataHandler } from '@nandorojo/fuego/lib/typescript/hooks/useFuego/types'
-import { useMemo } from 'react'
-
-/**
- * Fetches or subscribes to a chatroom. It automatically handles unmounts, etc.
- *
- * @param config - config dictionary.
- * @param config.id - Required: the unique ID for this chatroom, typically generated by the backend. If using the [[useInbox]] hook, each item in [[useInbox]]'s data array has this ID.
- * @param config.listen Boolean to determine if this room should update state as a subscription. Default false.
- * @param options - added options dictionary for useRoom
- *
- * @remarks Look at the fuego library's useFuego hook to see all the available arguments for config and options.
- *
- * @returns { data: room, loading, error, ref, create, edit, usersAreTyping, namesOfUsersTyping } data is formatted for rendering room.
- */
-
-export default (
-	{ id, ...config }: UseRoomType,
-	options: QueryDataHandler<ExistingRoomDocument> = {}
-) => {
-	const { path } = new Room({ id } as RoomPropertiesModel)
-	const { data, loading, error, ref } = useFuego<ExistingRoomDocument>(
-		{
-			...config,
-			path
-		},
-		options
-	)
-	const create = (room: CreateCallableRoomModel) => {
-		return new Room(room).createViaCallable()
-	}
-	const edit = (room: EditRoomModel) => {
-		return new Room(room).edit()
-	}
-	const members = data && (data as ExistingRoomDocument).members
-	const usersAreTyping = useMemo(() => {
-		return !!(members && new Room({ members }).getUsersTyping().length)
-	}, [members])
-	const namesOfUsersTyping = useMemo(() => {
-		return (
-			(members &&
-				new Room({ members }).getUsersTyping().map(user => user.name)) ||
-			[]
-		)
-	}, [members])
-	const room = useMemo(() => {
-		function isDocument(r: typeof data): r is ExistingRoomDocument {
-			return !!(r as ExistingRoomDocument)
-		}
-		if (data && isDocument(data)) {
-			const model: ExistingRoomModel = {
-				...data,
-				lastMessage: {
-					...data.lastMessage,
-					createdAt: data.lastMessage.createdAt.toDate()
-				}
-			}
-			return model
-		}
-		return null
-	}, [data])
-	return {
-		data: room,
-		loading,
-		error,
-		ref,
-		create,
-		edit,
-		usersAreTyping,
-		namesOfUsersTyping
-	}
-}

package/src/hooks/useRoom/types.ts

@@ -1,6 +0,0 @@
-import { FuegoQueryConfig } from '@nandorojo/fuego/lib/typescript/FuegoQuery/types'
-
-export interface UseRoomType extends Omit<FuegoQueryConfig, 'path'> {
-	id: string
-	listen?: boolean
-}

package/src/hooks/useSend/useSendToGroup/index.ts

@@ -1,38 +0,0 @@
-import { useState, useRef, useEffect, useCallback } from 'react'
-import { NewMessageModel } from '../../../classes/Message/types'
-import Message from '../../../classes/Message'
-
-export default function<MessageModel extends NewMessageModel>() {
-	const [uploading, setUploading] = useState(false)
-	const [error, setError] = useState(null)
-	const messageRef = useRef<MessageModel | null>(null)
-	const recipientsRef = useRef<string[] | null>(null)
-
-	useEffect(() => {
-		if (uploading) {
-			const run = async () => {
-				try {
-					if (messageRef.current && recipientsRef.current)
-						await new Message(messageRef.current).sendToGroup(
-							recipientsRef.current
-						)
-					messageRef.current = null
-					recipientsRef.current = null
-					setUploading(false)
-				} catch (e) {
-					console.error(`failure sending message from useSendToPeople`, e)
-					setError(e)
-				}
-			}
-			run()
-		}
-	}, [uploading])
-
-	const send = useCallback((message: MessageModel, recipients: string[]) => {
-		messageRef.current = message
-		recipientsRef.current = recipients
-		setUploading(true)
-	}, [])
-
-	return { send, uploading, error }
-}

package/src/hooks/useSend/useSendToPeople/index.ts

@@ -1,38 +0,0 @@
-import { useState, useRef, useEffect, useCallback } from 'react'
-import { NewMessageModel } from '../../../classes/Message/types'
-import Message from '../../../classes/Message'
-
-export default function<MessageModel extends NewMessageModel>() {
-	const [uploading, setUploading] = useState(false)
-	const [error, setError] = useState(null)
-	const messageRef = useRef<MessageModel | null>(null)
-	const recipientsRef = useRef<string[] | null>(null)
-
-	useEffect(() => {
-		if (uploading) {
-			const run = async () => {
-				try {
-					if (messageRef.current && recipientsRef.current)
-						await new Message(messageRef.current).sendToPeople(
-							recipientsRef.current
-						)
-					messageRef.current = null
-					recipientsRef.current = null
-					setUploading(false)
-				} catch (e) {
-					console.error(`failure sending message from useSendToPeople`, e)
-					setError(e)
-				}
-			}
-			run()
-		}
-	}, [uploading])
-
-	const send = useCallback((message: MessageModel, recipients: string[]) => {
-		messageRef.current = message
-		recipientsRef.current = recipients
-		setUploading(true)
-	}, [])
-
-	return { send, uploading, error }
-}

package/src/hooks/useTyping/index.ts

@@ -1,154 +0,0 @@
-import { useEffect, useState, useMemo, useRef } from 'react'
-import { useFuegoContext } from '@nandorojo/fuego'
-import { Typing } from '../../classes/Room/types'
-
-/**
- * useTyping automatically updates the backend whenever a user is typing.
- *
- * @param options - A dictionary to configure the typing.
- * @param options.roomId - **Required** unique id of the room you're typing in.
- * @param options.text - **Required** The current text state of your chat input
- * @param options.delay (Optional) Set the timeout delay to mark typing false. Set null if you don't want a time out.
- *
- * @example
- * ```javascript
- * // input text state
- * const [text, setText] = useState('')
- * // let's say we're getting our room id from our react-navigation params
- * const navigation = useNavigation()
- * const roomId = navigation.params.id
- *
- * useTyping({ roomId, text })
- *
- * <ChatComponent text={text} onChangeText={setText} />
- * ```
- *
- * @returns
- * Doesn't return anything. We live in an undefined world, I suppose.
- *
- * @remarks
- * The actual data of who is typing is stored in the chatroom object.
- * If you want to get this data realtime in a room, consider using useRoom({ listen: true }). This data will also be in useInbox().
- * See docs for useRoom or useInbox for more.
- *
- */
-export default ({
-	roomId,
-	text,
-	delay = 5000
-}: {
-	roomId: string
-	text: string
-	delay?: number | null
-}) => {
-	const { auth, firebase } = useFuegoContext()
-	const [ready, setReady] = useState(false)
-	const { currentUser } = auth()
-	try {
-		if (!currentUser)
-			throw new Error(
-				'🤯 error in useTyping hook. Looks like there is not a valid user signed in. \nConsider using the FuegoGate component from @nandorojo/fuego and wrapping it around your app.'
-			)
-	} catch (e) {
-		console.error(e)
-	}
-	const { uid } = currentUser as firebase.User
-	const databaseRef = useMemo(() => firebase.database().ref(`/typing/${uid}`), [
-		uid,
-		firebase
-	])
-	const previouslyTyped = useRef('')
-
-	const timer = useRef<NodeJS.Timeout>()
-
-	const lastStateSent = useRef<IsTyping['state']>('nothing')
-
-	// initialize the typing set to false when we disconnect
-	// once that is set up, then we can mark that we are indeed typing elsewhere
-	// ^ that will be done in the next hook
-	useEffect(() => {
-		const subscriptionRef = firebase.database().ref('.info/connected')
-		const notTyping: IsTyping = {
-			state: 'nothing',
-			lastChanged: firebase.database.ServerValue.TIMESTAMP,
-			roomId
-		}
-
-		subscriptionRef.on('value', async snapshot => {
-			if (!snapshot.val()) return
-
-			try {
-				await databaseRef.onDisconnect().set(notTyping)
-				setReady(true)
-			} catch (e) {
-				console.error(`useTyping error within snapshot listener ${e}`)
-			}
-		})
-
-		return () => {
-			// clean up the listener on unmount
-			subscriptionRef.off('value')
-			;(async () => {
-				try {
-					lastStateSent.current = notTyping.state
-					await databaseRef.set(notTyping)
-				} catch (e) {
-					console.error('useTyping errored on unmount setting not typing')
-				}
-			})()
-		}
-	}, [roomId, databaseRef, firebase])
-
-	// every time we type something new, upload that we're typing
-	// and after a certain delay, we mark typing false
-	// however, if we type before that timer has completed,
-	// we clean it up and start it over
-	useEffect(() => {
-		try {
-			// we're ready to upload from the previous effect
-			// ...and the text we typed just changed.
-			// if text is empty, set to false
-			if (ready && text !== previouslyTyped.current) {
-				previouslyTyped.current = text
-
-				const notTyping: IsTyping = {
-					state: 'nothing',
-					lastChanged: firebase.database.ServerValue.TIMESTAMP,
-					roomId
-				}
-				const isTyping: IsTyping = {
-					state: 'typing',
-					lastChanged: firebase.database.ServerValue.TIMESTAMP,
-					roomId
-				}
-
-				// if the text is empty, we set it to not typing
-				const setValue = text ? isTyping : notTyping
-
-				// don't resend the state we just sent to avoid redundancy
-				if (setValue.state !== lastStateSent.current) {
-					lastStateSent.current = setValue.state
-					databaseRef.set(setValue)
-				}
-
-				// only need a notTyping timer timer if we're typing
-				if (delay !== null && setValue.state === 'typing') {
-					timer.current = setTimeout(() => {
-						lastStateSent.current = notTyping.state
-						databaseRef.set(notTyping)
-					}, delay)
-				}
-			}
-		} catch (e) {
-			console.error('error in useTyping after timer', e)
-		}
-
-		return () => {
-			if (timer.current) clearTimeout(timer.current)
-		}
-	}, [ready, text, roomId, delay, uid, databaseRef, firebase])
-}
-
-interface IsTyping extends Typing {
-	roomId: string
-}

package/src/hooks/useTypingOLD/index.ts

@@ -1,67 +0,0 @@
-import { useEffect, useRef } from 'react'
-import { Room } from '../../index'
-import { fuego } from '../../components/ChatProvider'
-import { UseTypingConfig } from './types'
-
-/**
- * useTyping updates the backend every time a user types, setting it to false after a certain delay.
- *
- * @param config { text, id } A dictionary that takes in the Input's current text value and the chatroom ID.
- * @param delay How long the timer delay should be before the backend is told we're no longer typing.
- *
- * @returns undefined
- */
-export default (config: UseTypingConfig, delay: number = 1500) => {
-	const { text = '', id } = config
-	const { path } = new Room({ id })
-	const ref = fuego.db.doc(path)
-	const timer = useRef<number>()
-	const user = fuego.auth().currentUser as firebase.User
-	const uid = (user && user.uid) || 'tester_name'
-	// ensures that typing only happens on update, not on mount
-	const mounted = useRef(false)
-	const lastTyped = useRef(0)
-
-	useEffect(() => {
-		try {
-			if (mounted.current) {
-				const typedAt = Date.now()
-				// const last = lastTyped.current
-				lastTyped.current = typedAt
-				// if ((typedAt - last) / 1000 >= delay) {
-				ref.update({
-					[`members.${uid}.typing`]: true
-					// [`members.${uid}.lastTyped`]: new Date()
-				})
-				timer.current = setTimeout(() => {
-					ref.update({
-						[`members.${uid}.typing`]: false
-					})
-				}, delay)
-				// }
-			} else {
-				mounted.current = true
-			}
-		} catch (e) {
-			console.error('use typing update error', e)
-		}
-
-		return () => {
-			// cleanup on update
-			if (timer.current) clearTimeout(timer.current)
-		}
-	}, [text, uid, delay, path])
-
-	useEffect(() => {
-		return () => {
-			try {
-				// mark indicator as false
-				ref.update({
-					[`members.${uid}.typing`]: false
-				})
-			} catch (e) {
-				console.error('unmount usetyping error', e)
-			}
-		}
-	}, [])
-}

package/src/hooks/useTypingOLD/types.ts

@@ -1,7 +0,0 @@
-/**
- * useTyping updates the backend every time a user types, setting it to false after a certain delay.
- */
-export interface UseTypingConfig {
-	text: string
-	id: string
-}