added: empty home banner for reviewer (#275) (#276)

* refactor: turning premium status on and off * added: empty home banner for reviewer
HansGabriel · Dec 15, 2023 · 1d31329 · 1d31329
1 parent 7a7b6bc
commit 1d31329
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 6 deletions.
diff --git a/apps/expo/src/components/discover-reviewers/DiscoverReviewersHomeSection.tsx b/apps/expo/src/components/discover-reviewers/DiscoverReviewersHomeSection.tsx
@@ -5,8 +5,8 @@ import { trpc } from "../../utils/trpc";
 import type { FC } from "react";
 import { useNavigation } from "@react-navigation/native";
 import { SkeletonLoader } from "../loaders/SkeletonLoader";
-import HomeEmptyTest from "../home-empty-section/EmptyTest";
 import DiscoverReviewersHomeDisplayCard from "./DiscoverReviewersHomeCard";
+import HomeEmptyReviewer from "../home-empty-section/EmptyReviewer";
 
 const DiscoverReviewersHomeSection: FC = () => {
   const { data } = trpc.reviewer.getDiscoverReviewers.useQuery({
@@ -39,7 +39,7 @@ const DiscoverReviewersHomeSection: FC = () => {
   if (!data.length) {
     return (
       <SafeAreaView className="flex-1">
-        <HomeEmptyTest />
+        <HomeEmptyReviewer />
       </SafeAreaView>
     );
   }

diff --git a/apps/expo/src/components/home-empty-section/EmptyCollection.tsx b/apps/expo/src/components/home-empty-section/EmptyCollection.tsx
@@ -1,16 +1,26 @@
 import React, { FC } from "react";
 import { SafeAreaView, Text, TouchableOpacity, View } from "react-native";
 import HomeEmptyCollectionBanner from "../../icons/home-empty-section/HomeEmptyCollectionBanner";
+import { useNavigation } from "@react-navigation/native";
 
 const HomeEmptyCollection: FC = () => {
+  const navigation = useNavigation();
+
+  const goToCreateCollectionScreen = () => {
+    navigation.navigate("CreateCollection");
+  };
+
   return (
     <SafeAreaView>
       <View className="h-[75%] items-center">
         <HomeEmptyCollectionBanner />
       </View>
 
-      <View className="left-9 bottom-8 h-[23%] w-[30%]">
-        <TouchableOpacity className=" h-[100%] rounded-lg bg-purple-600">
+      <View className="bottom-8 left-9 h-[23%] w-[30%]">
+        <TouchableOpacity
+          className=" h-[100%] rounded-lg bg-purple-600"
+          onPress={goToCreateCollectionScreen}
+        >
           <Text className="font-nunito top-2 h-4 w-[100%] break-words text-center text-xs font-bold text-white">
             Create Collection
           </Text>

diff --git a/apps/expo/src/components/home-empty-section/EmptyReviewer.tsx b/apps/expo/src/components/home-empty-section/EmptyReviewer.tsx
@@ -0,0 +1,33 @@
+import React, { FC } from "react";
+import { SafeAreaView, Text, TouchableOpacity, View } from "react-native";
+import HomeEmptyReviewerBanner from "../../icons/home-empty-section/HomeEmptyReviewerBanner";
+import { useNavigation } from "@react-navigation/native";
+
+const HomeEmptyReviewer: FC = () => {
+  const navigation = useNavigation();
+
+  const goToCreateReviewerScreen = () => {
+    navigation.navigate("CreateReviewer");
+  };
+
+  return (
+    <SafeAreaView>
+      <View className="h-[75%] items-center">
+        <HomeEmptyReviewerBanner />
+      </View>
+
+      <View className="bottom-8 left-9 h-[23%] w-[30%]">
+        <TouchableOpacity
+          className=" h-[100%] rounded-lg bg-purple-600"
+          onPress={goToCreateReviewerScreen}
+        >
+          <Text className="font-nunito top-2 h-4 w-[100%] break-words text-center text-xs font-bold text-white">
+            Create Reviewer
+          </Text>
+        </TouchableOpacity>
+      </View>
+    </SafeAreaView>
+  );
+};
+
+export default HomeEmptyReviewer;
diff --git a/apps/expo/src/components/home-empty-section/EmptyTest.tsx b/apps/expo/src/components/home-empty-section/EmptyTest.tsx
@@ -1,16 +1,26 @@
 import React, { FC } from "react";
 import { SafeAreaView, Text, TouchableOpacity, View } from "react-native";
 import HomeEmptyTestBanner from "../../icons/home-empty-section/HomeEmptyTestBanner";
+import { useNavigation } from "@react-navigation/native";
 
 const HomeEmptyTest: FC = () => {
+  const navigation = useNavigation();
+
+  const goToCreateTestScreen = () => {
+    navigation.navigate("CreateTest");
+  };
+
   return (
     <SafeAreaView>
       <View className="h-[75%] items-center">
         <HomeEmptyTestBanner />
       </View>
 
-      <View className="left-9 bottom-8 h-[23%] w-[30%]">
-        <TouchableOpacity className=" h-[100%] rounded-lg bg-purple-600">
+      <View className="bottom-8 left-9 h-[23%] w-[30%]">
+        <TouchableOpacity
+          className=" h-[100%] rounded-lg bg-purple-600"
+          onPress={goToCreateTestScreen}
+        >
           <Text className="font-nunito top-2 h-4 w-[100%] break-words text-center text-xs font-bold text-white">
             Create Test
           </Text>