upd : tampilan edit komentar

Deskripsi:
- menampilkan tulisan edited jika komentar telah di edit
- menampilkan modal jika komentar di longpress

No Issues

app/(application)/discussion/[id].tsx

@@ -1,9 +1,12 @@
+import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import BorderBottomItem from "@/components/borderBottomItem";
 import ButtonBackHeader from "@/components/buttonBackHeader";
 import HeaderRightDiscussionGeneralDetail from "@/components/discussion_general/headerDiscussionDetail";
+import DrawerBottom from "@/components/drawerBottom";
 import ImageUser from "@/components/imageNew";
 import { InputForm } from "@/components/inputForm";
 import LabelStatus from "@/components/labelStatus";
+import MenuItemRow from "@/components/menuItemRow";
 import Skeleton from "@/components/skeleton";
 import SkeletonContent from "@/components/skeletonContent";
 import Text from '@/components/Text';
@@ -14,7 +17,7 @@ import Styles from "@/constants/Styles";
 import { apiGetDiscussionGeneralOne, apiSendDiscussionGeneralCommentar } from "@/lib/api";
 import { getDB } from "@/lib/firebaseDatabase";
 import { useAuthSession } from "@/providers/AuthProvider";
-import { Ionicons, MaterialIcons } from "@expo/vector-icons";
+import { Ionicons, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons";
 import { ref } from '@react-native-firebase/database';
 import { useHeaderHeight } from '@react-navigation/elements';
 import { router, Stack, useLocalSearchParams } from "expo-router";
@@ -39,6 +42,8 @@ type PropsKomentar = {
    idUser: string
    img: string
    username: string
+   isEdited: boolean
+   updatedAt: string
 }
 
 export default function DetailDiscussionGeneral() {
@@ -57,6 +62,11 @@ export default function DetailDiscussionGeneral() {
    const headerHeight = useHeaderHeight();
    const [detailMore, setDetailMore] = useState<any>([])
    const [loadingSendKomentar, setLoadingSendKomentar] = useState(false)
+   const [isVisible, setVisible] = useState(false)
+   const [selectKomentar, setSelectKomentar] = useState({
+      id: '',
+      comment: ''
+   })
 
 
    useEffect(() => {
@@ -138,6 +148,11 @@ export default function DetailDiscussionGeneral() {
       }
    }
 
+   function handleMenuKomentar(id: string, comment: string) {
+      setSelectKomentar({ id, comment })
+      setVisible(true)
+   }
+
    return (
       <>
          <Stack.Screen
@@ -204,6 +219,7 @@ export default function DetailDiscussionGeneral() {
                                     title={item.username}
                                     rightTopInfo={item.createdAt}
                                     desc={item.comment}
+                                    rightBottomInfo={item.isEdited ? "Edited" : ""}
                                     descEllipsize={detailMore.includes(item.id) ? false : true}
                                     onPress={() => {
                                        setDetailMore((prev: any) => {
@@ -214,6 +230,9 @@ export default function DetailDiscussionGeneral() {
                                           }
                                        })
                                     }}
+                                    onLongPress={() => {
+                                       handleMenuKomentar(item.id, item.comment)
+                                    }}
                                  />
                               )
                            })
@@ -268,6 +287,29 @@ export default function DetailDiscussionGeneral() {
                </View>
             </KeyboardAvoidingView>
          </View >
+
+         <DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Komentar">
+            <View style={Styles.rowItemsCenter}>
+               <MenuItemRow
+                  icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
+                  title="Edit"
+                  onPress={() => {
+                     setVisible(false)
+                  }}
+               />
+               <MenuItemRow
+                  icon={<MaterialIcons name="delete" color="black" size={25} />}
+                  title="Hapus"
+                  onPress={() => {
+                     AlertKonfirmasi({
+                        title: 'Konfirmasi',
+                        desc: 'Apakah anda yakin ingin menghapus komentar?',
+                        onPress: () => { setVisible(false) }
+                     })
+                  }}
+               />
+            </View>
+         </DrawerBottom>
       </>
    )
 }