commit 034a5be6a73c467c7ec2275e4242b8dd9603adea
Author: GherilArofani1 <e32210786@student.polije.ac.id>
Date:   Thu Aug 8 14:23:21 2024 +0700

    dashboard

diff --git a/dashboard b/dashboard
new file mode 100644
index 0000000..11ec616
--- /dev/null
+++ b/dashboard
@@ -0,0 +1,2083 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import {
+  View,
+  Image,
+  Switch,
+  TouchableOpacity,
+  RefreshControl,
+  Modal, 
+} from 'react-native';
+import React, {useState, useEffect, useCallback, useRef} from 'react';
+import moment from 'moment';
+import { StyleSheet } from 'react-native';
+import Icons from 'react-native-vector-icons/Ionicons';
+import {useSelector, useDispatch} from 'react-redux';
+import {
+  IconArrowNarrowLeft,
+  IconArrowNarrowRight,
+  IconCheckupList,
+  IconClipboardData,
+  IconCoin,
+  IconCpu2,
+  IconDatabaseSearch,
+  IconDots,
+  IconDropletHalf,
+  IconEdit,
+  IconFlag3,
+  IconInfoCircle,
+  IconMapPin,
+  IconMapPinFilled,
+  IconPlug,
+  IconTexture,
+  IconTrophy,
+  IconCirclePlus,
+  IconCaretDownFilled,
+  IconTrash,
+  IconPower,
+} from 'tabler-icons-react-native';
+import {addEventListener} from '@react-native-community/netinfo';
+import {
+  getPlantsFertils,
+  browseCultivationByQuery,
+  browseLocationByQuery,
+  addRSC,
+  editCultivation,
+} from '../../redux/actions/farms';
+import KelanaStatusBar from '../../components/statusbars';
+import KelanaNavbar from '../../components/navbars';
+import tw from '../../utils/tailwind';
+import {
+  ContainerScrollView,
+  ModalBasic,
+  TextBasic,
+} from '../../components/main';
+import {CardBasic} from '../../components/cards';
+import {TextInputBasic,TextAreaTypeA, TextInputTypeA} from '../../components/fields';
+import {useBle, bleManager} from '../../utils/useBle';
+import {setGlobalAlert} from '../../redux/reducers/globalSlice';
+import {ButtonCircle, ButtonRegular,ButtonParent} from '../../components/buttons';
+import {
+  setConnectedDevice,
+  setSensorDevices,
+} from '../../redux/reducers/farmSlice';
+import {Constants} from '../../utils/constants';
+import DateTimePickerModal from 'react-native-modal-datetime-picker';
+import MQTT from 'sp-react-native-mqtt';
+import { Table, Row, Rows } from 'react-native-table-component';
+const CustomCardA = ({
+  title,
+  titleStyle,
+  content = null,
+  onPressInfo,
+  onPress,
+  onPressShow,
+  headerStyle,
+  isContentShow = false,
+  isButtonAdd = true,
+}) => {
+  return (
+    <View style={{marginBottom: 15}}>
+      <View
+        style={[
+          styles.headerDefault,
+          tw`py-4`,
+          {
+            flexDirection: 'row',
+            alignItems: 'center',
+            borderTopColor: '#1d9da6',
+            borderTopWidth: 1.5,
+          },
+          headerStyle,
+        ]}>
+        <TouchableOpacity
+          onPress={onPressShow}
+          style={{flex: 1, flexDirection: 'row', alignItems: 'center'}}>
+          <TextBasic style={[tw`font-metroSB Text-toscaSB`, titleStyle]}>
+            {title}
+          </TextBasic>
+          <IconCaretDownFilled color={'#12646a'} size={13} style={tw`ml-2.5`} />
+        </TouchableOpacity>
+      </View>
+
+      {isContentShow ? (
+        content ? (
+          content
+        ) : (
+          <View style={[styles.listViewBordered, {flex: 1}]}>
+            <TextBasic
+              style={[
+                styles.metroM,
+                {
+                  flex: 1,
+                  fontSize: 15,
+                  lineHeight: 20,
+                  color: '#AAA',
+                },
+              ]}>
+              {'Klik tambah untuk menambah item.'}
+            </TextBasic>
+          </View>
+        )
+      ) : null}
+    </View>
+  );
+};
+
+
+const styles = StyleSheet.create({
+  tableHeader: {
+    height: 40,
+    backgroundColor: '#f1f8ff'
+  },
+  tableHeaderText: {
+    TextAlign: 'center',
+    fontWeight: 'bold',
+    fontSize: 14
+  },
+  tableRow: {
+    height: 40
+  },
+  tableRowText: {
+    TextAlign: 'center',
+    fontSize: 12
+  }
+});
+
+const FarmDetail = ({navigation, route}) => {
+  const {detailFarm} = route.params;
+  const dispatch = useDispatch();
+  const {user} = useSelector(state => state.user);
+  const {
+    loadingRSC,
+    plants,
+    cultivations,
+    locations,
+    sensorDevices,
+    connectedDevice,
+  } = useSelector(state => state.farm);
+  let connectedDeviceParse = connectedDevice
+    ? JSON.parse(connectedDevice)
+    : null;
+  const {token} = useSelector(state => state.auth);
+  const [refreshing, setRefreshing] = useState(false);
+  const [modalVisible, setModalVisible] = useState(false);
+  const [modalMenu, setModalMenu] = useState('message');
+  const optionFarm = [
+    {
+      label: 'Ubah Kebun',
+      color: '#333',
+      icon: 'create',
+      navigation: 'FarmAddEdit',
+    },
+  ];
+  const [datePickerVisible, setDatePickerVisible] = useState(false);
+  const [timePickerVisible1, settimePickerVisible1] = useState(false);
+  const [timePickerVisible2, settimePickerVisible2] = useState(false);
+  const [scheduleOneTime, setscheduleOneTime] = useState({
+    mode: '',
+    Waktumulai: null,
+    Waktuselesai: null,
+    Tanggal:null,
+    Gate:'',
+    SetiapHari:'',
+  });
+
+  const Gantitanggal = ({ md, wm, ws, tgl, sh, gt }) => {
+    setscheduleOneTime(prevState => {
+      if (md !== undefined) {
+        prevState.mode = md;
+      }
+      if (wm !== undefined) {
+        prevState.Waktumulai = wm;
+      }
+      if (ws !== undefined) {
+        prevState.Waktuselesai = ws;
+      }
+      if (tgl !== undefined) {
+        prevState.Tanggal = tgl;
+      }
+      if (gt !== undefined) {
+        prevState.Gate = gt;
+      }
+      if (sh !== undefined) {
+        prevState.SetiapHari = sh;
+      }
+      return { ...prevState };
+    });
+  };
+  let client;
+
+  const [Air,setAir] = useState();
+  const [Temp,setTemp] = useState();
+  const [Humidity,setHumidity] = useState();
+  const [Gerbang,setGerbang] = useState();
+  const [Status,setStatus] = useState();
+  const [Wflow, setWflow] = useState();
+  const [Automatic, setAutomatic] = useState();
+  const [Mode, setMode] = useState();
+ function connectAndPublish(topic, message, subscribeTopic) {
+  if (!client) {
+    MQTT.createClient({ uri: 'mqtt://habibigarden.com:1883', clientId: 'gheril' })
+      .then(function (createdClient) {
+        client = createdClient;
+
+        client.on('closed', function () {
+          console.log('mqtt.event.closed');
+        });
+
+        client.on('error', function (msg) {
+          console.log('mqtt.event.error', msg);
+        });
+
+        client.on('message', function (topic, message) {
+          console.log( topic);
+          const payload = JSON.stringify(topic);
+          const data = JSON.parse(payload);
+          const paring = JSON.parse(data.data);
+         // const data = payload.data;
+          console.log('ini parsingan',payload);
+          console.log(data);
+          // console.log(data.info.Air);
+          setAir(paring.info.distance);
+          console.log(paring.info.distance);
+          setTemp(paring.info.Temp);
+          setHumidity(paring.info.Humidity);
+          setWflow(paring.info.WFlow);
+          setGerbang(paring.info.Gerbang);
+          setStatus(paring.info.Hallefect);
+          setAutomatic(paring.info.Automatic);
+          setMode(paring.info.Mode);
+          setIsOn(Mode === 'OFF' ? isOn : !isOn);
+        });
+
+        client.on('connect', function () {
+          console.log('connected');
+          client.publish(topic, message, 0, false);
+          if (subscribeTopic) {
+            client.subscribe(subscribeTopic, 0);
+            client.subscribe('Irigate/Ultrasonik', 0);
+          }
+          if(subscribeTopic === 'Irigate/SNalat'){
+            console.log('subscribe');
+            console.log(message);
+          }
+          if(subscribeTopic === 'Irigate/Ultrasonik'){
+            console.log('subscribe');
+            console.log(message);
+          }
+        });
+
+        client.connect();
+      })
+      .catch(function (err) {
+        console.log(err);
+      });
+  } else {
+    client.publish(topic, message, 0, false);
+  }
+}
+
+
+  const [selectedOption, setSelectedOption] = useState(null);
+  const [isPickerVisible, setPickerVisible] = useState(false);
+  const [buttonOnPress, setButtonOnPress] = useState(() => {});
+  const [publishValue, setPublishValue] = useState(null);
+  const handleOptionSelect = (option) => {
+    setSelectedOption(option);
+    setPickerVisible(false);
+    
+
+    switch (option) {
+      case '25%':
+        setPublishValue('1');
+        break;
+      case '50%':
+        setPublishValue('2');
+        break;
+      case '75%':
+        setPublishValue('3');
+        break;
+      case '100%':
+        setPublishValue('4');
+        break;
+      default:
+        setButtonOnPress(() => {});
+        break;
+    }
+  };
+  const handleButtonPress = () => {
+    if (publishValue) {
+      connectAndPublish('Irigate/relay', publishValue);
+      setPublishValue(null);
+    }
+  };
+  const [selectedDays, setSelectedDays] = useState([]);
+  const days = ['Sen', 'Sel', 'Rab', 'Kam', 'Jum', 'Sab', 'Min', 'All'];
+  const dayValues = {
+    Sen: 1,
+    Sel: 2,
+    Rab: 3,
+    Kam: 4,
+    Jum: 5,
+    Sab: 6,
+    Min: 0,
+  };
+  const toggleDay = (day) => {
+    if (day === 'All') {
+      if (selectedDays.length === Object.values(dayValues).filter((value) => !selectedDays.includes(value)).length) {
+        setSelectedDays([]);
+      } else {
+        setSelectedDays(Object.values(dayValues));
+      }
+    } else {
+      setSelectedDays((prevSelectedDays) => {
+        if (prevSelectedDays.includes(dayValues[day])) {
+          return prevSelectedDays.filter((selectedDay) => selectedDay !== dayValues[day]);
+        } else {
+          if (prevSelectedDays.includes(dayValues.All)) {
+            return [...prevSelectedDays.filter((selectedDay) => selectedDay !== dayValues.All), dayValues[day]];
+          } else {
+            return [...prevSelectedDays, dayValues[day]];
+          }
+        }
+      });
+    }
+  };
+  const [isHariVisible, setIsHariVisible] = useState(true);
+  const [isTanggalVisible, setIsTanggalVisible] = useState(false);
+    const handleSekaliButtonPress = () => {
+      setIsHariVisible(false);
+      Gantitanggal({ md: 'OT' });
+      setIsTanggalVisible(true);
+    };
+    const handleUlangiButtonPress = () => {
+      setIsHariVisible(true);
+      Gantitanggal({ md: 'SH' });
+      setIsTanggalVisible(false);
+    };
+    const [isJadwalAdded, setIsJadwalAdded] = useState(false);
+
+    const [isOn, setIsOn] = useState(false);
+
+
+  // cultivation parameter
+  const [cultivationQueue, setCultivationQueue] = useState(0);
+  const [cultivationList, setCultivationList] = useState([]);
+
+  // rsc parameter
+  const [formRSC, setFormRSC] = useState({
+    locationId: null,
+    locationName: null,
+    mode: 'Auto',
+  });
+  const [isRscConnected, setIsRscConnected] = useState(false);
+  const [dataRSC, setDataRSC] = useState({
+    ...sensorDevices,
+    date: moment().format(),
+  });
+   // schedule parameter
+   const [schedule, ] = useState({
+    time: moment().format('HH:mm'),
+    date: moment().format('YYYY-MM-DD'),
+    
+  });
+  // ble parameter
+  const {
+    requestPermissions,
+    checkStatusBLE,
+    scanDevicesBLE,
+    connectDevice,
+    requestDataDevice,
+    disconnectDevice,
+  } = useBle(dispatch, connectedDeviceParse);
+  const [scannedDevices, setScannedDevices] = useState([]);
+
+  const reqCultivations = useCallback(async () => {
+    let query = {farmId: detailFarm._id};
+    await browseCultivationByQuery(dispatch, token, query, result => {
+      if (result) {
+        let tmpCultivation = result.filter(
+          item => item.farmId === detailFarm._id && item.endedAt === null,
+        );
+
+        setCultivationList(tmpCultivation);
+        setRefreshing(false);
+      }
+    });
+  }, [dispatch, token, detailFarm._id]);
+
+  const reqPlantsFertils = useCallback(async () => {
+    await getPlantsFertils(dispatch).then(() => {
+      setRefreshing(false);
+    });
+  }, [dispatch]);
+
+  const reqGetLocations = useCallback(
+    async cultivationId => {
+      await browseLocationByQuery(dispatch, token, cultivationId);
+    },
+    [dispatch, token],
+  );
+
+  useEffect(() => {
+    const unsubscribe = navigation.addListener('focus', () => {
+      reqCultivations();
+      if (plants.length === 0) {
+        reqPlantsFertils();
+      }
+    });
+    return unsubscribe;
+  }, []);
+
+  useEffect(() => {
+    const unsubscribe2 = navigation.addListener('beforeRemove', () => {
+      if (connectedDevice) {
+        disconnectDevice();
+        setIsRscConnected(false);
+        dispatch(setConnectedDevice({connectedDevice: null}));
+      }
+    });
+
+    return unsubscribe2;
+  }, [navigation, connectedDevice, disconnectDevice, dispatch]);
+
+  /**
+   * Lists action
+   * place all action button here
+   */
+  const onRefresh = () => {
+    setRefreshing(true);
+    reqPlantsFertils();
+    reqCultivations();
+  };
+
+  const onUpdateSensor = (key, value) => {
+    setDataRSC(current => {
+      return {...current, [key]: value};
+    });
+  };
+
+  const onShowModal = (menu, visible) => {
+    setModalMenu(menu);
+    setModalVisible(visible);
+  };
+
+  const onSubmitData = async second => {
+    setModalVisible(false);
+    let params = {
+      locationId: formRSC.locationId,
+      n: formRSC.mode === 'Auto' ? sensorDevices.n : dataRSC.n,
+      p: formRSC.mode === 'Auto' ? sensorDevices.p : dataRSC.p,
+      k: formRSC.mode === 'Auto' ? sensorDevices.k : dataRSC.k,
+      ph: formRSC.mode === 'Auto' ? sensorDevices.ph : dataRSC.ph,
+      rh: formRSC.mode === 'Auto' ? sensorDevices.rh : dataRSC.rh,
+      tds: formRSC.mode === 'Auto' ? sensorDevices.tds : dataRSC.tds,
+      temp: formRSC.mode === 'Auto' ? sensorDevices.temp : dataRSC.temp,
+      createdAt: moment().valueOf(),
+      updatedAt: moment().valueOf(),
+    };
+    await addRSC(dispatch, token, params);
+  };
+
+  const onHarvest = () => {
+    let params = {endedAt: moment().valueOf()};
+    editCultivation(
+      dispatch,
+      token,
+      cultivationList[cultivationQueue]?._id,
+      params,
+    ).then(async () => {
+      reqCultivations();
+    });
+  };
+
+  // ble action
+  const onConnectingToDevice = () => {
+    requestPermissions().then(result => {
+      if (result) {
+        const checkStatusBT = bleManager.onStateChange(state => {
+          if (state === 'PoweredOn') {
+            checkStatusBT.remove();
+
+            scanDevicesBLE(resScanDevices => {
+              if (
+                !isRscConnected &&
+                resScanDevices &&
+                resScanDevices.length >= 1
+              ) {
+                setScannedDevices(resScanDevices);
+                setModalMenu('devicesBLE');
+                setModalVisible(true);
+              } else {
+                dispatch(
+                  setGlobalAlert({
+                    isVisible: true,
+                    status: 'error',
+                    title: 'Proses Gagal',
+                    subtitle:
+                      'Perangkat tidak terdeteksi, coba beberapa saat lagi.',
+                  }),
+                );
+              }
+            });
+          }
+
+          if (state === 'PoweredOff') {
+            dispatch(
+              setGlobalAlert({
+                isVisible: true,
+                status: 'error',
+                title: 'Aplikasi memerlukan penggunaan bluetooth.',
+                subtitle: 'Silahkan nyalakan bluetooth terlebih dahulu.',
+              }),
+            );
+            checkStatusBT.remove();
+          }
+        }, true);
+      }
+    });
+  };
+
+  /**
+   * Lists of render UI
+   * place all render below
+   */
+  const renderHeader = () => {
+    return (
+      <CardBasic style={tw`p-0 shadow-none`}>
+        <>
+          <View style={[tw`flex-1 flex-row`]}>
+            {detailFarm.img ? (
+              <Image
+                source={{uri: detailFarm.img}}
+                style={tw`h-20 w-20 mr-4 rounded-5`}
+              />
+            ) : (
+              <Image
+                style={tw`h-20 w-20 mr-4 rounded-5`}
+                source={require('../../../assets/images/default_farm_1.png')}
+              />
+            )}
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`font-metroSB Text-black Text-lg mb-1`}>
+                {detailFarm?.name}
+              </TextBasic>
+              <View style={tw`flex-row items-center mb-1`}>
+                <IconMapPinFilled size={18} color={'#f75c64'} />
+                <TextBasic style={tw`ml-1 font-metroSB`}>
+                  {detailFarm?.city}
+                </TextBasic>
+              </View>
+              {detailFarm?.area ? (
+                <View style={tw`flex-row items-center`}>
+                  <IconTexture size={18} color={'#f75c64'} />
+                  <TextBasic style={tw`ml-1 font-metroSB`}>
+                    {detailFarm?.area} ha
+                  </TextBasic>
+                </View>
+              ) : null}
+            </View>
+            <TouchableOpacity
+              onPress={() => onShowModal('optionFarm', true)}
+              style={tw`items-center mx-2`}>
+              <IconDots size={25} color={'#333'} />
+            </TouchableOpacity>
+          </View>
+
+          <View style={tw`flex-1`}>
+            {detailFarm?.note ? (
+              <>
+                <CardBasic
+                  style={tw`bg-mainSB shadow-none mt-5 rounded-4 p-4 items-start`}>
+                  <TextBasic
+                    style={tw`bg-toscaSS font-metroSB Text-toscaSB px-3 py-1 rounded-full mb-3`}>
+                    Catatan
+                  </TextBasic>
+                  <TextBasic>{detailFarm?.note}</TextBasic>
+                </CardBasic>
+              </>
+            ) : null}
+          </View>
+
+          <View style={tw`flex-1 flex-row mt-5`}>
+            <ButtonRegular
+              style={tw`flex-1 mr-5`}
+              label={'Tambah Budidaya'}
+              onPress={() =>
+                navigation.navigate('CultivationAddEdit', {
+                  farmId: detailFarm._id,
+                })
+              }
+            />
+            <ButtonRegular
+              style={tw`flex-1 bg-toscaSS`}
+              labelStyle={tw`Text-toscaSB`}
+              label={'Riwayat Budidaya'}
+              onPress={() =>
+                navigation.navigate('CultivationHistory', {
+                  farmId: detailFarm._id,
+                })
+              }
+            />
+          </View>
+        </>
+      </CardBasic>
+    );
+  };
+
+  const renderCultivation = () => {
+    return (
+      <View style={tw`mb-5 p-5 pt-0`}>
+        <View style={[tw`flex-1 flex-row items-center rounded-t-7 mb-5`]}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB Text-base`}>
+            Informasi Budidaya
+          </TextBasic>
+          <TouchableOpacity
+            onPress={() => {
+              navigation.navigate('CultivationAddEdit', {
+                farmId: detailFarm._id,
+                detailCultivation: cultivationList[cultivationQueue],
+              });
+            }}
+            style={tw`ml-2`}>
+            <IconEdit size={20} color={'#000'} />
+          </TouchableOpacity>
+        </View>
+
+        <CardBasic style={tw`mb-5 bg-white p-5`}>
+          {cultivationList[cultivationQueue]?.note ? (
+            <CardBasic
+              style={tw`rounded-5 shadow-none flex-1 p-4 bg-mainSB items-start`}>
+              <TextBasic
+                style={tw`bg-toscaSS font-metroSB Text-toscaSB px-3 py-1 rounded-full mb-3`}>
+                {cultivationList[cultivationQueue]?.name}
+              </TextBasic>
+              <TextBasic style={tw`Text-gray-500`}>
+                {cultivationList[cultivationQueue]?.note}
+              </TextBasic>
+            </CardBasic>
+          ) : (
+            <View style={tw`flex-1 items-start`}>
+              <TextBasic
+                style={tw`bg-toscaSS font-metroSB Text-toscaSB px-3 py-1 rounded-full`}>
+                {cultivationList[cultivationQueue]?.name}
+              </TextBasic>
+            </View>
+          )}
+
+          <View
+            style={tw`flex-row rounded-5 shadow-none flex-1 items-center mt-5`}>
+            <Image
+              source={{
+                uri: `https://api.habibigarden.com/plants/${
+                  plants.find(
+                    item =>
+                      item.id === cultivationList[cultivationQueue]?.plantId,
+                  )?.image
+                }`,
+              }}
+              style={tw`rounded-full h-20 w-20 bg-toscaB items-center justify-center mr-3 border`}
+            />
+            <View style={tw`flex-1 ml-2`}>
+              <View style={tw`flex-1 flex-row mb-1`}>
+                <TextBasic style={tw`font-metroSB Text-black`}>
+                  Tanaman:
+                </TextBasic>
+                <TextBasic
+                  style={tw`flex-1 ml-2 font-metroSB Text-gray-400 Text-right`}>
+                  {(cultivationList.length &&
+                    plants.find(
+                      item =>
+                        item.id === cultivationList[cultivationQueue]?.plantId,
+                    )?.plants_name) ||
+                    'Belum ada tanaman'}
+                </TextBasic>
+              </View>
+
+              <View style={tw`flex-1 flex-row mb-1`}>
+                <TextBasic style={tw`font-metroSB Text-black`}>HST:</TextBasic>
+                <TextBasic
+                  style={tw`flex-1 ml-2 font-metroSB Text-gray-400 Text-right`}>
+                  {cultivationList.length
+                    ? moment().diff(
+                        moment(cultivationList[cultivationQueue].startedAt),
+                        'days',
+                      ) +
+                      2 +
+                      ' Hari'
+                    : '-'}
+                </TextBasic>
+              </View>
+
+              <View style={tw`flex-1 flex-row mb-1`}>
+                <TextBasic style={tw`font-metroSB Text-black`}>
+                  Populasi:
+                </TextBasic>
+                <TextBasic
+                  style={tw`flex-1 ml-2 font-metroSB Text-gray-400 Text-right`}>
+                  {cultivationList.length
+                    ? cultivationList[cultivationQueue].population
+                    : '-'}
+                </TextBasic>
+              </View>
+
+              {/* <View style={tw`flex-1 flex-row mb-1`}>
+                <TextBasic style={tw`font-metroSB Text-black`}>Fase:</TextBasic>
+                <TextBasic
+                  style={tw`flex-1 ml-2 font-metroSB Text-gray-400 Text-right`}>
+                  -
+                </TextBasic>
+              </View> */}
+            </View>
+          </View>
+
+          <View style={tw`flex-1 flex-row my-3 justify-center items-center`}>
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />
+            <TextBasic style={tw`mx-3 Text-gray-400`}>
+              NPK Rekomendasi
+            </TextBasic>
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />
+          </View>
+
+          <View style={[tw`flex-1 flex-row`]}>
+            <ButtonCircle
+              customText={
+                cultivationList.length &&
+                cultivationList[cultivationQueue]?.npkRecomended?.n
+                  ? cultivationList[cultivationQueue].npkRecomended.n
+                  : '-'
+              }
+              label={'N'}
+            />
+            <ButtonCircle
+              customText={
+                cultivationList.length &&
+                cultivationList[cultivationQueue]?.npkRecomended?.p
+                  ? cultivationList[cultivationQueue].npkRecomended.p
+                  : '-'
+              }
+              label={'P'}
+            />
+            <ButtonCircle
+              customText={
+                cultivationList.length &&
+                cultivationList[cultivationQueue]?.npkRecomended?.k
+                  ? cultivationList[cultivationQueue].npkRecomended.k
+                  : '-'
+              }
+              label={'K'}
+            />
+          </View>
+
+          {cultivationList.length > 1 ? (
+            <View style={tw`flex-row mt-5`}>
+              <CardBasic
+                disabled={false}
+                style={tw`flex-row shadow-none rounded-5 flex-1 py-3.5 bg-mainSB justify-center items-center mr-5`}
+                // onPress={() => setCultivationQueue(prev => prev - 1)}>
+                onPress={() =>
+                  setCultivationQueue(
+                    cultivationQueue === 0
+                      ? cultivationList.length - 1
+                      : prev => prev - 1,
+                  )
+                }>
+                <IconArrowNarrowLeft size={23} color={'#333'} />
+                <TextBasic style={tw`font-metroSB Text-black ml-2`}>
+                  Kembali
+                </TextBasic>
+              </CardBasic>
+
+              <CardBasic
+                disabled={false}
+                style={tw`flex-row shadow-none rounded-5 flex-1 py-3.5 bg-mainSB justify-center items-center`}
+                onPress={() => {
+                  setCultivationQueue(
+                    cultivationQueue + 1 === cultivationList.length
+                      ? 0
+                      : prev => prev + 1,
+                  );
+                }}>
+                <TextBasic style={tw`font-metroSB Text-black mr-2`}>
+                  Lanjut
+                </TextBasic>
+                <IconArrowNarrowRight size={23} color={'#333'} />
+              </CardBasic>
+            </View>
+          ) : null}
+        </CardBasic>
+
+        <CardBasic style={tw`bg-white`}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB mt-1 mb-5`}>
+            Menu Budidaya
+          </TextBasic>
+          <View style={[tw`flex-1 flex-row`]}>
+            <ButtonCircle
+              customIcon={<IconMapPin size={23} color={'#12646a'} />}
+              onPress={() =>
+                navigation.navigate('LocationsBread', {
+                  breadType: 'add',
+                  cultivationId: cultivationList[cultivationQueue]._id,
+                })
+              }
+              label={'Lokasi'}
+            />
+            <ButtonCircle
+              customIcon={<IconCheckupList size={23} color={'#12646a'} />}
+              label={'Laporan'}
+              onPress={() =>
+                navigation.navigate('FarmReport', {
+                  cultivationId: cultivationList[cultivationQueue]._id,
+                  farmId: detailFarm._id,
+                })
+              }
+            />
+            <ButtonCircle
+              customIcon={<IconCoin size={23} color={'#12646a'} />}
+              label={'Keuangan'}
+              onPress={() =>
+                navigation.navigate('FarmFinance', {
+                  cultivationId: cultivationList[cultivationQueue]._id,
+                })
+              }
+            />
+            <ButtonCircle
+              customIcon={<IconDropletHalf size={23} color={'#12646a'} />}
+              label={'Pupuk'}
+              onPress={() => {
+                navigation.navigate('Fertilizer', {
+                  farmId: detailFarm._id,
+                  cultivationId: cultivationList[cultivationQueue]._id,
+                  activeFertilizer:
+                    cultivationList[cultivationQueue]?.fertilizer,
+                });
+              }}
+            />
+          </View>
+
+          <View style={[tw`flex-1 flex-row mt-5`]}>
+            <TouchableOpacity
+              onPress={() => {
+                setModalMenu('harvest');
+                setModalVisible(true);
+              }}
+              style={tw`flex-1 flex-row bg-toscaB rounded-5 items-center justify-center py-4`}>
+              <IconTrophy size={23} color={'#fff'} />
+              <TextBasic style={tw` ml-3 font-metroSB Text-white`}>
+                Panen / Selesai Budidaya
+              </TextBasic>
+            </TouchableOpacity>
+          </View>
+        </CardBasic>
+      </View>
+    );
+  };
+
+  const renderRSC = () => {
+    return (
+      <View style={tw`mb-5 p-5 pt-0`}>
+        <View style={[tw`flex-1 flex-row items-center rounded-t-7 mb-5`]}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB Text-base`}>
+            Rapid Soil Check (RSC)
+          </TextBasic>
+          <TouchableOpacity
+            onPress={() => console.log('Setting Farm')}
+            style={tw`ml-2`}>
+            <IconInfoCircle size={20} color={'#000'} />
+          </TouchableOpacity>
+        </View>
+
+        <CardBasic style={tw`mb-5 bg-white p-5`}>
+          <View style={[tw`flex-1 flex-row items-center mb-2`]}>
+            <Image
+              source={require('../../../assets/images/rsc.png')}
+              style={tw`h-35 w-35 -mt-3`}
+            />
+            <View style={tw`ml-2`}>
+              <TextBasic style={tw`font-metroSB Text-black`}>
+                Serial Number:
+              </TextBasic>
+              <TextBasic style={tw`font-metroSB Text-gray-400 mb-3`}>
+                {connectedDeviceParse
+                  ? connectedDeviceParse.name.split('_')[2]
+                  : '-'}
+              </TextBasic>
+              <TextBasic style={tw`font-metroSB Text-black`}>Status:</TextBasic>
+              <TextBasic
+                style={tw`Text-sm Text-${
+                  isRscConnected ? 'toscaN' : 'redSB'
+                } font-metroSB`}>
+                {isRscConnected ? 'Terhubung' : 'Belum Terhubung'}
+              </TextBasic>
+            </View>
+          </View>
+
+          <CardBasic
+            style={tw`shadow-none flex-1 py-4 bg-mainSB justify-center items-center rounded-5`}>
+            <View style={[tw`flex-1 flex-row justify-center items-center`]}>
+              <View style={tw`flex-1`}>
+                <TextBasic style={tw`font-metroSB Text-black`}>
+                  Update Terakhir
+                </TextBasic>
+                <TextBasic>-</TextBasic>
+              </View>
+
+              <View>
+                <Switch
+                  trackColor={{false: '#DADADA', true: '#DADADA'}}
+                  thumbColor={isRscConnected ? '#2ab7a8' : '#C30010'}
+                  ios_backgroundColor="#3e3e3e"
+                  onValueChange={() => {
+                    if (isRscConnected) {
+                      disconnectDevice();
+                      setIsRscConnected(false);
+                      dispatch(setConnectedDevice({connectedDevice: null}));
+                    } else {
+                      onConnectingToDevice();
+                    }
+                  }}
+                  value={isRscConnected}
+                />
+              </View>
+            </View>
+          </CardBasic>
+        </CardBasic>
+
+        <CardBasic style={tw`mb-5 bg-white p-5`}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB mb-5`}>
+            Menu RSC
+          </TextBasic>
+          <View style={[tw`flex-1 flex-row `]}>
+            <ButtonCircle
+              customText={sensorDevices?.tokens || '-'}
+              label={'Token'}
+              // beta={true}
+              betaStyle={tw`font-metroSB Text-red-600 absolute -top-1 right-5`}
+            />
+            <ButtonCircle
+              customIcon={<IconDatabaseSearch size={25} color={'#1f2e45'} />}
+              label={'History'}
+              // beta={true}
+              betaStyle={tw`font-metroSB Text-red-600 absolute -top-1 right-5`}
+              onPress={() =>
+                navigation.navigate('DataHistory', {
+                  cultivationId: cultivationList[cultivationQueue]._id,
+                })
+              }
+            />
+            <ButtonCircle
+              customIcon={<IconClipboardData size={25} color={'#1f2e45'} />}
+              label={'Analisis'}
+              beta={true}
+              betaStyle={tw`font-metroSB Text-red-600 absolute -top-1 right-5`}
+            />
+          </View>
+        </CardBasic>
+
+        <CardBasic style={tw`mb-5 bg-white p-5`}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB mb-5`}>
+            Sampling RSC
+          </TextBasic>
+
+          {/* step 1 */}
+          <View style={tw`flex-1`}>
+            <View style={tw`flex-1 flex-row justify-center items-center`}>
+              <View style={tw`ml-3.4 bg-toscaSB w-0.5 h-17`} />
+              <View
+                style={tw`absolute bg-toscaSB w-7 h-7 rounded-full justify-center items-center left-0`}>
+                <TextBasic style={tw`Text-white`}>1</TextBasic>
+              </View>
+              <View style={tw`flex-1 flex-row ml-7 items-center`}>
+                <TextBasic style={tw`flex-1 font-metroSB Text-toscaSB`}>
+                  Pilih Lokasi
+                </TextBasic>
+                <TouchableOpacity
+                  onPress={() => {
+                    const locationList = locations.filter(
+                      v =>
+                        v.cultivationId ===
+                        cultivationList[cultivationQueue]._id,
+                    );
+                    if (!locationList.length) {
+                      reqGetLocations(cultivationList[cultivationQueue]._id);
+                    }
+                    onShowModal('optionLocation', true);
+                  }}
+                  style={tw`flex-1 flex-row bg-${
+                    formRSC?.locationId ? 'toscaSS' : 'mainSB'
+                  } rounded-4 items-center px-5 h-13`}>
+                  <TextBasic
+                    style={tw`flex-1 font-metroSB Text-center Text-toscaSB`}>
+                    {formRSC?.locationName
+                      ? formRSC?.locationName
+                      : 'Pilih lokasi'}
+                  </TextBasic>
+                </TouchableOpacity>
+              </View>
+            </View>
+          </View>
+
+          {/* step 2 */}
+          <View style={tw`flex-1`}>
+            <View style={tw`flex-1 flex-row justify-center items-center`}>
+              <View style={tw`ml-3.4 bg-toscaSB w-0.5 h-17`} />
+              <View
+                style={tw`absolute bg-toscaSB w-7 h-7 rounded-full justify-center items-center left-0`}>
+                <TextBasic style={tw`Text-white`}>2</TextBasic>
+              </View>
+              <View style={tw`flex-1 flex-row ml-7 items-center`}>
+                <TextBasic style={tw`flex-1 font-metroSB Text-toscaSB`}>
+                  Pilih Mode
+                </TextBasic>
+                <TouchableOpacity
+                  onPress={() => {
+                    setFormRSC(prev => ({
+                      ...prev,
+                      mode: prev.mode === 'Auto' ? 'Manual' : 'Auto',
+                    }));
+                  }}
+                  style={tw`flex-1 bg-${
+                    formRSC?.mode ? 'toscaSS' : 'mainSB'
+                  } rounded-4 items-center justify-center px-5 h-13`}>
+                  <TextBasic style={tw`font-metroSB Text-toscaSB`}>
+                    {formRSC.mode === 'Auto'
+                      ? 'RSC / Auto'
+                      : 'Input ' + formRSC.mode}
+                  </TextBasic>
+                </TouchableOpacity>
+              </View>
+            </View>
+          </View>
+
+          {/* step 3 */}
+          <View style={tw`flex-1`}>
+            <View style={tw`flex-1 flex-row justify-center items-center`}>
+              <View style={tw`ml-3.4 bg-toscaSB w-0.5 h-17`} />
+              <View
+                style={tw`absolute bg-toscaSB w-7 h-7 rounded-full justify-center items-center left-0`}>
+                <TextBasic style={tw`Text-white`}>3</TextBasic>
+              </View>
+              <View style={tw`flex-1 flex-row ml-7 items-center`}>
+                <TouchableOpacity
+                  disabled={!formRSC?.locationId}
+                  style={tw`flex-1 flex-row bg-${
+                    formRSC?.locationId ? 'toscaB' : 'mainSB'
+                  } rounded-4 items-center justify-center px-5 h-13`}
+                  onPress={() => {
+                    if (formRSC.mode === 'Auto') {
+                      if (isRscConnected) {
+                        // init loading and value sensorDevices
+                        dispatch(setSensorDevices({sensorDevices: {}}));
+                        dispatch(
+                          setGlobalAlert({
+                            isVisible: true,
+                            status: 'loading',
+                            title: 'Request data ke RSC',
+                          }),
+                        );
+
+                        // request data from RSC
+                        requestDataDevice();
+                      } else {
+                        return dispatch(
+                          setGlobalAlert({
+                            isVisible: true,
+                            status: 'error',
+                            title: 'HP belum terhubung ke RSC!',
+                            subtitle:
+                              'Hubungkan terlebih dahulu perangkat HP dengan RSC.',
+                          }),
+                        );
+                      }
+                    } else {
+                      setDataRSC(prev => ({...prev, ...sensorDevices}));
+                    }
+                    setModalMenu('formRSC');
+                    setModalVisible(true);
+                  }}>
+                  {formRSC.mode === 'Auto' ? (
+                    <IconPlug
+                      style={{transform: [{rotate: '90deg'}]}}
+                      size={20}
+                      color={formRSC?.locationId ? '#fff' : '#12646a'}
+                    />
+                  ) : null}
+                  <TextBasic
+                    style={tw`ml-2 font-metroSB Text-${
+                      formRSC?.locationId ? 'white' : 'toscaSB'
+                    }`}>
+                    {formRSC.mode === 'Auto' ? 'Scan RSC' : 'Mulai Input Data'}
+                  </TextBasic>
+                </TouchableOpacity>
+              </View>
+            </View>
+          </View>
+        </CardBasic>
+      </View>
+    );
+  };
+
+  /**
+   * Lists of render UI Modal
+   * place all render modal below
+   */
+  const renderModalListDevices = () => {
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg`}>
+          Pilih perangkat
+        </TextBasic>
+        <TextBasic style={tw`mb-5`}>
+          Pilih salah satu device kelana dibawah ini
+        </TextBasic>
+
+        {scannedDevices &&
+          scannedDevices.map((device, index) => (
+            <TouchableOpacity
+              key={index.toString()}
+              style={[
+                tw`flex-row items-center p-4 py-4 border border-mainB border-t${
+                  index === 0 ? '' : '-0'
+                } rounded-t-${index === 0 ? '5' : 'none'} rounded-b-${
+                  scannedDevices.length - 1 === index ? '5' : 'none'
+                }`,
+              ]}
+              onPress={() => {
+                let params = {device, isRscConnected};
+                connectDevice(params, (res, err) => {
+                  if (err) {
+                    throw Error(err);
+                  }
+                  setIsRscConnected(res.switchStatus);
+                  setModalVisible(false);
+                });
+              }}>
+              <View
+                style={[
+                  tw`rounded-full h-12 w-12 justify-center items-center bg-toscaSS`,
+                ]}>
+                <IconCpu2 color={'#12646a'} size={23} />
+              </View>
+              <View style={tw`ml-4`}>
+                <TextBasic style={[tw`Text-gray-400`]}>Serial Number</TextBasic>
+                <TextBasic style={[tw`font-metroSB Text-black`]}>
+                  {device?.name ? device.name.split('_')[2] : '-'}
+                </TextBasic>
+              </View>
+            </TouchableOpacity>
+          ))}
+      </View>
+    );
+  };
+
+  const renderModalOptionFarm = () => {
+    let optionFarmTmp = [...optionFarm];
+    if (
+      Constants.ROLES[user.status] === 'ADMIN' ||
+      Constants.ROLES[user.status] === 'AGRONOMIST'
+    ) {
+      optionFarmTmp.push({
+        label: 'Kelola Pengguna',
+        color: '#1d9da6',
+        icon: 'people-circle-outline',
+        navigation: 'FarmManageMembers',
+      });
+    }
+
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg`}>
+          Opsi Kebun
+        </TextBasic>
+        <TextBasic style={tw`mb-5`}>
+          Pilih salah satu opsi kebun dibawah ini
+        </TextBasic>
+
+        {optionFarmTmp.map((item, index) => (
+          <TouchableOpacity
+            key={index.toString()}
+            style={[
+              tw`flex-row items-center p-4 py-4 border border-mainB border-t${
+                index === 0 ? '' : '-0'
+              } rounded-t-${index === 0 ? '5' : 'none'} rounded-b-${
+                optionFarmTmp.length - 1 === index ? '5' : 'none'
+              }`,
+            ]}
+            onPress={() => {
+              setModalVisible(false);
+              if (item.navigation === 'FarmAddEdit') {
+                navigation.navigate('FarmAddEdit', {
+                  farmsId: detailFarm._id,
+                });
+              }
+              if (item.navigation === 'FarmManageMembers') {
+                navigation.navigate('FarmManageMembers', {
+                  // detailFarm,
+                  farmsId: detailFarm._id,
+                });
+              }
+            }}>
+            <Icons name={item.icon} color={item.color} size={25} />
+            <TextBasic style={[tw`font-metroM ml-3 Text-gray-600`]}>
+              {item.label}
+            </TextBasic>
+          </TouchableOpacity>
+        ))}
+      </View>
+    );
+  };
+
+  const renderModalFormRSC = () => {
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg`}>
+          {formRSC.mode === 'Auto' ? 'Hasil Scan RSC' : 'Input RSC Manual'}
+        </TextBasic>
+        <TextBasic style={tw`mb-3`}>
+          {formRSC.mode === 'Auto'
+            ? 'Berikut nilai sensor hasil scan dari RSC'
+            : 'Lengkapi seluruh form dibawah ini'}
+        </TextBasic>
+
+        <View style={tw`mb-5`}>
+          <View style={tw`flex-row mt-5 items-center`}>
+            <TextBasic style={tw`flex-1 Text-black font-metroSB`}>
+              Temperature (°C)
+            </TextBasic>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={
+                formRSC.mode === 'Manual' ? dataRSC.temp : sensorDevices.temp
+              }
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('temp', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>RH (%)</TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                Kelembaban relatif
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={formRSC.mode === 'Manual' ? dataRSC.rh : sensorDevices.rh}
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('rh', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>pH</TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                Derajat keasaman
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={formRSC.mode === 'Manual' ? dataRSC.ph : sensorDevices.ph}
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('ph', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>
+                TDS (ppm)
+              </TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                Jumlah zat terlarut
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={
+                formRSC.mode === 'Manual' ? dataRSC.tds : sensorDevices.tds
+              }
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('tds', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>
+                N / Nitrogen
+              </TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                (mg/kg)
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={formRSC.mode === 'Manual' ? dataRSC.n : sensorDevices.n}
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('n', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>
+                P / Fosfor
+              </TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                (mg/kg)
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={formRSC.mode === 'Manual' ? dataRSC.p : sensorDevices.p}
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('p', val)}
+            />
+          </View>
+          <View style={tw`flex-row mt-4 items-center`}>
+            <View style={tw`flex-1`}>
+              <TextBasic style={tw`Text-black font-metroSB`}>
+                K / Kalium
+              </TextBasic>
+              <TextBasic style={tw`Text-gray-400 font-metroM`}>
+                (mg/kg)
+              </TextBasic>
+            </View>
+            <TextInputBasic
+              editable={formRSC.mode === 'Manual' ? true : false}
+              inputStyle={tw`Text-base h-12 font-metroSB`}
+              placeholder={'0'}
+              value={formRSC.mode === 'Manual' ? dataRSC.k : sensorDevices.k}
+              keyboardType={'numeric'}
+              onChangeText={val => onUpdateSensor('k', val)}
+            />
+          </View>
+        </View>
+
+        <TouchableOpacity
+          style={tw`bg-toscaB rounded-4 items-center justify-center px-5 h-13`}
+          onPress={onSubmitData}>
+          <TextBasic style={tw`ml-2 font-metroSB Text-white`}>
+            Simpan Data
+          </TextBasic>
+        </TouchableOpacity>
+      </View>
+    );
+  };
+
+  const renderModalOptionLocation = () => {
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg`}>
+          Pilih Lokasi
+        </TextBasic>
+        <TextBasic style={tw`mb-5 leading-5`}>
+          {locations.length
+            ? 'Pilih salah satu lokasi dibawah ini'
+            : 'Belum ada lokasi, silahkan tambah terlebih dahulu dengan menekan tombol dibawah ini.'}
+        </TextBasic>
+
+        {locations.length ? (
+          locations.map((item, index) => (
+            <TouchableOpacity
+              key={index.toString()}
+              onPress={() => {
+                setFormRSC(prev => ({
+                  ...prev,
+                  locationName: item.name,
+                  locationId: item._id,
+                }));
+                setModalVisible(false);
+              }}
+              style={[
+                tw`flex-row items-center p-4 py-4 border border-mainB border-t${
+                  index === 0 ? '' : '-0'
+                } rounded-t-${index === 0 ? '5' : 'none'} rounded-b-${
+                  locations.length - 1 === index ? '5' : 'none'
+                }`,
+              ]}>
+              <View
+                style={[
+                  tw`rounded-full h-12 w-12 justify-center items-center bg-toscaSS`,
+                ]}>
+                <IconFlag3 color={'#12646a'} size={23} />
+              </View>
+              <View style={tw`ml-4`}>
+                <TextBasic style={[tw`font-metroSB Text-black`]}>
+                  {item.name}
+                </TextBasic>
+                <TextBasic style={[tw`Text-gray-400`]}>
+                  Sample Ke {index + 1}
+                </TextBasic>
+              </View>
+            </TouchableOpacity>
+          ))
+        ) : (
+          <TouchableOpacity
+            onPress={() => {
+              setModalVisible(false);
+              navigation.navigate('LocationsBread', {
+                breadType: 'add',
+                cultivationId: cultivationList[cultivationQueue]._id,
+              });
+            }}
+            style={tw`flex-row bg-toscaB rounded-5 items-center justify-center py-4`}>
+            <TextBasic style={tw`font-metroSB Text-white`}>
+              Tambah Lokasi
+            </TextBasic>
+          </TouchableOpacity>
+        )}
+      </View>
+    );
+  };
+
+  const renderModalHarvest = () => {
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg mb-2`}>
+          Panen / Selesai Budidaya
+        </TextBasic>
+        <TextBasic style={tw`mb-5 leading-5`}>
+          {
+            'Apakah anda yakin untuk panen / menyelesaikan budidaya ?\n\nJika "YA", klik tombol dibawah ini.'
+          }
+        </TextBasic>
+
+        <TouchableOpacity
+          onPress={() => {
+            setModalVisible(false);
+            onHarvest();
+          }}
+          style={tw`flex-row bg-toscaB rounded-5 items-center justify-center py-4`}>
+          <TextBasic style={tw`font-metroSB Text-white`}>
+            Selesaikan Budidaya / Panen
+          </TextBasic>
+        </TouchableOpacity>
+      </View>
+    );
+  };
+  
+  const renderModalSchedule = () => {
+      const ButtonCircle = ({ customText, isSelected, onPress }) => {
+        const circleStyle = isSelected
+          ? { backgroundColor: '#055B66' }
+          : { backgroundColor: 'gray' };
+      
+        return (
+          <TouchableOpacity
+            style={[circleStyle, tw`w-8 h-8 rounded-full mr-2 flex items-center justify-center`]}
+            onPress={onPress}
+          >
+            <TextBasic style={tw`Text-white`}>{customText}</TextBasic>
+          </TouchableOpacity>
+        );
+      };
+
+    return (
+      <View style={tw`mt-5`}>
+        <TextBasic style={tw`font-metroSB Text-black Text-lg`}>
+          Pilih Jadwal
+        </TextBasic>
+        <TextBasic style={tw`mb-5 leading-5`}>
+          Pilih salah satu jadwal dibawah ini
+        </TextBasic>
+
+        <View style={tw`mb-1 flex-row mt-1`}>
+        <ButtonRegular
+              style={tw`flex-1 leading-5`}
+              label={'Sekali'}
+              onPress={handleSekaliButtonPress}
+            />
+             <ButtonRegular
+              style={tw`flex-1 bg-toscaSS`}
+              labelStyle={tw`Text-toscaSB`}
+              label={'Ulangi'}
+              onPress={handleUlangiButtonPress}
+            />
+        </View>
+
+        {isHariVisible && (
+        <View style={tw`mb-5 leading-5`}>
+          <TextBasic style={tw`Text-black font-metroSB Text-sm mb-2`}>
+            Pilih Hari
+          </TextBasic>
+          <View style={tw`mb-1 flex-row mt-1`}>
+          {days.map((day, index) => (
+            <ButtonCircle
+              key={index}
+              customText={day}
+              isSelected={day === 'All' ? selectedDays.length === Object.values(dayValues).filter((value) => value !== 'x').length : selectedDays.includes(dayValues[day])}
+              onPress={() => toggleDay(day)}
+            />
+          ))}
+        </View>
+        </View>
+        )}
+
+        {isTanggalVisible && (
+        <View style={tw`mb-5 leading-5`}>
+          <TextBasic style={tw`Text-black font-metroSB Text-sm mb-2`}>
+            Pilih Tanggal
+          </TextBasic>
+          <View style={tw`flex-row mb-1`}>
+          <ButtonParent
+            onPress={() => setDatePickerVisible(true)}
+            style={tw`flex-1 bg-mainSB border-gray-200 py-4.5 flex-row items-center`}>
+            <TextBasic
+              style={tw`font-metroM Text-${
+                scheduleOneTime?.Tanggal ? 'black' : 'gray-400'
+              } flex-1`}>
+              {scheduleOneTime?.Tanggal
+                ? moment(scheduleOneTime?.Tanggal).format('D MMMM YYYY')
+                : 'Pilih tanggal tanam'}
+            </TextBasic>
+            <IconCaretDownFilled size={17} color={'#999'} />
+          </ButtonParent>
+            </View>
+        </View>
+        )}
+
+        <View style={tw`flex-row mb-1`}>
+        <ButtonParent
+            onPress={() => settimePickerVisible1(true)}
+            style={tw`flex-1 bg-mainSB border-gray-200 py-4.5 flex-row items-center`}>
+            <TextBasic
+              style={tw`font-metroM Text-${
+                scheduleOneTime?.Waktumulai ? 'black' : 'gray-400'
+              } flex-1`}>
+              {scheduleOneTime?.Waktumulai
+                ? moment(scheduleOneTime?.Waktumulai).format('HH:mm')
+                : 'Waktu mulai'}
+            </TextBasic>
+            <IconCaretDownFilled size={14} color={'#999'} />
+          </ButtonParent>
+          <ButtonParent
+            onPress={() => settimePickerVisible2(true)}
+            style={tw`flex-1 bg-mainSB border-gray-200 py-4.5 flex-row items-center`}>
+            <TextBasic
+              style={tw`font-metroM Text-${
+                scheduleOneTime?.Waktuselesai ? 'black' : 'gray-400'
+              } flex-1`}>
+              {scheduleOneTime?.Waktuselesai
+                ? moment(scheduleOneTime?.Waktuselesai).format('HH:mm')
+                : 'Waktu Selesai'}
+            </TextBasic>
+            <IconCaretDownFilled size={14} color={'#999'} />
+          </ButtonParent>
+        </View>
+
+        <View style={tw`flex-row mb-1`}>
+            <TouchableOpacity
+              onPress={() => setPickerVisible(true)}
+              style={tw`flex-1 bg-mainSB border-gray-200 py-4.5 flex-row items-center`}
+            >
+              <TextBasic style={tw`font-metroM Text-flex-1`}>
+                {selectedOption ? selectedOption : 'Pilih Tinggi Gerbang'}
+              </TextBasic>
+              <IconCaretDownFilled size={17} color={'#999'} />
+            </TouchableOpacity>
+
+            <Modal
+              visible={isPickerVisible}
+              animationType="slide"
+            >
+              <View style={tw`flex-1 justify-center items-center`}>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect(null)}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}> Tinggi Gerbang</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => {
+                    Gantitanggal({ gt: '1' })
+                    setPickerVisible(false);
+                  }}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>25%</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => {
+                    Gantitanggal({ gt: '2' })
+                    setPickerVisible(false);
+                  }}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>50%</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() =>{
+                    Gantitanggal({ gt: '3' })
+                    setPickerVisible(false);
+                  }}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>75%</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() =>{
+                    Gantitanggal({ gt: '4' })
+                    setPickerVisible(false);
+                  }}
+                  style={tw`bg-white py-4 px-6`}
+                >
+                  <TextBasic style={tw`font-metroM`}>100%</TextBasic>
+                </TouchableOpacity>
+              </View>
+            </Modal>
+          </View>
+
+        <TouchableOpacity
+          onPress={() => {
+            setIsJadwalAdded(true);
+            if (scheduleOneTime.mode === 'OT') {
+              const time1 = `${scheduleOneTime.mode}${moment(scheduleOneTime.Waktumulai).format('HHmm')}${moment(scheduleOneTime.Waktuselesai).format('HHmm')}${moment(scheduleOneTime.Tanggal).format('DDMMYYYY')}${scheduleOneTime.Gate}`;
+              connectAndPublish('Irigate/time1', time1);
+            } else if (scheduleOneTime.mode === 'SH') {
+              console.log(scheduleOneTime.SetiapHari);
+              Gantitanggal({ sh: selectedDays });
+              const time2 = `${scheduleOneTime.mode}${moment(scheduleOneTime.Waktumulai).format('HHmm')}${moment(scheduleOneTime.Waktuselesai).format('HHmm')}${scheduleOneTime.SetiapHari.join('')}${scheduleOneTime.Gate}`;
+              console.log ({time2});
+              connectAndPublish('Irigate/time2', time2);
+            }
+          }}
+          style={tw`flex-row bg-toscaB rounded-5 items-center justify-center py-4`}>
+          <TextBasic style={tw`font-metroSB Text-white`}>
+            Tambah Jadwal
+          </TextBasic>
+        </TouchableOpacity>
+
+        {isJadwalAdded && (
+      //  <TextBasic style={'twfont-metroSB Text-black Text-lg'}>           
+      //   mode :  {scheduleOneTime.mode}            
+      //   Waktumulai :  {moment(scheduleOneTime.Waktumulai).format('HH:mm')}           
+      //   Waktuselesai :  {moment(scheduleOneTime.Waktuselesai).format('HH:mm')}           
+      //   Tanggal :  {moment(scheduleOneTime.tgl).format('DD-MM-YYYY')}           
+      //   TinggiGerbang :  {scheduleOneTime.Gate}
+      //   </TextBasic>
+      <CustomCardA
+            title={'Jadwal'}
+            onPress={() => {
+              setModalMenu('hasil_penjualan');
+              setModalVisible(true);
+            }}
+            onPressShow={() =>
+              setContentVisible(prevState => {
+                return {
+                  ...prevState,
+                  hasilPenjualan: !prevState.hasilPenjualan,
+                };
+              })
+            }
+            isContentShow={scheduleOneTime && scheduleOneTime.mode}
+              content={
+                <View>
+                  {/* list item */}
+                  <View style={[styles.listViewBordered, {flex: 1}]}>
+                    <View>
+                      <TextBasic
+                        style={[
+                          styles.metroSB,
+                          {
+                            fontSize: 15,
+                            color: '#333',
+                          },
+                        ]}>
+                        {scheduleOneTime.mode}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroM]}>Harga {'Rp 20.000'}</TextBasic>
+                      <TextBasic style={[styles.metroM]}>Qty {'5197.50'} Kg</TextBasic>
+
+                      <TextBasic style={[styles.metroM, {marginTop: 10}]}>
+                        Total Harga ={' '}
+                        <TextBasic style={[styles.metroSB, {color: '#218869'}]}>
+                          {'Rp 103.950.000'}
+                        </TextBasic>
+                      </TextBasic>
+                    </View>
+                  </View>
+
+                  {/* total */}
+                  <View
+                    style={[
+                      styles.headerDefault,
+                      {
+                        padding: 20,
+                        borderBottomWidth: 1.2,
+                        borderColor: '#DDDDDD',
+                      },
+                    ]}>
+                    <View style={{flexDirection: 'row', marginBottom: 5}}>
+                      <TextBasic style={[styles.metroSB, {flex: 1}]}>
+                        {'Mode :'}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroSB, {color: '#333'}]}>
+                        {scheduleOneTime.mode} 
+                      </TextBasic>
+                    </View>
+                    <View style={{flexDirection: 'row', marginBottom: 5}}>
+                      <TextBasic style={[styles.metroSB, {flex: 1}]}>
+                        {'Waktu Mulai :'}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroSB, {color: '#333'}]}>
+                        {moment(scheduleOneTime.Waktumulai).format('HH:mm')}
+                      </TextBasic>
+                    </View>
+                    <View style={{flexDirection: 'row', marginBottom: 5}}>
+                      <TextBasic style={[styles.metroSB, {flex: 1}]}>
+                        {'Waktu Selesai :'}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroSB, {color: '#333'}]}>
+                        {moment(scheduleOneTime.Waktuselesai).format('HH:mm')}
+                      </TextBasic>
+                    </View>
+                    <View style={{flexDirection: 'row', marginBottom: 5}}>
+                      <TextBasic style={[styles.metroSB, {flex: 1}]}>
+                        {'Tanggal :'}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroSB, {color: '#333'}]}>
+                        {moment(scheduleOneTime.Tanggal).format('DD-MM-YYYY')}
+                      </TextBasic>
+                    </View>
+                    <View style={{flexDirection: 'row', marginBottom: 5}}>
+                      <TextBasic style={[styles.metroSB, {flex: 1}]}>
+                        {'Tinggi Gerbang :'}
+                      </TextBasic>
+                      <TextBasic style={[styles.metroSB, {color: '#333'}]}>
+                        {scheduleOneTime.Gate}
+                      </TextBasic>
+                    </View>
+                  </View>
+                </View>
+              }
+            />
+      )}
+      </View>
+    );
+  };
+
+  const renderIrigate = () => {
+    
+    return (
+      <View style={tw`mb-5 p-5 pt-0`}>
+        <View style={[tw`flex-1 flex-row items-center rounded-t-7 mb-5`]}>
+          <TextBasic style={tw`flex-1 Text-black font-metroSB Text-base`}>
+            Smart Irrigate
+          </TextBasic>
+        </View>
+
+        <CardBasic style={tw`mb-5 bg-white p-5`}>
+
+          <View style={tw`flex-row rounded-5 shadow-none flex-1 items-center`}>
+          <Image
+              source={require('../../../assets/images/gate2.png')}
+              style={tw`rounded-full h-55 w-70 bg-toscaB justify-center items-center mr-3 border`}
+            />
+            <View style={tw`flex-1 ml-2`}>
+            </View>
+          </View>
+          
+           <View style={tw`flex-1 flex-row my-3 justify-center items-center`}>
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />
+            <TextBasic style={tw`mx-3 Text-gray-400`}>
+              Nilai Sensor
+            </TextBasic>
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />
+          </View>
+
+          <View style={[tw`flex-1 flex-row`]}>
+            <ButtonCircle
+              customText={
+                  `${Air} cm`
+              }
+              label={'Ketinggian Air'}
+            />
+            <ButtonCircle
+              customText={
+                 Status
+              }
+              label={'Status Gate'}
+            />
+              <ButtonCircle
+              customText={
+                 Temp
+              }
+              label={'Tinggi Gerbang'}
+            />
+            {/* { <ButtonCircle
+              customText={
+                 Mode
+              }
+              style={Mode === 'Mode 1' ? tw`bg-red-500` : tw`bg-blue-500`}
+              label={'Mode'}
+            /> } */}
+           </View>
+          {/* <View style={[tw`flex-1 flex-row`]}>
+            <ButtonCircle
+              customText={
+                  Humidity
+              }
+              label={'Humidity'}
+            />
+            <ButtonCircle
+              customText={
+                  Wflow
+              }
+              label={'Water Flow'}
+            />
+            <ButtonCircle
+              customText={
+                  Temp
+              }
+              label={'Temperaturer'}
+            /> 
+            <ButtonCircle
+            customText={
+              NPK === 1 ? '10' :
+              NPK === 2 ? '20' :
+              NPK === 3 ? '30' :
+              NPK === 4 ? '40' :
+              'Unknown'
+            }
+            label={'NPK'}
+          />
+          </View> */}
+
+          <View style={tw`flex-1 flex-row my-3 justify-center items-center`}>
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />
+            {/* <TextBasic style={tw`mx-3 Text-gray-400`}>
+              Nilai Sensor
+            </TextBasic> }
+            <View style={tw`flex-1 border-dashed border-b border-gray-300`} />*/}
+          </View> 
+
+          <TextBasic style={tw`font-metroSB Text-black mb-2`}>
+            Mode Otomatis
+          </TextBasic>
+          <View style={tw`flex-1 flex-row mb-5`}>
+          <ButtonParent
+            onPress={() => {
+              setIsOn(!isOn);
+              const mode = isOn ? 'OFF' : 'ON';
+              connectAndPublish('Irigate/AutoMode', mode, 'Irigate/Information');
+            }}
+            style={tw`flex-1 py-4.3 flex-row items-center mr-1 bg-${
+              isOn ? 'redSS border-0' : 'blueSB border-0'
+            }`}
+          >
+            <IconPower
+              color={isOn ? '#FF0000' : '#ffffff'}
+              size={20}
+            />
+            <TextBasic
+              style={[tw`font-metroM flex-1 Text-center`, { color: isOn ? '#FF0000' : '#ffffff' }]}
+            >
+              {isOn ? 'OFF' : 'ON'}
+            </TextBasic>
+          </ButtonParent>
+          </View>
+            
+          <TextBasic style={tw`font-metroSB Text-black mb-2`}>
+            Mode Manual
+          </TextBasic>
+          <View style={tw`mb-1 leading-10`}>
+            <TouchableOpacity
+              onPress={() => setPickerVisible(true)}
+              style={tw`flex-1 bg-mainSB border-gray-200 py-4.5 flex-row items-center`}
+            >
+              <TextBasic style={tw`font-metroM Text-flex-1`}>
+                {selectedOption ? selectedOption : 'Pilih Tinggi Gerbang'}
+              </TextBasic>
+              <IconCaretDownFilled size={17} color={'#999'} />
+            </TouchableOpacity>
+
+            <Modal
+              visible={isPickerVisible}
+              animationType="slide"
+            >
+              <View style={tw`flex-1 justify-center items-center`}>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect(null)}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>Pilih Tinggi Gerbang</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect('25%')}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>25%/12,5 cm</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect('50%')}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>50%/25 cm</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect('75%')}
+                  style={tw`bg-white py-4 px-6 border-b border-gray-200`}
+                >
+                  <TextBasic style={tw`font-metroM`}>75%/37,5 cm</TextBasic>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  onPress={() => handleOptionSelect('100%')}
+                  style={tw`bg-white py-4 px-6`}
+                >
+                  <TextBasic style={tw`font-metroM`}>100%/50 cm</TextBasic>
+                </TouchableOpacity>
+              </View>
+            </Modal>
+          </View>
+          
+          <View style={tw`flex-1 flex-row mt-5`}>
+             <ButtonRegular
+              style={tw`flex-1 mr-5 Text-blueSB bg-blueSS`}
+              label={'Buka'}
+              onPress={handleButtonPress}
+            />
+            {/* <ButtonRegular
+              style={tw`flex-row shadow-none rounded-5 flex-1 py-3.5 bg-mainSB justify-center items-center mr-5`}
+              labelStyle={tw`font-metroSB Text-black ml-2`}
+              label={'Stop'}
+              onPress={() => console.log('STOP')}
+            /> */}
+             <ButtonRegular
+              style={tw`flex-1 bg-redSS`}
+              labelStyle={tw`text-redSB`}
+              label={'Tutup'}
+              onPress={() => connectAndPublish('Irigate/relay', '0')}
+            />
+          </View>
+
+          {/* {cultivationList.length ? (
+            <View style={tw`flex-1 flex-row mt-5`}>
+              <View style={tw`flex-1 flex-row justify-center items-center`}>
+                <View style={tw`flex-100 flex-row ml-1 items-center`}>
+                  <TouchableOpacity
+                    onPress={() => {
+                      setModalMenu("schedule");
+                      renderModalSchedule();
+                      setModalVisible(true);
+                    }}
+                    style={tw`flex-1 flex-row bg-mainSB rounded-4 items-center px-5 h-13`}>
+                    <TextBasic
+                      style={tw`flex-1 font-metroSB Text-center Text-toscaSB`}>
+                      { 'Set-up Schedule'}
+                    </TextBasic>
+                  </TouchableOpacity>
+                </View>
+              </View>
+          </View>
+          ) : null} */}
+        </CardBasic>
+
+      </View>
+    );
+    
+  };
+
+
+  return (
+    <View style={[tw`flex-1`]}>
+      <KelanaStatusBar />
+      <KelanaNavbar
+        navigation={navigation}
+        backButton={true}
+        title={'Detail Kebun'}
+      />
+
+      <ContainerScrollView
+        refreshControl={
+          <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
+        }
+        childrenStyle={tw`px-0`}
+        header={renderHeader()}>
+        <View style={[tw`pb-5`]}>
+          {cultivationList.length ? renderCultivation() : null}
+          {cultivationList.length ? renderRSC() : null}
+          {/* {renderPlantInfo()} */}
+          {/* {renderFarmInfo()} */}
+          {/* {renderSampling()} */}
+          {cultivationList.length ? renderIrigate() : null}
+        
+        </View>
+      </ContainerScrollView>
+
+      <DateTimePickerModal
+        isVisible={datePickerVisible}
+        mode="date"
+        date={
+          scheduleOneTime?.Tanggal
+            ? new Date(scheduleOneTime?.Tanggal)
+            : new Date()
+        }
+        onConfirm={date => {
+          setDatePickerVisible(false);
+          Gantitanggal({ tgl: moment(date).valueOf() });
+        }}
+        onCancel={() => setDatePickerVisible(false)}
+      />
+      <DateTimePickerModal
+        isVisible={timePickerVisible1}
+        mode="time"
+        time={
+          scheduleOneTime?.Waktumulai
+            ? new Date(scheduleOneTime?.Waktumulai)
+            : new Date()
+        }
+        onConfirm={time => {
+          settimePickerVisible1(false);
+          Gantitanggal({wm: moment(time).valueOf() });
+        }}
+        onCancel={() => settimePickerVisible1(false)}
+      />
+      <DateTimePickerModal
+        isVisible={timePickerVisible2}
+        mode="time"
+        time={
+          scheduleOneTime?.Waktuselesai
+            ? new Date(scheduleOneTime?.Waktuselesai)
+            : new Date()
+        }
+        onConfirm={time => {
+          settimePickerVisible2(false);
+          Gantitanggal({ws: moment(time).valueOf() });
+        }}
+        onCancel={() => settimePickerVisible2(false)}
+      />
+      <ModalBasic
+        isVisible={modalVisible}
+        onClose={() => setModalVisible(prevState => !prevState)}
+        onSwipeComplete={() => setModalVisible(prevState => !prevState)}
+        swipeDirection={['down']}
+        style={tw`justify-end m-0`}>
+        <View>
+          {modalMenu === 'optionFarm' ? renderModalOptionFarm() : null}
+          {modalMenu === 'optionLocation' ? renderModalOptionLocation() : null}
+          {modalMenu === 'formRSC' ? renderModalFormRSC() : null}
+          {modalMenu === 'devicesBLE' ? renderModalListDevices() : null}
+          {modalMenu === 'harvest' ? renderModalHarvest() : null}
+          {modalMenu === 'schedule' ? renderModalSchedule() : null}
+
+
+
+          {/* {modalMenu === 'samplingType' ? renderModalSamplingType() : null} */}
+          {/* {modalMenu === 'phaseGrowth' ? renderModalPhaseGrowth() : null} */}
+        </View>
+      </ModalBasic>
+    </View>
+  );
+};
+
+export default FarmDetail;