feat: redesign halaman create project dan task divisi dengan section card

- Ganti ButtonSelect dengan section card (Tanggal & Tugas, File, Anggota)
- Tiap card: header pressable dengan icon, badge count, chevron, dan preview isi
- Background item list (file & anggota) dibuat transparan (hanya border)
- Badge file seragam dengan badge tugas dan orang
- Tambah prop showTitle pada SectionListAddTask
- Ekstrak inline style ke Styles.ts: sectionActionRow, sectionBadge, positionBadge, listItemCard

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/project/sectionListAddTask.tsx

@@ -10,7 +10,7 @@ import ItemSectionTanggalTugas from "../itemSectionTanggalTugas";
 import MenuItemRow from "../menuItemRow";
 import Text from "../Text";
 
-export default function SectionListAddTask() {
+export default function SectionListAddTask({ showTitle = true }: { showTitle?: boolean }) {
    const { colors } = useTheme();
    const taskCreate = useSelector((state: any) => state.taskCreate)
    const [select, setSelect] = useState<any>(null)
@@ -22,39 +22,32 @@ export default function SectionListAddTask() {
       setModal(false)
    }
 
+   const items = taskCreate.map((item: { status: number; title: string; dateStart: string; dateEnd: string; }, index: Key | null | undefined) => (
+      <ItemSectionTanggalTugas
+         key={index}
+         title={item.title}
+         dateStart={item.dateStart}
+         dateEnd={item.dateEnd}
+         onPress={() => {
+            setSelect(index)
+            setModal(true)
+         }}
+      />
+   ))
+
    return (
       <>
-         {
-            taskCreate.length > 0
-            &&
+         {taskCreate.length > 0 && (
             <>
-               <View style={[Styles.mb15, Styles.mt10]}>
-                  <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>
-                     Tanggal & Tugas
-                  </Text>
-                  {
-                     taskCreate.map((item: { status: number; title: string; dateStart: string; dateEnd: string; }, index: Key | null | undefined) => {
-                        return (
-                           <ItemSectionTanggalTugas
-                              key={index}
-                              title={item.title}
-                              dateStart={item.dateStart}
-                              dateEnd={item.dateEnd}
-                              onPress={() => {
-                                 setSelect(index)
-                                 setModal(true)
-                              }}
-                           />
-                        );
-                     })
-                  }
-               </View>
-               <DrawerBottom
-                  animation="slide"
-                  isVisible={isModal}
-                  setVisible={setModal}
-                  title="Menu"
-               >
+               {showTitle ? (
+                  <View style={[Styles.mb15, Styles.mt10]}>
+                     <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
+                     {items}
+                  </View>
+               ) : (
+                  <View>{items}</View>
+               )}
+               <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
                   <View style={Styles.rowItemsCenter}>
                      <MenuItemRow
                         icon={<Ionicons name="trash-outline" color={colors.text} size={25} />}
@@ -64,7 +57,7 @@ export default function SectionListAddTask() {
                   </View>
                </DrawerBottom>
             </>
-         }
+         )}
       </>
    )
 }