Fix job notifikasi

###  No Issue

app/(application)/(user)/_layout.tsx

@@ -519,7 +519,8 @@ export default function UserLayout() {
           name="job/(tabs)"
           options={{
             title: "Job Vacancy",
-            headerLeft: () => <BackButton path="/home" />,
+            // headerLeft: () => <BackButton path="/home" />,
+            // Note: headerLeft di pindahkan ke Tabs Layout
           }}
         />
         <Stack.Screen

app/(application)/(user)/job/(tabs)/_layout.tsx

@@ -1,34 +1,72 @@
+import { BackButton } from "@/components";
 import { IconHome, IconStatus } from "@/components/_Icon";
 import { TabsStyles } from "@/styles/tabs-styles";
 import { Ionicons } from "@expo/vector-icons";
-import { Tabs } from "expo-router";
+import {
+  Stack,
+  Tabs,
+  useLocalSearchParams,
+  router,
+  useNavigation,
+} from "expo-router";
+import { useLayoutEffect } from "react";
 
 export default function JobTabsLayout() {
+  const navigation = useNavigation();
+
+  const { from, category } = useLocalSearchParams<{
+    from?: string;
+    category?: string;
+  }>();
+
+  // Atur header secara dinamis
+  useLayoutEffect(() => {
+    navigation.setOptions({
+      headerLeft: () => (
+        <BackButton
+          onPress={() => {
+            if (from === "notifications") {
+              router.replace(`/notifications?category=${category}`);
+            } else {
+              if (from) {
+                router.replace(`/${from}` as any);
+              } else {
+                router.back();
+              }
+            }
+          }}
+        />
+      ),
+    });
+  }, [from, router, navigation]);
+
   return (
-    <Tabs screenOptions={TabsStyles}>
+    <>
-      <Tabs.Screen
+      <Tabs screenOptions={TabsStyles}>
-        name="index"
+        <Tabs.Screen
-        options={{
+          name="index"
-          title: "Beranda",
+          options={{
-          tabBarIcon: ({ color }) => <IconHome color={color} />,
+            title: "Beranda",
-        }}
+            tabBarIcon: ({ color }) => <IconHome color={color} />,
-      />
+          }}
-      <Tabs.Screen
+        />
-        name="status"
+        <Tabs.Screen
-        options={{
+          name="status"
-          title: "Status",
+          options={{
-          tabBarIcon: ({ color }) => <IconStatus color={color} />,
+            title: "Status",
-        }}
+            tabBarIcon: ({ color }) => <IconStatus color={color} />,
-      />
+          }}
-      <Tabs.Screen
+        />
-        name="archive"
+        <Tabs.Screen
-        options={{
+          name="archive"
-          title: "Arsip",
+          options={{
-          tabBarIcon: ({ color }) => (
+            title: "Arsip",
-            <Ionicons size={20} name="archive" color={color} />
+            tabBarIcon: ({ color }) => (
-          ),
+              <Ionicons size={20} name="archive" color={color} />
-        }}
+            ),
-      />
+          }}
-    </Tabs>
+        />
+      </Tabs>
+    </>
   );
 }

app/(application)/(user)/job/(tabs)/status.tsx

@@ -9,14 +9,17 @@ import {
 import { useAuth } from "@/hooks/use-auth";
 import { dummyMasterStatus } from "@/lib/dummy-data/_master/status";
 import { apiJobGetByStatus } from "@/service/api-client/api-job";
-import { useFocusEffect } from "expo-router";
+import { useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
 import { useCallback, useState } from "react";
 
 export default function JobStatus() {
   const { user } = useAuth();
+  const { status } = useLocalSearchParams<{ status?: string }>();
+  console.log("STATUS", status);
+
   const [activeCategory, setActiveCategory] = useState<string | null>(
-    "publish"
+    status || "publish"
   );
   const [listData, setListData] = useState<any[]>([]);
   const [isLoadList, setIsLoadList] = useState(false);
@@ -60,25 +63,29 @@ export default function JobStatus() {
   );
 
   return (
-    <ViewWrapper headerComponent={scrollComponent} hideFooter>
+    <>
-      {isLoadList ? (
+      <ViewWrapper headerComponent={scrollComponent} hideFooter>
-        <LoaderCustom />
+        {isLoadList ? (
-      ) : _.isEmpty(listData) ? (
+          <LoaderCustom />
-        <TextCustom align="center">Tidak ada data {activeCategory}</TextCustom>
+        ) : _.isEmpty(listData) ? (
-      ) : (
+          <TextCustom align="center">
-        listData.map((e, i) => (
+            Tidak ada data {activeCategory}
-          <BaseBox
+          </TextCustom>
-            key={i}
+        ) : (
-            paddingTop={20}
+          listData.map((e, i) => (
-            paddingBottom={20}
+            <BaseBox
-            href={`/job/${e?.id}/${activeCategory}/detail`}
+              key={i}
-          >
+              paddingTop={20}
-            <TextCustom align="center" bold truncate size="large">
+              paddingBottom={20}
-              {e?.title}
+              href={`/job/${e?.id}/${activeCategory}/detail`}
-            </TextCustom>
+            >
-          </BaseBox>
+              <TextCustom align="center" bold truncate size="large">
-        ))
+                {e?.title}
-      )}
+              </TextCustom>
-    </ViewWrapper>
+            </BaseBox>
+          ))
+        )}
+      </ViewWrapper>
+    </>
   );
 }

app/(application)/(user)/job/[id]/[status]/detail.tsx

@@ -74,7 +74,7 @@ export default function JobDetailStatus() {
             <StackCustom gap={"xs"}>
               {data &&
                 data?.catatan &&
-                (status === "draft" || status === "rejected") && (
+                (status === "draft" || status === "reject") && (
                   <ReportBox text={data?.catatan} />
                 )}
                 

app/(application)/(user)/job/create.tsx

@@ -19,7 +19,7 @@ import { useState } from "react";
 import Toast from "react-native-toast-message";
 
 export default function JobCreate() {
-  const nextUrl = "/(application)/(user)/job/(tabs)/status";
+  const nextUrl = "/(application)/(user)/job/(tabs)/status?status=review";
   const { user } = useAuth();
   const [isLoading, setIsLoading] = useState(false);
   const [image, setImage] = useState<string | null>(null);

app/(application)/(user)/notifications/index.tsx

@@ -13,7 +13,7 @@ import { useNotificationStore } from "@/hooks/use-notification-store";
 import { apiGetNotificationsById } from "@/service/api-notifications";
 import { listOfcategoriesAppNotification } from "@/types/type-notification-category";
 import { formatChatTime } from "@/utils/formatChatTime";
-import { router, useFocusEffect } from "expo-router";
+import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
 import _ from "lodash";
 import { useCallback, useState } from "react";
 import { RefreshControl, View } from "react-native";
@@ -25,6 +25,19 @@ const selectedCategory = (value: string) => {
   return category?.label;
 };
 
+const fixPath = ({
+  deepLink,
+  categoryApp,
+}: {
+  deepLink: string;
+  categoryApp: string;
+}) => {
+  const fixPath =
+    deepLink + "&from=notifications&category=" + _.lowerCase(categoryApp);
+
+  return fixPath;
+};
+
 const BoxNotification = ({
   data,
   activeCategory,
@@ -32,18 +45,28 @@ const BoxNotification = ({
   data: any;
   activeCategory: string | null;
 }) => {
+  // console.log("DATA NOTIFICATION", JSON.stringify(data, null, 2));
   const { markAsRead } = useNotificationStore();
   return (
     <>
       <BaseBox
         backgroundColor={data.isRead ? AccentColor.darkblue : AccentColor.blue}
         onPress={() => {
-          console.log(
+          // console.log(
-            "Notification >",
+          //   "Notification >",
-            selectedCategory(activeCategory as string)
+          //   selectedCategory(activeCategory as string)
-          );
+          // );
-          router.push(data.deepLink);
+          const newPath = fixPath({
-          markAsRead(data.id);
+            deepLink: data.deepLink,
+            categoryApp: data.kategoriApp,
+          });
+
+          router.replace(newPath as any);
+          selectedCategory(activeCategory as string);
+
+          if (!data.isRead) {
+            markAsRead(data.id);
+          }
         }}
       >
         <StackCustom>
@@ -64,7 +87,10 @@ const BoxNotification = ({
 
 export default function Notifications() {
   const { user } = useAuth();
-  const [activeCategory, setActiveCategory] = useState<string | null>("event");
+  const { category } = useLocalSearchParams<{ category?: string }>();
+  const [activeCategory, setActiveCategory] = useState<string | null>(
+    category || "event"
+  );
   const [listData, setListData] = useState<any[]>([]);
   const [refreshing, setRefreshing] = useState(false);
   const [loading, setLoading] = useState(false);

app/(application)/admin/job/[id]/[status]/reject-input.tsx

@@ -15,7 +15,10 @@ import Toast from "react-native-toast-message";
 
 export default function AdminJobRejectInput() {
   const { id, status } = useLocalSearchParams();
-  const [data, setData] = useState<any | null>(null);
+  const [data, setData] = useState({
+    catatan: "",
+    senderId: ""
+  });
   const [isLoading, setIsLoading] = useState(false);
 
   useFocusEffect(
@@ -48,7 +51,7 @@ export default function AdminJobRejectInput() {
       const response = await funUpdateStatusJob({
         id: id as string,
         changeStatus,
-        data: data,
+        data: data ,
       });
 
       if (!response.success) {
@@ -102,8 +105,8 @@ export default function AdminJobRejectInput() {
         headerComponent={<AdminBackButtonAntTitle title="Penolakan Job" />}
       >
         <TextAreaCustom
-          value={data}
+          value={data?.catatan}
-          onChangeText={setData}
+          onChangeText={(text) => setData({ ...data, catatan: text })}
           placeholder="Masukan alasan"
           required
           showCount

app/(application)/admin/notification/index.tsx

@@ -7,6 +7,8 @@ import {
   TextCustom,
 } from "@/components";
 import { IconPlus } from "@/components/_Icon";
+import ListSkeletonComponent from "@/components/_ShareComponent/ListSkeletonComponent";
+import NoDataText from "@/components/_ShareComponent/NoDataText";
 import { AccentColor, MainColor } from "@/constants/color-palet";
 import { useAuth } from "@/hooks/use-auth";
 import { useNotificationStore } from "@/hooks/use-notification-store";
@@ -14,6 +16,7 @@ import { apiGetNotificationsById } from "@/service/api-notifications";
 import { listOfcategoriesAppNotification } from "@/types/type-notification-category";
 import { formatChatTime } from "@/utils/formatChatTime";
 import { router, Stack, useFocusEffect } from "expo-router";
+import _ from "lodash";
 import { useCallback, useState } from "react";
 import { RefreshControl, View } from "react-native";
 
@@ -66,6 +69,7 @@ export default function AdminNotification() {
   const [activeCategory, setActiveCategory] = useState<string | null>("event");
   const [listData, setListData] = useState<any[]>([]);
   const [refreshing, setRefreshing] = useState(false);
+  const [loading, setLoading] = useState(false);
 
   const handlePress = (item: any) => {
     setActiveCategory(item.value);
@@ -80,6 +84,7 @@ export default function AdminNotification() {
 
   const fecthData = async () => {
     try {
+      setLoading(true);
       const response = await apiGetNotificationsById({
         id: user?.id as any,
         category: activeCategory as any,
@@ -92,6 +97,8 @@ export default function AdminNotification() {
       }
     } catch (error) {
       console.log("Error Notification", error);
+    } finally {
+      setLoading(false);
     }
   };
 
@@ -132,11 +139,20 @@ export default function AdminNotification() {
           <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
         }
       >
-        {listData.map((e, i) => (
+        {loading ? (
-          <View key={i}>
+          <ListSkeletonComponent />
-            <BoxNotification data={e} activeCategory={activeCategory as any} />
+        ) : _.isEmpty(listData) ? (
-          </View>
+          <NoDataText text="Belum ada notifikasi" />
-        ))}
+        ) : (
+          listData.map((e, i) => (
+            <View key={i}>
+              <BoxNotification
+                data={e}
+                activeCategory={activeCategory as any}
+              />
+            </View>
+          ))
+        )}
       </NewWrapper>
     </>
   );

components/Button/BackButton.tsx

@@ -12,10 +12,12 @@ const LeftButtonCustom = ({
   path,
   icon = "arrow-back",
   iconCustom,
+  onPress,
 }: {
   path?: Href;
   icon?: React.ReactNode | any;
   iconCustom?: React.ReactNode;
+  onPress?: () => void;
 }) => {
   return (
     <>
@@ -26,7 +28,7 @@ const LeftButtonCustom = ({
           name={icon}
           size={20}
           color={MainColor.yellow}
-          onPress={() => (path ? router.replace(path) : router.back())}
+          onPress={() => (onPress ? onPress() : path ? router.replace(path) : router.back())}
         />
       )}
     </>

screens/Admin/Job/funUpdateStatus.ts

@@ -7,7 +7,7 @@ const funUpdateStatusJob = async ({
 }: {
   id: string;
   changeStatus: "publish" | "review" | "reject";
-  data?: string;
+  data?: any;
 }) => {
   try {
     const response = await apiAdminJobUpdate({