wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd: notifikasi

Browse Source 
Deskripsi:
- list notifikasi
- tanda notifikasi
- entiti user login

NO Issues
This commit is contained in:
amel
2025-06-26 12:28:36 +08:00
parent ed08953a14
commit 76c0ba0535
9 changed files with 231 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
components/borderBottomItem.tsx
View File

@@ -17,9 +17,10 @@ type Props = {
bgColor?: 'white' | 'transparent'
width?: number
descEllipsize?: boolean
textColor?: string
}
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo, titleWeight, bgColor, width, descEllipsize }: Props) {
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo, titleWeight, bgColor, width, descEllipsize, textColor }: Props) {
const lebarDim = Dimensions.get("window").width;
const lebar = width ? lebarDim * width / 100 : 'auto';
@@ -29,23 +30,23 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
{icon}
<View style={[Styles.rowSpaceBetween, width ? { width: lebar } : { width: '88%' }]}>
<View style={[Styles.ml10, width ? { width: lebar } : { width: '70%' }]}>
<Text style={[titleWeight == 'normal' ? Styles.textDefault : Styles.textDefaultSemiBold]} numberOfLines={1} ellipsizeMode='tail'>{title}</Text>
<Text style={[titleWeight == 'normal' ? Styles.textDefault : Styles.textDefaultSemiBold, { color: textColor }]} numberOfLines={1} ellipsizeMode='tail'>{title}</Text>
{
subtitle &&
typeof subtitle == "string"
? <Text style={[Styles.textMediumNormal, { lineHeight: 15 }]}>{subtitle}</Text>
? <Text style={[Styles.textMediumNormal, { lineHeight: 15, color: textColor }]}>{subtitle}</Text>
: <View style={{ alignItems: 'flex-start' }}>
{subtitle}
</View>
}
</View>
{
rightTopInfo && <Text style={[Styles.textInformation, Styles.mt05]}>{rightTopInfo}</Text>
rightTopInfo && <Text style={[Styles.textInformation, Styles.mt05, { color: textColor}]}>{rightTopInfo}</Text>
}
</View>
</View>
{desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify' }]} numberOfLines={descEllipsize == false ? 0 : 2} ellipsizeMode='tail'>{desc}</Text>}
{desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify', color: textColor }]} numberOfLines={descEllipsize == false ? 0 : 2} ellipsizeMode='tail'>{desc}</Text>}
{
(leftBottomInfo || rightBottomInfo) &&
(

4
components/buttonHeader.tsx
View File

@@ -1,5 +1,5 @@
import Styles from "@/constants/Styles";
import { Pressable, Text, View } from "react-native";
import { Pressable, View } from "react-native";
type PropsBtnHeader = {
onPress: () => void;
@@ -15,7 +15,7 @@ export function ButtonHeader({ onPress, item, valueTop }: PropsBtnHeader) {
</View>
{
valueTop != undefined && valueTop && (
<View style={{ position: 'absolute', top: 0, right: 0, backgroundColor: 'red', width: 10, height: 10, borderRadius: 100 }}> </View>
<View style={{ position: 'absolute', top: 0, right: 0, backgroundColor: 'red', width: 10, height: 10, borderRadius: 100 }}></View>
)
}
</Pressable>

31
components/home/headerRightHome.tsx
View File

@@ -1,14 +1,35 @@
import { View } from "react-native"
import { router } from "expo-router"
import Feather from '@expo/vector-icons/Feather';
import { ButtonHeader } from "../buttonHeader";
import Styles from "@/constants/Styles";
import { apiGetDataHome } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import Feather from '@expo/vector-icons/Feather';
import { router } from "expo-router";
import { useEffect, useState } from "react";
import { View } from "react-native";
import { ButtonHeader } from "../buttonHeader";
export function HeaderRightHome() {
const { decryptToken, token } = useAuthSession()
const [notification, setNotification] = useState(0)
async function handleData() {
try {
const hasil = await decryptToken(String(token?.current))
const response = await apiGetDataHome({ cat: "header", user: hasil })
setNotification(response.data.totalNotif)
} catch (error) {
console.error(error)
}
}
useEffect(() => {
handleData()
}, []);
return (
<View style={[Styles.rowSpaceBetween, { width: 140 }]}>
<ButtonHeader item={<Feather name="search" size={20} color="white" />} onPress={() => { router.push('/search') }} />
<ButtonHeader item={<Feather name="bell" size={20} color="white" />} onPress={() => { router.push('/notification') }} />
<ButtonHeader valueTop={notification > 0 ? true : false} item={<Feather name="bell" size={20} color="white" />} onPress={() => { router.push('/notification') }} />
<ButtonHeader item={<Feather name="user" size={20} color="white" />} onPress={() => { router.push('/profile') }} />
</View>
)