upd: dokumen divisi

Deskripsi;
- ui modal salin dan pindah file
- button on bottom

No Issues

app/(application)/division/[id]/(fitur-division)/discussion/[detail]/index.tsx

@@ -135,7 +135,7 @@ export default function DiscussionDetail() {
                   </View>
                </View>
             </ScrollView>
-            <View style={[Styles.ph15, { position: 'absolute', bottom: 0, backgroundColor: '#f4f4f4' }]}>
+            <View style={[Styles.ph15, Styles.absolute0, { backgroundColor: '#f4f4f4' }]}>
                <InputForm
                   bg="white"
                   type="default"

app/(application)/division/[id]/(fitur-division)/document/index.tsx

@@ -31,7 +31,7 @@ export default function DocumentDivision() {
          />
          <ScrollView style={{ height: '100%' }}>
             <View style={[Styles.p15, Styles.mb100]}>
-               <View style={{ flexDirection: 'row', alignItems: 'center' }}>
+               <View style={[Styles.rowItemsCenter]}>
                   <Text> home </Text>
                   <AntDesign name="right" style={[Styles.mh05, Styles.mt02]} />
                   <Text> folder 1 </Text>

components/document/menuBottomSelectDocument.tsx

@@ -12,6 +12,7 @@ import ItemDetailMember from "../itemDetailMember";
 import MenuItemRow from "../menuItemRow";
 import ModalFloat from "../modalFloat";
 import ModalSelectMultiple from "../modalSelectMultiple";
+import ModalSalinMove from "./modalSalinMove";
 
 
 type Props = {
@@ -23,12 +24,20 @@ export default function MenuBottomSelectDocument({ onDone }: Props) {
    const [isInformasi, setInformasi] = useState(false)
    const [isRename, setRename] = useState(false)
    const [isShare, setShare] = useState(false)
+   const [isMoveCopy, setMoveCopy] = useState(false)
+   const [valMoveCopy, setValMoveCopy] = useState<'move' | 'copy'>('copy')
    const open = useSharedValue(false)
 
    const onPress = () => {
       open.value = !open.value;
    };
 
+   function handleMoveCopy(val: 'copy' | 'move') {
+      setValMoveCopy(val)
+      setModal(false)
+      setMoveCopy(true)
+   }
+
 
    return (
       <>
@@ -97,12 +106,12 @@ export default function MenuBottomSelectDocument({ onDone }: Props) {
                <MenuItemRow
                   icon={<MaterialCommunityIcons name="folder-move-outline" color="black" size={25} />}
                   title="Pindah"
-                  onPress={() => { }}
+                  onPress={() => { handleMoveCopy('move') }}
                />
                <MenuItemRow
                   icon={<MaterialCommunityIcons name="folder-multiple-outline" color="black" size={25} />}
                   title="Salin"
-                  onPress={() => { }}
+                  onPress={() => { handleMoveCopy('copy') }}
                />
                <MenuItemRow
                   icon={<MaterialCommunityIcons name="information-variant" color="black" size={25} />}
@@ -197,7 +206,9 @@ export default function MenuBottomSelectDocument({ onDone }: Props) {
             onSelect={() => {
                ToastAndroid.show('Success', ToastAndroid.SHORT)
                setShare(false)
-            }} />
+            }}
+         />
+         <ModalSalinMove open={isMoveCopy} close={setMoveCopy} category={valMoveCopy} />
       </>
    )
 }

components/document/modalSalinMove.tsx

@@ -0,0 +1,51 @@
+import Styles from "@/constants/Styles"
+import { AntDesign, Ionicons } from "@expo/vector-icons"
+import { Pressable, Text, View } from "react-native"
+import BorderBottomItem from "../borderBottomItem"
+import DrawerBottom from "../drawerBottom"
+
+type Props = {
+   open: boolean
+   close: (value: boolean) => void
+   category: 'copy' | 'move'
+}
+
+export default function ModalSalinMove({ open, close, category, }: Props) {
+   return (
+      <DrawerBottom animation="slide" isVisible={open} setVisible={close} title={category == 'copy' ? 'Pilih Lokasi Salin' : 'Pilih Lokasi Pemindahan'} height={75}>
+         <View style={[Styles.rowItemsCenter, Styles.mv05]}>
+            <Text> home </Text>
+            <AntDesign name="right" style={[Styles.mh05, Styles.mt02]} />
+            <Text> folder 1 </Text>
+         </View>
+         <View>
+            <BorderBottomItem
+               borderType="bottom"
+               icon={<Ionicons name="folder-open-sharp" color={'#f9cc40'} size={30} />}
+               title="Folder 1"
+               titleWeight="normal"
+            />
+            <BorderBottomItem
+               borderType="bottom"
+               icon={<Ionicons name="folder-open-sharp" color={'#f9cc40'} size={30} />}
+               title="Folder 2"
+               titleWeight="normal"
+            />
+            <BorderBottomItem
+               borderType="bottom"
+               icon={<Ionicons name="folder-open-sharp" color={'#f9cc40'} size={30} />}
+               title="Folder 3"
+               titleWeight="normal"
+            />
+         </View>
+         <View style={[Styles.rowOnly, Styles.mt15, Styles.absolute0]}>
+            <Pressable style={[Styles.pv05, Styles.borderRight, { width: '50%' }]} onPress={() => { close }}>
+               <Text style={[Styles.textDefaultSemiBold, { textAlign: 'center' }]}>BATAL</Text>
+            </Pressable>
+            <Pressable style={[Styles.pv05, { width: '50%' }]} onPress={() => { }}>
+               <Text style={[Styles.textDefaultSemiBold, { textAlign: 'center' }]}>{category == 'copy' ? 'SALIN' : 'PINDAH'}</Text>
+            </Pressable>
+         </View>
+      </DrawerBottom>
+   )
+}

components/modalSelectMultiple.tsx

@@ -44,7 +44,9 @@ export default function ModalSelectMultiple({ open, close, title, category, choo
                   <></>
             }
          </View>
+         <View style={[Styles.absolute0, { width: '100%' }]}>
             <ButtonForm text="Simpan" onPress={() => { onSelect([{ val: 'dinas', label: 'Dinas' }]) }} />
+         </View>
       </DrawerBottom>
    )
 }

constants/Styles.ts

@@ -413,7 +413,7 @@ const Styles = StyleSheet.create({
       paddingVertical: 10
    },
    contentContainer: {
-      height: '80%'
+      height: '90%'
    },
    modalContentNew: {
       width: '100%',
@@ -421,7 +421,7 @@ const Styles = StyleSheet.create({
       borderTopRightRadius: 18,
       borderTopLeftRadius: 18,
       paddingTop: 5,
-      paddingBottom: 20,
+      paddingBottom: 5,
       paddingHorizontal: 20
    },
    titleContainerNew: {
@@ -487,6 +487,30 @@ const Styles = StyleSheet.create({
       display: 'flex',
       alignItems: 'center',
    },
+   borderRight: {
+      borderRightWidth: 1,
+      borderRightColor: '#d6d8f6'
+   },
+   borderLeft: {
+      borderLeftWidth: 1,
+      borderLeftColor: '#d6d8f6'
+   },
+   borderBottom: {
+      borderBottomWidth: 1,
+      borderBottomColor: '#d6d8f6'
+   },
+   borderTop: {
+      borderTopWidth: 1,
+      borderTopColor: '#d6d8f6'
+   },
+   borderAll: {
+      borderWidth: 1,
+      borderColor: '#d6d8f6'
+   },
+   absolute0: {
+      position: 'absolute',
+      bottom: 0
+   }
 })
 
 export default Styles;