upd: redesign

Deskripsi:
- fitur ganti mode tema
- penerapan tema pada semua fitur

NO Issues
This commit is contained in:
2026-02-09 17:49:25 +08:00
parent ddfee00410
commit d3802ca26c
157 changed files with 1278 additions and 692 deletions

View File

@@ -2,6 +2,7 @@ import Styles from "@/constants/Styles"
import { apiAddLinkProject, apiDeleteProject } from "@/lib/api"
import { setUpdateProject } from "@/lib/projectUpdate"
import { useAuthSession } from "@/providers/AuthProvider"
import { useTheme } from "@/providers/ThemeProvider"
import { AntDesign, Feather, Ionicons, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { router } from "expo-router"
import { useState } from "react"
@@ -23,6 +24,7 @@ type Props = {
export default function HeaderRightProjectDetail({ id, status }: Props) {
const entityUser = useSelector((state: any) => state.user)
const { token, decryptToken } = useAuthSession()
const { colors } = useTheme();
const [isVisible, setVisible] = useState(false)
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
@@ -70,7 +72,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu" height={35}>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
icon={<AntDesign name="pluscircle" color={colors.text} size={25} />}
title="Tambah Tugas"
onPress={() => {
if (status == 3) return
@@ -80,7 +82,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
disabled={status == 3}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-plus" color="black" size={25} />}
icon={<MaterialCommunityIcons name="file-plus" color={colors.text} size={25} />}
title="Tambah File"
onPress={() => {
if (status == 3) return
@@ -90,7 +92,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
disabled={status == 3}
/>
<MenuItemRow
icon={<Feather name="link" color="black" size={25} />}
icon={<Feather name="link" color={colors.text} size={25} />}
title="Tambah Link"
onPress={() => {
if (status == 3) return
@@ -104,7 +106,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
</View>
<View style={[Styles.rowItemsCenter, Styles.mt15]}>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-document" color="black" size={25} />}
icon={<MaterialCommunityIcons name="file-document" color={colors.text} size={25} />}
title="Laporan"
onPress={() => {
if (status == 3) return
@@ -117,7 +119,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
entityUser.role != "user" && entityUser.role != "coadmin" &&
<>
<MenuItemRow
icon={<MaterialIcons name="groups" color="black" size={25} />}
icon={<MaterialIcons name="groups" color={colors.text} size={25} />}
title="Tambah Anggota"
onPress={() => {
if (status == 3) return
@@ -127,7 +129,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
disabled={status == 3}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
icon={<MaterialCommunityIcons name="pencil-outline" color={colors.text} size={25} />}
title="Edit"
onPress={() => {
if (status == 3) return
@@ -146,7 +148,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
status == 3
?
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
icon={<Ionicons name="trash" color={colors.text} size={25} />}
title="Hapus"
onPress={() => {
setVisible(false)
@@ -159,7 +161,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
/>
:
<MenuItemRow
icon={<MaterialIcons name="close" color="black" size={25} />}
icon={<MaterialIcons name="close" color={colors.text} size={25} />}
title="Batal"
onPress={() => {
setVisible(false)
@@ -182,6 +184,7 @@ export default function HeaderRightProjectDetail({ id, status }: Props) {
<InputForm
type="default"
placeholder="Masukkan link"
bg={colors.card}
value={link}
onChange={(text) => { setLink(text) }}
/>

View File

@@ -1,4 +1,5 @@
import Styles from "@/constants/Styles"
import { useTheme } from "@/providers/ThemeProvider"
import { AntDesign } from "@expo/vector-icons"
import { router } from "expo-router"
import { useState } from "react"
@@ -10,6 +11,7 @@ import MenuItemRow from "../menuItemRow"
import ModalFilter from "../modalFilter"
export default function HeaderRightProjectList() {
const { colors } = useTheme();
const [isVisible, setVisible] = useState(false)
const [isFilter, setFilter] = useState(false)
const entityUser = useSelector((state: any) => state.user)
@@ -22,7 +24,7 @@ export default function HeaderRightProjectList() {
{
entityUser.role != "user" && entityUser.role != "coadmin" &&
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
icon={<AntDesign name="pluscircle" color={colors.text} size={25} />}
title="Tambah Kegiatan"
onPress={() => {
setVisible(false)
@@ -33,7 +35,7 @@ export default function HeaderRightProjectList() {
{
// (entityUser.role == "user" || entityUser.role == "coadmin" || entityUser.role == "supadmin" || entityUser.role == "developer") &&
<MenuItemRow
icon={<AntDesign name="filter" color="black" size={25} />}
icon={<AntDesign name="filter" color={colors.text} size={25} />}
title="Filter"
onPress={() => {
setVisible(false)

View File

@@ -1,5 +1,6 @@
import Styles from "@/constants/Styles";
import { stringToDateTime } from "@/lib/fun_stringToDate";
import { useTheme } from "@/providers/ThemeProvider";
import { useEffect, useState } from "react";
import { Dimensions, View, VirtualizedList } from "react-native";
import { InputDate } from "../inputDate";
@@ -13,6 +14,7 @@ interface Props {
}
export default function ModalAddDetailTugasProject({ isVisible, setVisible, dataTanggal, onSubmit }: { isVisible: boolean, setVisible: (value: boolean) => void, dataTanggal: Props[], onSubmit: (data: Props[]) => void }) {
const { colors } = useTheme();
const [data, setData] = useState<Props[]>(dataTanggal)
const tinggiScreen = Dimensions.get("window").height;
const tinggiFix = tinggiScreen * 70 / 100;
@@ -89,14 +91,14 @@ export default function ModalAddDetailTugasProject({ isVisible, setVisible, data
setVisible(false)
}}
>
<View style={[{ height: tinggiFix }]} >
<View style={[{ height: tinggiFix, }]} >
<VirtualizedList
data={data}
getItemCount={() => data.length}
getItem={getItem}
renderItem={({ item, index }: { item: Props, index: number }) => {
return (
<View key={index} style={[Styles.borderBottom, Styles.pv05]}>
<View key={index} style={[Styles.borderBottom, Styles.pv05, { borderBottomColor: colors.icon }]}>
<Text style={[Styles.textDefaultSemiBold]}>{item.date}</Text>
<View style={[Styles.rowSpaceBetween]}>
<View style={[{ width: "48%" }]}>

View File

@@ -1,6 +1,7 @@
import Styles from "@/constants/Styles";
import { apiGetProjectTask } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { useEffect, useState } from "react";
import { Dimensions, View, VirtualizedList } from "react-native";
import { InputDate } from "../inputDate";
@@ -16,6 +17,7 @@ interface Props {
}
export default function ModalListDetailTugasProject({ isVisible, setVisible, idTask }: { isVisible: boolean, setVisible: (value: boolean) => void, idTask: string }) {
const { colors } = useTheme();
const [data, setData] = useState<Props[]>([])
const [loading, setLoading] = useState(false)
const { token, decryptToken } = useAuthSession()
@@ -75,7 +77,7 @@ export default function ModalListDetailTugasProject({ isVisible, setVisible, idT
getItem={getItem}
renderItem={({ item, index }: { item: Props, index: number }) => {
return (
<View key={index} style={[Styles.borderBottom, Styles.pv05]}>
<View key={index} style={[Styles.borderBottom, Styles.pv05, { borderBottomColor: colors.icon }]}>
<Text style={[Styles.textDefaultSemiBold]}>{item.date}</Text>
<View style={[Styles.rowSpaceBetween]}>
<View style={[{ width: "48%" }]}>

View File

@@ -3,6 +3,7 @@ import Styles from "@/constants/Styles";
import { apiDeleteFileProject, apiGetProjectOne } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import * as FileSystem from 'expo-file-system';
import { startActivityAsync } from 'expo-intent-launcher';
@@ -30,6 +31,7 @@ type Props = {
}
export default function SectionFile({ status, member, refreshing }: { status: number | undefined, member: boolean, refreshing?: boolean }) {
const { colors } = useTheme();
const entityUser = useSelector((state: any) => state.user)
const [isModal, setModal] = useState(false)
const { token, decryptToken } = useAuthSession();
@@ -135,7 +137,7 @@ export default function SectionFile({ status, member, refreshing }: { status: nu
<ModalLoading isVisible={loadingOpen} setVisible={setLoadingOpen} />
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
loading ?
arrSkeleton.map((item, index) => {
@@ -150,7 +152,7 @@ export default function SectionFile({ status, member, refreshing }: { status: nu
<BorderBottomItem
key={index}
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
icon={<MaterialCommunityIcons name="file-outline" size={25} color={colors.text} />}
title={item.name + '.' + item.extension}
titleWeight="normal"
onPress={() => { setSelectFile(item); setModal(true) }}
@@ -167,7 +169,7 @@ export default function SectionFile({ status, member, refreshing }: { status: nu
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-eye" color="black" size={25} />}
icon={<MaterialCommunityIcons name="file-eye" color={colors.text} size={25} />}
title="Lihat / Share"
onPress={() => {
openFile()
@@ -177,7 +179,7 @@ export default function SectionFile({ status, member, refreshing }: { status: nu
!member && (entityUser.role == "user" || entityUser.role == "coadmin") ? <></>
:
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
icon={<Ionicons name="trash" color={colors.text} size={25} />}
title="Hapus"
disabled={status == 3}
onPress={() => {

View File

@@ -3,6 +3,7 @@ import { apiDeleteLinkProject, apiGetProjectOne } from "@/lib/api";
import { urlCompleted } from "@/lib/fun_urlCompleted";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { Feather, Ionicons } from "@expo/vector-icons";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
@@ -22,6 +23,7 @@ type Props = {
}
export default function SectionLink({ status, member, refreshing }: { status: number | undefined, member: boolean, refreshing?: boolean }) {
const { colors } = useTheme();
const entityUser = useSelector((state: any) => state.user)
const [isModal, setModal] = useState(false)
const { token, decryptToken } = useAuthSession();
@@ -82,14 +84,14 @@ export default function SectionLink({ status, member, refreshing }: { status: nu
<>
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Link</Text>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="all"
icon={<Feather name="link" size={25} color="black" />}
icon={<Feather name="link" size={25} color={colors.text} />}
title={item.link}
titleWeight="normal"
onPress={() => { setSelectLink(item); setModal(true) }}
@@ -104,7 +106,7 @@ export default function SectionLink({ status, member, refreshing }: { status: nu
<DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<Feather name="external-link" color="black" size={25} />}
icon={<Feather name="external-link" color={colors.text} size={25} />}
title="Buka Link"
onPress={() => {
Linking.openURL(urlCompleted(String(selectLink?.link)))
@@ -114,7 +116,7 @@ export default function SectionLink({ status, member, refreshing }: { status: nu
!member && (entityUser.role == "user" || entityUser.role == "coadmin") ? <></>
:
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
icon={<Ionicons name="trash" color={colors.text} size={25} />}
title="Hapus"
disabled={status == 3}
onPress={() => {

View File

@@ -1,5 +1,6 @@
import Styles from "@/constants/Styles";
import { deleteTaskCreate } from "@/lib/taskCreate";
import { useTheme } from "@/providers/ThemeProvider";
import { Ionicons } from "@expo/vector-icons";
import { Key, useState } from "react";
import { View } from "react-native";
@@ -10,6 +11,7 @@ import MenuItemRow from "../menuItemRow";
import Text from "../Text";
export default function SectionListAddTask() {
const { colors } = useTheme();
const taskCreate = useSelector((state: any) => state.taskCreate)
const [select, setSelect] = useState<any>(null)
const [isModal, setModal] = useState(false)
@@ -30,7 +32,7 @@ export default function SectionListAddTask() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
Tanggal & Tugas
</Text>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
taskCreate.map((item: { status: number; title: string; dateStart: string; dateEnd: string; }, index: Key | null | undefined) => {
return (
@@ -58,7 +60,7 @@ export default function SectionListAddTask() {
>
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
icon={<Ionicons name="trash" color={colors.text} size={25} />}
title="Hapus Tugas"
onPress={() => { handleDelete() }}
/>

View File

@@ -3,6 +3,7 @@ import Styles from "@/constants/Styles";
import { apiDeleteProjectMember, apiGetProjectOne } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
@@ -27,6 +28,7 @@ type Props = {
};
export default function SectionMember({ status, refreshing }: { status: number | undefined, refreshing?: boolean }) {
const { colors } = useTheme();
const dispatch = useDispatch()
const entityUser = useSelector((state: any) => state.user)
const update = useSelector((state: any) => state.projectUpdate)
@@ -97,7 +99,7 @@ export default function SectionMember({ status, refreshing }: { status: number |
<Text style={[Styles.textDefault]}>Total {data.length} Anggota</Text>
</View>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
loading ?
arrSkeleton.map((item, index) => {
@@ -143,7 +145,7 @@ export default function SectionMember({ status, refreshing }: { status: number |
icon={
<MaterialCommunityIcons
name="account-eye"
color="black"
color={colors.text}
size={25}
/>
}
@@ -159,7 +161,7 @@ export default function SectionMember({ status, refreshing }: { status: number |
icon={
<MaterialCommunityIcons
name="account-remove"
color="black"
color={colors.text}
size={25}
/>
}

View File

@@ -1,6 +1,7 @@
import Styles from "@/constants/Styles";
import { apiGetProjectOne } from "@/lib/api";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
import { View } from "react-native";
@@ -9,6 +10,7 @@ import Text from "../Text";
import TextExpandable from "../textExpandable";
export default function SectionReportProject({ refreshing }: { refreshing?: boolean }) {
const { colors } = useTheme();
const update = useSelector((state: any) => state.projectUpdate)
const { token, decryptToken } = useAuthSession();
const { id } = useLocalSearchParams<{ id: string }>();
@@ -45,7 +47,7 @@ export default function SectionReportProject({ refreshing }: { refreshing?: bool
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
Laporan Kegiatan
</Text>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
<TextExpandable content={data} maxLines={2} />
</View>
</View>

View File

@@ -2,6 +2,7 @@ import Styles from "@/constants/Styles";
import { apiDeleteProjectTask, apiGetProjectOne, apiUpdateStatusProjectTask } from "@/lib/api";
import { setUpdateProject } from "@/lib/projectUpdate";
import { useAuthSession } from "@/providers/AuthProvider";
import { useTheme } from "@/providers/ThemeProvider";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
import { router, useLocalSearchParams } from "expo-router";
import { useEffect, useState } from "react";
@@ -28,6 +29,7 @@ type Props = {
};
export default function SectionTanggalTugasProject({ status, member, refreshing }: { status: number | undefined, member: boolean, refreshing?: boolean }) {
const { colors } = useTheme();
const entityUser = useSelector((state: any) => state.user)
const dispatch = useDispatch()
const update = useSelector((state: any) => state.projectUpdate)
@@ -116,7 +118,7 @@ export default function SectionTanggalTugasProject({ status, member, refreshing
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
Tanggal & Tugas
</Text>
<View style={[Styles.wrapPaper]}>
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
{
loading ?
arrSkeleton.map((item, index) => {
@@ -163,7 +165,7 @@ export default function SectionTanggalTugasProject({ status, member, refreshing
icon={
<MaterialCommunityIcons
name="list-status"
color="black"
color={colors.text}
size={25}
/>
}
@@ -179,7 +181,7 @@ export default function SectionTanggalTugasProject({ status, member, refreshing
icon={
<MaterialCommunityIcons
name="pencil-outline"
color="black"
color={colors.text}
size={25}
/>
}
@@ -194,7 +196,7 @@ export default function SectionTanggalTugasProject({ status, member, refreshing
icon={
<MaterialCommunityIcons
name="clock-time-three-outline"
color="black"
color={colors.text}
size={25}
/>
}
@@ -209,7 +211,7 @@ export default function SectionTanggalTugasProject({ status, member, refreshing
</View>
<View style={[Styles.rowItemsCenter, Styles.mt15]}>
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
icon={<Ionicons name="trash" color={colors.text} size={25} />}
title="Hapus Tugas"
onPress={() => {
setModal(false)