upd: redesign
Deskripsi: - fitur ganti mode tema - penerapan tema pada semua fitur NO Issues
This commit is contained in:
@@ -8,6 +8,7 @@ import { isImageFile } from "@/constants/FileExtensions";
|
||||
import Styles from "@/constants/Styles";
|
||||
import { apiGetAnnouncementOne } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { useTheme } from "@/providers/ThemeProvider";
|
||||
import { Entypo, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons";
|
||||
import * as FileSystem from 'expo-file-system';
|
||||
import { startActivityAsync } from 'expo-intent-launcher';
|
||||
@@ -51,6 +52,7 @@ interface ApiResponse {
|
||||
export default function DetailAnnouncement() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>();
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const { colors } = useTheme();
|
||||
const [data, setData] = useState<AnnouncementData>({ id: '', title: '', desc: '' })
|
||||
const [dataMember, setDataMember] = useState<Record<string, MemberData[]>>({})
|
||||
const [dataFile, setDataFile] = useState<FileData[]>([])
|
||||
@@ -175,7 +177,7 @@ export default function DetailAnnouncement() {
|
||||
};
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
<SafeAreaView style={{ flex: 1, backgroundColor: colors.background }}>
|
||||
<Stack.Screen
|
||||
options={{
|
||||
// headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
|
||||
@@ -193,16 +195,17 @@ export default function DetailAnnouncement() {
|
||||
/>
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
style={[Styles.h100]}
|
||||
style={[Styles.h100, { backgroundColor: colors.background }]}
|
||||
refreshControl={
|
||||
<RefreshControl
|
||||
refreshing={refreshing}
|
||||
onRefresh={() => handleRefresh()}
|
||||
tintColor={colors.primary}
|
||||
/>
|
||||
}
|
||||
>
|
||||
<View style={[Styles.p15, Styles.mb50]}>
|
||||
<View style={[Styles.wrapPaper]}>
|
||||
<View style={[Styles.wrapPaper, { backgroundColor: colors.card, borderColor: colors.background }]}>
|
||||
{
|
||||
loading ?
|
||||
<View>
|
||||
@@ -219,7 +222,7 @@ export default function DetailAnnouncement() {
|
||||
:
|
||||
<>
|
||||
<View style={[Styles.rowItemsCenter, { alignItems: 'flex-start' }]}>
|
||||
<MaterialIcons name="campaign" size={25} color="black" style={[Styles.mr05]} />
|
||||
<MaterialIcons name="campaign" size={25} color={colors.text} style={[Styles.mr05]} />
|
||||
<Text style={[Styles.textDefaultSemiBold, Styles.w90, Styles.mt02]}>{data?.title}</Text>
|
||||
</View>
|
||||
<View style={[Styles.mt10]}>
|
||||
@@ -228,7 +231,7 @@ export default function DetailAnnouncement() {
|
||||
<RenderHTML
|
||||
contentWidth={contentWidth}
|
||||
source={{ html: data?.desc }}
|
||||
baseStyle={{ color: 'black' }}
|
||||
baseStyle={{ color: colors.text }}
|
||||
/>
|
||||
:
|
||||
<Text>{data?.desc}</Text>
|
||||
@@ -240,7 +243,7 @@ export default function DetailAnnouncement() {
|
||||
</View>
|
||||
{
|
||||
dataFile.length > 0 && (
|
||||
<View style={[Styles.wrapPaper, Styles.mt10]}>
|
||||
<View style={[Styles.wrapPaper, Styles.mt10, { backgroundColor: colors.card, borderColor: colors.background }]}>
|
||||
<View style={[Styles.mb05]}>
|
||||
<Text style={[Styles.textDefaultSemiBold]}>File</Text>
|
||||
</View>
|
||||
@@ -251,7 +254,7 @@ export default function DetailAnnouncement() {
|
||||
icon={<MaterialCommunityIcons
|
||||
name={isImageFile(item.extension) ? "file-image-outline" : "file-document-outline"}
|
||||
size={25}
|
||||
color="black"
|
||||
color={colors.text}
|
||||
/>}
|
||||
title={item.name + '.' + item.extension}
|
||||
titleWeight="normal"
|
||||
@@ -265,7 +268,7 @@ export default function DetailAnnouncement() {
|
||||
</View>
|
||||
)
|
||||
}
|
||||
<View style={[Styles.wrapPaper, Styles.mt10]}>
|
||||
<View style={[Styles.wrapPaper, Styles.mt10, { backgroundColor: colors.card, borderColor: colors.background }]}>
|
||||
{
|
||||
loading ?
|
||||
arrSkeleton.map((item, index) => {
|
||||
@@ -286,7 +289,7 @@ export default function DetailAnnouncement() {
|
||||
dataMember[v].map((item: any, x: any) => {
|
||||
return (
|
||||
<View key={x} style={[Styles.rowItemsCenter, Styles.w90]}>
|
||||
<Entypo name="dot-single" size={24} color="black" />
|
||||
<Entypo name="dot-single" size={24} color={colors.text} />
|
||||
<Text style={[Styles.textDefault]} numberOfLines={1} ellipsizeMode='tail'>{item.division}</Text>
|
||||
</View>
|
||||
)
|
||||
|
||||
@@ -12,6 +12,7 @@ import Styles from "@/constants/Styles";
|
||||
import { setUpdateAnnouncement } from "@/lib/announcementUpdate";
|
||||
import { apiCreateAnnouncement } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { useTheme } from "@/providers/ThemeProvider";
|
||||
import { Entypo, Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
import * as DocumentPicker from "expo-document-picker";
|
||||
import { router, Stack } from "expo-router";
|
||||
@@ -24,6 +25,7 @@ export default function CreateAnnouncement() {
|
||||
const dispatch = useDispatch()
|
||||
const update = useSelector((state: any) => state.announcementUpdate)
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const { colors } = useTheme();
|
||||
const [disableBtn, setDisableBtn] = useState(true);
|
||||
const [modalDivisi, setModalDivisi] = useState(false);
|
||||
const [divisionMember, setDivisionMember] = useState<any>([])
|
||||
@@ -129,7 +131,7 @@ export default function CreateAnnouncement() {
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
<SafeAreaView style={{ flex: 1, backgroundColor: colors.background }}>
|
||||
<Stack.Screen
|
||||
options={{
|
||||
// headerLeft: () => (
|
||||
@@ -158,15 +160,15 @@ export default function CreateAnnouncement() {
|
||||
showBack={true}
|
||||
onPressLeft={() => router.back()}
|
||||
right={
|
||||
<ButtonSaveHeader
|
||||
disable={disableBtn || divisionMember.length == 0 || loading ? true : false}
|
||||
category="create"
|
||||
onPress={() => {
|
||||
divisionMember.length == 0
|
||||
? Toast.show({ type: 'small', text1: "Anda belum memilih divisi", })
|
||||
: handleCreate();
|
||||
}}
|
||||
/>
|
||||
<ButtonSaveHeader
|
||||
disable={disableBtn || divisionMember.length == 0 || loading ? true : false}
|
||||
category="create"
|
||||
onPress={() => {
|
||||
divisionMember.length == 0
|
||||
? Toast.show({ type: 'small', text1: "Anda belum memilih divisi", })
|
||||
: handleCreate();
|
||||
}}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
)
|
||||
@@ -175,7 +177,7 @@ export default function CreateAnnouncement() {
|
||||
<LoadingOverlay visible={loading} />
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
style={[Styles.h100]}
|
||||
style={[Styles.h100, { backgroundColor: colors.background }]}
|
||||
>
|
||||
<View style={[Styles.p15]}>
|
||||
<InputForm
|
||||
@@ -184,6 +186,7 @@ export default function CreateAnnouncement() {
|
||||
placeholder="Judul Pengumuman"
|
||||
required
|
||||
error={error.title}
|
||||
bg={colors.card}
|
||||
errorText="Judul harus diisi"
|
||||
onChange={(val) => validationForm("title", val)}
|
||||
/>
|
||||
@@ -193,6 +196,7 @@ export default function CreateAnnouncement() {
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
required
|
||||
error={error.desc}
|
||||
bg={colors.card}
|
||||
errorText="Pengumuman harus diisi"
|
||||
onChange={(val) => validationForm("desc", val)}
|
||||
multiline
|
||||
@@ -208,7 +212,7 @@ export default function CreateAnnouncement() {
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
borderType={fileForm.length > 1 ? "bottom" : "none"}
|
||||
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
|
||||
icon={<MaterialCommunityIcons name="file-outline" size={25} color={colors.text} />}
|
||||
title={item.name}
|
||||
titleWeight="normal"
|
||||
onPress={() => { setIndexDelFile(index); setModalFile(true) }}
|
||||
@@ -237,7 +241,7 @@ export default function CreateAnnouncement() {
|
||||
{
|
||||
item.Division.map((division: any, i: any) => (
|
||||
<View key={i} style={[Styles.rowItemsCenter, Styles.w90]}>
|
||||
<Entypo name="dot-single" size={24} color="black" />
|
||||
<Entypo name="dot-single" size={24} color={colors.text} />
|
||||
<Text style={[Styles.textDefault]} numberOfLines={1} ellipsizeMode='tail'>{division.name}</Text>
|
||||
</View>
|
||||
))
|
||||
@@ -266,7 +270,7 @@ export default function CreateAnnouncement() {
|
||||
<DrawerBottom animation="slide" isVisible={isModalFile} setVisible={setModalFile} title="Menu">
|
||||
<View style={Styles.rowItemsCenter}>
|
||||
<MenuItemRow
|
||||
icon={<Ionicons name="trash" color="black" size={25} />}
|
||||
icon={<Ionicons name="trash" color={colors.text} size={25} />}
|
||||
title="Hapus"
|
||||
onPress={() => { deleteFile(indexDelFile) }}
|
||||
/>
|
||||
|
||||
@@ -12,6 +12,7 @@ import Styles from "@/constants/Styles";
|
||||
import { setUpdateAnnouncement } from "@/lib/announcementUpdate";
|
||||
import { apiEditAnnouncement, apiGetAnnouncementOne } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { useTheme } from "@/providers/ThemeProvider";
|
||||
import { Entypo, Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
import * as DocumentPicker from "expo-document-picker";
|
||||
import { router, Stack, useLocalSearchParams } from "expo-router";
|
||||
@@ -35,6 +36,7 @@ export default function EditAnnouncement() {
|
||||
const dispatch = useDispatch()
|
||||
const update = useSelector((state: any) => state.announcementUpdate)
|
||||
const { token, decryptToken } = useAuthSession();
|
||||
const { colors } = useTheme();
|
||||
const [modalDivisi, setModalDivisi] = useState(false);
|
||||
const [disableBtn, setDisableBtn] = useState(true);
|
||||
const [dataMember, setDataMember] = useState<any>([]);
|
||||
@@ -180,7 +182,7 @@ export default function EditAnnouncement() {
|
||||
}
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
<SafeAreaView style={{ flex: 1, backgroundColor: colors.background }}>
|
||||
<Stack.Screen
|
||||
options={{
|
||||
// headerLeft: () => (
|
||||
@@ -226,7 +228,7 @@ export default function EditAnnouncement() {
|
||||
<LoadingOverlay visible={loading} />
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
style={[Styles.h100]}
|
||||
style={[Styles.h100, { backgroundColor: colors.background }]}
|
||||
>
|
||||
<View style={[Styles.p15]}>
|
||||
<InputForm
|
||||
@@ -235,6 +237,7 @@ export default function EditAnnouncement() {
|
||||
placeholder="Judul Pengumuman"
|
||||
required
|
||||
error={error.title}
|
||||
bg={colors.card}
|
||||
errorText="Judul harus diisi"
|
||||
onChange={(val) => validationForm("title", val)}
|
||||
value={dataForm.title}
|
||||
@@ -245,6 +248,7 @@ export default function EditAnnouncement() {
|
||||
placeholder="Deskripsi Pengumuman"
|
||||
required
|
||||
error={error.desc}
|
||||
bg={colors.card}
|
||||
errorText="Pengumuman harus diisi"
|
||||
onChange={(val) => validationForm("desc", val)}
|
||||
value={dataForm.desc}
|
||||
@@ -261,7 +265,7 @@ export default function EditAnnouncement() {
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
borderType={(fileForm.length + dataFile.length) > 1 ? "bottom" : "none"}
|
||||
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={() => { setIndexDelFile({ id: item.id, cat: "oldFile" }); setModalFile(true) }}
|
||||
@@ -273,7 +277,7 @@ export default function EditAnnouncement() {
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
borderType={(fileForm.length + dataFile.length) > 1 ? "bottom" : "none"}
|
||||
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
|
||||
icon={<MaterialCommunityIcons name="file-outline" size={25} color={colors.text} />}
|
||||
title={item.name}
|
||||
titleWeight="normal"
|
||||
onPress={() => { setIndexDelFile({ id: index, cat: "newFile" }); setModalFile(true) }}
|
||||
@@ -300,7 +304,7 @@ export default function EditAnnouncement() {
|
||||
{
|
||||
item.Division.map((division: any, i: any) => (
|
||||
<View key={i} style={[Styles.rowItemsCenter, Styles.w90]}>
|
||||
<Entypo name="dot-single" size={24} color="black" />
|
||||
<Entypo name="dot-single" size={24} color={colors.text} />
|
||||
<Text style={[Styles.textDefault]} numberOfLines={1} ellipsizeMode='tail'>{division.name}</Text>
|
||||
</View>
|
||||
))
|
||||
@@ -330,7 +334,7 @@ export default function EditAnnouncement() {
|
||||
<DrawerBottom animation="slide" isVisible={isModalFile} setVisible={setModalFile} title="Menu">
|
||||
<View style={Styles.rowItemsCenter}>
|
||||
<MenuItemRow
|
||||
icon={<Ionicons name="trash" color="black" size={25} />}
|
||||
icon={<Ionicons name="trash" color={colors.text} size={25} />}
|
||||
title="Hapus"
|
||||
onPress={() => { deleteFile(indexDelFile.id, indexDelFile.cat) }}
|
||||
/>
|
||||
|
||||
@@ -6,6 +6,7 @@ import { ColorsStatus } from "@/constants/ColorsStatus";
|
||||
import Styles from "@/constants/Styles";
|
||||
import { apiGetAnnouncement } from "@/lib/api";
|
||||
import { useAuthSession } from "@/providers/AuthProvider";
|
||||
import { useTheme } from "@/providers/ThemeProvider";
|
||||
import { MaterialIcons } from "@expo/vector-icons";
|
||||
import { router } from "expo-router";
|
||||
import { useEffect, useState } from "react";
|
||||
@@ -22,6 +23,7 @@ type Props = {
|
||||
|
||||
export default function Announcement() {
|
||||
const { token, decryptToken } = useAuthSession()
|
||||
const { colors } = useTheme();
|
||||
const [data, setData] = useState<Props[]>([])
|
||||
const [search, setSearch] = useState('')
|
||||
const update = useSelector((state: any) => state.announcementUpdate)
|
||||
@@ -83,7 +85,7 @@ export default function Announcement() {
|
||||
})
|
||||
|
||||
return (
|
||||
<View style={[Styles.p15, { flex: 1 }]}>
|
||||
<View style={[Styles.p15, { flex: 1, backgroundColor: colors.background }]}>
|
||||
<View>
|
||||
<InputSearch onChange={setSearch} />
|
||||
</View>
|
||||
@@ -127,6 +129,7 @@ export default function Announcement() {
|
||||
<RefreshControl
|
||||
refreshing={refreshing}
|
||||
onRefresh={handleRefresh}
|
||||
tintColor={colors.primary}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user