Merge pull request #12 from bipproduction/amalia/13-mar-25

Amalia/13 mar 25

android/.gitignore

@@ -0,0 +1,16 @@
+# OSX
+#
+.DS_Store
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+.cxx/
+
+# Bundle artifacts
+*.jsbundle

android/app/build.gradle

@@ -0,0 +1,176 @@
+apply plugin: "com.android.application"
+apply plugin: "org.jetbrains.kotlin.android"
+apply plugin: "com.facebook.react"
+
+def projectRoot = rootDir.getAbsoluteFile().getParentFile().getAbsolutePath()
+
+/**
+ * This is the configuration block to customize your React Native Android app.
+ * By default you don't need to apply any configuration, just uncomment the lines you need.
+ */
+react {
+    entryFile = file(["node", "-e", "require('expo/scripts/resolveAppEntry')", projectRoot, "android", "absolute"].execute(null, rootDir).text.trim())
+    reactNativeDir = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
+    hermesCommand = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/sdks/hermesc/%OS-BIN%/hermesc"
+    codegenDir = new File(["node", "--print", "require.resolve('@react-native/codegen/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
+
+    // Use Expo CLI to bundle the app, this ensures the Metro config
+    // works correctly with Expo projects.
+    cliFile = new File(["node", "--print", "require.resolve('@expo/cli', { paths: [require.resolve('expo/package.json')] })"].execute(null, rootDir).text.trim())
+    bundleCommand = "export:embed"
+
+    /* Folders */
+     //   The root of your project, i.e. where "package.json" lives. Default is '../..'
+    // root = file("../../")
+    //   The folder where the react-native NPM package is. Default is ../../node_modules/react-native
+    // reactNativeDir = file("../../node_modules/react-native")
+    //   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen
+    // codegenDir = file("../../node_modules/@react-native/codegen")
+
+    /* Variants */
+    //   The list of variants to that are debuggable. For those we're going to
+    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.
+    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
+    // debuggableVariants = ["liteDebug", "prodDebug"]
+
+    /* Bundling */
+    //   A list containing the node command and its flags. Default is just 'node'.
+    // nodeExecutableAndArgs = ["node"]
+
+    //
+    //   The path to the CLI configuration file. Default is empty.
+    // bundleConfig = file(../rn-cli.config.js)
+    //
+    //   The name of the generated asset file containing your JS bundle
+    // bundleAssetName = "MyApplication.android.bundle"
+    //
+    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
+    // entryFile = file("../js/MyApplication.android.js")
+    //
+    //   A list of extra flags to pass to the 'bundle' commands.
+    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
+    // extraPackagerArgs = []
+
+    /* Hermes Commands */
+    //   The hermes compiler command to run. By default it is 'hermesc'
+    // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
+    //
+    //   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
+    // hermesFlags = ["-O", "-output-source-map"]
+
+    /* Autolinking */
+    autolinkLibrariesWithApp()
+}
+
+/**
+ * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
+ */
+def enableProguardInReleaseBuilds = (findProperty('android.enableProguardInReleaseBuilds') ?: false).toBoolean()
+
+/**
+ * The preferred build flavor of JavaScriptCore (JSC)
+ *
+ * For example, to use the international variant, you can use:
+ * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ *
+ * The international variant includes ICU i18n library and necessary data
+ * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
+ * give correct results when using with locales other than en-US. Note that
+ * this variant is about 6MiB larger per architecture than default.
+ */
+def jscFlavor = 'org.webkit:android-jsc:+'
+
+android {
+    ndkVersion rootProject.ext.ndkVersion
+
+    buildToolsVersion rootProject.ext.buildToolsVersion
+    compileSdk rootProject.ext.compileSdkVersion
+
+    namespace 'mobiledarmasaba.app'
+    defaultConfig {
+        applicationId 'mobiledarmasaba.app'
+        minSdkVersion rootProject.ext.minSdkVersion
+        targetSdkVersion rootProject.ext.targetSdkVersion
+        versionCode 1
+        versionName "1.0.0"
+    }
+    signingConfigs {
+        debug {
+            storeFile file('debug.keystore')
+            storePassword 'android'
+            keyAlias 'androiddebugkey'
+            keyPassword 'android'
+        }
+    }
+    buildTypes {
+        debug {
+            signingConfig signingConfigs.debug
+        }
+        release {
+            // Caution! In production, you need to generate your own keystore file.
+            // see https://reactnative.dev/docs/signed-apk-android.
+            signingConfig signingConfigs.debug
+            shrinkResources (findProperty('android.enableShrinkResourcesInReleaseBuilds')?.toBoolean() ?: false)
+            minifyEnabled enableProguardInReleaseBuilds
+            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
+            crunchPngs (findProperty('android.enablePngCrunchInReleaseBuilds')?.toBoolean() ?: true)
+        }
+    }
+    packagingOptions {
+        jniLibs {
+            useLegacyPackaging (findProperty('expo.useLegacyPackaging')?.toBoolean() ?: false)
+        }
+    }
+    androidResources {
+        ignoreAssetsPattern '!.svn:!.git:!.ds_store:!*.scc:!CVS:!thumbs.db:!picasa.ini:!*~'
+    }
+}
+
+// Apply static values from `gradle.properties` to the `android.packagingOptions`
+// Accepts values in comma delimited lists, example:
+// android.packagingOptions.pickFirsts=/LICENSE,**/picasa.ini
+["pickFirsts", "excludes", "merges", "doNotStrip"].each { prop ->
+    // Split option: 'foo,bar' -> ['foo', 'bar']
+    def options = (findProperty("android.packagingOptions.$prop") ?: "").split(",");
+    // Trim all elements in place.
+    for (i in 0..<options.size()) options[i] = options[i].trim();
+    // `[] - ""` is essentially `[""].filter(Boolean)` removing all empty strings.
+    options -= ""
+
+    if (options.length > 0) {
+        println "android.packagingOptions.$prop += $options ($options.length)"
+        // Ex: android.packagingOptions.pickFirsts += '**/SCCS/**'
+        options.each {
+            android.packagingOptions[prop] += it
+        }
+    }
+}
+
+dependencies {
+    // The version of react-native is set by the React Native Gradle Plugin
+    implementation("com.facebook.react:react-android")
+
+    def isGifEnabled = (findProperty('expo.gif.enabled') ?: "") == "true";
+    def isWebpEnabled = (findProperty('expo.webp.enabled') ?: "") == "true";
+    def isWebpAnimatedEnabled = (findProperty('expo.webp.animated') ?: "") == "true";
+
+    if (isGifEnabled) {
+        // For animated gif support
+        implementation("com.facebook.fresco:animated-gif:${reactAndroidLibs.versions.fresco.get()}")
+    }
+
+    if (isWebpEnabled) {
+        // For webp support
+        implementation("com.facebook.fresco:webpsupport:${reactAndroidLibs.versions.fresco.get()}")
+        if (isWebpAnimatedEnabled) {
+            // Animated webp support
+            implementation("com.facebook.fresco:animated-webp:${reactAndroidLibs.versions.fresco.get()}")
+        }
+    }
+
+    if (hermesEnabled.toBoolean()) {
+        implementation("com.facebook.react:hermes-android")
+    } else {
+        implementation jscFlavor
+    }
+}

android/app/proguard-rules.pro

@@ -0,0 +1,14 @@
+# Add project specific ProGuard rules here.
+# By default, the flags in this file are appended to flags specified
+# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
+# You can edit the include path and order by changing the proguardFiles
+# directive in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# react-native-reanimated
+-keep class com.swmansion.reanimated.** { *; }
+-keep class com.facebook.react.turbomodule.** { *; }
+
+# Add any project specific keep options here:

android/app/src/debug/AndroidManifest.xml

@@ -0,0 +1,7 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+
+    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" tools:replace="android:usesCleartextTraffic" />
+</manifest>

android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,33 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
+  <uses-permission android:name="android.permission.INTERNET"/>
+  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+  <uses-permission android:name="android.permission.RECORD_AUDIO"/>
+  <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+  <uses-permission android:name="android.permission.VIBRATE"/>
+  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
+  <queries>
+    <intent>
+      <action android:name="android.intent.action.VIEW"/>
+      <category android:name="android.intent.category.BROWSABLE"/>
+      <data android:scheme="https"/>
+    </intent>
+  </queries>
+  <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true" android:requestLegacyExternalStorage="true">
+    <meta-data android:name="expo.modules.updates.ENABLED" android:value="false"/>
+    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH" android:value="ALWAYS"/>
+    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS" android:value="0"/>
+    <activity android:name=".MainActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:exported="true" android:screenOrientation="portrait">
+      <intent-filter>
+        <action android:name="android.intent.action.MAIN"/>
+        <category android:name="android.intent.category.LAUNCHER"/>
+      </intent-filter>
+      <intent-filter>
+        <action android:name="android.intent.action.VIEW"/>
+        <category android:name="android.intent.category.DEFAULT"/>
+        <category android:name="android.intent.category.BROWSABLE"/>
+        <data android:scheme="myapp"/>
+        <data android:scheme="mobiledarmasaba.app"/>
+      </intent-filter>
+    </activity>
+  </application>
+</manifest>

android/app/src/main/java/mobiledarmasaba/app/MainActivity.kt

@@ -0,0 +1,65 @@
+package mobiledarmasaba.app
+import expo.modules.splashscreen.SplashScreenManager
+
+import android.os.Build
+import android.os.Bundle
+
+import com.facebook.react.ReactActivity
+import com.facebook.react.ReactActivityDelegate
+import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled
+import com.facebook.react.defaults.DefaultReactActivityDelegate
+
+import expo.modules.ReactActivityDelegateWrapper
+
+class MainActivity : ReactActivity() {
+  override fun onCreate(savedInstanceState: Bundle?) {
+    // Set the theme to AppTheme BEFORE onCreate to support
+    // coloring the background, status bar, and navigation bar.
+    // This is required for expo-splash-screen.
+    // setTheme(R.style.AppTheme);
+    // @generated begin expo-splashscreen - expo prebuild (DO NOT MODIFY) sync-f3ff59a738c56c9a6119210cb55f0b613eb8b6af
+    SplashScreenManager.registerOnActivity(this)
+    // @generated end expo-splashscreen
+    super.onCreate(null)
+  }
+
+  /**
+   * Returns the name of the main component registered from JavaScript. This is used to schedule
+   * rendering of the component.
+   */
+  override fun getMainComponentName(): String = "main"
+
+  /**
+   * Returns the instance of the [ReactActivityDelegate]. We use [DefaultReactActivityDelegate]
+   * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]
+   */
+  override fun createReactActivityDelegate(): ReactActivityDelegate {
+    return ReactActivityDelegateWrapper(
+          this,
+          BuildConfig.IS_NEW_ARCHITECTURE_ENABLED,
+          object : DefaultReactActivityDelegate(
+              this,
+              mainComponentName,
+              fabricEnabled
+          ){})
+  }
+
+  /**
+    * Align the back button behavior with Android S
+    * where moving root activities to background instead of finishing activities.
+    * @see <a href="https://developer.android.com/reference/android/app/Activity#onBackPressed()">onBackPressed</a>
+    */
+  override fun invokeDefaultOnBackPressed() {
+      if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.R) {
+          if (!moveTaskToBack(false)) {
+              // For non-root activities, use the default implementation to finish them.
+              super.invokeDefaultOnBackPressed()
+          }
+          return
+      }
+
+      // Use the default back button implementation on Android S
+      // because it's doing more than [Activity.moveTaskToBack] in fact.
+      super.invokeDefaultOnBackPressed()
+  }
+}

android/app/src/main/java/mobiledarmasaba/app/MainApplication.kt

@@ -0,0 +1,57 @@
+package mobiledarmasaba.app
+
+import android.app.Application
+import android.content.res.Configuration
+
+import com.facebook.react.PackageList
+import com.facebook.react.ReactApplication
+import com.facebook.react.ReactNativeHost
+import com.facebook.react.ReactPackage
+import com.facebook.react.ReactHost
+import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load
+import com.facebook.react.defaults.DefaultReactNativeHost
+import com.facebook.react.soloader.OpenSourceMergedSoMapping
+import com.facebook.soloader.SoLoader
+
+import expo.modules.ApplicationLifecycleDispatcher
+import expo.modules.ReactNativeHostWrapper
+
+class MainApplication : Application(), ReactApplication {
+
+  override val reactNativeHost: ReactNativeHost = ReactNativeHostWrapper(
+        this,
+        object : DefaultReactNativeHost(this) {
+          override fun getPackages(): List<ReactPackage> {
+            val packages = PackageList(this).packages
+            // Packages that cannot be autolinked yet can be added manually here, for example:
+            // packages.add(new MyReactNativePackage());
+            return packages
+          }
+
+          override fun getJSMainModuleName(): String = ".expo/.virtual-metro-entry"
+
+          override fun getUseDeveloperSupport(): Boolean = BuildConfig.DEBUG
+
+          override val isNewArchEnabled: Boolean = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED
+          override val isHermesEnabled: Boolean = BuildConfig.IS_HERMES_ENABLED
+      }
+  )
+
+  override val reactHost: ReactHost
+    get() = ReactNativeHostWrapper.createReactHost(applicationContext, reactNativeHost)
+
+  override fun onCreate() {
+    super.onCreate()
+    SoLoader.init(this, OpenSourceMergedSoMapping)
+    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+      // If you opted-in for the New Architecture, we load the native entry point for this app.
+      load()
+    }
+    ApplicationLifecycleDispatcher.onApplicationCreate(this)
+  }
+
+  override fun onConfigurationChanged(newConfig: Configuration) {
+    super.onConfigurationChanged(newConfig)
+    ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
+  }
+}

android/app/src/main/res/drawable/ic_launcher_background.xml

@@ -0,0 +1,6 @@
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+  <item android:drawable="@color/splashscreen_background"/>
+  <item>
+    <bitmap android:gravity="center" android:src="@drawable/splashscreen_logo"/>
+  </item>
+</layer-list>

android/app/src/main/res/drawable/rn_edit_text_material.xml

@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<inset xmlns:android="http://schemas.android.com/apk/res/android"
+       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
+       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
+       android:insetTop="@dimen/abc_edit_text_inset_top_material"
+       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material"
+       >
+
+    <selector>
+        <!--
+          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
+          The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
+          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'
+
+          <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
+
+          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.
+        -->
+        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
+        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
+    </selector>
+
+</inset>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/iconBackground"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/iconBackground"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/values-night/colors.xml

@@ -0,0 +1 @@
+<resources/>

android/app/src/main/res/values/colors.xml

@@ -0,0 +1,6 @@
+<resources>
+  <color name="splashscreen_background">#ffffff</color>
+  <color name="iconBackground">#ffffff</color>
+  <color name="colorPrimary">#023c69</color>
+  <color name="colorPrimaryDark">#ffffff</color>
+</resources>

android/app/src/main/res/values/strings.xml

@@ -0,0 +1,6 @@
+<resources>
+  <string name="app_name">mobile-darmasaba</string>
+  <string name="expo_system_ui_user_interface_style" translatable="false">automatic</string>
+  <string name="expo_splash_screen_resize_mode" translatable="false">contain</string>
+  <string name="expo_splash_screen_status_bar_translucent" translatable="false">false</string>
+</resources>

android/app/src/main/res/values/styles.xml

@@ -0,0 +1,19 @@
+<resources xmlns:tools="http://schemas.android.com/tools">
+  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
+    <item name="android:textColor">@android:color/black</item>
+    <item name="android:editTextStyle">@style/ResetEditText</item>
+    <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
+    <item name="colorPrimary">@color/colorPrimary</item>
+    <item name="android:statusBarColor">#ffffff</item>
+  </style>
+  <style name="ResetEditText" parent="@android:style/Widget.EditText">
+    <item name="android:padding">0dp</item>
+    <item name="android:textColorHint">#c8c8c8</item>
+    <item name="android:textColor">@android:color/black</item>
+  </style>
+  <style name="Theme.App.SplashScreen" parent="Theme.SplashScreen">
+    <item name="windowSplashScreenBackground">@color/splashscreen_background</item>
+    <item name="windowSplashScreenAnimatedIcon">@drawable/splashscreen_logo</item>
+    <item name="postSplashScreenTheme">@style/AppTheme</item>
+  </style>
+</resources>

android/build.gradle

@@ -0,0 +1,41 @@
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+
+buildscript {
+    ext {
+        buildToolsVersion = findProperty('android.buildToolsVersion') ?: '35.0.0'
+        minSdkVersion = Integer.parseInt(findProperty('android.minSdkVersion') ?: '24')
+        compileSdkVersion = Integer.parseInt(findProperty('android.compileSdkVersion') ?: '35')
+        targetSdkVersion = Integer.parseInt(findProperty('android.targetSdkVersion') ?: '34')
+        kotlinVersion = findProperty('android.kotlinVersion') ?: '1.9.25'
+
+        ndkVersion = "26.1.10909125"
+    }
+    repositories {
+        google()
+        mavenCentral()
+    }
+    dependencies {
+        classpath('com.android.tools.build:gradle')
+        classpath('com.facebook.react:react-native-gradle-plugin')
+        classpath('org.jetbrains.kotlin:kotlin-gradle-plugin')
+    }
+}
+
+apply plugin: "com.facebook.react.rootproject"
+
+allprojects {
+    repositories {
+        maven {
+            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
+            url(new File(['node', '--print', "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), '../android'))
+        }
+        maven {
+            // Android JSC is installed from npm
+            url(new File(['node', '--print', "require.resolve('jsc-android/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim(), '../dist'))
+        }
+
+        google()
+        mavenCentral()
+        maven { url 'https://www.jitpack.io' }
+    }
+}

android/gradle.properties

@@ -0,0 +1,56 @@
+# Project-wide Gradle settings.
+
+# IDE (e.g. Android Studio) users:
+# Gradle settings configured through the IDE *will override*
+# any settings specified in this file.
+
+# For more details on how to configure your build environment visit
+# http://www.gradle.org/docs/current/userguide/build_environment.html
+
+# Specifies the JVM arguments used for the daemon process.
+# The setting is particularly useful for tweaking memory settings.
+# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
+org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
+
+# When configured, Gradle will run in incubating parallel mode.
+# This option should only be used with decoupled projects. More details, visit
+# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
+# org.gradle.parallel=true
+
+# AndroidX package structure to make it clearer which packages are bundled with the
+# Android operating system, and which are packaged with your app's APK
+# https://developer.android.com/topic/libraries/support-library/androidx-rn
+android.useAndroidX=true
+
+# Enable AAPT2 PNG crunching
+android.enablePngCrunchInReleaseBuilds=true
+
+# Use this property to specify which architecture you want to build.
+# You can also override it from the CLI using
+# ./gradlew <task> -PreactNativeArchitectures=x86_64
+reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
+
+# Use this property to enable support to the new architecture.
+# This will allow you to use TurboModules and the Fabric render in
+# your application. You should enable this flag either if you want
+# to write custom TurboModules/Fabric components OR use libraries that
+# are providing them.
+newArchEnabled=true
+
+# Use this property to enable or disable the Hermes JS engine.
+# If set to false, you will be using JSC instead.
+hermesEnabled=true
+
+# Enable GIF support in React Native images (~200 B increase)
+expo.gif.enabled=true
+# Enable webp support in React Native images (~85 KB increase)
+expo.webp.enabled=true
+# Enable animated webp support (~3.4 MB increase)
+# Disabled by default because iOS doesn't support animated webp
+expo.webp.animated=false
+
+# Enable network inspector
+EX_DEV_CLIENT_NETWORK_INSPECTOR=true
+
+# Use legacy packaging to compress native libraries in the resulting APK.
+expo.useLegacyPackaging=false

android/gradle/wrapper/gradle-wrapper.properties

@@ -0,0 +1,7 @@
+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-all.zip
+networkTimeout=10000
+validateDistributionUrl=true
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

android/gradlew

@@ -0,0 +1,252 @@
+#!/bin/sh
+
+#
+# Copyright © 2015-2021 the original authors.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      https://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+# SPDX-License-Identifier: Apache-2.0
+#
+
+##############################################################################
+#
+#   Gradle start up script for POSIX generated by Gradle.
+#
+#   Important for running:
+#
+#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
+#       noncompliant, but you have some other compliant shell such as ksh or
+#       bash, then to run this script, type that shell name before the whole
+#       command line, like:
+#
+#           ksh Gradle
+#
+#       Busybox and similar reduced shells will NOT work, because this script
+#       requires all of these POSIX shell features:
+#         * functions;
+#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
+#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
+#         * compound commands having a testable exit status, especially «case»;
+#         * various built-in commands including «command», «set», and «ulimit».
+#
+#   Important for patching:
+#
+#   (2) This script targets any POSIX shell, so it avoids extensions provided
+#       by Bash, Ksh, etc; in particular arrays are avoided.
+#
+#       The "traditional" practice of packing multiple parameters into a
+#       space-separated string is a well documented source of bugs and security
+#       problems, so this is (mostly) avoided, by progressively accumulating
+#       options in "$@", and eventually passing that to Java.
+#
+#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
+#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
+#       see the in-line comments for details.
+#
+#       There are tweaks for specific operating systems such as AIX, CygWin,
+#       Darwin, MinGW, and NonStop.
+#
+#   (3) This script is generated from the Groovy template
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       within the Gradle project.
+#
+#       You can find Gradle at https://github.com/gradle/gradle/.
+#
+##############################################################################
+
+# Attempt to set APP_HOME
+
+# Resolve links: $0 may be a link
+app_path=$0
+
+# Need this for daisy-chained symlinks.
+while
+    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
+    [ -h "$app_path" ]
+do
+    ls=$( ls -ld "$app_path" )
+    link=${ls#*' -> '}
+    case $link in             #(
+      /*)   app_path=$link ;; #(
+      *)    app_path=$APP_HOME$link ;;
+    esac
+done
+
+# This is normally unused
+# shellcheck disable=SC2034
+APP_BASE_NAME=${0##*/}
+# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
+' "$PWD" ) || exit
+
+# Use the maximum available, or set MAX_FD != -1 to use that value.
+MAX_FD=maximum
+
+warn () {
+    echo "$*"
+} >&2
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+} >&2
+
+# OS specific support (must be 'true' or 'false').
+cygwin=false
+msys=false
+darwin=false
+nonstop=false
+case "$( uname )" in                #(
+  CYGWIN* )         cygwin=true  ;; #(
+  Darwin* )         darwin=true  ;; #(
+  MSYS* | MINGW* )  msys=true    ;; #(
+  NONSTOP* )        nonstop=true ;;
+esac
+
+CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+
+
+# Determine the Java command to use to start the JVM.
+if [ -n "$JAVA_HOME" ] ; then
+    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
+        # IBM's JDK on AIX uses strange locations for the executables
+        JAVACMD=$JAVA_HOME/jre/sh/java
+    else
+        JAVACMD=$JAVA_HOME/bin/java
+    fi
+    if [ ! -x "$JAVACMD" ] ; then
+        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+else
+    JAVACMD=java
+    if ! command -v java >/dev/null 2>&1
+    then
+        die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+fi
+
+# Increase the maximum file descriptors if we can.
+if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
+    case $MAX_FD in #(
+      max*)
+        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC2039,SC3045
+        MAX_FD=$( ulimit -H -n ) ||
+            warn "Could not query maximum file descriptor limit"
+    esac
+    case $MAX_FD in  #(
+      '' | soft) :;; #(
+      *)
+        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
+        # shellcheck disable=SC2039,SC3045
+        ulimit -n "$MAX_FD" ||
+            warn "Could not set maximum file descriptor limit to $MAX_FD"
+    esac
+fi
+
+# Collect all arguments for the java command, stacking in reverse order:
+#   * args from the command line
+#   * the main class name
+#   * -classpath
+#   * -D...appname settings
+#   * --module-path (only if needed)
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
+
+# For Cygwin or MSYS, switch paths to Windows format before running java
+if "$cygwin" || "$msys" ; then
+    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
+    CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
+
+    JAVACMD=$( cygpath --unix "$JAVACMD" )
+
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    for arg do
+        if
+            case $arg in                                #(
+              -*)   false ;;                            # don't mess with options #(
+              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
+                    [ -e "$t" ] ;;                      #(
+              *)    false ;;
+            esac
+        then
+            arg=$( cygpath --path --ignore --mixed "$arg" )
+        fi
+        # Roll the args list around exactly as many times as the number of
+        # args, so each arg winds up back in the position where it started, but
+        # possibly modified.
+        #
+        # NB: a `for` loop captures its iteration list before it begins, so
+        # changing the positional parameters here affects neither the number of
+        # iterations, nor the values presented in `arg`.
+        shift                   # remove old arg
+        set -- "$@" "$arg"      # push replacement arg
+    done
+fi
+
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Collect all arguments for the java command:
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
+#     and any embedded shellness will be escaped.
+#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
+#     treated as '${Hostname}' itself on the command line.
+
+set -- \
+        "-Dorg.gradle.appname=$APP_BASE_NAME" \
+        -classpath "$CLASSPATH" \
+        org.gradle.wrapper.GradleWrapperMain \
+        "$@"
+
+# Stop when "xargs" is not available.
+if ! command -v xargs >/dev/null 2>&1
+then
+    die "xargs is not available"
+fi
+
+# Use "xargs" to parse quoted args.
+#
+# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
+#
+# In Bash we could simply go:
+#
+#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
+#   set -- "${ARGS[@]}" "$@"
+#
+# but POSIX shell has neither arrays nor command substitution, so instead we
+# post-process each arg (as a line of input to sed) to backslash-escape any
+# character that might be a shell metacharacter, then use eval to reverse
+# that process (while maintaining the separation between arguments), and wrap
+# the whole thing up as a single "set" statement.
+#
+# This will of course break if any of these variables contains a newline or
+# an unmatched quote.
+#
+
+eval "set -- $(
+        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
+        xargs -n1 |
+        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
+        tr '\n' ' '
+    )" '"$@"'
+
+exec "$JAVACMD" "$@"

android/gradlew.bat

@@ -0,0 +1,94 @@
+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
+
+@if "%DEBUG%"=="" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%"=="" set DIRNAME=.
+@rem This is normally unused
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if %ERRORLEVEL% equ 0 goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto execute
+
+echo. 1>&2
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
+echo. 1>&2
+echo Please set the JAVA_HOME variable in your environment to match the 1>&2
+echo location of your Java installation. 1>&2
+
+goto fail
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
+
+:end
+@rem End local scope for the variables with windows NT shell
+if %ERRORLEVEL% equ 0 goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+set EXIT_CODE=%ERRORLEVEL%
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

android/settings.gradle

@@ -0,0 +1,38 @@
+pluginManagement {
+    includeBuild(new File(["node", "--print", "require.resolve('@react-native/gradle-plugin/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().toString())
+}
+plugins { id("com.facebook.react.settings") }
+
+extensions.configure(com.facebook.react.ReactSettingsExtension) { ex ->
+  if (System.getenv('EXPO_USE_COMMUNITY_AUTOLINKING') == '1') {
+    ex.autolinkLibrariesFromCommand()
+  } else {
+    def command = [
+      'node',
+      '--no-warnings',
+      '--eval',
+      'require(require.resolve(\'expo-modules-autolinking\', { paths: [require.resolve(\'expo/package.json\')] }))(process.argv.slice(1))',
+      'react-native-config',
+      '--json',
+      '--platform',
+      'android'
+    ].toList()
+    ex.autolinkLibrariesFromCommand(command)
+  }
+}
+
+rootProject.name = 'mobile-darmasaba'
+
+dependencyResolutionManagement {
+  versionCatalogs {
+    reactAndroidLibs {
+      from(files(new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), "../gradle/libs.versions.toml")))
+    }
+  }
+}
+
+apply from: new File(["node", "--print", "require.resolve('expo/package.json')"].execute(null, rootDir).text.trim(), "../scripts/autolinking.gradle");
+useExpoModules()
+
+include ':app'
+includeBuild(new File(["node", "--print", "require.resolve('@react-native/gradle-plugin/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile())

app.json

@@ -12,6 +12,7 @@
       "supportsTablet": true
     },
     "android": {
+      "package":"mobiledarmasaba.app",
       "adaptiveIcon": {
         "foregroundImage": "./assets/images/adaptive-icon.png",
         "backgroundColor": "#ffffff"

app/(application)/announcement/create.tsx

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
-import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import ButtonSelect from "@/components/buttonSelect";
 import { InputForm } from "@/components/inputForm";
 import Styles from "@/constants/Styles";
@@ -15,6 +14,10 @@ export default function CreateAnnouncement() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Pengumuman',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
+                  router.push('/announcement')
+               }} />
             }}
          />
          <ScrollView>
@@ -22,7 +25,7 @@ export default function CreateAnnouncement() {
                <InputForm label="Judul" type="default" placeholder="Judul Pengumuman" required />
                <InputForm label="Pengumuman" type="default" placeholder="Deskripsi Pengumuman" required />
                <ButtonSelect value="Pilih divisi penerima pengumuman" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -33,7 +36,7 @@ export default function CreateAnnouncement() {
                            router.push('/announcement')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

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

@@ -1,6 +1,7 @@
 import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
 import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import ButtonSelect from "@/components/buttonSelect"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
@@ -15,6 +16,10 @@ export default function EditAnnouncement() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Pengumuman',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                  router.push('/announcement')
+               }} />
             }}
          />
          <ScrollView>
@@ -22,7 +27,7 @@ export default function EditAnnouncement() {
                <InputForm label="Judul" type="default" placeholder="Judul Pengumuman" required />
                <InputForm label="Pengumuman" type="default" placeholder="Deskripsi Pengumuman" required />
                <ButtonSelect value="Pilih divisi penerima pengumuman" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -33,7 +38,7 @@ export default function EditAnnouncement() {
                            router.push('/announcement')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/banner/[id].tsx

@@ -1,13 +1,12 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import { Entypo } from "@expo/vector-icons"
 import * as ImagePicker from 'expo-image-picker'
 import { router, Stack } from "expo-router"
 import { useState } from "react"
-import { Image, Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
+import { Image, Pressable, SafeAreaView, ScrollView, Text, View } from "react-native"
 
 export default function EditBanner() {
    const [selectedImage, setSelectedImage] = useState<string | undefined>(undefined)
@@ -33,6 +32,7 @@ export default function EditBanner() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Banner',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" />
             }}
          />
          <ScrollView>
@@ -53,8 +53,8 @@ export default function EditBanner() {
                      )
                   }
                </View>
-               <InputForm label="Judul" type="numeric" placeholder="Judul" required />
+               <InputForm label="Judul" type="numeric" placeholder="Judul" required bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -65,7 +65,7 @@ export default function EditBanner() {
                            router.push('/banner')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/banner/create.tsx

@@ -1,13 +1,12 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
-import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import { InputForm } from "@/components/inputForm";
 import Styles from "@/constants/Styles";
 import { Entypo } from "@expo/vector-icons";
 import * as ImagePicker from 'expo-image-picker';
 import { router, Stack } from "expo-router";
 import { useState } from "react";
-import { Image, Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import { Image, Pressable, SafeAreaView, ScrollView, Text, View } from "react-native";
 
 export default function CreateBanner() {
    const [selectedImage, setSelectedImage] = useState<string | undefined>(undefined)
@@ -33,6 +32,7 @@ export default function CreateBanner() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Banner',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" />
             }}
          />
          <ScrollView>
@@ -41,11 +41,11 @@ export default function CreateBanner() {
                   {
                      selectedImage != undefined ? (
                         <Pressable onPress={pickImageAsync}>
-                           <Image src={selectedImage} style={{ resizeMode: 'contain', width: '100%', height:100 }} />
+                           <Image src={selectedImage} style={{ resizeMode: 'contain', width: '100%', height: 100 }} />
                         </Pressable>
                      ) : (
                         <Pressable onPress={pickImageAsync} style={[Styles.wrapPaper, Styles.contentItemCenter]}>
-                           <View style={{justifyContent:'center', alignItems:'center'}}>
+                           <View style={{ justifyContent: 'center', alignItems: 'center' }}>
                               <Entypo name="image" size={50} color={'#aeaeae'} />
                               <Text style={[Styles.textInformation, Styles.mt05]}>Mohon unggah gambar dalam resolusi 1535 x 450 piksel untuk memastikan</Text>
                            </View>
@@ -53,8 +53,8 @@ export default function CreateBanner() {
                      )
                   }
                </View>
-               <InputForm label="Judul" type="numeric" placeholder="Judul" required />
+               <InputForm label="Judul" type="numeric" placeholder="Judul" required bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -65,7 +65,7 @@ export default function CreateBanner() {
                            router.push('/banner')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/discussion/[id].tsx

@@ -23,125 +23,124 @@ export default function DetailDiscussionGeneral() {
             }}
          />
          <View style={{ flex: 1 }}>
-            <View style={{ flex: 5 }}>
+            <ScrollView>
-               <ScrollView>
+               <View style={[Styles.p15, Styles.mb100]}>
-                  <View style={[Styles.p15, Styles.mb100]}>
+                  <BorderBottomItem
+                     borderType="bottom"
+                     icon={
+                        <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
+                           <MaterialIcons name="chat" size={25} color={'#384288'} />
+                        </View>
+                     }
+                     title="Danantara"
+                     subtitle={
+                        <LabelStatus category='success' text='BUKA' size="small" />
+                     }
+                     rightTopInfo="3 Jan 2025"
+                     desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
+                     leftBottomInfo={
+                        <View style={[Styles.rowItemsCenter]}>
+                           <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
+                           <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>15 Komentar</Text>
+                        </View>
+                     }
+                  />
+                  <View style={[Styles.p15]}>
                      <BorderBottomItem
                         borderType="bottom"
                         icon={
-                           <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
+                           <Image
-                              <MaterialIcons name="chat" size={25} color={'#384288'} />
+                              source={require("../../../assets/images/user.jpeg")}
-                           </View>
+                              style={[Styles.userProfileExtraSmall]}
-                        }
+                           />
-                        title="Danantara"
-                        subtitle={
-                           <LabelStatus category='success' text='BUKA' size="small" />
                         }
+                        title="Amalia Dwi"
                         rightTopInfo="3 Jan 2025"
-                        desc="Bagaimana dampak yg dirasakan akibat efisiensi?"
+                        desc="sangat berdampak dari berbagai sisi"
-                        leftBottomInfo={
+                     />
-                           <View style={[Styles.rowItemsCenter]}>
+                     <BorderBottomItem
-                              <Ionicons name="chatbox-ellipses-outline" size={18} color="grey" style={Styles.mr05} />
+                        borderType="bottom"
-                              <Text style={[Styles.textInformation, Styles.cGray, Styles.mb05]}>15 Komentar</Text>
+                        icon={
-                           </View>
+                           <Image
-                        }
+                              source={require("../../../assets/images/user.jpeg")}
+                              style={[Styles.userProfileExtraSmall]}
+                           />
+                        }
+                        title="Amalia Dwi"
+                        rightTopInfo="3 Jan 2025"
+                        desc="semua menjadi terbatas.."
+                     />
+                     <BorderBottomItem
+                        borderType="bottom"
+                        icon={
+                           <Image
+                              source={require("../../../assets/images/user.jpeg")}
+                              style={[Styles.userProfileExtraSmall]}
+                           />
+                        }
+                        title="Amalia Dwi"
+                        rightTopInfo="3 Jan 2025"
+                        desc="semua menjadi terbatas.."
+                     />
+                     <BorderBottomItem
+                        borderType="bottom"
+                        icon={
+                           <Image
+                              source={require("../../../assets/images/user.jpeg")}
+                              style={[Styles.userProfileExtraSmall]}
+                           />
+                        }
+                        title="Amalia Dwi"
+                        rightTopInfo="3 Jan 2025"
+                        desc="semua menjadi terbatas.."
+                     />
+                     <BorderBottomItem
+                        borderType="bottom"
+                        icon={
+                           <Image
+                              source={require("../../../assets/images/user.jpeg")}
+                              style={[Styles.userProfileExtraSmall]}
+                           />
+                        }
+                        title="Amalia Dwi"
+                        rightTopInfo="3 Jan 2025"
+                        desc="semua menjadi terbatas.."
+                     />
+                     <BorderBottomItem
+                        borderType="bottom"
+                        icon={
+                           <Image
+                              source={require("../../../assets/images/user.jpeg")}
+                              style={[Styles.userProfileExtraSmall]}
+                           />
+                        }
+                        title="Amalia Dwi"
+                        rightTopInfo="3 Jan 2025"
+                        desc="semua menjadi terbatas.."
                      />
-                     <View style={[Styles.p15]}>
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="sangat berdampak dari berbagai sisi"
-                        />
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
-                        />
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
-                        />
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
-                        />
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
-                        />
-                        <BorderBottomItem
-                           borderType="bottom"
-                           icon={
-                              <Image
-                                 source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
-                              />
-                           }
-                           title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
-                        />
 
-                        <BorderBottomItem
+                     <BorderBottomItem
-                           borderType="bottom"
+                        borderType="bottom"
-                           icon={
+                        icon={
-                              <Image
+                           <Image
-                                 source={require("../../../assets/images/user.jpeg")}
+                              source={require("../../../assets/images/user.jpeg")}
-                                 style={[Styles.userProfileExtraSmall]}
+                              style={[Styles.userProfileExtraSmall]}
-                              />
+                           />
-                           }
+                        }
-                           title="Amalia Dwi"
+                        title="Amalia Dwi"
-                           rightTopInfo="3 Jan 2025"
+                        rightTopInfo="3 Jan 2025"
-                           desc="semua menjadi terbatas.."
+                        desc="semua menjadi terbatas.."
-                        />
+                     />
 
-                     </View>
                   </View>
-               </ScrollView>
+               </View>
-            </View>
+            </ScrollView>
-            <View style={[Styles.p15, { flex: 1 }]}>
+            <View style={[Styles.ph15, Styles.pv10, { position: 'absolute', bottom: 10 }]}>
                <InputForm
                   type="default"
                   round
                   placeholder="Kirim Komentar"
+                  bg="white"
                   itemRight={
                      <MaterialIcons name="send" size={25} color={'#384288'} />
                   }

app/(application)/discussion/create.tsx

@@ -1,6 +1,7 @@
 import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
 import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import ButtonSelect from "@/components/buttonSelect";
 import { InputForm } from "@/components/inputForm";
 import SelectForm from "@/components/selectForm";
@@ -19,6 +20,10 @@ export default function CreateDiscussionGeneral() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Diskusi',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
+                  router.push('/discussion?active=true')
+               }} />
             }}
          />
          <ScrollView>
@@ -26,8 +31,8 @@ export default function CreateDiscussionGeneral() {
                <SelectForm label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={chooseGroup.label} required onPress={() => { }} />
                <InputForm label="Nama" type="default" placeholder="Nama" required />
                <InputForm label="Diskusi" type="default" placeholder="Hal yang didiskusikan" required />
-               <ButtonSelect value="Pilih Anggota"/>
+               <ButtonSelect value="Pilih Anggota" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -38,7 +43,7 @@ export default function CreateDiscussionGeneral() {
                            router.push('/discussion?active=true')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

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

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import { router, Stack } from "expo-router"
@@ -14,13 +13,17 @@ export default function EditDiscussionGeneral() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Diskusi',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                  router.back()
+               }} />
             }}
          />
          <ScrollView>
             <View style={[Styles.p15]}>
                <InputForm label="Judul" type="default" placeholder="Judul" required />
                <InputForm label="Diskusi" type="default" placeholder="Hal yang didiskusikan" required />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -31,7 +34,7 @@ export default function EditDiscussionGeneral() {
                            router.back()
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/division/[id]/(fitur-division)/calendar/[detail]/edit.tsx

@@ -1,12 +1,11 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import SelectForm from "@/components/selectForm"
 import Styles from "@/constants/Styles"
 import { Stack, router } from "expo-router"
 import { useState } from "react"
-import { SafeAreaView, ScrollView, View, ToastAndroid, Text } from "react-native"
+import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
 
 export default function EditEventCalendar() {
    const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
@@ -18,6 +17,10 @@ export default function EditEventCalendar() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Acara',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                  router.back()
+               }} />
             }}
          />
          <ScrollView>
@@ -42,7 +45,7 @@ export default function EditEventCalendar() {
                <SelectForm bg="white" label="Ulangi Acara" placeholder="Ulangi Acara" value={chooseGroup.label} required onPress={() => { }} />
                <InputForm label="Jumlah Pengulangan" type="numeric" placeholder="Jumlah Pengulangan" required bg="white" />
                <InputForm label="Deskripsi" type="default" placeholder="Deskripsi" bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -53,7 +56,7 @@ export default function EditEventCalendar() {
                            router.back()
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/division/[id]/(fitur-division)/calendar/create.tsx

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
-import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import { InputForm } from "@/components/inputForm";
 import SelectForm from "@/components/selectForm";
 import Styles from "@/constants/Styles";
@@ -18,6 +17,10 @@ export default function CalendarDivisionCreate() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Acara',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
+                  router.push('./')
+               }} />
             }}
          />
          <ScrollView>
@@ -42,7 +45,7 @@ export default function CalendarDivisionCreate() {
                <SelectForm bg="white" label="Ulangi Acara" placeholder="Ulangi Acara" value={chooseGroup.label} required onPress={() => { }} />
                <InputForm label="Jumlah Pengulangan" type="numeric" placeholder="Jumlah Pengulangan" required bg="white" />
                <InputForm label="Deskripsi" type="default" placeholder="Deskripsi" bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -53,7 +56,7 @@ export default function CalendarDivisionCreate() {
                            router.push('./')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

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

@@ -29,11 +29,12 @@ export default function DiscussionDetail() {
                      <BorderBottomItem
                         borderType="bottom"
                         icon={
-                           <View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
+                           <Image
-                              <MaterialIcons name="chat" size={25} color={'#384288'} />
+                              source={require("../../../../../../../assets/images/user.jpeg")}
-                           </View>
+                              style={[Styles.userProfileSmall]}
+                           />
                         }
-                        title="Danantara"
+                        title="Amalia Dwi"
                         subtitle={
                            <LabelStatus category='success' text='BUKA' size="small" />
                         }
@@ -137,7 +138,7 @@ export default function DiscussionDetail() {
                   </View>
                </ScrollView>
             </View>
-            <View style={[Styles.p15, { flex: 0.4 }]}>
+            <View style={[Styles.p10, { flex: 0.5 }]}>
                <InputForm
                   bg="white"
                   type="default"

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

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import { router, Stack, useLocalSearchParams } from "expo-router"
@@ -16,13 +15,17 @@ export default function EditDivision() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Divisi',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                  router.push('/division/123/info')
+               }} />
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
                <InputForm label="Nama Divisi" type="default" placeholder="Nama Divisi" required />
                <InputForm label="Deskripsi" type="default" placeholder="Deskripsi Divisi" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -33,7 +36,7 @@ export default function EditDivision() {
                            router.push('/division/123/info')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/division/create.tsx

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import ButtonSelect from "@/components/buttonSelect"
 import { InputForm } from "@/components/inputForm"
 import SelectForm from "@/components/selectForm"
@@ -19,6 +18,10 @@ export default function CreateDivision() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Divisi',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambahkan data', ToastAndroid.SHORT)
+                  router.push('/division')
+               }} />
             }}
          />
          <ScrollView>
@@ -27,7 +30,7 @@ export default function CreateDivision() {
                <InputForm label="Nama Divisi" type="default" placeholder="Nama Divisi" required />
                <InputForm label="Deskripsi" type="default" placeholder="Deskripsi Divisi" />
                <ButtonSelect value="Pilih Anggota" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -38,7 +41,7 @@ export default function CreateDivision() {
                            router.push('/division/123')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/group/_layout.tsx

@@ -38,14 +38,11 @@ export default function RootLayout() {
                   icon={<AntDesign name="pluscircle" color="black" size={25} />}
                   title="Tambah Lembaga"
                   onPress={() => {
-                     console.log('yeal')
                      setVisible(false);
-                     // open the 2nd modal
                      setTimeout(
                         () => {
                            setVisibleTambah(true)
                         },
-                        // any small number will do, maybe animation duration
                         100,
                      );
 

app/(application)/group/index.tsx

@@ -116,7 +116,10 @@ export default function Index() {
                <MenuItemRow
                   icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
                   title="Edit"
-                  onPress={() => { setVisibleEdit(true) }}
+                  onPress={() => { 
+                     setModal(false)
+                     setVisibleEdit(true) 
+                  }}
                />
             </View>
          </DrawerBottom>

app/(application)/member/create.tsx

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
-import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import { InputForm } from "@/components/inputForm";
 import SelectForm from "@/components/selectForm";
 import { ColorsStatus } from "@/constants/ColorsStatus";
@@ -9,7 +8,7 @@ import { MaterialCommunityIcons } from "@expo/vector-icons";
 import * as ImagePicker from 'expo-image-picker';
 import { router, Stack } from "expo-router";
 import { useState } from "react";
-import { Image, Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import { Image, Pressable, SafeAreaView, ScrollView, Text, View } from "react-native";
 
 export default function CreateMember() {
    const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
@@ -36,6 +35,7 @@ export default function CreateMember() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Anggota',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => { router.push('/member') }} />
             }}
          />
          <ScrollView>
@@ -61,7 +61,7 @@ export default function CreateMember() {
                <InputForm label="Email" type="default" placeholder="Email" required />
                <InputForm label="Nomor Telepon" type="numeric" placeholder="8XX-XXX-XXX" required itemLeft={<Text>+62</Text>} />
                <SelectForm label="Jenis Kelamin" placeholder="Pilih Jenis Kelamin" value={chooseGroup.label} required onPress={() => { }} />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -72,7 +72,7 @@ export default function CreateMember() {
                            router.push('/member?active=true')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

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

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import SelectForm from "@/components/selectForm"
 import { ColorsStatus } from "@/constants/ColorsStatus"
@@ -9,7 +8,7 @@ import { MaterialCommunityIcons } from "@expo/vector-icons"
 import * as ImagePicker from 'expo-image-picker'
 import { router, Stack } from "expo-router"
 import { useState } from "react"
-import { Image, Pressable, SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
+import { Image, Pressable, SafeAreaView, ScrollView, Text, View } from "react-native"
 
 export default function EditMember() {
    const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
@@ -36,6 +35,7 @@ export default function EditMember() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Edit Anggota',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => { router.back() }} />
             }}
          />
          <ScrollView>
@@ -60,7 +60,7 @@ export default function EditMember() {
                <InputForm label="Email" type="default" placeholder="Email" required />
                <InputForm label="Nomor Telepon" type="numeric" placeholder="8XX-XXX-XXX" required itemLeft={<Text>+62</Text>} />
                <SelectForm label="Jenis Kelamin" placeholder="Pilih Jenis Kelamin" value={chooseGroup.label} required onPress={() => { }} />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -71,7 +71,7 @@ export default function EditMember() {
                            router.back()
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/member/index.tsx

@@ -19,7 +19,7 @@ export default function Index() {
                      value="true"
                      onPress={() => { router.push('/member?active=true') }}
                      label="Aktif"
-                     icon={<Feather name="check-circle" color={active == "true" ? 'white' : 'black'} size={20} />}
+                     icon={<Feather name="check-circle" color={active == "false" ? 'black' : 'white'} size={20} />}
                      n={2} />
                   <ButtonTab
                      active={active == "false" ? "false" : "true"}

app/(application)/notification.tsx

@@ -21,7 +21,7 @@ export default function Notification() {
                <View style={[Styles.wrapPaper, Styles.mb100]}>
                   <View style={[Styles.mb05]}>
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -32,7 +32,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -43,7 +43,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -54,7 +54,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -65,7 +65,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -76,7 +76,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -87,7 +87,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -98,7 +98,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />
@@ -109,7 +109,7 @@ export default function Notification() {
                         desc="Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum temporibus"
                      />
                      <BorderBottomItem
-                        borderType="all"
+                        borderType="bottom"
                         icon={
                            <View style={[Styles.iconContent, ColorsStatus.primary]}>
                               <Feather name="bell" size={25} color="white" />

app/(application)/position/_layout.tsx

@@ -43,7 +43,10 @@ export default function RootLayout() {
                <MenuItemRow
                   icon={<AntDesign name="pluscircle" color="black" size={25} />}
                   title="Tambah Jabatan"
-                  onPress={() => { setVisibleTambah(true) }}
+                  onPress={() => {
+                     setVisible(false)
+                     setVisibleTambah(true)
+                  }}
                />
                <MenuItemRow
                   icon={<AntDesign name="filter" color="black" size={25} />}
@@ -53,10 +56,13 @@ export default function RootLayout() {
             </View>
          </DrawerBottom>
 
-         <DrawerBottom animation="none" isVisible={isVisibleTambah} setVisible={setVisibleTambah} title="Tambah Lembaga Desa">
+         <DrawerBottom animation="slide" isVisible={isVisibleTambah} setVisible={setVisibleTambah} title="Tambah Lembaga Desa">
             <View style={{ justifyContent: 'space-between', flex: 1 }}>
                <View>
-                  <SelectForm label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={choose.label} required onPress={() => { setSelect(true) }} />
+                  <SelectForm label="Lembaga Desa" placeholder="Pilih Lembaga Desa" value={choose.label} required onPress={() => {
+                     setVisibleTambah(false)
+                     setSelect(true)
+                  }} />
                   <InputForm type="default" placeholder="Nama Jabatan" required label="Jabatan" />
                </View>
                <View>
@@ -76,6 +82,7 @@ export default function RootLayout() {
             onSelect={(value) => {
                setChoose(value)
                setSelect(false)
+               setVisibleTambah(true)
             }}
             title="Lembaga Desa"
             choose={choose.val}

app/(application)/project/[id]/add-file.tsx

@@ -1,7 +1,6 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import BorderBottomItem from "@/components/borderBottomItem"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import ButtonSelect from "@/components/buttonSelect"
 import Styles from "@/constants/Styles"
 import { MaterialCommunityIcons } from "@expo/vector-icons"
@@ -18,6 +17,10 @@ export default function ProjectAddFile() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah File',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
+                  router.push('/project/4324')
+               }} />
             }}
          />
          <ScrollView>
@@ -40,7 +43,7 @@ export default function ProjectAddFile() {
                      />
                   </View>
                </View>
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -51,7 +54,7 @@ export default function ProjectAddFile() {
                            router.push('/project/4324')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/project/[id]/add-task.tsx

@@ -1,13 +1,12 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import dayjs from "dayjs"
 import { router, Stack, useLocalSearchParams } from "expo-router"
 import { useState } from "react"
 import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native"
-import DateTimePicker, { DateType, getDefaultStyles } from 'react-native-ui-datepicker';
+import DateTimePicker, { DateType, getDefaultStyles } from 'react-native-ui-datepicker'
 
 export default function ProjectAddTask() {
    const { id } = useLocalSearchParams()
@@ -27,6 +26,10 @@ export default function ProjectAddTask() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Tugas',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
+                  router.push('/project/4324')
+               }} />
             }}
          />
          <ScrollView>
@@ -55,7 +58,7 @@ export default function ProjectAddTask() {
                   </View>
                </View>
                <InputForm label="Judul Tugas" type="default" placeholder="Judul Tugas" required bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -66,7 +69,7 @@ export default function ProjectAddTask() {
                            router.push('/project/4324')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/project/[id]/cancel.tsx

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import { router, Stack, useLocalSearchParams } from "expo-router"
@@ -15,12 +14,16 @@ export default function ProjectCancel() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Pembatalan Kegiatan',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="cancel" onPress={() => {
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                  router.push('/project/4324')
+               }} />
             }}
          />
          <ScrollView>
             <View style={[Styles.p15, Styles.mb100]}>
                <InputForm label="Alasan Pembatalan" type="default" placeholder="Alasan Pembatalan" required bg="white" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -31,7 +34,7 @@ export default function ProjectCancel() {
                            router.push('/project/4324')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

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

@@ -1,6 +1,5 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi"
 import ButtonBackHeader from "@/components/buttonBackHeader"
-import { ButtonForm } from "@/components/buttonForm"
+import ButtonSaveHeader from "@/components/buttonSaveHeader"
 import { InputForm } from "@/components/inputForm"
 import Styles from "@/constants/Styles"
 import { router, Stack, useLocalSearchParams } from "expo-router"
@@ -10,30 +9,34 @@ export default function EditProject() {
    const { id } = useLocalSearchParams()
    return (
       <SafeAreaView>
-      <Stack.Screen
+         <Stack.Screen
-         options={{
+            options={{
-            headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
+               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
-            headerTitle: 'Edit Judul Kegiatan',
+               headerTitle: 'Edit Judul Kegiatan',
-            headerTitleAlign: 'center',
+               headerTitleAlign: 'center',
-         }}
+               headerRight: () => <ButtonSaveHeader category="update" onPress={() => {
-      />
+                  ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-      <ScrollView>
+                  router.push('/project/4324')
-         <View style={[Styles.p15, Styles.mb100]}>
-            <InputForm label="Judul Kegiatan" type="default" placeholder="Judul Kegiatan" required bg="white" />
-            <ButtonForm
-               text="SIMPAN"
-               onPress={() => {
-                  AlertKonfirmasi({
-                     title: 'Konfirmasi',
-                     desc: 'Apakah anda yakin ingin mengubah data?',
-                     onPress: () => {
-                        ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
-                        router.push('/project/4324')
-                     }
-                  })
                }} />
-         </View>
+            }}
-      </ScrollView>
+         />
-   </SafeAreaView>
+         <ScrollView>
+            <View style={[Styles.p15, Styles.mb100]}>
+               <InputForm label="Judul Kegiatan" type="default" placeholder="Judul Kegiatan" required bg="white" />
+               {/* <ButtonForm
+                  text="SIMPAN"
+                  onPress={() => {
+                     AlertKonfirmasi({
+                        title: 'Konfirmasi',
+                        desc: 'Apakah anda yakin ingin mengubah data?',
+                        onPress: () => {
+                           ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                           router.push('/project/4324')
+                        }
+                     })
+                  }} /> */}
+            </View>
+         </ScrollView>
+      </SafeAreaView>
    )
 }

app/(application)/project/create.tsx

@@ -1,13 +1,12 @@
-import AlertKonfirmasi from "@/components/alertKonfirmasi";
 import ButtonBackHeader from "@/components/buttonBackHeader";
-import { ButtonForm } from "@/components/buttonForm";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
 import ButtonSelect from "@/components/buttonSelect";
 import { InputForm } from "@/components/inputForm";
 import SelectForm from "@/components/selectForm";
 import Styles from "@/constants/Styles";
 import { router, Stack } from "expo-router";
 import { useState } from "react";
-import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import { SafeAreaView, ScrollView, ToastAndroid, View } from "react-native";
 
 export default function CreateProject() {
    const [chooseGroup, setChooseGroup] = useState({ val: '', label: '' })
@@ -19,6 +18,10 @@ export default function CreateProject() {
                headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
                headerTitle: 'Tambah Kegiatan',
                headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
+                  router.push('/project?status=0')
+               }} />
             }}
          />
          <ScrollView>
@@ -28,7 +31,7 @@ export default function CreateProject() {
                <ButtonSelect value="Tambah Tanggal & Tugas" />
                <ButtonSelect value="Upload File" />
                <ButtonSelect value="Tambah Anggota" />
-               <ButtonForm
+               {/* <ButtonForm
                   text="SIMPAN"
                   onPress={() => {
                      AlertKonfirmasi({
@@ -39,7 +42,7 @@ export default function CreateProject() {
                            router.push('/project?status=0')
                         }
                      })
-                  }} />
+                  }} /> */}
             </View>
          </ScrollView>
       </SafeAreaView>

app/(application)/project/update/[detail].tsx

@@ -0,0 +1,65 @@
+import ButtonBackHeader from "@/components/buttonBackHeader";
+import ButtonSaveHeader from "@/components/buttonSaveHeader";
+import { InputForm } from "@/components/inputForm";
+import Styles from "@/constants/Styles";
+import dayjs from "dayjs";
+import { router, Stack, useLocalSearchParams } from "expo-router";
+import { useState } from "react";
+import { SafeAreaView, ScrollView, Text, ToastAndroid, View } from "react-native";
+import DateTimePicker, { DateType, getDefaultStyles } from "react-native-ui-datepicker";
+
+export default function UpdateProjectTask() {
+   const { detail } = useLocalSearchParams()
+   const [range, setRange] = useState<{ startDate: DateType; endDate: DateType; }>({ startDate: undefined, endDate: undefined });
+   const defaultStyles = getDefaultStyles()
+
+   const from = range.startDate
+      ? dayjs(range.startDate).format('MMM DD, YYYY')
+      : '';
+   const to = range.endDate ? dayjs(range.endDate).format('MMM DD, YYYY') : '';
+
+
+   return (
+      <SafeAreaView>
+         <Stack.Screen
+            options={{
+               headerLeft: () => <ButtonBackHeader onPress={() => { router.back() }} />,
+               headerTitle: 'Edit Tanggal dan Tugas',
+               headerTitleAlign: 'center',
+               headerRight: () => <ButtonSaveHeader category="create" onPress={() => {
+                  ToastAndroid.show('Berhasil menambah data', ToastAndroid.SHORT)
+                  router.push('/project/4324')
+               }} />
+            }}
+         />
+         <ScrollView>
+            <View style={[Styles.p15, Styles.mb100]}>
+               <View style={[Styles.wrapPaper, Styles.p10]}>
+                  <DateTimePicker
+                     mode="range"
+                     startDate={range.startDate}
+                     endDate={range.endDate}
+                     onChange={(param) => setRange(param)}
+                     styles={defaultStyles}
+                  />
+               </View>
+               <View style={[Styles.rowSpaceBetween, Styles.mv10]}>
+                  <View style={[{ width: '48%' }]}>
+                     <Text style={[Styles.mb05]}>Tanggal Mulai <Text style={Styles.cError}>*</Text></Text>
+                     <View style={[Styles.wrapPaper, Styles.p10]}>
+                        <Text style={{ textAlign: 'center' }}>{from}</Text>
+                     </View>
+                  </View>
+                  <View style={[{ width: '48%' }]}>
+                     <Text style={[Styles.mb05]}>Tanggal Berakhir <Text style={Styles.cError}>*</Text></Text>
+                     <View style={[Styles.wrapPaper, Styles.p10]}>
+                        <Text style={{ textAlign: 'center' }}>{to}</Text>
+                     </View>
+                  </View>
+               </View>
+               <InputForm label="Judul Tugas" type="default" placeholder="Judul Tugas" required bg="white" />
+            </View>
+         </ScrollView>
+      </SafeAreaView>
+   )
+}

components/borderBottomItem.tsx

@@ -25,7 +25,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
    const lebar = width ? lebarDim * width / 100 : 'auto';
 
    return (
-      <Pressable style={[borderType == 'bottom' ? Styles.wrapItemBorderBottom : borderType == 'all' ? Styles.wrapItemBorderAll : Styles.wrapItemBorderNone, bgColor && bgColor == 'white' && ColorsStatus.white]} onPressOut={onPress}>
+      <Pressable style={[borderType == 'bottom' ? Styles.wrapItemBorderBottom : borderType == 'all' ? Styles.wrapItemBorderAll : Styles.wrapItemBorderNone, bgColor && bgColor == 'white' && ColorsStatus.white]} onPress={onPress}>
          <View style={[Styles.rowItemsCenter]}>
             {icon}
             <View style={[Styles.rowSpaceBetween, width ? { width: lebar } : { width: '88%' }]}>

components/buttonBackHeader.tsx

@@ -10,7 +10,7 @@ export default function ButtonBackHeader({ onPress }: Props) {
       <>
          <ButtonHeader
             item={<Feather name="chevron-left" size={20} color="white" />}
-            onPress={onPress}
+            onPress={() => { onPress && onPress() }}
          />
       </>
    )

components/buttonHeader.tsx

@@ -8,7 +8,7 @@ type PropsBtnHeader = {
 
 export function ButtonHeader({ onPress, item }: PropsBtnHeader) {
    return (
-      <Pressable onPressOut={() => {onPress()}}>
+      <Pressable onPress={() => {onPress()}}>
          <View style={[Styles.btnIconHeader]}>
             {item}
          </View>

components/buttonSaveHeader.tsx

@@ -0,0 +1,34 @@
+import { Feather } from "@expo/vector-icons"
+import { ButtonHeader } from "./buttonHeader"
+import AlertKonfirmasi from "./alertKonfirmasi"
+
+type Props = {
+   category: 'create' | 'update' | 'cancel'
+   onPress?: () => void
+   disable?: boolean
+}
+
+export default function ButtonSaveHeader({ category, onPress, disable }: Props) {
+   return (
+      <>
+         <ButtonHeader
+            item={<Feather name="check" size={20} color={disable == false ? "grey" : "white"} />}
+            onPress={() => {
+               AlertKonfirmasi({
+                  title: 'Konfirmasi',
+                  desc: category == 'create'
+                     ? 'Apakah anda yakin ingin menambahkan data?'
+                     : category == 'cancel'
+                        ? 'Apakah anda yakin ingin membatalkan kegiatan? Pembatalan bersifat permanen'
+                        : 'Apakah anda yakin mengubah data?',
+                  onPress: () => {
+                     onPress && onPress()
+                  }
+               })
+            }
+
+            }
+         />
+      </>
+   )
+}

components/buttonSelect.tsx

@@ -11,7 +11,7 @@ type Props = {
 export default function ButtonSelect({ value, onPress, round }: Props) {
    return (
       <View style={[Styles.mv15]}>
-         <Pressable onPressOut={onPress}>
+         <Pressable onPress={onPress}>
             <View style={[Styles.inputRoundForm, Styles.inputRoundFormRight, round && Styles.round30, Styles.pv10]}>
                <Feather name="arrow-right-circle" size={20} color="black" />
                <Text style={[Styles.cBlack]}>{value}</Text>

components/drawerBottom.tsx

@@ -18,7 +18,7 @@ export default function DrawerBottom({ isVisible, setVisible, title, children, a
             <View style={[Styles.modalContent, height != undefined && { height: `${height}%` }]}>
                <View style={Styles.titleContainer}>
                   <Text style={Styles.textDefault}>{title}</Text>
-                  <Pressable onPressOut={() => setVisible(false)}>
+                  <Pressable onPress={() => setVisible(false)}>
                      <MaterialIcons name="close" color="black" size={22} />
                   </Pressable>
                </View>

components/inputForm.tsx

@@ -32,13 +32,13 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
                   </Text>
                )
             }
-            <View style={[Styles.inputRoundForm, itemRight != undefined ? Styles.inputRoundFormRight : Styles.inputRoundFormLeft, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}>
+            <View style={[Styles.inputRoundForm, itemRight != undefined ? Styles.inputRoundFormRight : Styles.inputRoundFormLeft, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }, Styles.pv10]}>
                {itemRight != undefined ? itemRight : itemLeft}
                <TextInput
                   placeholder={placeholder}
                   keyboardType={type}
                   onChangeText={onChange}
-                  style={{ width: width && lebar * width / 100}}
+                  style={[Styles.mh05, { width: width ? lebar * width / 100: lebar*0.78 }]}
                />
             </View>
             {error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
@@ -66,7 +66,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
             onChangeText={onChange}
          />
          {error && (<Text style={[Styles.textInformation, Styles.cError, Styles.mt05]}>{errorText}</Text>)}
-         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05 , Styles.cGray]}>{info}</Text>)}
+         {info != undefined && (<Text style={[Styles.textInformation, Styles.mt05, Styles.cGray]}>{info}</Text>)}
       </View>
    )
 }

components/itemSectionTanggalTugas.tsx

@@ -1,6 +1,6 @@
 import Styles from "@/constants/Styles";
 import { MaterialCommunityIcons } from "@expo/vector-icons";
-import { Text, View } from "react-native";
+import { Pressable, Text, View } from "react-native";
 
 
 type Props = {
@@ -8,11 +8,12 @@ type Props = {
    title: string
    dateStart: string
    dateEnd: string
+   onPress?: () => void
 }
 
-export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd }: Props) {
+export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd, onPress }: Props) {
    return (
-      <View style={[Styles.mb15, { borderBottomColor: '#d6d8f6', borderBottomWidth: 1 }]}>
+      <Pressable style={[Styles.mb15, { borderBottomColor: '#d6d8f6', borderBottomWidth: 1 }]} onPress={onPress}>
          <View style={[Styles.rowItemsCenter]}>
             {
                done ?
@@ -48,6 +49,6 @@ export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEn
                </View>
             </View>
          </View>
-      </View>
+      </Pressable>
    )
 }

components/member/headerMemberDetail.tsx

@@ -1,7 +1,7 @@
 import Styles from "@/constants/Styles"
 import { MaterialCommunityIcons } from "@expo/vector-icons"
 import { useState } from "react"
-import { View } from "react-native"
+import { ToastAndroid, View } from "react-native"
 import AlertKonfirmasi from "../alertKonfirmasi"
 import ButtonMenuHeader from "../buttonMenuHeader"
 import DrawerBottom from "../drawerBottom"
@@ -27,7 +27,10 @@ export default function HeaderRightMemberDetail({ id }: Props) {
                      AlertKonfirmasi({
                         title: 'Konfirmasi',
                         desc: 'Apakah anda yakin ingin menonaktifkan data?',
-                        onPress: () => { }
+                        onPress: () => {
+                           setVisible(false)
+                           ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+                        }
                      })
                   }}
                />

components/menuItemRow.tsx

@@ -9,7 +9,7 @@ type Props = {
 
 export default function MenuItemRow({ onPress, icon, title }: Props) {
    return (
-      <Pressable onPressOut={() => { onPress() }} style={[Styles.btnMenuRow]}>
+      <Pressable onPress={() => { onPress() }} style={[Styles.btnMenuRow]}>
          <View style={{ alignItems: 'center' }}>
             {icon}
             <Text style={[Styles.mt05, {textAlign: 'center'}]}>{title}</Text>

components/modalSelect.tsx

@@ -8,7 +8,7 @@ type Props = {
    open: boolean
    close: (value: boolean) => void
    title: string
-   category: 'group'
+   category: 'group' | 'status-task'
    choose: string
    onSelect: (value: { val: string, label: string }) => void
 }
@@ -19,23 +19,43 @@ export default function ModalSelect({ open, close, title, category, choose, onSe
    return (
       <DrawerBottom animation="none" isVisible={open} setVisible={close} title={title} height={75}>
          <View>
-            <Pressable style={[Styles.itemSelectModal]} onPressOut={() => {
+            {
-               onSelect({ val: 'dinas', label: 'Dinas' })
+               category == 'group' ?
-               setChoose('dinas')
+                  <>
-               close(false)
+                     <Pressable style={[Styles.itemSelectModal]} onPress={() => {
-            }}>
+                        onSelect({ val: 'dinas', label: 'Dinas' })
-               <Text style={[Styles.textDefaultSemiBold]}>Dinas</Text>
+                        setChoose('dinas')
-               <AntDesign name="check" size={20} />
+                        close(false)
-            </Pressable>
+                     }}>
-            <Pressable style={[Styles.itemSelectModal]}>
+                        <Text style={[Styles.textDefaultSemiBold]}>Dinas</Text>
-               <Text>Adat</Text>
+                        <AntDesign name="check" size={20} />
-            </Pressable>
+                     </Pressable>
-            <Pressable style={[Styles.itemSelectModal]}>
+                     <Pressable style={[Styles.itemSelectModal]}>
-               <Text>Karang Taruna</Text>
+                        <Text>Adat</Text>
-            </Pressable>
+                     </Pressable>
-            <Pressable style={[Styles.itemSelectModal]}>
+                     <Pressable style={[Styles.itemSelectModal]}>
-               <Text>PKK</Text>
+                        <Text>Karang Taruna</Text>
-            </Pressable>
+                     </Pressable>
+                     <Pressable style={[Styles.itemSelectModal]}>
+                        <Text>PKK</Text>
+                     </Pressable>
+                  </>
+                  :
+                  <>
+                     <Pressable style={[Styles.itemSelectModal]} onPress={() => {
+                        onSelect({ val: 'blm-dikerjakan', label: 'Belum Dikerjakan' })
+                        setChoose('blm-dikerjakan')
+                        close(false)
+                     }}>
+                        <Text style={[Styles.textDefaultSemiBold]}>Belum Dikerjakan</Text>
+                        <AntDesign name="check" size={20} />
+                     </Pressable>
+                     <Pressable style={[Styles.itemSelectModal]}>
+                        <Text>Selesai</Text>
+                     </Pressable>
+                  </>
+            }
+
          </View>
       </DrawerBottom>
    )

components/sectionFile.tsx

@@ -1,26 +1,72 @@
 import Styles from "@/constants/Styles";
-import { MaterialCommunityIcons } from "@expo/vector-icons";
+import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
-import { Text, View } from "react-native";
+import { Text, ToastAndroid, View } from "react-native";
 import BorderBottomItem from "./borderBottomItem";
+import { useState } from "react";
+import { router } from "expo-router";
+import AlertKonfirmasi from "./alertKonfirmasi";
+import DrawerBottom from "./drawerBottom";
+import MenuItemRow from "./menuItemRow";
 
 export default function SectionFile() {
+   const [isModal, setModal] = useState(false)
+
    return (
-      <View style={[Styles.mb15]}>
+      <>
-         <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
+         <View style={[Styles.mb15]}>
-         <View style={[Styles.wrapPaper]}>
+            <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
-            <BorderBottomItem
+            <View style={[Styles.wrapPaper]}>
-               borderType="all"
+               <BorderBottomItem
-               icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
+                  borderType="all"
-               title="image_pertama.jpg"
+                  icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
-               titleWeight="normal"
+                  title="image_pertama.jpg"
-            />
+                  titleWeight="normal"
-            <BorderBottomItem
+                  onPress={() => { setModal(true) }}
-               borderType="all"
+               />
-               icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
+               <BorderBottomItem
-               title="file_kedua.pdf"
+                  borderType="all"
-               titleWeight="normal"
+                  icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
-            />
+                  title="file_kedua.pdf"
+                  titleWeight="normal"
+                  onPress={() => { setModal(true) }}
+               />
+            </View>
          </View>
-      </View>
+
+         <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
+            <View style={Styles.rowItemsCenter}>
+               <MenuItemRow
+                  icon={<MaterialCommunityIcons name="file-eye" color="black" size={25} />}
+                  title="Lihat File"
+                  onPress={() => {
+                     setModal(false)
+                  }}
+               />
+               <MenuItemRow
+                  icon={<MaterialCommunityIcons name="download" color="black" size={25} />}
+                  title="Download"
+                  onPress={() => {
+                     setModal(false)
+                  }}
+               />
+
+               <MenuItemRow
+                  icon={<Ionicons name="trash" color="black" size={25} />}
+                  title="Hapus"
+                  onPress={() => {
+                     AlertKonfirmasi({
+                        title: 'Konfirmasi',
+                        desc: 'Apakah Anda yakin ingin menghapus file ini? File yang dihapus tidak dapat dikembalikan',
+                        onPress: () => {
+                           setModal(false)
+                           ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT)
+                        }
+                     })
+
+                  }}
+               />
+            </View>
+         </DrawerBottom>
+      </>
    )
 }

components/sectionMember.tsx

@@ -1,45 +1,88 @@
 import Styles from "@/constants/Styles";
-import { Image, Text, View } from "react-native";
+import { MaterialCommunityIcons } from "@expo/vector-icons";
+import { useState } from "react";
+import { Image, Text, ToastAndroid, View } from "react-native";
+import AlertKonfirmasi from "./alertKonfirmasi";
 import BorderBottomItem from "./borderBottomItem";
+import DrawerBottom from "./drawerBottom";
+import MenuItemRow from "./menuItemRow";
+import { router } from "expo-router";
 
 export default function SectionMember() {
+   const [isModal, setModal] = useState(false)
+
    return (
-      <View style={[Styles.mb15]}>
+      <>
-         <View style={[Styles.rowSpaceBetween, Styles.mv05]}>
+         <View style={[Styles.mb15]}>
-            <Text style={[Styles.textDefaultSemiBold]}>Anggota</Text>
+            <View style={[Styles.rowSpaceBetween, Styles.mv05]}>
-            <Text style={[Styles.textDefault]}>Total 5 Anggota</Text>
+               <Text style={[Styles.textDefaultSemiBold]}>Anggota</Text>
+               <Text style={[Styles.textDefault]}>Total 5 Anggota</Text>
+            </View>
+
+            <View style={[Styles.wrapPaper]}>
+               <BorderBottomItem
+                  borderType="bottom"
+                  icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  title="Amalia Dwi"
+                  subtitle="Dinas - Bendahara"
+                  rightTopInfo="Anggota"
+                  onPress={() => { setModal(true) }}
+               />
+               <BorderBottomItem
+                  borderType="bottom"
+                  icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  title="Amalia Dwi"
+                  subtitle="Dinas - Bendahara"
+                  rightTopInfo="Anggota"
+                  onPress={() => { setModal(true) }}
+               />
+               <BorderBottomItem
+                  borderType="bottom"
+                  icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  title="Amalia Dwi"
+                  subtitle="Dinas - Bendahara"
+                  rightTopInfo="Anggota"
+                  onPress={() => { setModal(true) }}
+               />
+               <BorderBottomItem
+                  borderType="bottom"
+                  icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  title="Amalia Dwi"
+                  subtitle="Dinas - Bendahara"
+                  rightTopInfo="Anggota"
+                  onPress={() => { setModal(true) }}
+               />
+            </View>
          </View>
 
-         <View style={[Styles.wrapPaper]}>
+         <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
-            <BorderBottomItem
+            <View style={Styles.rowItemsCenter}>
-               borderType="bottom"
+               <MenuItemRow
-               icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  icon={<MaterialCommunityIcons name="account-eye" color="black" size={25} />}
-               title="Amalia Dwi"
+                  title="Lihat Profil"
-               subtitle="Dinas - Bendahara"
+                  onPress={() => {
-               rightTopInfo="Anggota"
+                     setModal(false)
-            />
+                     router.push('/member/123')
-            <BorderBottomItem
+                  }}
-               borderType="bottom"
+               />
-               icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+
-               title="Amalia Dwi"
+               <MenuItemRow
-               subtitle="Dinas - Bendahara"
+                  icon={<MaterialCommunityIcons name="account-remove" color="black" size={25} />}
-               rightTopInfo="Anggota"
+                  title="Keluarkan"
-            />
+                  onPress={() => {
-            <BorderBottomItem
+                     AlertKonfirmasi({
-               borderType="bottom"
+                        title: 'Konfirmasi',
-               icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                        desc: 'Apakah Anda yakin ingin mengeluarkan anggota?',
-               title="Amalia Dwi"
+                        onPress: () => {
-               subtitle="Dinas - Bendahara"
+                           setModal(false)
-               rightTopInfo="Anggota"
+                           ToastAndroid.show('Berhasil mengeluarkan anggota', ToastAndroid.SHORT)
-            />
+                        }
-            <BorderBottomItem
+                     })
-               borderType="bottom"
+
-               icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
+                  }}
-               title="Amalia Dwi"
+               />
-               subtitle="Dinas - Bendahara"
+            </View>
-               rightTopInfo="Anggota"
+         </DrawerBottom>
-            />
+      </>
-         </View>
-      </View>
    )
 }

components/sectionTanggalTugas.tsx

@@ -1,15 +1,79 @@
 import Styles from "@/constants/Styles";
-import { Text, View } from "react-native";
+import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
+import { router } from "expo-router";
+import { useState } from "react";
+import { Text, ToastAndroid, View } from "react-native";
+import DrawerBottom from "./drawerBottom";
 import ItemSectionTanggalTugas from "./itemSectionTanggalTugas";
+import MenuItemRow from "./menuItemRow";
+import AlertKonfirmasi from "./alertKonfirmasi";
+import ModalSelect from "./modalSelect";
 
 export default function SectionTanggalTugas() {
+   const [isModal, setModal] = useState(false)
+   const [isSelect, setSelect] = useState(false)
+   const [choose, setChoose] = useState({ val: '', label: '' })
+
    return (
-      <View style={[Styles.mb15, Styles.mt10]}>
+      <>
-         <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
+         <View style={[Styles.mb15, Styles.mt10]}>
-         <View style={[Styles.wrapPaper]}>
+            <Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
-            <ItemSectionTanggalTugas done={false} title="Pertama" dateStart="12-03-2023" dateEnd="15-03-2023" />
+            <View style={[Styles.wrapPaper]}>
-            <ItemSectionTanggalTugas done={true} title="Kedua" dateStart="15-03-2023" dateEnd="20-03-2023" />
+               <ItemSectionTanggalTugas done={false} title="Pertama" dateStart="12-03-2023" dateEnd="15-03-2023" onPress={() => { setModal(true) }} />
+               <ItemSectionTanggalTugas done={true} title="Kedua" dateStart="15-03-2023" dateEnd="20-03-2023" onPress={() => { setModal(true) }} />
+            </View>
          </View>
-      </View>
+
+         <DrawerBottom animation="slide" isVisible={isModal} setVisible={setModal} title="Menu">
+            <View style={Styles.rowItemsCenter}>
+               <MenuItemRow
+                  icon={<MaterialCommunityIcons name="list-status" color="black" size={25} />}
+                  title="Update Status"
+                  onPress={() => {
+                     setModal(false)
+                     setSelect(true)
+                  }}
+               />
+               <MenuItemRow
+                  icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
+                  title="Edit Tugas"
+                  onPress={() => {
+                     setModal(false)
+                     router.push(`/project/update/124`)
+                  }}
+               />
+
+               <MenuItemRow
+                  icon={<Ionicons name="trash" color="black" size={25} />}
+                  title="Hapus Tugas"
+                  onPress={() => {
+                     AlertKonfirmasi({
+                        title: 'Konfirmasi',
+                        desc: 'Apakah anda yakin ingin menghapus data ini?',
+                        onPress: () => {
+                           setModal(false)
+                           ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT)
+                           router.push('/project/243')
+                        }
+                     })
+
+                  }}
+               />
+            </View>
+         </DrawerBottom>
+
+         <ModalSelect
+            category="status-task"
+            close={setSelect}
+            onSelect={(value) => {
+               setChoose(value)
+               setSelect(false)
+               ToastAndroid.show('Berhasil mengubah data', ToastAndroid.SHORT)
+            }}
+            title="Status"
+            choose={choose.val}
+            open={isSelect}
+         />
+      </>
    )
 }

components/selectForm.tsx

@@ -28,7 +28,7 @@ export default function SelectForm({ label, value, placeholder, onPress, info, e
                </Text>
             )
          }
-         <Pressable onPressOut={onPress}>
+         <Pressable onPress={onPress}>
             <View style={[Styles.inputRoundForm, Styles.inputRoundFormRight, error && { borderColor: "red" }, round && Styles.round30, Styles.pv10, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}>
                <Feather name="chevron-right" size={20} color="grey" />
                {

package.json

@@ -5,8 +5,8 @@
   "scripts": {
     "start": "expo start",
     "reset-project": "node ./scripts/reset-project.js",
-    "android": "expo start --android",
+    "android": "expo run:android",
-    "ios": "expo start --ios",
+    "ios": "expo run:ios",
     "web": "expo start --web",
     "test": "jest --watchAll",
     "lint": "expo lint"