Files
mobile-darmasaba/components/borderBottomItem.tsx
amel d923d10290 upd: discussion
Deskripsi:
- ui list diskusi

No Issues
2025-03-04 10:19:39 +08:00

66 lines
2.5 KiB
TypeScript

import Styles from "@/constants/Styles";
import React from "react";
import { Pressable, Text, View } from "react-native";
import LabelStatus from "./labelStatus";
import { Feather } from "@expo/vector-icons";
type Props = {
title: string
subtitle?: string | React.ReactNode
icon: React.ReactNode
desc?: string
rightTopInfo?: string
onPress?: () => void
borderType: 'all' | 'bottom'
leftBottomInfo?: React.ReactNode | string
rightBottomInfo?: React.ReactNode | string
}
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo }: Props) {
console.log(typeof rightBottomInfo)
return (
<Pressable style={[borderType == 'bottom' ? Styles.wrapItemBorderBottom : Styles.wrapItemBorderAll]} onPressOut={onPress}>
<View style={[Styles.rowItemsCenter]}>
{icon}
<View style={[Styles.rowSpaceBetween, { width: '85%' }]}>
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefaultSemiBold]}>{title}</Text>
{
subtitle &&
typeof subtitle == "string"
? <Text style={[Styles.textMediumNormal, { lineHeight: 15 }]}>{subtitle}</Text>
: <View style={{ alignItems: 'flex-start' }}>
{subtitle}
</View>
}
</View>
{
rightTopInfo && <Text style={[Styles.textInformation]}>{rightTopInfo}</Text>
}
</View>
</View>
{desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify' }]}>{desc}</Text>}
{
leftBottomInfo && rightBottomInfo &&
(
<View style={[Styles.rowSpaceBetween, Styles.mt10]}>
{
typeof leftBottomInfo == 'string' ?
<Text style={[Styles.textInformation, Styles.cGray, { textAlign: 'left' }]}>{leftBottomInfo}</Text>
:
leftBottomInfo
}
{
typeof rightBottomInfo == 'string' ?
<Text style={[Styles.textInformation, Styles.cGray, { textAlign: 'right' }]}>{rightBottomInfo}</Text>
:
rightBottomInfo
}
</View>
)
}
</Pressable>
)
}