Merge pull request #25 from Ruffrl/priyapower/setup-search-framing

Setup search dashboard screen layout, framing, and styles

apps/rufferal/src/app/screens/Screens.tsx

@@ -1,5 +1,6 @@
 import { NavigationContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import { ScreenProps } from '@rufferal/types';
 import { observer } from 'mobx-react-lite';
 import {
   CatAvatarScreen,
@@ -12,10 +13,13 @@ import {
   DogPersonalityScreen,
   ManagePetsScreen,
   PetSplashScreen,
-  SearchScreen,
+  ProfileSplashScreen,
+  SearchDashboardScreen,
+  SearchFiltersScreen,
+  SearchResultsScreen,
 } from '.';
 
-const Stack = createNativeStackNavigator();
+const Stack = createNativeStackNavigator<ScreenProps>();
 
 export const Screens = observer(() => {
   return (
@@ -24,11 +28,8 @@ export const Screens = observer(() => {
         {/* ⬇️⬇️⬇️ CURRENT DEVELOPMENT PAGE ⬇️⬇️⬇️ */}
         {/* ⬆️⬆️⬆️ CURRENT DEVELOPMENT PAGE ⬆️⬆️⬆️ */}
 
-        <Stack.Screen
-          name="Create Pets Onboarding"
-          component={PetSplashScreen}
-        />
-        <Stack.Screen name="Manage Pets" component={ManagePetsScreen} />
+        <Stack.Screen name="Pet Splash" component={PetSplashScreen} />
+        <Stack.Screen name="Pets Dashboard" component={ManagePetsScreen} />
         <Stack.Screen name="Cat Details" component={CatDetailsScreen} />
         <Stack.Screen name="Cat Avatar" component={CatAvatarScreen} />
         <Stack.Screen name="Cat Personality" component={CatPersonalityScreen} />
@@ -37,7 +38,13 @@ export const Screens = observer(() => {
         <Stack.Screen name="Dog Avatar" component={DogAvatarScreen} />
         <Stack.Screen name="Dog Personality" component={DogPersonalityScreen} />
         <Stack.Screen name="Dog Careplan" component={DogCareplanScreen} />
-        <Stack.Screen name="Search" component={SearchScreen} />
+        <Stack.Screen
+          name="Search Dashboard"
+          component={SearchDashboardScreen}
+        />
+        <Stack.Screen name="Search Filters" component={SearchFiltersScreen} />
+        <Stack.Screen name="Search Results" component={SearchResultsScreen} />
+        <Stack.Screen name="Profile Splash" component={ProfileSplashScreen} />
       </Stack.Navigator>
     </NavigationContainer>
   );

apps/rufferal/src/app/screens/index.ts

@@ -7,5 +7,8 @@ export { DogCareplanScreen } from './pets/dogs/DogCareplanScreen';
 export { DogDetailsScreen } from './pets/dogs/DogDetailsScreen';
 export { DogPersonalityScreen } from './pets/dogs/DogPersonalityScreen';
 export { ManagePetsScreen } from './pets/ManagePetsScreen';
-export { PetSplashScreen } from './profile/create/PetSplashScreen';
-export { SearchScreen } from './search/SearchScreen';
+export { PetSplashScreen } from './pets/PetSplashScreen';
+export { ProfileSplashScreen } from './profile/ProfileSplashScreen';
+export { SearchDashboardScreen } from './search/SearchDashboardScreen';
+export { SearchFiltersScreen } from './search/SearchFiltersScreen';
+export { SearchResultsScreen } from './search/SearchResultsScreen';

apps/rufferal/src/app/screens/profile/create/PetSplashScreen.tsx → apps/rufferal/src/app/screens/pets/PetSplashScreen.tsx

@@ -1,4 +1,5 @@
-import { PageNavigationProps, PetSplash } from '@rufferal/ui';
+import { PageNavigationProps } from '@rufferal/types';
+import { PetSplash } from '@rufferal/ui';
 
 export const PetSplashScreen = ({ navigation }: PageNavigationProps) => {
   return <PetSplash navigation={navigation} />;

apps/rufferal/src/app/screens/profile/ProfileSplashScreen.tsx

@@ -0,0 +1,7 @@
+import { PageNavigationProps } from '@rufferal/types';
+import { ProfileSplash } from '@rufferal/ui';
+
+export const ProfileSplashScreen
+  = ({ navigation }: PageNavigationProps) => {
+  return <ProfileSplash navigation={navigation} />;
+};

apps/rufferal/src/app/screens/search/SearchDashboardScreen.tsx

@@ -0,0 +1,6 @@
+import { PageNavigationProps } from '@rufferal/types';
+import { SearchDashboard } from '@rufferal/ui';
+
+export const SearchDashboardScreen = ({ navigation }: PageNavigationProps) => {
+  return <SearchDashboard navigation={navigation} />;
+};

apps/rufferal/src/app/screens/search/SearchFiltersScreen.tsx

@@ -0,0 +1,6 @@
+import { PageNavigationProps } from '@rufferal/types';
+import { SearchFilters } from '@rufferal/ui';
+
+export const SearchFiltersScreen = ({ navigation }: PageNavigationProps) => {
+  return <SearchFilters navigation={navigation} />;
+};

apps/rufferal/src/app/screens/search/SearchResultsScreen.tsx

@@ -0,0 +1,6 @@
+import { PageNavigationProps } from '@rufferal/types';
+import { SearchResults } from '@rufferal/ui';
+
+export const SearchResultsScreen = ({ navigation }: PageNavigationProps) => {
+  return <SearchResults navigation={navigation} />;
+};

assets/src/images/mocks/asian-teenager-s-close-up-portrait-isolated-blue-studio/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/asian-teenager-s-close-up-portrait-isolated-blue-studio_11197072.htm#fromView=search&page=1&position=51&uuid=8a341c09-5225-411a-8a62-705698af6ab1
+* Asian teenager's close up portrait isolated on blue studio
+* master1305

assets/src/images/mocks/authentic-small-youthful-marketing-agency/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/authentic-small-youthful-marketing-agency_94964017.htm#fromView=search&page=1&position=32&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Authentic small and youthful marketing agency
+* freepik

assets/src/images/mocks/beautiful-african-american-woman-cafe/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/beautiful-african-american-woman-cafe_9618831.htm#fromView=search&page=1&position=22&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Beautiful African-American woman in cafe
+* wayhomestudio

assets/src/images/mocks/close-up-smiley-woman-taking-selfie/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/close-up-smiley-woman-taking-selfie_11100291.htm#fromView=search&page=2&position=37&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Close-up smiley woman taking selfie
+* freepik

assets/src/images/mocks/close-up-view-attractive-adult-male-with-beard-sitting-open-terrace-typing-laptop-looking-screen-with-interested-smile-using-wi-fi-communicate-online-while-away-vacations/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/close-up-view-attractive-adult-male-with-beard-sitting-open-terrace-typing-laptop-looking-screen-with-interested-smile-using-wi-fi-communicate-online-while-away-vacations_9661800.htm#fromView=search&page=2&position=10&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Close up view of attractive adult male with beard sitting at open terrace, typing on laptop, looking at screen with interested smile, using wi-fi to communicate online while away on vacations
+* wayhomestudio

assets/src/images/mocks/front-view-handsome-african-american-man-looking/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/front-view-handsome-african-american-man-looking_7552544.htm#fromView=search&page=1&position=20&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Front view of handsome African American man looking
+* pch.vector

assets/src/images/mocks/front-view-man-with-beard-posing/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/front-view-man-with-beard-posing_27572249.htm#fromView=search&page=1&position=6&uuid=fbf7ffa0-2811-4b24-9f60-497b81823322
+* Front view man with beard posing
+* freepik

assets/src/images/mocks/front-view-smiley-woman-home/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/front-view-smiley-woman-home_36300675.htm#fromView=search&page=1&position=2&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Front view smiley woman at home
+* freepik

assets/src/images/mocks/handsome-man-outdoors-portrait/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/handsome-man-outdoors-portrait_7090542.htm#fromView=search&page=1&position=9&uuid=033c2787-580e-46bc-923d-3a562a0abcca
+* handsome-man-outdoors-portrait
+* ArthurHidden

assets/src/images/mocks/medium-shot-happy-woman/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/medium-shot-happy-woman_15516563.htm#fromView=search&page=1&position=23&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Medium shot happy woman
+* freepik

assets/src/images/mocks/portrait-asian-teen-boy/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-asian-teen-boy_19333620.htm#fromView=search&page=1&position=3&uuid=fd3e979d-a0b9-4099-a6ca-9aa6811a0c2d
+* Portrait of asian teen boy
+* freepik

assets/src/images/mocks/portrait-beautiful-woman-wearing-formal-clothes/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-beautiful-woman-wearing-formal-clothes_7009911.htm#fromView=search&page=1&position=28&uuid=fbf7ffa0-2811-4b24-9f60-497b81823322
+* Portrait of beautiful woman wearing formal clothes
+* freepik

assets/src/images/mocks/portrait-man-laughing/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-man-laughing_12478216.htm#fromView=search&page=1&position=19&uuid=45f90a99-b549-476a-80da-5da2834287d6
+* Portrait man laughing
+* freepik

assets/src/images/mocks/portrait-smiling-woman-outdoors-with-beanie/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-smiling-woman-outdoors-with-beanie_22196507.htm#fromView=search&page=1&position=18&uuid=8a341c09-5225-411a-8a62-705698af6ab1
+* Portrait of smiling woman outdoors with beanie
+* freepik

assets/src/images/mocks/portrait-smiling-woman-patient-looking-camera-sitting-chair-waiting-room-stomatologic/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-smiling-woman-patient-looking-camera-sitting-chair-waiting-room-stomatologic_15967364.htm#fromView=search&page=1&position=0&uuid=09964647-7e4c-4fc8-b87d-3c45a002dcb3
+* Portrait of smiling woman patient looking on camera sitting on chair in waiting room of stomatologic
+* DC Studio

assets/src/images/mocks/portrait-white-man-isolated/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-white-man-isolated_3199590.htm#fromView=search&page=1&position=21&uuid=45f90a99-b549-476a-80da-5da2834287d6
+* Portrait of white man isolated
+* rawpixel.com

assets/src/images/mocks/portrait-young-happy-man/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-young-happy-man_23441181.htm#fromView=search&page=1&position=8&uuid=fbf7ffa0-2811-4b24-9f60-497b81823322
+* Portrait of young and happy man
+* freepik

assets/src/images/mocks/portrait-young-woman-street/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/portrait-young-woman-street_27496518.htm#fromView=search&page=2&position=14&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Portrait of a young woman in the street
+* freepik

assets/src/images/mocks/positive-happy-black-lady-posing-outdoors-smiling/attribution.txt

@@ -0,0 +1,6 @@
+Attribution: 
+"Designed by Freepik"
+
+* https://www.freepik.com/free-photo/positive-happy-black-lady-posing-outdoors-smiling_5546701.htm#fromView=search&page=2&position=3&uuid=43377257-07f4-4338-8801-5f497d9097a1
+* Positive happy black lady posing outdoors and smiling
+* katemangostar