@chem-po/react-native 0.0.51 → 0.0.53

package/src/components/feed/hooks.ts

@@ -1,279 +0,0 @@
-import { FetchFeedFunction } from '@chem-po/core'
-import { UpdatePanelsArgs, useAuth, useToast } from '@chem-po/react'
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-
-const DEFAULT_LIMIT = 10
-export const useMediaFeed = (
-  fetch: FetchFeedFunction,
-  onUpdatePanels: (items: UpdatePanelsArgs) => void,
-  limit: number = DEFAULT_LIMIT,
-  authRequired = false,
-) => {
-  // first element is prev ids, second element is curr ids, third element is next ids
-  const [ids, setIds] = useState<[string[] | null, string[] | null, string[] | null]>([
-    null,
-    null,
-    null,
-  ])
-  const [idIdx, setIdIdx] = useState<number>(0)
-  const user = useAuth(s => s.user)
-
-  const [loading, setLoading] = useState(false)
-  const [refreshing, setRefreshing] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [itemLoading, setItemLoading] = useState(false)
-  const [direction, setDirection] = useState<'next' | 'prev' | null>(null)
-
-  const fetchingId = useRef<string | null>(null)
-
-  const idsRef = useRef<{ prev: string | null; curr: string | null; next: string | null }>({
-    prev: null,
-    curr: null,
-    next: null,
-  })
-
-  const { showInfo, showError } = useToast()
-
-  const updateCurr = useCallback(
-    (id: string | null) => {
-      if (id) {
-        if (idsRef.current.prev === id) {
-          idsRef.current.prev = null
-        }
-        if (idsRef.current.next === id) {
-          idsRef.current.next = null
-        }
-      }
-      idsRef.current.curr = id
-      onUpdatePanels({ ...idsRef.current })
-    },
-    [onUpdatePanels],
-  )
-
-  const updateNext = useCallback(
-    (id: string | null) => {
-      if (id) {
-        if (idsRef.current.prev === id) {
-          idsRef.current.prev = null
-        }
-        if (idsRef.current.curr === id) {
-          idsRef.current.curr = null
-        }
-      }
-      idsRef.current.next = id
-      onUpdatePanels({ ...idsRef.current })
-    },
-    [onUpdatePanels],
-  )
-
-  const updatePrev = useCallback(
-    (id: string | null) => {
-      if (id) {
-        if (idsRef.current.curr === id) {
-          idsRef.current.curr = null
-        }
-        if (idsRef.current.next === id) {
-          idsRef.current.next = null
-        }
-      }
-      idsRef.current.prev = id
-      onUpdatePanels({ ...idsRef.current })
-    },
-    [onUpdatePanels],
-  )
-
-  const fetchIds = useCallback(
-    async (
-      startBefore: string | null,
-      startAfter: string | null,
-      isPrefetch: boolean,
-    ): Promise<string[]> => {
-      if (!user && authRequired) return []
-      if (!isPrefetch) setLoading(true)
-
-      try {
-        const data = await fetch({ limit, startAfter, startBefore })
-        if (!isPrefetch) {
-          const firstId = data.ids[0]
-          const secondId = data.ids[1] || null
-          updateCurr(firstId)
-          updateNext(secondId)
-          updatePrev(startAfter)
-          if (startAfter) {
-            setIds(s => [s[1], data.ids, null])
-          } else if (startBefore) {
-            setIds(s => [null, data.ids, s[1]])
-          } else {
-            setIds([null, data.ids, null])
-          }
-          const newLastId = data.ids[data.ids.length - 1]
-          if (newLastId) {
-            fetchIds(null, newLastId, true)
-          }
-        } else if (startAfter) {
-          setIds(s => [s[0], s[1], data.ids])
-        } else if (startBefore) {
-          setIds(s => [data.ids, s[1], s[2]])
-        }
-        setLoading(false)
-        return data.ids || []
-      } catch (err: any) {
-        setError(err.message)
-        // toast({
-        //   title: 'Error fetching feed',
-        //   description: err.message,
-        //   status: 'error',
-        //   duration: 9000,
-        //   isClosable: true,
-        // })
-        showError('Error fetching feed')
-      }
-      setLoading(false)
-      return []
-    },
-    [fetch, user, authRequired, updateCurr, updateNext, updatePrev, limit, showError],
-  )
-
-  // handles prefetching of next items
-  const getNextId = useCallback(
-    async (currIdx: number, isPrefetch: boolean): Promise<{ id: string; idx: number } | null> => {
-      const currIds = ids[1] ?? []
-      const nextIds = ids[2] ?? []
-      const nextIdx = currIdx + 1
-      if (nextIdx < currIds.length) {
-        return { id: currIds[nextIdx], idx: nextIdx }
-      }
-      if (nextIds[0]) {
-        const newLastId = nextIds[nextIds.length - 1]
-        if (!isPrefetch) {
-          setIds(s => [s[1], s[2], null])
-          fetchIds(null, newLastId, true)
-        }
-        return { id: nextIds[0], idx: 0 }
-      }
-      const fetchedNextIds = await fetchIds(null, currIds[currIds.length - 1], isPrefetch)
-      const fetchedNextId = fetchedNextIds[0]
-      return fetchedNextId ? { id: fetchedNextId, idx: 0 } : null
-    },
-    [ids, fetchIds],
-  )
-
-  const getPrevId = useCallback(
-    async (currIdx: number, isPrefetch: boolean): Promise<{ id: string; idx: number } | null> => {
-      const currIds = ids[1] ?? []
-      const prevIds = ids[0] ?? []
-      const prevIdx = currIdx - 1
-      if (prevIdx >= 0) {
-        return { id: currIds[prevIdx], idx: prevIdx }
-      }
-      if (prevIds[prevIds.length - 1]) {
-        const newFirstId = prevIds[0]
-        if (!isPrefetch) {
-          setIds([null, ids[0], ids[1]])
-          fetchIds(newFirstId, null, true)
-        }
-        return { id: prevIds[prevIds.length - 1], idx: prevIds.length - 1 }
-      }
-      const fetchedPrevIds = await fetchIds(currIds[0], null, isPrefetch)
-      const fetchedPrevId = fetchedPrevIds[fetchedPrevIds.length - 1]
-      return fetchedPrevId ? { id: fetchedPrevId, idx: fetchedPrevIds.length - 1 } : null
-    },
-    [ids, fetchIds],
-  )
-
-  const goNext = useCallback(async () => {
-    if (itemLoading) return
-    // case 1: next item ID is fetched
-    const newPrev = idsRef.current.curr
-
-    setItemLoading(true)
-    const nextIdData = await getNextId(idIdx, false)
-    setDirection('next')
-    if (nextIdData) {
-      const { id: nextId, idx: nextIdx } = nextIdData
-      fetchingId.current = nextId
-      setIdIdx(nextIdx)
-      updateCurr(nextId)
-      updateNext(null)
-      updatePrev(newPrev)
-      getNextId(nextIdx, true).then(newNextId => updateNext(newNextId?.id ?? null))
-    } else {
-      showInfo('No more items')
-    }
-    setItemLoading(false)
-  }, [idIdx, getNextId, updateCurr, updateNext, updatePrev, itemLoading, showInfo])
-
-  const goPrev = useCallback(async () => {
-    if (itemLoading) return
-    // case 1: next item ID is fetched
-    const newNext = idsRef.current.curr
-
-    setDirection('prev')
-    setItemLoading(true)
-    const prevIdData = await getPrevId(idIdx, false)
-    if (prevIdData) {
-      const { id: prevId, idx: prevIdx } = prevIdData
-      fetchingId.current = prevId
-      setIdIdx(prevIdx)
-      updateCurr(prevId)
-      updatePrev(null)
-      updateNext(newNext)
-      getPrevId(prevIdx, true).then(newPrevId => updatePrev(newPrevId?.id ?? null))
-    } else {
-      showInfo('No more items')
-    }
-    setItemLoading(false)
-  }, [idIdx, getPrevId, updateCurr, updateNext, updatePrev, itemLoading, showInfo])
-
-  const refresh = useCallback(async () => {
-    setLoading(true)
-    setRefreshing(true)
-    setIds([null, null, null])
-    updateCurr(null)
-    updateNext(null)
-    updatePrev(null)
-    setDirection(null)
-    setIdIdx(0)
-    await fetchIds(null, null, false)
-    setRefreshing(false)
-  }, [fetchIds, updateCurr, updateNext, updatePrev])
-
-  const [initFetchIds] = useState(() => fetchIds)
-  useEffect(() => {
-    initFetchIds(null, null, false)
-  }, [initFetchIds])
-
-  const canGoPrev = useMemo(() => (idIdx > 0 && !!ids[1]?.length) || !!ids[0]?.length, [ids, idIdx])
-  const canGoNext = useMemo(
-    () => (ids[1] && idIdx < ids[1].length) ?? !!ids[2]?.length,
-    [ids, idIdx],
-  )
-  return useMemo(
-    () => ({
-      ids,
-      goNext,
-      goPrev,
-      error,
-      refresh,
-      refreshing,
-      loading,
-      canGoNext,
-      direction,
-      canGoPrev,
-      itemLoading,
-    }),
-    [
-      ids,
-      goNext,
-      goPrev,
-      loading,
-      error,
-      itemLoading,
-      canGoNext,
-      canGoPrev,
-      refresh,
-      refreshing,
-      direction,
-    ],
-  )
-}

package/src/components/feed/index.ts

@@ -1,2 +0,0 @@
-export { useMediaFeed } from './context'
-export * from './MediaFeed'

package/src/components/form/Condition.tsx

@@ -1,27 +0,0 @@
-import React, { PropsWithChildren, useMemo } from 'react'
-import { useWatch } from 'react-hook-form'
-import { Animated } from 'react-native'
-
-export const Condition = ({
-  path,
-  condition,
-  children,
-}: PropsWithChildren<{
-  path: string
-  condition: (values: any) => boolean
-}>) => {
-  const value = useWatch({ exact: true, name: path })
-  const isVisible = useMemo(() => condition(value), [value, condition])
-
-  if (!isVisible) return null
-
-  return (
-    <Animated.View
-      style={{
-        paddingVertical: 3,
-        opacity: 1,
-      }}>
-      {children}
-    </Animated.View>
-  )
-}

package/src/components/form/Field.tsx

@@ -1,44 +0,0 @@
-import { InputRef, InputSize, getFieldValidate } from '@chem-po/core'
-import { Field, useField } from '@chem-po/react'
-import React, { ForwardedRef, forwardRef, useMemo } from 'react'
-import { ChangeHandler, Controller } from 'react-hook-form'
-import { Input } from './input/input'
-
-const FieldComponentBase = (
-  { field, name, size: formSize }: { field: Field; name: string; size?: InputSize },
-  ref: ForwardedRef<InputRef>,
-) => {
-  const { control, getOnChange, meta, onFocus, onBlur: fieldBlur } = useField(name, field)
-  const validate = useMemo(() => field.validate ?? getFieldValidate(field), [field])
-
-  return (
-    <Controller<Field['defaultValue']>
-      control={control}
-      rules={{ validate }}
-      name={name}
-      render={({ field: { name: _, ref: _r, onBlur, ...inputProps } }) => {
-        return (
-          <Input
-            ref={ref}
-            field={field}
-            input={{
-              ...inputProps,
-              onFocus,
-              onBlur: () => {
-                fieldBlur()
-                onBlur()
-              },
-              onChange: getOnChange(inputProps.onChange as ChangeHandler),
-            }}
-            meta={meta}
-            formSize={formSize}
-          />
-        )
-      }}
-    />
-  )
-}
-
-export const FieldComponent = forwardRef(FieldComponentBase)
-
-export default FieldComponent