upd: diskusi divisi
Deskripsi: - list diskusi - search diskusi - detail diskusi - kirim komentar - edit diskusi - status diskusi - arsip diskusi - tambah diskusi - role akses user diskusi No Issues
This commit is contained in:
amel
@@ -1,152 +1,278 @@
|
||||
import BorderBottomItem from "@/components/borderBottomItem";
|
||||
import ButtonBackHeader from "@/components/buttonBackHeader";
|
||||
import HeaderRightDiscussionDetail from "@/components/discussion/headerDiscussionDetail";
|
||||
import ImageUser from "@/components/imageNew";
|
||||
import { InputForm } from "@/components/inputForm";
|
||||
import LabelStatus from "@/components/labelStatus";
|
||||
import Styles from "@/constants/Styles";
|
||||
import {
|
||||
apiGetDiscussionOne,
|
||||
apiGetDivisionOneFeature,
|
||||
apiSendDiscussionCommentar,
|
||||
} from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { Ionicons, MaterialIcons } from "@expo/vector-icons";
|
||||
import { router, Stack, useLocalSearchParams } from "expo-router";
|
||||
import { Image, ScrollView, Text, View } from "react-native";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Pressable, ScrollView, Text, View } from "react-native";
|
||||
import { useSelector } from "react-redux";
|
||||
|
||||
type Props = {
|
||||
id: string;
|
||||
title: string;
|
||||
desc: string;
|
||||
status: number;
|
||||
createdAt: string;
|
||||
createdBy: string;
|
||||
username: string;
|
||||
user_img: string;
|
||||
isCreator: boolean;
|
||||
isActive: boolean;
|
||||
};
|
||||
|
||||
type PropsComment = {
|
||||
id: string;
|
||||
comment: string;
|
||||
createdAt: string;
|
||||
username: string;
|
||||
img: string;
|
||||
};
|
||||
|
||||
export default function DiscussionDetail() {
|
||||
const { id, detail } = useLocalSearchParams();
|
||||
const { id, detail } = useLocalSearchParams<{ id: string; detail: string }>();
|
||||
const [data, setData] = useState<Props>();
|
||||
const [dataComment, setDataComment] = useState<PropsComment[]>([]);
|
||||
const { token, decryptToken } = useAuthSession();
|
||||
const [komentar, setKomentar] = useState("");
|
||||
const [loadingSend, setLoadingSend] = useState(false);
|
||||
const update = useSelector((state: any) => state.discussionUpdate);
|
||||
const entityUser = useSelector((state: any) => state.user);
|
||||
const [isMemberDivision, setIsMemberDivision] = useState(false);
|
||||
const [isAdminDivision, setIsAdminDivision] = useState(false);
|
||||
const [isCreator, setIsCreator] = useState(false);
|
||||
|
||||
async function handleLoad() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetDiscussionOne({
|
||||
id: detail,
|
||||
user: hasil,
|
||||
cat: "data",
|
||||
});
|
||||
setData(response.data);
|
||||
setIsCreator(response.data.createdBy == hasil);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleLoadComment() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetDiscussionOne({
|
||||
id: detail,
|
||||
user: hasil,
|
||||
cat: "comment",
|
||||
});
|
||||
setDataComment(response.data);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleCheckMember() {
|
||||
try {
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetDivisionOneFeature({
|
||||
id,
|
||||
user: hasil,
|
||||
cat: "check-member",
|
||||
});
|
||||
|
||||
const response2 = await apiGetDivisionOneFeature({
|
||||
id,
|
||||
user: hasil,
|
||||
cat: "check-admin",
|
||||
});
|
||||
setIsMemberDivision(response.data);
|
||||
setIsAdminDivision(response2.data);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad();
|
||||
}, [update.data]);
|
||||
|
||||
useEffect(() => {
|
||||
handleLoadComment();
|
||||
handleCheckMember();
|
||||
}, []);
|
||||
|
||||
async function handleKomentar() {
|
||||
try {
|
||||
setLoadingSend(true);
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiSendDiscussionCommentar({
|
||||
id: detail,
|
||||
data: { comment: komentar, user: hasil },
|
||||
});
|
||||
if (response.success) {
|
||||
setKomentar("");
|
||||
handleLoadComment();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoadingSend(false);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Stack.Screen
|
||||
options={{
|
||||
headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
|
||||
headerTitle: 'Diskusi',
|
||||
headerTitleAlign: 'center',
|
||||
headerRight: () => <HeaderRightDiscussionDetail id={detail} />,
|
||||
headerLeft: () => (
|
||||
<ButtonBackHeader
|
||||
onPress={() => {
|
||||
router.back();
|
||||
}}
|
||||
/>
|
||||
),
|
||||
headerTitle: "Diskusi",
|
||||
headerTitleAlign: "center",
|
||||
headerRight: () =>
|
||||
(entityUser.role != "user" && entityUser.role != "coadmin") || isAdminDivision || isCreator ?
|
||||
<HeaderRightDiscussionDetail
|
||||
id={detail}
|
||||
status={data?.status}
|
||||
isActive={data?.isActive}
|
||||
/> : (<></>)
|
||||
,
|
||||
}}
|
||||
/>
|
||||
<View style={{ flex: 1 }}>
|
||||
<ScrollView>
|
||||
<View style={[Styles.p15, Styles.mb100]}>
|
||||
<BorderBottomItem
|
||||
descEllipsize={false}
|
||||
width={60}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileSmall]}
|
||||
<ImageUser
|
||||
src={`https://wibu-storage.wibudev.com/api/files/${data?.user_img}`}
|
||||
size="sm"
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
title={data?.username}
|
||||
subtitle={
|
||||
<LabelStatus category='success' text='BUKA' size="small" />
|
||||
data?.isActive ? (
|
||||
data?.status == 1 ? (
|
||||
<LabelStatus category="success" text="BUKA" size="small" />
|
||||
) : (
|
||||
<LabelStatus category="error" text="TUTUP" size="small" />
|
||||
)
|
||||
) : (
|
||||
<LabelStatus category="secondary" text="ARSIP" size="small" />
|
||||
)
|
||||
}
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
|
||||
rightTopInfo={data?.createdAt}
|
||||
desc={data?.desc}
|
||||
leftBottomInfo={
|
||||
<View style={[Styles.rowItemsCenter]}>
|
||||
<Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
|
||||
<Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>15 Komentar</Text>
|
||||
<Ionicons
|
||||
name="chatbox-ellipses-outline"
|
||||
size={18}
|
||||
color="grey"
|
||||
style={Styles.mr05}
|
||||
/>
|
||||
<Text
|
||||
style={[Styles.textInformation, Styles.cGray, Styles.mb05]}
|
||||
>
|
||||
{dataComment.length} Komentar
|
||||
</Text>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
<View style={[Styles.p15]}>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="sangat berdampak dari berbagai sisi"
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
|
||||
<BorderBottomItem
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<Image
|
||||
source={require("../../../../../../../assets/images/user.jpeg")}
|
||||
style={[Styles.userProfileExtraSmall]}
|
||||
/>
|
||||
}
|
||||
title="Amalia Dwi"
|
||||
rightTopInfo="3 Jan 2025"
|
||||
desc="semua menjadi terbatas.."
|
||||
/>
|
||||
|
||||
{dataComment.map((item, index) => (
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
width={55}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<ImageUser
|
||||
src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
|
||||
size="xs"
|
||||
/>
|
||||
}
|
||||
title={item.username}
|
||||
rightTopInfo={item.createdAt}
|
||||
desc={item.comment}
|
||||
descEllipsize={false}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
<View style={[Styles.ph15, Styles.absolute0, { backgroundColor: '#f4f4f4' }]}>
|
||||
<View
|
||||
style={[
|
||||
Styles.ph15,
|
||||
Styles.absolute0,
|
||||
{ backgroundColor: "#f4f4f4" },
|
||||
]}
|
||||
>
|
||||
<InputForm
|
||||
disable={
|
||||
data?.status == 2 ||
|
||||
data?.isActive == false ||
|
||||
((entityUser.role == "user" || entityUser.role == "coadmin") &&
|
||||
!isMemberDivision)
|
||||
}
|
||||
bg="white"
|
||||
type="default"
|
||||
round
|
||||
placeholder="Kirim Komentar"
|
||||
onChange={setKomentar}
|
||||
value={komentar}
|
||||
itemRight={
|
||||
<MaterialIcons name="send" size={25} color={'#384288'} />
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
komentar != "" &&
|
||||
!loadingSend &&
|
||||
data?.status != 2 &&
|
||||
data?.isActive &&
|
||||
(((entityUser.role == "user" ||
|
||||
entityUser.role == "coadmin") &&
|
||||
isMemberDivision) ||
|
||||
entityUser.role == "admin" ||
|
||||
entityUser.role == "superadmin" ||
|
||||
entityUser.role == "developer" ||
|
||||
entityUser.role == "cosupadmin") &&
|
||||
handleKomentar();
|
||||
}}
|
||||
>
|
||||
<MaterialIcons
|
||||
name="send"
|
||||
size={25}
|
||||
style={
|
||||
komentar == "" ||
|
||||
loadingSend ||
|
||||
data?.status == 2 ||
|
||||
data?.isActive == false ||
|
||||
((entityUser.role == "user" ||
|
||||
entityUser.role == "coadmin") &&
|
||||
!isMemberDivision)
|
||||
? Styles.cGray
|
||||
: Styles.cDefault
|
||||
}
|
||||
/>
|
||||
</Pressable>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</>
|
||||
)
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user