upd: skeleton
Deskripsi: - divisi - detail divisi - informasi divisi - calender list - calender detail - history - diskusi list - detail diskusi - list task divisi NO Issuese
This commit is contained in:
amel
@@ -4,6 +4,8 @@ import HeaderRightDiscussionDetail from "@/components/discussion/headerDiscussio
|
||||
import ImageUser from "@/components/imageNew";
|
||||
import { InputForm } from "@/components/inputForm";
|
||||
import LabelStatus from "@/components/labelStatus";
|
||||
import Skeleton from "@/components/skeleton";
|
||||
import SkeletonContent from "@/components/skeletonContent";
|
||||
import Styles from "@/constants/Styles";
|
||||
import {
|
||||
apiGetDiscussionOne,
|
||||
@@ -50,9 +52,13 @@ export default function DiscussionDetail() {
|
||||
const [isMemberDivision, setIsMemberDivision] = useState(false);
|
||||
const [isAdminDivision, setIsAdminDivision] = useState(false);
|
||||
const [isCreator, setIsCreator] = useState(false);
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [loadingKomentar, setLoadingKomentar] = useState(true)
|
||||
const arrSkeleton = Array.from({ length: 3 })
|
||||
|
||||
async function handleLoad() {
|
||||
async function handleLoad(loading: boolean) {
|
||||
try {
|
||||
setLoading(loading)
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetDiscussionOne({
|
||||
id: detail,
|
||||
@@ -63,11 +69,14 @@ export default function DiscussionDetail() {
|
||||
setIsCreator(response.data.createdBy == hasil);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
async function handleLoadComment() {
|
||||
async function handleLoadComment(loading: boolean) {
|
||||
try {
|
||||
setLoadingKomentar(loading)
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetDiscussionOne({
|
||||
id: detail,
|
||||
@@ -77,6 +86,8 @@ export default function DiscussionDetail() {
|
||||
setDataComment(response.data);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoadingKomentar(false)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -102,11 +113,12 @@ export default function DiscussionDetail() {
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad();
|
||||
handleLoad(false);
|
||||
}, [update.data]);
|
||||
|
||||
useEffect(() => {
|
||||
handleLoadComment();
|
||||
handleLoad(true)
|
||||
handleLoadComment(true);
|
||||
handleCheckMember();
|
||||
}, []);
|
||||
|
||||
@@ -120,7 +132,7 @@ export default function DiscussionDetail() {
|
||||
});
|
||||
if (response.success) {
|
||||
setKomentar("");
|
||||
handleLoadComment();
|
||||
handleLoadComment(false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
@@ -155,64 +167,78 @@ export default function DiscussionDetail() {
|
||||
<View style={{ flex: 1 }}>
|
||||
<ScrollView>
|
||||
<View style={[Styles.p15, Styles.mb100]}>
|
||||
<BorderBottomItem
|
||||
descEllipsize={false}
|
||||
width={60}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<ImageUser
|
||||
src={`https://wibu-storage.wibudev.com/api/files/${data?.user_img}`}
|
||||
size="sm"
|
||||
/>
|
||||
}
|
||||
title={data?.username}
|
||||
subtitle={
|
||||
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={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]}
|
||||
>
|
||||
{dataComment.length} Komentar
|
||||
</Text>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
<View style={[Styles.p15]}>
|
||||
{dataComment.map((item, index) => (
|
||||
{
|
||||
loading ?
|
||||
<SkeletonContent />
|
||||
:
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
width={55}
|
||||
descEllipsize={false}
|
||||
width={60}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<ImageUser
|
||||
src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
|
||||
size="xs"
|
||||
src={`https://wibu-storage.wibudev.com/api/files/${data?.user_img}`}
|
||||
size="sm"
|
||||
/>
|
||||
}
|
||||
title={item.username}
|
||||
rightTopInfo={item.createdAt}
|
||||
desc={item.comment}
|
||||
descEllipsize={false}
|
||||
title={data?.username}
|
||||
subtitle={
|
||||
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={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]}
|
||||
>
|
||||
{dataComment.length} Komentar
|
||||
</Text>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
))}
|
||||
}
|
||||
|
||||
<View style={[Styles.p15]}>
|
||||
{
|
||||
loadingKomentar ?
|
||||
arrSkeleton.map((item, index) => (
|
||||
<Skeleton key={index} width={100} widthType="percent" height={40} borderRadius={5} />
|
||||
))
|
||||
:
|
||||
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>
|
||||
|
||||
@@ -3,8 +3,9 @@ import ButtonTab from "@/components/buttonTab";
|
||||
import ImageUser from "@/components/imageNew";
|
||||
import InputSearch from "@/components/inputSearch";
|
||||
import LabelStatus from "@/components/labelStatus";
|
||||
import SkeletonContent from "@/components/skeletonContent";
|
||||
import Styles from "@/constants/Styles";
|
||||
import { apiGetDiscussion, apiGetDivisionOneFeature } from "@/lib/api";
|
||||
import { apiGetDiscussion } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { AntDesign, Feather, Ionicons } from "@expo/vector-icons";
|
||||
import { router, useLocalSearchParams } from "expo-router";
|
||||
@@ -32,21 +33,30 @@ export default function DiscussionDivision() {
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const [search, setSearch] = useState('')
|
||||
const update = useSelector((state: any) => state.discussionUpdate);
|
||||
const [loading, setLoading] = useState(true)
|
||||
const arrSkeleton = Array.from({ length: 5 })
|
||||
|
||||
async function handleLoad() {
|
||||
async function handleLoad(loading: boolean) {
|
||||
try {
|
||||
setLoading(loading)
|
||||
const hasil = await decryptToken(String(token?.current))
|
||||
const response = await apiGetDiscussion({ user: hasil, search, division: id, active })
|
||||
setData(response.data)
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad(false)
|
||||
}, [update.data])
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad()
|
||||
}, [active, search, update.data])
|
||||
handleLoad(true)
|
||||
}, [active, search])
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
@@ -70,35 +80,44 @@ export default function DiscussionDivision() {
|
||||
</View>
|
||||
<InputSearch onChange={setSearch} />
|
||||
<View>
|
||||
{data.length > 0 ?
|
||||
data.map((item, index) => (
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
width={55}
|
||||
onPress={() => { router.push(`./discussion/${item.id}`) }}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} size="sm" />
|
||||
}
|
||||
title={item.user_name}
|
||||
subtitle={
|
||||
active == "true" ? item.status == 1 ? <LabelStatus category='success' text='BUKA' size="small" /> : <LabelStatus category='error' text='TUTUP' size="small" /> : <></>
|
||||
}
|
||||
rightTopInfo={item.createdAt}
|
||||
desc={item.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]}>Diskusikan</Text>
|
||||
</View>
|
||||
}
|
||||
rightBottomInfo={item.total_komentar + ' Komentar'}
|
||||
/>
|
||||
))
|
||||
:
|
||||
(
|
||||
<Text style={[Styles.textDefault, Styles.cGray, Styles.mv10, { textAlign: "center" }]}>Tidak ada diskusi</Text>
|
||||
)}
|
||||
{
|
||||
loading ?
|
||||
arrSkeleton.map((item: any, i: number) => {
|
||||
return (
|
||||
<SkeletonContent key={i} />
|
||||
)
|
||||
})
|
||||
:
|
||||
data.length > 0 ?
|
||||
data.map((item, index) => (
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
width={55}
|
||||
onPress={() => { router.push(`./discussion/${item.id}`) }}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<ImageUser src={`https://wibu-storage.wibudev.com/api/files/${item.img}`} size="sm" />
|
||||
}
|
||||
title={item.user_name}
|
||||
subtitle={
|
||||
active == "true" ? item.status == 1 ? <LabelStatus category='success' text='BUKA' size="small" /> : <LabelStatus category='error' text='TUTUP' size="small" /> : <></>
|
||||
}
|
||||
rightTopInfo={item.createdAt}
|
||||
desc={item.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]}>Diskusikan</Text>
|
||||
</View>
|
||||
}
|
||||
rightBottomInfo={item.total_komentar + ' Komentar'}
|
||||
/>
|
||||
))
|
||||
:
|
||||
(
|
||||
<Text style={[Styles.textDefault, Styles.cGray, Styles.mv10, { textAlign: "center" }]}>Tidak ada diskusi</Text>
|
||||
)
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
|
||||
Reference in New Issue
Block a user