esoftplay 0.0.127 → 0.0.128-a

package/assets/locale/id.json

@@ -0,0 +1,104 @@
+{
+  "lib/curl": {
+    "alert_title": "Oops..! Gagal menyambung ke server",
+    "alert_msg": "Sepertinya perangkatmu ada masalah jaringan",
+    "alert_ok": "Coba Lagi",
+    "alert_cancel": "Tutup",
+    "msg_failed": "Koneksi internet kamu tidak stabil, silahkan coba lagi",
+    "error_message": "Terjadi kesalahan, biar %s bereskan, silahkan coba lagi atau kembali ke halaman utama"
+  },
+  "lib/datepicker": {
+    "month1": "Januari",
+    "month2": "Februari",
+    "month3": "Maret",
+    "month4": "April",
+    "month5": "Mei",
+    "month6": "Juni",
+    "month7": "Juli",
+    "month8": "Agustus",
+    "month9": "September",
+    "month10": "Oktober",
+    "month11": "November",
+    "month12": "Desember",
+    "done": "Done"
+  },
+  "lib/dropdown": {
+    "select": "Select"
+  },
+  "lib/editbox": {
+    "btn_save": "Simpan"
+  },
+  "lib/document": {
+    "waiting_upload": "Mohon tunggu sedang mengunggah dokumen"
+  },
+  "lib/image_crop": {
+    "waiting": "Sedang menyiapkan...",
+    "waiting_crop": "Sedang memotong gambar..",
+    "alert_out": "Garis putus-putus tidak boleh keluar dari gambar",
+    "text_msg": "Geser dan cubit layar untuk menyesuaikan bagian foto yang ingin dipakai (pastikan bagian foto berada di dalam garis putus-putus) lalu crop jika sudah sesuai",
+    "btn_save": "SIMPAN"
+  },
+  "lib/image_multi": {
+    "selected": " Selected"
+  },
+  "lib/image_shadow": {
+    "error": "width and height is required"
+  },
+  "lib/image": {
+    "cam_title": "%s tidak dapat mengakses kamera ",
+    "cam_msg": "Mohon Pastikan anda memberikan izin %s untuk dapat mengambil foto",
+    "gallery_title": "%s tidak dapat mengakses galeri ",
+    "gallery_msg": "Mohon Pastikan anda memberikan izin %s untuk dapat mengambil foto",
+    "wait": "Mohon tunggu, Sedang mengunggah foto",
+    "wait_upload": "Mohon Tunggu, Sedang mengunggah foto"
+  },
+  "lib/infinite": {
+    "empty_data": "Belum ada data"
+  },
+  "lib/net_status": {
+    "online": "Device is Online",
+    "offline": "Device is Offline"
+  },
+  "lib/notification": {
+    "permission": "Please enable notifications permissions"
+  },
+  "lib/roll": {
+    "failed": "Failed to access"
+  },
+  "lib/updater": {
+    "alert_info": "Informasi",
+    "alert_msg": "Pembaharuan berhasil diinstall",
+    "ok": "Ok",
+    "alert_dev": "Development Mode",
+    "alert_dev_msg": "Update not working in development mode!",
+    "alert_title": "App is fine",
+    "alert_expo": "Your app is up-to-date",
+    "wait_check": "Sedang memeriksa versi terbaru",
+    "alert_update": "App is fine",
+    "alert_uptodate": "Your app is up-to-date"
+  },
+  "lib/utils": {
+    "toas_latlongfrom": "LatLongFrom tidak valid",
+    "toas_latlongto": "LatlongTo tidak valid"
+  },
+  "lib/version": {
+    "update": "Update",
+    "skip": "Nanti",
+    "update_now": "Update to a new version now",
+    "version_available": "A new version is available",
+    "btn_update": "Update Sekarang"
+  },
+  "lib/video": {
+    "missing_code": "Missing Youtube Code in Props"
+  },
+  "main/index": {
+    "helo_msg": "Hellow Esoftplay developer, jangan lupa bismillah dulu. (-̀ᴗ-́)و ̑̑"
+  },
+  "use/deeplink": {
+    "msg_err": "Oops...!"
+  },
+  "user/login": {
+    "username": "username",
+    "pass": "password"
+  }
+}

package/bin/build.js

@@ -363,6 +363,7 @@ export default function App() {
 				cmd += "&& expo install " + installExpoLibs.join(" ")
 			execSync(cmd)
 			execSync("cd ../../ && node ./node_modules/esoftplay/bin/router.js || true")
+			execSync("cd ../../ && node ./node_modules/esoftplay/bin/locale.js")
 			console.log('App.js has been replace to App.tsx');
 			// /* bugfix AsyncStorage @firebase, remove this section if firebase has update the AsyncStorage */
 			// if (fs.existsSync('../@firebase/app/dist/index.rn.cjs.js')) {

package/bin/locale.js

@@ -0,0 +1,18 @@
+const fs = require('fs')
+const merge = require('lodash/merge')
+
+function readAsJson(path) {
+  let out = ""
+  try { out = JSON.parse(fs.readFileSync(path, { encoding: 'utf8' })) } catch (e) { }
+  return out;
+}
+if (!fs.existsSync("./assets/locale/id.json")) {
+  fs.writeFileSync("./assets/locale/id.json", JSON.stringify({}, undefined, 2))
+}
+if (fs.existsSync("./assets/locale/id.json")) {
+  let masterLocale = readAsJson('./node_modules/esoftplay/assets/locale/id.json')
+  let projectLang = readAsJson("./assets/locale/id.json")
+  let _lg = merge(masterLocale, projectLang)
+  masterLocale = { ..._lg }
+  fs.writeFileSync("./assets/locale/id.json", JSON.stringify(masterLocale, undefined, 2))
+}

package/bin/router.js

@@ -612,7 +612,9 @@ function createRouter() {
   staticImport.push("export function applyStyle(style){ return style };\n")
   staticImport.push("export { default as useGlobalState } from '../../../node_modules/esoftplay/global';\n")
   staticImport.push("export { default as usePersistState } from '../../../node_modules/esoftplay/persist';\n")
+  staticImport.push("export { default as useGlobalSubscribe } from '../../../node_modules/esoftplay/subscribe';\n")
   staticImport.push("export { default as useSafeState } from '../../../node_modules/esoftplay/state';\n")
+  staticImport.push("export { default as useLazyState } from '../../../node_modules/esoftplay/lazy';\n")
   staticImport.push("export { default as esp } from '../../../node_modules/esoftplay/esp';\n")
   // staticImport.push("export { default as createCache } from '../../../node_modules/esoftplay/_cache';\n")
   staticImport.push("export { default as _global } from '../../../node_modules/esoftplay/_global';\n")
@@ -625,21 +627,28 @@ function createRouter() {
         Navigations.push(nav);
       }
       AllRoutes.push(nav)
+      let fileExt = 'js'
       Task += "\t\t" + 'case "' + nav + '":' + "\n\t\t\t" + 'Out = require("../../.' + Modules[module][task] + '")?.default' + "\n\t\t\t" + 'break;' + "\n";
       TaskProperty += "\t\t" + 'case "' + nav + '":' + "\n\t\t\t" + 'Out = require("../../.' + Modules[module][task] + '")' + "\n\t\t\t" + 'break;' + "\n";
       /* ADD ROUTER EACH FILE FOR STATIC IMPORT */
-      var item = "import { stable } from 'usestable';\nimport { default as _" + ucword(module) + ucword(task) + " } from '../../../../." + Modules[module][task] + "';\n"
+      var item = `import { stable } from 'usestable';\n`
       if (HookModules.includes(nav)) {
+        // fileExt = 'tsx'
         item += "" +
+          "import React from 'react'\n" +
+          "const _" + ucword(module) + ucword(task) + " = React.lazy(() => import('../../../../." + Modules[module][task] + "')); \n" +
           "import * as " + ucword(module) + ucword(task) + SuffixHooksProperty + " from '../../../../." + Modules[module][task] + "';\n" +
-          "var " + ucword(module) + ucword(task) + " = stable(_" + ucword(module) + ucword(task) + "); \n" +
+          "const UpdatedComponent = (OriginalComponent) => { function "+ucword(module) + ucword(task)+"Component(props) { return ( <React.Suspense><OriginalComponent {...props} /></React.Suspense> ) } return "+ucword(module) + ucword(task)+"Component; };\n" +
+          "const " + ucword(module) + ucword(task) + " = stable(UpdatedComponent(_" + ucword(module) + ucword(task) + ")); \n" +
           "export { " + ucword(module) + ucword(task) + SuffixHooksProperty + ", " + ucword(module) + ucword(task) + " };\n"
       } else if (UseLibs.includes(nav)) {
         item += "" +
+          "import { default as _" + ucword(module) + ucword(task) + " } from '../../../../." + Modules[module][task] + "';\n" +
           "import * as " + ucword(module) + ucword(task) + SuffixHooksProperty + " from '../../../../." + Modules[module][task] + "';\n" +
-          "var " + ucword(module) + ucword(task) + " = _" + ucword(module) + ucword(task) + "; \n" +
+          "const " + ucword(module) + ucword(task) + " = _" + ucword(module) + ucword(task) + "; \n" +
           "export { " + ucword(module) + ucword(task) + SuffixHooksProperty + ", " + ucword(module) + ucword(task) + " };\n"
       } else {
+        item += "import { default as _" + ucword(module) + ucword(task) + " } from '../../../../." + Modules[module][task] + "';\n"
         item += "export { _" + ucword(module) + ucword(task) + " as " + ucword(module) + ucword(task) + " };\n"
       }
 
@@ -649,8 +658,8 @@ function createRouter() {
       if (!fs.existsSync(tmpDir + nav))
         fs.mkdirSync(tmpDir + nav)
 
-      if (isChange(tmpDir + nav + "/import.js", item)) {
-        fs.writeFile(tmpDir + nav + '/import.js', item, { flag: 'w' }, function (err) {
+      if (isChange(tmpDir + nav + "/import." + fileExt, item)) {
+        fs.writeFile(tmpDir + nav + '/import.' + fileExt, item, { flag: 'w' }, function (err) {
           if (err) {
             return console.log(err);
           }
@@ -728,7 +737,8 @@ function createRouter() {
     const orientation = NavsOrientation[nav]
     const [module, task] = nav.split('/')
     const comp = ucword(module) + ucword(task)
-    importer.push(`import { ${comp} } from ${'"esoftplay/cache/' + module + '/' + task + '/import"'}`)
+    importer.push(`import { ${comp}
+      } from ${'"esoftplay/cache/' + module + '/' + task + '/import"'} `)
     if (orientation)
       screens.push("\t\t\t\t" + "<Stack.Screen name={\"" + nav + "\"} options={{ orientation: '" + orientation + "' }} component={" + comp + "} />")
     else

package/error.ts

@@ -22,11 +22,12 @@ export function setError(error?: any) {
   const config = esp?.config?.();
   const routes = UserRoutes?.state()?.get?.();
   const user = UserClass?.state()?.get?.();
-  const lastIndex = (routes?.routes?.length - 1) ?? 0;
+  const routesName = routes?.routes?.map((x) => x.name)
+
   const _e = {
     user,
     error: String(error),
-    routes: `${routes?.routes?.[lastIndex]?.name}`
+    routes: routesName
   };
   try {
     AsyncStorage.setItem(`${config?.domain}error`, JSON.stringify(_e));

package/esp.ts

@@ -122,7 +122,7 @@ const esp = {
     function sprintf(string: string, index: number): string {
       if (stringToBe[index] != undefined) {
         string = string.replace("%s", stringToBe[index])
-        if (string.includes("%s")) {
+        if (string?.includes?.("%s")) {
           return sprintf(string, index + 1)
         }
       }

package/global.ts

@@ -20,7 +20,8 @@ export interface useGlobalOption {
   inFile?: boolean,
   listener?: (data: any) => void,
   jsonBeautify?: boolean,
-  isUserData?: boolean
+  isUserData?: boolean,
+  onFinish?: () => void
 }
 
 export interface useGlobalConnect<T> {
@@ -37,8 +38,8 @@ const Context = {
     this.idx = 0
   }
 }
-
 export const globalIdx = Context
+let timeoutFinish: NodeJS.Timeout
 export default function useGlobalState<T>(initValue: T, o?: useGlobalOption): useGlobalReturn<T> {
   const STORAGE = o?.inFile ? Storage : AsyncStorage
   const _idx = o?.persistKey || globalIdx.idx
@@ -50,21 +51,29 @@ export default function useGlobalState<T>(initValue: T, o?: useGlobalOption): us
     let persistKey = o?.persistKey
     STORAGE.getItem(persistKey).then((p: any) => {
       if (p) {
-        if (p != undefined && typeof p == 'string' && (p.startsWith("{") || p.startsWith("[")))
-          try { set(JSON.parse(p)) } catch (error) { }
-        else {
-          if (p == "true" || p == "false") {
-            try { /* @ts-ignore */ set(eval(p)) } catch (error) { }
-          } else if (isNaN(p)) {
-            try { /* @ts-ignore */ set(p) } catch (error) { }
-          } else {
-            try { /* @ts-ignore */ set(eval(p)) } catch (error) { }
+        if (persistKey != '__globalReady')
+          if (p != undefined && typeof p == 'string' && (p.startsWith("{") || p.startsWith("[")))
+            try { set(JSON.parse(p)) } catch (error) { }
+          else {
+            if (p == "true" || p == "false") {
+              try { /* @ts-ignore */ set(eval(p)) } catch (error) { }
+            } else if (isNaN(p)) {
+              try { /* @ts-ignore */ set(p) } catch (error) { }
+            } else {
+              try { /* @ts-ignore */ set(eval(p)) } catch (error) { }
+            }
           }
-        }
+      }
+      if (o?.onFinish) {
+        clearTimeout(timeoutFinish)
+        timeoutFinish = setTimeout(() => {
+          o.onFinish?.()
+        }, 50);
       }
     })
   }
 
+
   /* register to userData to automatically reset state and persist */
   if (o?.isUserData) {
     function resetFunction() {

package/lazy.ts

@@ -0,0 +1,23 @@
+import { useLayoutEffect, useRef, useState } from 'react';
+
+export default function useLazyState<T>(initialState: T): [T, (newValue: T) => () => void] {
+  const [, rerender] = useState({})
+  const dispatch = () => { rerender({}) }
+  const value = useRef(initialState)
+  const isMounted = useRef(true)
+  const setter = (newValue: T) => {
+    if (isMounted.current)
+      value.current = newValue;
+    return () => {
+      if (isMounted.current)
+        dispatch()
+    }
+  }
+
+  useLayoutEffect(() => {
+    isMounted.current = true
+    return () => { isMounted.current = false }
+  }, [])
+
+  return [value.current, setter]
+}

package/modules/lib/collaps.tsx

@@ -14,6 +14,7 @@ export interface LibCollapsProps {
   show?: boolean,
   header: (isShow: boolean) => any,
   children: any,
+  onToggle?: (expanded: boolean) => void,
   style?: any
 }
 export default function m(props: LibCollapsProps): any {
@@ -40,7 +41,7 @@ export default function m(props: LibCollapsProps): any {
         runOnJS(setExpand)(false)
       }
     });
-    translateY.value = withTiming(opacity.value !== 0 ? -10 : 0, { duration: 300})
+    translateY.value = withTiming(opacity.value !== 0 ? -10 : 0, { duration: 300 })
   };
 
   function toggle() {
@@ -49,16 +50,19 @@ export default function m(props: LibCollapsProps): any {
     } else {
       toggleAnimation()
     }
+    if (props.onToggle) {
+      props.onToggle(!expand)
+    }
   }
 
   return (
     <Animated.View>
-       <Pressable onPress={toggle} style={{zIndex:11}} >
+      <Pressable onPress={toggle} style={{ zIndex: 11 }} >
         {props.header(expand)}
       </Pressable>
       {expand &&
         <Animated.View
-          style={[{ paddingBottom: expand ? 10 : 0, zIndex:10 }, animatedStyle]}>
+          style={[{ paddingBottom: expand ? 10 : 0, zIndex: 10 }, animatedStyle]}>
           {props.children}
         </Animated.View>
       }

package/modules/lib/curl.ts

@@ -31,10 +31,10 @@ export default class m {
   isSecure: boolean = false
   fetchConf: any = ''
   alertTimeout = {
-    title: "Oops..! Gagal menyambung ke server",
-    message: "Sepertinya perangkatmu ada masalah jaringan",
-    ok: "Coba Lagi",
-    cancel: "Tutup"
+    title: esp.lang("lib/curl", "alert_title"),
+    message: esp.lang("lib/curl", "alert_msg"),
+    ok: esp.lang("lib/curl", "alert_ok"),
+    cancel: esp.lang("lib/curl", "alert_cancel")
   }
 
   constructor(uri?: string, post?: any, onDone?: (res: any, msg: string) => void, onFailed?: (error: any, timeout: boolean) => void, debug?: number) {
@@ -163,7 +163,7 @@ export default class m {
           this.cancelTimeout()
           let resText = await res.text()
           if (res.status == 200 && resText == "") {
-            if (onFailed) onFailed({ message: "Koneksi internet kamu tidak stabil, silahkan coba lagi" }, false)
+            if (onFailed) onFailed({ message: esp.lang("lib/curl", "msg_failed") }, false)
             return
           }
           this.onFetched(resText,
@@ -176,7 +176,7 @@ export default class m {
         }).catch((r) => {
           this.cancelTimeout()
           LibProgress.hide()
-          LibToastProperty.show('Koneksi internet kamu tidak stabil, silahkan coba lagi')
+          LibToastProperty.show(esp.lang("lib/curl", "msg_failed"))
           this.onFetchFailed(r)
         })
       }
@@ -363,7 +363,7 @@ export default class m {
       this.resStatus = res.status
       let resText = await res.text()
       if (res.status == 200 && resText == "") {
-        if (onFailed) onFailed({ message: "Koneksi internet kamu tidak stabil, silahkan coba lagi" }, false)
+        if (onFailed) onFailed({ message: esp.lang("lib/curl", "msg_failed") }, false)
         return
       }
       //api_logger
@@ -379,7 +379,7 @@ export default class m {
       if (__DEV__) {
         console.warn(r)
       } else
-        LibToastProperty.show("Koneksi internet kamu tidak stabil, silahkan coba lagi")
+        LibToastProperty.show(esp.lang("lib/curl", "msg_failed"))
       this.onFetchFailed(r)
       LibProgress.hide()
     })
@@ -417,10 +417,10 @@ export default class m {
         ltext.includes('error')
       ) {
         // reportApiError(this.fetchConf.options, resText)
-        out = 'Terjadi kesalahan, biar ' + esp.appjson()?.expo?.name + ' bereskan, silahkan coba lagi atau kembali ke halaman utama'
+        out = esp.lang("lib/curl", "error_message", esp.appjson()?.expo?.name)
       }
       if (ltext.includes('timeout exceeded')) {
-        out = 'Koneksi internet kamu tidak stabil, silahkan coba lagi'
+        out = esp.lang("lib/curl", "msg_failed")
       }
     }
     return out

package/modules/lib/datepicker.tsx

@@ -1,6 +1,6 @@
 // withHooks
 // noPage
-import { useSafeState } from 'esoftplay';
+import { esp, useSafeState } from 'esoftplay';
 
 import { LibLoading } from 'esoftplay/cache/lib/loading/import';
 import { LibScrollpicker } from 'esoftplay/cache/lib/scrollpicker/import';
@@ -26,7 +26,21 @@ export default function m(props: LibDatepickerProps): any {
   const refDate = useRef<any>(null)
   const allYears = [1901, 1902, 1903, 1904, 1905, 1906, 1907, 1908, 1909, 1910, 1911, 1912, 1913, 1914, 1915, 1916, 1917, 1918, 1919, 1920, 1921, 1922, 1923, 1924, 1925, 1926, 1927, 1928, 1929, 1930, 1931, 1932, 1933, 1934, 1935, 1936, 1937, 1938, 1939, 1940, 1941, 1942, 1943, 1944, 1945, 1946, 1947, 1948, 1949, 1950, 1951, 1952, 1953, 1954, 1955, 1956, 1957, 1958, 1959, 1960, 1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022, 2023, 2024, 2025, 2026, 2027, 2028, 2029, 2030, 2031, 2032, 2033, 2034, 2035, 2036, 2037, 2038, 2039, 2040, 2041, 2042, 2043, 2044, 2045, 2046, 2047, 2048, 2049, 2050, 2051, 2052, 2053, 2054, 2055, 2056, 2057, 2058, 2059, 2060, 2061, 2062, 2063, 2064, 2065, 2066, 2067, 2068, 2069, 2070, 2071, 2072, 2073, 2074, 2075, 2076, 2077, 2078, 2079, 2080, 2081, 2082, 2083, 2084, 2085, 2086, 2087, 2088, 2089, 2090, 2091, 2092, 2093, 2094, 2095, 2096, 2097, 2098, 2099, 2100, 2101]
   const allDates = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31]
-  const allMonths = props.monthsDisplay || ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember']
+  const allMonths = props.monthsDisplay ||
+    [
+      esp.lang("lib/datepicker", "month1"),
+      esp.lang("lib/datepicker", "month2"),
+      esp.lang("lib/datepicker", "month3"),
+      esp.lang("lib/datepicker", "month4"),
+      esp.lang("lib/datepicker", "month5"),
+      esp.lang("lib/datepicker", "month6"),
+      esp.lang("lib/datepicker", "month7"),
+      esp.lang("lib/datepicker", "month8"),
+      esp.lang("lib/datepicker", "month9"),
+      esp.lang("lib/datepicker", "month10"),
+      esp.lang("lib/datepicker", "month11"),
+      esp.lang("lib/datepicker", "month12")
+    ]
   const minDate = props.minDate
   const maxDate = props.maxDate
   const selectedDate = props.selectedDate || minDate
@@ -164,7 +178,7 @@ export default function m(props: LibDatepickerProps): any {
     <View style={{ flex: 1, backgroundColor: 'white' }} >
       <View style={{ height: 44, alignItems: 'flex-end', backgroundColor: '#fafafa' }} >
         <TouchableOpacity onPress={() => { getDateChange() }} >
-          <Text style={{ fontSize: 15, fontWeight: "500", paddingHorizontal: 16, paddingVertical: 13, fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorPrimary }} >Done</Text>
+          <Text style={{ fontSize: 15, fontWeight: "500", paddingHorizontal: 16, paddingVertical: 13, fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorPrimary }} >{esp.lang("lib/datepicker", "done")}</Text>
         </TouchableOpacity>
       </View>
       <View style={{ height: 175, flexDirection: 'row' }} >

package/modules/lib/dropdown.tsx

@@ -1,5 +1,6 @@
 // withHooks
 
+import { esp } from 'esoftplay';
 import { LibStyle } from 'esoftplay/cache/lib/style/import';
 import React, { useEffect, useRef, useState } from "react";
 import { FlatList, Modal, Platform, Pressable, TextInput, View, ViewProps } from "react-native";
@@ -59,7 +60,7 @@ export default function m(props: LibDropdownProps) {
           pointerEvents="none"
           editable={false}
           style={[{ height: 40, borderWidth: 1, borderRadius: 2, borderColor: '#ccc' }, Platform.OS == 'web' ? { outlineWidth: 0 } : {}, props?.style]}
-          placeholder={props?.label || 'Select'}
+          placeholder={props?.label || esp.lang("lib/dropdown", "select")}
           value={currentValue?.value}
         />
       </Pressable>

package/modules/lib/editbox.tsx

@@ -1,5 +1,6 @@
 
 // noPage
+import { esp } from 'esoftplay';
 import { LibComponent } from 'esoftplay/cache/lib/component/import';
 import { LibInput } from 'esoftplay/cache/lib/input/import';
 import { LibKeyboard_avoid } from 'esoftplay/cache/lib/keyboard_avoid/import';
@@ -93,7 +94,7 @@ class m extends LibComponent<ComponentEditboxProps, ComponentEditboxState>{
                         ref={this.input}
                         {...props}
                       />
-                      <Button title="Simpan" color={LibStyle.colorPrimary} onPress={() => { onSubmit(this.input?.current?.getText?.()); m.hide(); }} />
+                      <Button title={esp.lang("lib/editbox", "btn_save")} color={LibStyle.colorPrimary} onPress={() => { onSubmit(this.input?.current?.getText?.()); m.hide(); }} />
                     </View>
                   </TouchableOpacity>
                 </LibKeyboard_avoid>

package/modules/lib/focus.tsx

@@ -18,7 +18,7 @@ export interface LibFocusState {
 }
 
 export default function m(props: LibFocusProps): any {
-
+  console.warn("LibFocus now DEPRECATED, will be remove on next update")
   const isFocused = useIsFocused()
 
   useEffect(() => {

package/modules/lib/global.tsx

@@ -0,0 +1,30 @@
+// withHooks
+// noPage
+
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import useGlobalState from 'esoftplay/global';
+import React from 'react';
+
+
+export interface LibGlobalArgs {
+
+}
+export interface LibGlobalProps {
+  waitForFinish: boolean,
+  waitingView?: any,
+  children?: any
+}
+const globalReady = useGlobalState(false, {
+  persistKey: "__globalReady",
+  onFinish: () => {
+    globalReady.set(true)
+  }
+})
+
+export default function m(props: LibGlobalProps): any {
+  const [ready] = globalReady.useState();
+  if (props.waitForFinish)
+    return ready ? props.children : props.waitingView || <LibLoading />
+  else
+    return props.children
+}

package/modules/lib/image.tsx

@@ -120,7 +120,7 @@ class m extends LibComponent<LibImageProps, LibImageState> {
           }
         }
         if (finalStatus != 'granted') {
-          Alert.alert(esp.appjson().expo.name + " tidak dapat mengakses kamera ", "Mohon Pastikan anda memberikan izin " + esp.appjson().expo.name + " untuk dapat mengambil foto")
+          Alert.alert(esp.lang("lib/image", "cam_title", esp.appjson().expo.name), esp.lang("lib/image", "cam_msg", esp.appjson().expo.name))
         }
         ImagePicker.launchCameraAsync({
           allowsEditing: Platform.OS != 'ios' && options && options.crop ? true : false,
@@ -158,7 +158,7 @@ class m extends LibComponent<LibImageProps, LibImageState> {
           finalStatus = status
         }
         if (finalStatus != 'granted') {
-          Alert.alert(esp.appjson().expo.name + " tidak dapat mengakses galeri ", "Mohon Pastikan anda memberikan izin " + esp.appjson().expo.name + " untuk dapat mengambil foto")
+          Alert.alert(esp.lang("lib/image", "gallery_title"), esp.lang("lib/image", "gallery_msg"))
           return
         }
         let max = 0
@@ -194,7 +194,7 @@ class m extends LibComponent<LibImageProps, LibImageState> {
           let a: string[] = []
           x.forEach(async (t: any, i) => {
             if (i == 0) {
-              LibProgress.show("Mohon tunggu, Sedang mengunggah foto")
+              LibProgress.show(esp.lang("lib/image", "wait"))
             }
             var wantedMaxSize = options?.maxDimension || 1280
             var rawheight = t.height
@@ -238,7 +238,7 @@ class m extends LibComponent<LibImageProps, LibImageState> {
   static processImage(result: any, maxDimension?: number): Promise<string> {
     return new Promise((r) => {
       if (!result.cancelled) {
-        LibProgress.show("Mohon Tunggu, Sedang mengunggah foto")
+        LibProgress.show(esp.lang("lib/image", "wait_upload"))
         var wantedMaxSize = maxDimension || 1280
         var rawheight = result.height
         var rawwidth = result.width

package/modules/lib/image_crop.tsx

@@ -1,5 +1,5 @@
 // withHooks
-import { useSafeState } from 'esoftplay';
+import { esp, useSafeState } from 'esoftplay';
 import { LibIcon } from 'esoftplay/cache/lib/icon/import';
 import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
 import { LibProgress } from 'esoftplay/cache/lib/progress/import';
@@ -42,7 +42,7 @@ export default function m(props: LibImage_cropProps): any {
   }
 
   function resize(image: string) {
-    LibProgress.show("Sedang menyiapkan...")
+    LibProgress.show(esp.lang("lib/image_crop", "waiting"))
     Image.getSize(image, async (actualWidth, actualHeight) => {
       var wantedMaxSize = 900
       var rawheight = actualHeight
@@ -85,7 +85,7 @@ export default function m(props: LibImage_cropProps): any {
   }
 
   function capture() {
-    LibProgress.show("Sedang memotong gambar..")
+    LibProgress.show(esp.lang("lib/image_crop", "waiting_crop"))
     let crop = {
       x: 0,
       y: 0,
@@ -166,7 +166,7 @@ export default function m(props: LibImage_cropProps): any {
             LibProgress.hide()
           }).catch(() => {
             LibProgress.hide()
-            LibToastProperty.show("Garis putus-putus tidak boleh keluar dari gambar")
+            LibToastProperty.show(esp.lang("lib/image_crop", "alert_out"))
           })
         })
       })
@@ -231,7 +231,7 @@ export default function m(props: LibImage_cropProps): any {
         <Pressable
           onPress={() => setHint(!hint)}
           style={{ opacity: hint ? 1 : 0, position: 'absolute', left: 0, right: 0, bottom: 50, backgroundColor: 'rgba(0,0,0,0.5)', alignItems: 'center', justifyContent: 'center', padding: 30 }} >
-          <Text style={{ color: "white", textAlign: 'center' }} >{message || "Geser dan cubit layar untuk menyesuaikan bagian foto yang ingin dipakai (pastikan bagian foto berada di dalam garis putus-putus) lalu crop jika sudah sesuai"}</Text>
+          <Text style={{ color: "white", textAlign: 'center' }} >{message || esp.lang("lib/image_crop", "text_msg")}</Text>
         </Pressable>
       }
       {
@@ -244,7 +244,7 @@ export default function m(props: LibImage_cropProps): any {
               }, () => { })
             }}
             style={{ height: 50, alignItems: 'center', justifyContent: 'center', backgroundColor: 'rgba(255,255,255,0.3)' }} >
-            <LibTextstyle textStyle="body" text="SIMPAN" style={{ color: "white" }} />
+            <LibTextstyle textStyle="body" text={esp.lang("lib/image_crop", "btn_save")} style={{ color: "white" }} />
           </TouchableOpacity>
         </View>
       }

package/modules/lib/image_multi.tsx

@@ -1,7 +1,7 @@
 // withHooks
 
 //noPage
-import { useSafeState } from 'esoftplay';
+import { esp, useSafeState } from 'esoftplay';
 import { LibIcon } from 'esoftplay/cache/lib/icon/import';
 import { LibLoading } from 'esoftplay/cache/lib/loading/import';
 import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
@@ -88,7 +88,7 @@ export default function m(props: LibImage_multiProps): any {
           <LibIcon name="close" />
         </TouchableOpacity>
         <View style={{ flex: 1, height: 50, justifyContent: 'center', alignItems: 'center' }} >
-          <LibTextstyle textStyle={"headline"} text={photos.filter((x: any) => x.selected).length + (max > 0 ? "/" + max : "") + " Selected"} style={{ color: "#000" }} />
+          <LibTextstyle textStyle={"headline"} text={photos.filter((x: any) => x.selected).length + (max > 0 ? "/" + max : "") + esp.lang("lib/image_multi", "selected")} style={{ color: "#000" }} />
         </View>
         <TouchableOpacity
           onPress={() => LibNavigation.sendBackResult(photos.filter((x: any) => x.selected))}