Revert "infinite"

This reverts commit f781381, reversing changes made to 463c7a1.
andrew-bierman · Sep 9, 2024 · bcfc63e · bcfc63e
1 parent f781381
commit bcfc63e
Show file tree

Hide file tree

Showing 54 changed files with 484 additions and 714 deletions.
diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/search.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/search.tsx
@@ -1,11 +1,13 @@
-import { RStack, View } from '@packrat/ui';
-import { PlacesAutocomplete } from 'app/components/PlacesAutocomplete';
-import { useRouter } from 'app/hooks/router';
-import useTheme from 'app/hooks/useTheme';
+import React from 'react';
+import { Platform, type TextInput } from 'react-native';
+import { useCallback, useRef } from 'react';
 import { Stack, useFocusEffect } from 'expo-router';
 import Head from 'expo-router/head';
-import React, { useCallback, useRef } from 'react';
-import { Platform, type TextInput } from 'react-native';
+import { useRouter } from 'app/hooks/router';
+import { PlacesAutocomplete } from 'app/components/PlacesAutocomplete';
+import { RStack } from '@packrat/ui';
+import useTheme from 'app/hooks/useTheme';
+import { View } from 'native-base';
 
 interface SearchResult {
   properties: {

diff --git a/packages/app/components/carousel/index.tsx b/packages/app/components/carousel/index.tsx
@@ -15,7 +15,7 @@ interface CarouselProps {
   iconColor?: string;
 }
 
-const { width: screenWidth } = Dimensions.get('window');
+const { height, width } = Dimensions.get('window');
 
 const Carousel: React.FC<CarouselProps> = ({
   children = [],
@@ -37,7 +37,7 @@ const Carousel: React.FC<CarouselProps> = ({
   const scrollToIndex = (index: number) => {
     if (index >= 0 && index < children.length && scrollViewRef.current) {
       scrollViewRef.current.scrollTo({
-        x: index * (itemWidth || 220), // Use itemWidth if passed
+        x: index * 220,
         y: 0,
         animated: true,
       });
@@ -49,14 +49,13 @@ const Carousel: React.FC<CarouselProps> = ({
     <RStack
       style={{
         alignSelf: 'center',
-        width: Platform.OS === 'web' ? '90%' : screenWidth, // Full width on native
+        width: '90%',
         justifyContent: 'center',
         alignItems: 'center',
         flexDirection: 'row',
         flex: 1,
       }}
     >
-      {/* Show buttons only on web */}
       {Platform.OS === 'web' && (
         <ScrollButton
           direction="left"
@@ -71,6 +70,7 @@ const Carousel: React.FC<CarouselProps> = ({
         ref={scrollViewRef}
         horizontal
         scrollEnabled
+        // gestureEnabled={false} // Add this prop
         style={styles.carousel}
         showsHorizontalScrollIndicator={false}
         contentContainerStyle={{ flexDirection: 'row' }}
@@ -82,7 +82,6 @@ const Carousel: React.FC<CarouselProps> = ({
             <RStack
               key={index}
               style={{
-                ...(index === 0 ? { marginLeft: 10 } : { marginLeft: 0 }),
                 marginRight: 10,
                 marginTop: 10,
                 flexDirection: 'row',
@@ -93,7 +92,6 @@ const Carousel: React.FC<CarouselProps> = ({
           ))}
       </ScrollView>
 
-      {/* Show buttons only on web */}
       {Platform.OS === 'web' && (
         <ScrollButton
           direction="right"

diff --git a/packages/app/components/chat/index.tsx b/packages/app/components/chat/index.tsx
@@ -21,6 +21,7 @@ import {
   SuggestionList,
 } from '../../components/Suggestion';
 import useTheme from 'app/hooks/useTheme';
+import colors from 'native-base/lib/typescript/theme/base/colors';
 
 interface ChatComponentProps {
   showChatSelector?: boolean;

diff --git a/packages/app/components/layout/Layout.tsx b/packages/app/components/layout/Layout.tsx
@@ -16,7 +16,6 @@ const Layout = ({
           flex: 1,
           justifyContent: 'center',
           marginTop: 20,
-          marginBottom: 20,
           alignItems: 'center',
           backgroundColor: 'transparent',
           width: '100%',

diff --git a/packages/app/components/progress/index.tsx b/packages/app/components/progress/index.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
+import { Progress } from 'native-base';
 import useTheme from 'app/hooks/useTheme';
 import { useProgressStore } from 'app/atoms/progressStore';
-import { View } from '@packrat/ui';
 
 const ProgressBarComponent = () => {
   const { currentTheme } = useTheme();
@@ -35,23 +35,14 @@ const ProgressBarComponent = () => {
   }, [localCurrentValue, targetValue, operationId]);
 
   return (
-    <View
-      style={{
-        width: '100%',
-        height: 4,
-        backgroundColor: currentTheme.colors.background,
-        borderRadius: 2,
-        overflow: 'hidden',
-      }}
-    >
-      <View
-        style={{
-          width: `${(localCurrentValue / targetValue) * 100}%`,
-          height: '100%',
-          backgroundColor: currentTheme.colors.primary,
-        }}
-      />
-    </View>
+    <Progress
+      value={localCurrentValue}
+      colorScheme="success"
+      size="sm"
+      w="100%"
+      borderRadius={0}
+      bg={currentTheme.colors.background}
+    />
   );
 };
 

diff --git a/packages/app/config/axios.ts b/packages/app/config/axios.ts
@@ -1,7 +1,7 @@
 import axios from 'axios';
 import { api } from 'app/constants/api';
 // import { store } from '../store/store';
-import { toast } from 'app/utils/ToastUtils';
+import { InformUser } from 'app/utils/ToastUtils';
 import { dispatchProgress, progressActions } from '../atoms/progressStore';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 
@@ -70,10 +70,11 @@ const responseInterceptor = (response) => {
   const responseMessage = response.headers['x-response-message'];
 
   if (responseMessage) {
-    toast({
+    InformUser({
       title: responseMessage,
-      duration: 3,
-      preset: response.status === 200 ? 'done' : 'error',
+      placement: 'bottom',
+      duration: 3000,
+      style: { backgroundColor: response.status === 200 ? 'green' : 'red' },
     });
   }
 
@@ -85,10 +86,11 @@ const responseInterceptor2 = (response) => {
   const responseMessage = response.headers['x-response-message'];
 
   if (responseMessage) {
-    toast({
+    InformUser({
       title: responseMessage,
-      duration: 3,
-      preset: response.status === 200 ? 'done' : 'error',
+      placement: 'bottom',
+      duration: 3000,
+      style: { backgroundColor: response.status === 200 ? 'green' : 'red' },
     });
   }
 
@@ -114,11 +116,11 @@ const responseErrorInterceptor = (error) => {
 
   const errorMessage =
     'message' in error ? error.message : 'Something went wrong';
-
-  toast({
+  InformUser({
     title: errorMessage,
-    duration: 3,
-    preset: 'error',
+    placement: 'bottom',
+    duration: 3000,
+    style: { backgroundColor: 'red' },
   });
 
   return Promise.reject(error);
@@ -131,10 +133,11 @@ const responseErrorInterceptor2 = (error) => {
 
   const errorMessage =
     'message' in error ? error.message : 'Something went wrong';
-  toast({
+  InformUser({
     title: errorMessage,
-    duration: 3,
-    preset: 'error',
+    placement: 'bottom',
+    duration: 3000,
+    style: { backgroundColor: 'red' },
   });
 
   setTimeout(() => {

diff --git a/packages/app/config/trpcAxiosClient.ts b/packages/app/config/trpcAxiosClient.ts
@@ -1,5 +1,5 @@
 import axios, { AxiosResponse } from 'axios';
-import { toast } from 'app/utils/ToastUtils';
+import { InformUser } from 'app/utils/ToastUtils';
 import { logoutAuthUser } from 'app/utils/userUtils';
 import { getErrorMessageFromError } from 'app/utils/apiUtils';
 
@@ -25,10 +25,11 @@ const responseInterceptor = (response: AxiosResponse) => {
     return response;
   }
 
-  toast({
+  InformUser({
     title: 'Confirmed! Your submission was successful.',
-    duration: 3,
-    preset: 'done',
+    placement: 'bottom',
+    duration: 3000,
+    style: { backgroundColor: 'green' },
   });
 
   return response;
@@ -51,10 +52,11 @@ const responseErrorInterceptor = (response: AxiosResponse) => {
   const responseMessage = getErrorMessageFromError(response);
 
   if (responseMessage) {
-    toast({
+    InformUser({
       title: responseMessage,
-      duration: 3,
-      preset: 'error',
+      placement: 'bottom',
+      duration: 3000,
+      style: { backgroundColor: 'red' },
     });
   }
 

diff --git a/packages/app/context/ThirdPartyThemeProviders.tsx b/packages/app/context/ThirdPartyThemeProviders.tsx
@@ -3,6 +3,7 @@ import { TamaguiProvider, Theme as TamaguiTheme } from 'tamagui';
 import { ToastProvider } from '@tamagui/toast';
 import config from '../theme/tamagui.config';
 import { ThemeProvider as RNPaperThemeProvider } from 'react-native-paper';
+import { NativeBaseProvider } from 'native-base';
 import {
   darkPaperTheme,
   lightThemePaper,
@@ -11,7 +12,6 @@ import {
 } from '../theme';
 import FontLoader from './FontLoader';
 import { setupDev } from 'tamagui';
-import { Toaster } from 'burnt/web';
 
 const ThirdPartyProviders = ({ children, isDark = false }) => {
   setupDev({
@@ -26,16 +26,19 @@ const ThirdPartyProviders = ({ children, isDark = false }) => {
 
   return (
     <FontLoader>
-      <TamaguiProvider config={config} disableRootThemeClass={false}>
-        <TamaguiTheme name={isDark ? 'dark' : 'light'}>
-          <ToastProvider>
-            <RNPaperThemeProvider theme={darkPaperTheme}>
-              {children}
-              <Toaster />
-            </RNPaperThemeProvider>
-          </ToastProvider>
-        </TamaguiTheme>
-      </TamaguiProvider>
+      <NativeBaseProvider
+        theme={isDark ? nativeBaseDarkTheme : nativeBaseLightTheme}
+      >
+        <TamaguiProvider config={config} disableRootThemeClass={false}>
+          <TamaguiTheme name={isDark ? 'dark' : 'light'}>
+            <ToastProvider>
+              <RNPaperThemeProvider theme={darkPaperTheme}>
+                {children}
+              </RNPaperThemeProvider>
+            </ToastProvider>
+          </TamaguiTheme>
+        </TamaguiProvider>
+      </NativeBaseProvider>
     </FontLoader>
   );
 };

diff --git a/packages/app/hooks/favorites/index.ts b/packages/app/hooks/favorites/index.ts
@@ -0,0 +1,2 @@
+export * from './useFetchUserFavorites';
+export * from './useAddFavorite';
diff --git a/.../app/modules/feed/hooks/useAddFavorite.ts → ...ges/app/hooks/favorites/useAddFavorite.ts b/.../app/modules/feed/hooks/useAddFavorite.ts → ...ges/app/hooks/favorites/useAddFavorite.ts
@@ -1,4 +1,4 @@
-import { queryTrpc } from 'app/trpc';
+import { queryTrpc } from '../../trpc';
 
 export function useAddFavorite() {
   const utils = queryTrpc.useContext();

diff --git a/...dules/feed/hooks/useFetchUserFavorites.ts → .../hooks/favorites/useFetchUserFavorites.ts b/...dules/feed/hooks/useFetchUserFavorites.ts → .../hooks/favorites/useFetchUserFavorites.ts
@@ -1,4 +1,4 @@
-import { queryTrpc } from 'app/trpc';
+import { queryTrpc } from '../../trpc';
 
 export const useFetchUserFavorites = (userId: string) => {
   const enabled = !!userId;

diff --git a/packages/app/hooks/password-reset/useRequestEmailModal.ts b/packages/app/hooks/password-reset/useRequestEmailModal.ts
@@ -1,5 +1,5 @@
 import useTheme from 'app/hooks/useTheme';
-import { toast } from 'app/utils/ToastUtils';
+import { InformUser } from 'app/utils/ToastUtils';
 import { queryTrpc } from 'app/trpc';
 
 export const useRequestEmailModal = () => {
@@ -21,11 +21,11 @@ export const useRequestEmailModal = () => {
       // TODO - switch to RTK query
       // await axios.post(`${api}/password-reset`, { email });
       closeModal();
-
-      toast({
+      InformUser({
         title: 'Password reset email sent',
-        duration: 3,
-        preset: 'done',
+        style: { backgroundColor: currentTheme.colors.text },
+        placement: 'bottom',
+        duration: 5000,
       });
     } catch (error) {}
   };
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export * from './useFetchUserFavorites';
		export * from './useAddFavorite';