upd: text input area

Deskripsi>;
- update tambah dan edit deskripsi pengumuman
- update tambah dan edit deskripsi divisi

No Issues

app/(application)/announcement/create.tsx

@@ -10,7 +10,7 @@ import { useAuthSession } from "@/providers/AuthProvider";
 import { Entypo } from "@expo/vector-icons";
 import { router, Stack } from "expo-router";
 import { useEffect, useState } from "react";
-import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import { SafeAreaView, ScrollView, StyleSheet, Text, ToastAndroid, View } from "react-native";
 import { useDispatch, useSelector } from "react-redux";
 
 export default function CreateAnnouncement() {
@@ -123,6 +123,7 @@ export default function CreateAnnouncement() {
                   error={error.desc}
                   errorText="Pengumuman harus diisi"
                   onChange={(val) => validationForm("desc", val)}
+                  multiline
                />
                <ButtonSelect
                   value="Pilih divisi penerima pengumuman"
@@ -171,3 +172,16 @@ export default function CreateAnnouncement() {
       </SafeAreaView>
    );
 }
+
+const styles = StyleSheet.create({
+   container: {
+      padding: 20,
+   },
+   textArea: {
+      height: 100, // Or use flex-based sizing
+      borderColor: 'gray',
+      borderWidth: 1,
+      padding: 10,
+      textAlignVertical: 'top', // Important for Android to align text at the top
+   },
+});

app/(application)/announcement/edit/[id].tsx

@@ -168,6 +168,7 @@ export default function EditAnnouncement() {
                   errorText="Pengumuman harus diisi"
                   onChange={(val) => validationForm("desc", val)}
                   value={dataForm.desc}
+                  multiline
                />
                <ButtonSelect
                   value="Pilih divisi penerima pengumuman"

app/(application)/division/[id]/edit.tsx

@@ -106,6 +106,7 @@ export default function EditDivision() {
                   onChange={(value) => {
                      setData({ ...data, desc: value })
                   }}
+                  multiline
                />
             </View>
          </ScrollView>

app/(application)/division/create.tsx

@@ -118,6 +118,7 @@ export default function CreateDivision() {
                   placeholder="Deskripsi Divisi"
                   value={dataForm.desc}
                   onChange={(val) => setDataForm({ ...dataForm, desc: val })}
+                  multiline
                />
             </View>
          </ScrollView>

components/inputForm.tsx

@@ -17,10 +17,11 @@ type Props = {
    bg?: 'white' | 'transparent'
    value?: string
    disable?: boolean
+   multiline?: boolean
 };
 
 
-export function InputForm({ label, value, placeholder, onChange, info, disable, error, errorText, required, itemLeft, itemRight, type, round, width, bg }: Props) {
+export function InputForm({ label, value, placeholder, onChange, info, disable, error, errorText, required, itemLeft, itemRight, type, round, width, bg, multiline }: Props) {
    const lebar = Dimensions.get("window").width;
 
    if (itemLeft != undefined || itemRight != undefined) {
@@ -68,9 +69,11 @@ export function InputForm({ label, value, placeholder, onChange, info, disable,
             value={value}
             placeholder={placeholder}
             keyboardType={type}
-            style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }, { color: 'black' }]}
+            style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }, { color: 'black' }, multiline && { height: 100, textAlignVertical: 'top' }]}
             onChangeText={onChange}
             placeholderTextColor={'gray'}
+            multiline={multiline}
+            numberOfLines={multiline ? 4 : undefined}
          />
          {error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
          {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cGray]}>{info}</Text>)}