Compare commits

...

2 Commits

Author SHA1 Message Date
a01a9bd93f Filter console dan clean code
Add:
- service/api-device-token.ts

Fix:
- app/(application)/(user)/home.tsx
- app/(application)/(user)/test-notifications.tsx
- app/_layout.tsx
- components/_ShareComponent/NotificationInitializer.tsx
- context/AuthContext.tsx
- hooks/use-foreground-notifications.ts
- screens/Home/HeaderBell.tsx
- service/api-notifications.ts

### No Issue
2025-12-17 17:46:28 +08:00
05c1cac10f Penerapan ke database
Fix:
- android/app/src/main/AndroidManifest.xml
- app/(application)/(user)/home.tsx
- components/_ShareComponent/NotificationInitializer.tsx
- ios/HIPMIBadungConnect.xcodeproj/project.pbxproj
- ios/HIPMIBadungConnect/Info.plist
- service/api-notifications.ts

### No Issue
2025-12-16 17:47:50 +08:00
12 changed files with 185 additions and 91 deletions

View File

@@ -15,7 +15,7 @@
<data android:scheme="https"/> <data android:scheme="https"/>
</intent> </intent>
</queries> </queries>
<application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true" android:enableOnBackInvokedCallback="false"> <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true" android:enableOnBackInvokedCallback="false" android:fullBackupContent="@xml/secure_store_backup_rules" android:dataExtractionRules="@xml/secure_store_data_extraction_rules">
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/notification_icon_color"/> <meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/notification_icon_color"/>
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/> <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/>
<meta-data android:name="expo.modules.notifications.default_notification_color" android:resource="@color/notification_icon_color"/> <meta-data android:name="expo.modules.notifications.default_notification_color" android:resource="@color/notification_icon_color"/>

View File

@@ -21,12 +21,6 @@ export default function Application() {
const { token, user, userData } = useAuth(); const { token, user, userData } = useAuth();
const [data, setData] = useState<any>(); const [data, setData] = useState<any>();
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
// console.log("[User] >>", JSON.stringify(user?.id, null, 2));
// const { notifications } = useNotificationStore();
// const unreadCount = notifications.filter((n) => !n.read).length;
// console.log("UNREAD", notifications)
// ‼️ Untuk cek apakah: 1. user ada, 2. user punya profile, 3. accept temrs of forum nya ada atau tidak
useFocusEffect( useFocusEffect(
useCallback(() => { useCallback(() => {
@@ -89,46 +83,6 @@ export default function Application() {
/> />
), ),
headerRight: () => <HeaderBell />, headerRight: () => <HeaderBell />,
// headerRight: () => {
// return (
// <View style={{ position: "relative" }}>
// <Ionicons
// name="notifications"
// size={20}
// color={MainColor.yellow}
// onPress={() => {
// router.push("/notifications");
// }}
// />
// {unreadCount > 0 && (
// <View
// style={{
// position: "absolute",
// top: -4,
// right: -4,
// backgroundColor: "red",
// borderRadius: 8,
// minWidth: 16,
// height: 16,
// justifyContent: "center",
// alignItems: "center",
// paddingHorizontal: 2,
// }}
// >
// <Text
// style={{
// color: "white",
// fontSize: 10,
// fontWeight: "bold",
// }}
// >
// {unreadCount > 9 ? "9+" : unreadCount}
// </Text>
// </View>
// )}
// </View>
// );
// },
}} }}
/> />
<ViewWrapper <ViewWrapper
@@ -145,7 +99,7 @@ export default function Application() {
} }
> >
<StackCustom> <StackCustom>
<ButtonCustom onPress={() => router.push("./test-notifications")}>Test Notif</ButtonCustom> {/* <ButtonCustom onPress={() => router.push("./test-notifications")}>Test Notif</ButtonCustom> */}
<Home_ImageSection /> <Home_ImageSection />

View File

@@ -4,11 +4,29 @@ import {
StackCustom, StackCustom,
TextInputCustom, TextInputCustom,
} from "@/components"; } from "@/components";
import { apiNotificationsSend } from "@/service/api-notifications"; import { useAuth } from "@/hooks/use-auth";
import { useState } from "react"; import { apiGetAllTokenDevice } from "@/service/api-device-token";
import {
apiNotificationsSend,
} from "@/service/api-notifications";
import { useEffect, useState } from "react";
export default function TestNotification() { export default function TestNotification() {
const { user } = useAuth();
const [data, setData] = useState(""); const [data, setData] = useState("");
useEffect(() => {
// fecthData();
}, []);
const fecthData = async () => {
const response = await apiGetAllTokenDevice();
console.log(
"[RES GET ALL TOKEN DEVICE]",
JSON.stringify(response.data, null, 2)
);
};
const handleSubmit = async () => { const handleSubmit = async () => {
console.log("[Data Dikirim]", data); console.log("[Data Dikirim]", data);
const response = await apiNotificationsSend({ const response = await apiNotificationsSend({
@@ -17,6 +35,7 @@ export default function TestNotification() {
"cVmHm-3P4E-1vjt6AA9kSF:APA91bHTkHjGTLxrFsb6Le6bZmzboZhwMGYXU4p0FP9yEeXixLDXNKS4F5vLuZV3sRgSnjjQsPpLOgstVLHJB8VJTObctKLdN-CxAp4dnP7Jbc_mH53jWvs", "cVmHm-3P4E-1vjt6AA9kSF:APA91bHTkHjGTLxrFsb6Le6bZmzboZhwMGYXU4p0FP9yEeXixLDXNKS4F5vLuZV3sRgSnjjQsPpLOgstVLHJB8VJTObctKLdN-CxAp4dnP7Jbc_mH53jWvs",
title: "Test dari Backend (App Router)!", title: "Test dari Backend (App Router)!",
body: data, body: data,
userLoginId: user?.id || "",
}, },
}); });

View File

@@ -1,15 +1,9 @@
import NotificationInitializer from "@/components/_ShareComponent/NotificationInitializer"; import NotificationInitializer from "@/components/_ShareComponent/NotificationInitializer";
import { AuthProvider } from "@/context/AuthContext"; import { AuthProvider } from "@/context/AuthContext";
import { useForegroundNotifications } from "@/hooks/use-foreground-notifications";
import { import {
NotificationProvider, NotificationProvider
useNotificationStore,
} from "@/hooks/use-notification-store"; } from "@/hooks/use-notification-store";
import AppRoot from "@/screens/RootLayout/AppRoot"; import AppRoot from "@/screens/RootLayout/AppRoot";
import messaging, {
FirebaseMessagingTypes,
} from "@react-native-firebase/messaging";
import { useEffect } from "react";
import "react-native-gesture-handler"; import "react-native-gesture-handler";
import { SafeAreaProvider } from "react-native-safe-area-context"; import { SafeAreaProvider } from "react-native-safe-area-context";
import Toast from "react-native-toast-message"; import Toast from "react-native-toast-message";

View File

@@ -1,28 +1,90 @@
// src/components/NotificationInitializer.tsx // src/components/NotificationInitializer.tsx
import { useEffect } from "react"; import { useEffect } from "react";
import messaging from "@react-native-firebase/messaging";
import { useForegroundNotifications } from "@/hooks/use-foreground-notifications"; import { useForegroundNotifications } from "@/hooks/use-foreground-notifications";
import { import { useNotificationStore } from "@/hooks/use-notification-store";
useNotificationStore,
} from "@/hooks/use-notification-store";
import type { FirebaseMessagingTypes } from "@react-native-firebase/messaging"; import type { FirebaseMessagingTypes } from "@react-native-firebase/messaging";
import { useAuth } from "@/hooks/use-auth";
import { Platform } from "react-native";
import * as Device from "expo-device";
import * as Application from "expo-application";
import { apiDeviceRegisterToken } from "@/service/api-device-token";
import messaging from "@react-native-firebase/messaging";
export default function NotificationInitializer() { export default function NotificationInitializer() {
// 1. Ambil token FCM (opsional, hanya untuk log) // Setup handler notifikasi
const { user, logout } = useAuth(); // dari AuthContext
const { addNotification } = useNotificationStore();
// Ambil token FCM (opsional, hanya untuk log)
useEffect(() => { useEffect(() => {
const getFCMToken = async () => { if (!user) {
if (!messaging().isSupported()) return; console.log("User not available, skipping token sync");
const authStatus = await messaging().requestPermission(); return;
if (authStatus === messaging.AuthorizationStatus.AUTHORIZED) { }
const token = await messaging().getToken();
console.log("✅ FCM Token:", token); const registerDeviceToken = async () => {
try {
// 1. Minta izin & ambil FCM token
if (!messaging().isSupported()) return;
const authStatus = await messaging().requestPermission();
if (authStatus === messaging.AuthorizationStatus.AUTHORIZED) {
const token = await messaging().getToken();
console.log("✅ FCM Token:", token);
if (!token) {
logout();
return;
}
} else {
console.warn("Izin notifikasi ditolak");
return;
}
const fcmToken = await messaging().getToken();
if (!fcmToken) {
console.warn("Gagal mendapatkan FCM token");
return;
}
// 2. Ambil info device
const platform = Platform.OS; // "ios" | "android"
const model = Device.modelName || "unknown";
const appVersion = (Application.nativeApplicationVersion || "unknown") + "-" + (Application.nativeBuildVersion || "unknown");
const deviceId = Device.osInternalBuildId || Device.modelName + "-" + Date.now();
// console.log(
// "📱 Device info:",
// JSON.stringify(
// {
// fcmToken,
// platform,
// deviceId,
// model,
// appVersion,
// },
// null,
// 2
// )
// );
// 3. Kirim ke backend
await apiDeviceRegisterToken({
data: {
fcmToken,
platform,
deviceId,
model,
appVersion,
userId: user?.id || "",
},
});
console.log("✅ Device token berhasil didaftarkan ke backend");
} catch (error) {
console.error("❌ Gagal mendaftarkan device token:", error);
} }
}; };
getFCMToken();
}, []);
// 2. Setup handler notifikasi registerDeviceToken();
const { addNotification } = useNotificationStore(); }, [user?.id]);
const handleForegroundNotification = ( const handleForegroundNotification = (
message: FirebaseMessagingTypes.RemoteMessage message: FirebaseMessagingTypes.RemoteMessage
@@ -33,9 +95,10 @@ export default function NotificationInitializer() {
const safeData: Record<string, string> = {}; const safeData: Record<string, string> = {};
for (const key in rawData) { for (const key in rawData) {
safeData[key] = typeof rawData[key] === "string" safeData[key] =
? rawData[key] typeof rawData[key] === "string"
: JSON.stringify(rawData[key]); ? rawData[key]
: JSON.stringify(rawData[key]);
} }
console.log("📥 Menambahkan ke store:", { title, body, safeData }); console.log("📥 Menambahkan ke store:", { title, body, safeData });

View File

@@ -4,6 +4,7 @@ import {
apiRegister, apiRegister,
apiValidationCode, apiValidationCode,
} from "@/service/api-config"; } from "@/service/api-config";
import { apiDeviceTokenDeleted } from "@/service/api-device-token";
import { IUser } from "@/types/User"; import { IUser } from "@/types/User";
import AsyncStorage from "@react-native-async-storage/async-storage"; import AsyncStorage from "@react-native-async-storage/async-storage";
import { router } from "expo-router"; import { router } from "expo-router";
@@ -282,7 +283,7 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
setUser(null); setUser(null);
await AsyncStorage.removeItem("authToken"); await AsyncStorage.removeItem("authToken");
await AsyncStorage.removeItem("userData"); await AsyncStorage.removeItem("userData");
setIsLoading(false); await apiDeviceTokenDeleted({userId: user?.id as any})
Toast.show({ Toast.show({
type: "success", type: "success",

View File

@@ -1,5 +1,7 @@
import { useEffect } from "react"; import { useEffect } from "react";
import messaging, { import {
getMessaging,
onMessage,
FirebaseMessagingTypes, FirebaseMessagingTypes,
} from "@react-native-firebase/messaging"; } from "@react-native-firebase/messaging";
@@ -10,7 +12,9 @@ export function useForegroundNotifications(
onMessageReceived: (message: RemoteMessage) => void onMessageReceived: (message: RemoteMessage) => void
) { ) {
useEffect(() => { useEffect(() => {
const unsubscribe = messaging().onMessage((remoteMessage) => { const messaging = getMessaging();
const unsubscribe = onMessage(messaging, (remoteMessage) => {
console.log( console.log(
"🔔 Notifikasi diterima saat app aktif:", "🔔 Notifikasi diterima saat app aktif:",
JSON.stringify(remoteMessage, null, 2) JSON.stringify(remoteMessage, null, 2)

View File

@@ -458,7 +458,7 @@
); );
OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_DEBUG"; OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_DEBUG";
PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.hipmi-mobile"; PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.hipmi-mobile";
PRODUCT_NAME = HIPMIBadungConnect; PRODUCT_NAME = "HIPMIBadungConnect";
SWIFT_OBJC_BRIDGING_HEADER = "HIPMIBadungConnect/HIPMIBadungConnect-Bridging-Header.h"; SWIFT_OBJC_BRIDGING_HEADER = "HIPMIBadungConnect/HIPMIBadungConnect-Bridging-Header.h";
SWIFT_OPTIMIZATION_LEVEL = "-Onone"; SWIFT_OPTIMIZATION_LEVEL = "-Onone";
SWIFT_VERSION = 5.0; SWIFT_VERSION = 5.0;
@@ -490,7 +490,7 @@
); );
OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_RELEASE"; OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_RELEASE";
PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.hipmi-mobile"; PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.hipmi-mobile";
PRODUCT_NAME = HIPMIBadungConnect; PRODUCT_NAME = "HIPMIBadungConnect";
SWIFT_OBJC_BRIDGING_HEADER = "HIPMIBadungConnect/HIPMIBadungConnect-Bridging-Header.h"; SWIFT_OBJC_BRIDGING_HEADER = "HIPMIBadungConnect/HIPMIBadungConnect-Bridging-Header.h";
SWIFT_VERSION = 5.0; SWIFT_VERSION = 5.0;
TARGETED_DEVICE_FAMILY = "1,2"; TARGETED_DEVICE_FAMILY = "1,2";

View File

@@ -55,6 +55,8 @@
</dict> </dict>
<key>NSCameraUsageDescription</key> <key>NSCameraUsageDescription</key>
<string>Allow $(PRODUCT_NAME) to access your camera</string> <string>Allow $(PRODUCT_NAME) to access your camera</string>
<key>NSFaceIDUsageDescription</key>
<string>Allow $(PRODUCT_NAME) to access your Face ID biometric data.</string>
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key> <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>Allow $(PRODUCT_NAME) to access your location</string> <string>Allow $(PRODUCT_NAME) to access your location</string>
<key>NSLocationAlwaysUsageDescription</key> <key>NSLocationAlwaysUsageDescription</key>

View File

@@ -8,7 +8,7 @@ import { MainColor } from "@/constants/color-palet";
export default function HeaderBell() { export default function HeaderBell() {
const { notifications } = useNotificationStore(); const { notifications } = useNotificationStore();
const unreadCount = notifications.filter((n) => !n.read).length; const unreadCount = notifications.filter((n) => !n.read).length;
console.log("NOTIF:", JSON.stringify(notifications, null, 2)); // console.log("NOTIF:", JSON.stringify(notifications, null, 2));
return ( return (
<View style={{ position: "relative" }}> <View style={{ position: "relative" }}>

View File

@@ -0,0 +1,54 @@
import { apiConfig } from "./api-config";
type DeviceTokenData = {
fcmToken: string;
platform: string;
deviceId: string;
model: string;
appVersion: string;
userId: string;
};
export async function apiDeviceRegisterToken({
data,
}: {
data: DeviceTokenData;
}) {
try {
const response = await apiConfig.post(`/mobile/auth/device-tokens`, {
data: data,
});
console.log(
"Device token registered:",
JSON.stringify(response.data, null, 2)
);
return response.data;
} catch (error) {
console.error("Failed to register device token:", error);
throw error;
}
}
export async function apiDeviceTokenDeleted({ userId }: { userId: string }) {
try {
const response = await apiConfig.delete(
`/mobile/auth/device-tokens/${userId}`
);
console.log("Device token deleted:", response.data);
return response.data;
} catch (error) {
console.error("Failed to delete device token:", error);
throw error;
}
}
export async function apiGetAllTokenDevice() {
try {
const response = await apiConfig.get(`/mobile/auth/device-tokens`);
console.log("Device token deleted:", response.data);
return response.data;
} catch (error) {
console.error("Failed to delete device token:", error);
throw error;
}
}

View File

@@ -1,20 +1,23 @@
import { apiConfig } from "./api-config"; import { apiConfig } from "./api-config";
type NotificationProp = { type NotificationProp = {
fcmToken: string fcmToken: string;
title: string, title: string;
body: Object body: Object;
} userLoginId?: string;
};
export async function apiNotificationsSend({
export async function apiNotificationsSend({ data }: { data: NotificationProp }) { data,
}: {
data: NotificationProp;
}) {
try { try {
const response = await apiConfig.post(`/mobile/notifications`, { const response = await apiConfig.post(`/mobile/notifications`, {
data: data, data: data,
}); });
console.log("Fecth Notif", response.data) console.log("Fecth Notif", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {