diff --git a/app/(application)/division/index.tsx b/app/(application)/division/index.tsx index fa83515..e0e8309 100644 --- a/app/(application)/division/index.tsx +++ b/app/(application)/division/index.tsx @@ -193,7 +193,7 @@ export default function ListDivision() { {data.map((item, index) => ( { }} + onPress={() => { router.push(`/division/${item.id}`) }} borderType="bottom" icon={ diff --git a/components/project/sectionFile.tsx b/components/project/sectionFile.tsx index 0eb6be0..44661cc 100644 --- a/components/project/sectionFile.tsx +++ b/components/project/sectionFile.tsx @@ -169,6 +169,7 @@ export default function SectionFile({ status, member }: { status: number | undef title={item.name + '.' + item.extension} titleWeight="normal" onPress={() => { setIdSelect(item.id); setModal(true) }} + width={65} /> ) }) diff --git a/components/task/sectionFileTask.tsx b/components/task/sectionFileTask.tsx index dde105c..d02a8f8 100644 --- a/components/task/sectionFileTask.tsx +++ b/components/task/sectionFileTask.tsx @@ -11,6 +11,7 @@ import AlertKonfirmasi from "../alertKonfirmasi"; import BorderBottomItem from "../borderBottomItem"; import DrawerBottom from "../drawerBottom"; import MenuItemRow from "../menuItemRow"; +import Skeleton from "../skeleton"; type Props = { id: string @@ -27,21 +28,30 @@ export default function SectionFileTask() { const [idSelect, setIdSelect] = useState('') const update = useSelector((state: any) => state.taskUpdate) const dispatch = useDispatch() + 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 apiGetTaskOne({ id: detail, user: hasil, cat: 'file' }) setData(response.data) } catch (error) { console.error(error) + } finally { + setLoading(false) } } useEffect(() => { - handleLoad() + handleLoad(false) }, [update.file]) + useEffect(() => { + handleLoad(true) + }, []) + async function handleDelete() { try { const hasil = await decryptToken(String(token?.current)); @@ -66,21 +76,29 @@ export default function SectionFileTask() { File { - data.length > 0 ? - data.map((item, index) => { + loading ? + arrSkeleton.map((item, index) => { return ( - } - title={item.name + '.' + item.extension} - titleWeight="normal" - onPress={() => { setIdSelect(item.id); setModal(true) }} - /> + ) }) : - Tidak ada file + data.length > 0 ? + data.map((item, index) => { + return ( + } + title={item.name + '.' + item.extension} + titleWeight="normal" + onPress={() => { setIdSelect(item.id); setModal(true) }} + width={65} + /> + ) + }) + : + Tidak ada file } diff --git a/components/task/sectionMemberTask.tsx b/components/task/sectionMemberTask.tsx index 4c8ec1f..3ef0325 100644 --- a/components/task/sectionMemberTask.tsx +++ b/components/task/sectionMemberTask.tsx @@ -12,6 +12,7 @@ import BorderBottomItem from "../borderBottomItem"; import DrawerBottom from "../drawerBottom"; import ImageUser from "../imageNew"; import MenuItemRow from "../menuItemRow"; +import SkeletonTwoItem from "../skeletonTwoItem"; type Props = { id: string; @@ -29,13 +30,16 @@ export default function SectionMemberTask() { const [data, setData] = useState([]); const dispatch = useDispatch(); const update = useSelector((state: any) => state.taskUpdate); + const [loading, setLoading] = useState(true) + const arrSkeleton = Array.from({ length: 3 }) const [memberChoose, setMemberChoose] = useState({ id: "", name: "", }); - async function handleLoad() { + async function handleLoad(loading: boolean) { try { + setLoading(loading) const hasil = await decryptToken(String(token?.current)); const response = await apiGetTaskOne({ id: detail, @@ -45,13 +49,19 @@ export default function SectionMemberTask() { setData(response.data); } catch (error) { console.error(error); + } finally { + setLoading(false) } } useEffect(() => { - handleLoad(); + handleLoad(false); }, [update.member]); + useEffect(() => { + handleLoad(true); + }, []) + async function handleDeleteMember() { try { @@ -83,39 +93,48 @@ export default function SectionMemberTask() { - {data.length > 0 ? ( - data.map((item, index) => { - return ( - { + return ( + + ) + }) + : + data.length > 0 ? ( + data.map((item, index) => { + return ( + + } + title={item.name} + onPress={() => { + setMemberChoose({ + id: item.idUser, + name: item.name, + }); + setModal(true); + }} /> - } - title={item.name} - onPress={() => { - setMemberChoose({ - id: item.idUser, - name: item.name, - }); - setModal(true); - }} - /> - ); - }) - ) : ( - - Tidak ada anggota - - )} + ); + }) + ) : ( + + Tidak ada anggota + + ) + } diff --git a/components/task/sectionTanggalTugasTask.tsx b/components/task/sectionTanggalTugasTask.tsx index 16c437e..2ef9cf0 100644 --- a/components/task/sectionTanggalTugasTask.tsx +++ b/components/task/sectionTanggalTugasTask.tsx @@ -12,6 +12,7 @@ import DrawerBottom from "../drawerBottom"; import ItemSectionTanggalTugas from "../itemSectionTanggalTugas"; import MenuItemRow from "../menuItemRow"; import ModalSelect from "../modalSelect"; +import SkeletonTask from "../skeletonTask"; type Props = { @@ -28,6 +29,8 @@ export default function SectionTanggalTugasTask() { const [isModal, setModal] = useState(false) const [isSelect, setSelect] = useState(false) const { token, decryptToken } = useAuthSession() + const [loading, setLoading] = useState(true) + const arrSkeleton = Array.from({ length: 5 }) const { id, detail } = useLocalSearchParams<{ id: string, detail: string }>(); const [data, setData] = useState([]) const [tugas, setTugas] = useState({ @@ -35,13 +38,16 @@ export default function SectionTanggalTugasTask() { status: 0, }) - async function handleLoad() { + async function handleLoad(loading: boolean) { try { + setLoading(loading) const hasil = await decryptToken(String(token?.current)) const response = await apiGetTaskOne({ id: detail, user: hasil, cat: 'task' }) setData(response.data) } catch (error) { console.error(error) + } finally { + setLoading(false) } } @@ -68,10 +74,15 @@ export default function SectionTanggalTugasTask() { } useEffect(() => { - handleLoad() + handleLoad(false) }, [update.task]) + useEffect(() => { + handleLoad(true) + }, []) + + async function handleDelete() { try { const hasil = await decryptToken(String(token?.current)); @@ -100,28 +111,35 @@ export default function SectionTanggalTugasTask() { Tanggal & Tugas { - data.length > 0 - ? - data.map((item, index) => { + loading ? + arrSkeleton.map((item, index) => { return ( - { - setTugas({ - id: item.id, - status: item.status - }) - setModal(true) - }} - /> - ); + + ) }) : - Tidak ada tugas + data.length > 0 + ? + data.map((item, index) => { + return ( + { + setTugas({ + id: item.id, + status: item.status + }) + setModal(true) + }} + /> + ); + }) + : + Tidak ada tugas }