esoftplay-event 0.0.2 → 0.0.3

package/event/countdown_base.tsx

@@ -1,7 +1,6 @@
 // withHooks
-
+// noPage
 import esp from 'esoftplay/esp';
-import moment from 'esoftplay/moment';
 import React, { useEffect, useRef } from 'react';
 import { TextInput, View } from 'react-native';
 
@@ -11,6 +10,7 @@ export interface EventCountdown_baseArgs {
 }
 export interface EventCountdown_baseProps {
   expired: string,
+  timezone?: string,
   expiredText?: string,
   style?: any,
   containerStyle?: any,
@@ -22,68 +22,108 @@ export interface EventCountdown_baseProps {
 
 const fixSingleNumber = (number: number) => number < 10 ? '0' + number : number
 
+function parseTimezone(tz: string): string {
+  if (!tz) return '+00:00';
+  const lower = tz.toLowerCase().trim();
+
+  const match = lower.match(/gmt([+-]\d{1,2})(?::?(\d{1,2}))?(\.\d+)?/);
+  if (!match) return '+00:00';
+
+  const sign = match[1].startsWith('-') ? '-' : '+';
+  let hours = Math.abs(parseInt(match[1], 10));
+  let minutes = 0;
+
+  if (match[2]) {
+    minutes = parseInt(match[2], 10);
+  } else if (match[3]) {
+    minutes = Math.round(parseFloat(match[3]) * 60);
+  }
+
+  const hh = hours.toString().padStart(2, '0');
+  const mm = minutes.toString().padStart(2, '0');
+  return `${sign}${hh}:${mm}`;
+}
+
 export default function m(props: EventCountdown_baseProps): any {
   const ref = useRef<TextInput>(null)
-  let timmer = useRef<any>(undefined).current
+  let timmerRef = useRef<any>(undefined)
 
   useEffect(() => {
     countDown()
     return () => {
-      clearTimeout(timmer)
-      timmer = undefined
+      clearTimeout(timmerRef.current)
+      timmerRef.current = undefined
     }
   }, [])
 
   function countDown(): any {
     let expired = false
     function loop() {
-      const t = [esp.lang("market/countdown", "day"), esp.lang("market/countdown", "hour"), esp.lang("market/countdown", "minutes"), esp.lang("market/countdown", "second")]
-      const diffr = moment(props.expired).duration(moment().toDate());
-      const text = [
-        parseInt(diffr.asDays().toString()),
-        fixSingleNumber(parseInt(diffr.hours().toString())),
-        fixSingleNumber(parseInt(diffr.minutes().toString())),
-        fixSingleNumber(parseInt(diffr.seconds().toString()))
-      ]
-
-      if (text.every((x) => (Number(x) < 1 || isNaN(Number(x))))) {
-        expired = true
-        props.onExpired && props.onExpired()
-        ref?.current?.setNativeProps({ text: props.expiredText || esp.lang("market/countdown", "expired") })
-      } else if (text.length == 4 && text[0] != 0 && props.onlyDay) {
-        ref?.current?.setNativeProps({ text: text[0] + esp.lang("market/countdown", "days") })
-      } else if (text[0] == 0) {
-        text.splice(0, 1)
-        t.splice(0, 1)
-        if (text[0].toString() == '00') {
-          text.splice(0, 1)
-          t.splice(0, 1)
-          if (text[0].toString() == '00') {
-            text.splice(0, 1)
-            t.splice(0, 1)
-          }
+      const labels = [esp.lang("market/countdown", "day"), esp.lang("market/countdown", "hour"), esp.lang("market/countdown", "minutes"), esp.lang("market/countdown", "second")]
+
+      // @ts-ignore
+      const configGMT = esp.config("forcedGMT+") ? `GMT+${esp.config("forcedGMT+")}` : "GMT+7" // set default to GMT+7 Jakarta
+      const tzOffset = parseTimezone(props?.timezone || configGMT);
+      const serverDate = new Date(props.expired.replace(' ', 'T') + tzOffset);
+      const now = new Date();
+
+      const diffMs = serverDate.getTime() - now.getTime();
+
+      if (diffMs <= 0) {
+        expired = true;
+        props.onExpired?.();
+        ref.current?.setNativeProps({
+          text: props.expiredText || esp.lang('market/countdown', 'expired'),
+        });
+        return;
+      }
+
+      const totalSeconds = Math.floor(diffMs / 1000);
+      const days = Math.floor(totalSeconds / 86400);
+      const hours = Math.floor((totalSeconds % 86400) / 3600);
+      const minutes = Math.floor((totalSeconds % 3600) / 60);
+      const seconds = totalSeconds % 60;
+
+      const parts = [
+        days,
+        fixSingleNumber(hours),
+        fixSingleNumber(minutes),
+        fixSingleNumber(seconds),
+      ];
+
+      if (parts[0] != 0 && props.onlyDay) {
+        ref.current?.setNativeProps({
+          text: parts[0] + esp.lang('market/countdown', 'days'),
+        });
+      } else if (parts[0] == 0) {
+        const filteredParts = [...parts];
+        while (filteredParts.length > 1 && (filteredParts[0] === 0 || filteredParts[0] === "00")) {
+          filteredParts.splice(0, 1);
         }
-        ref?.current?.setNativeProps({ text: text.filter((x, i) => !isNaN(Number(x))).map((d, id) => d + (props?.hideTimeUnit ? '' : ' ' + t[id])).join(" : ") })
+
+        const filtered = filteredParts.map((d, i) =>
+          `${d}${props?.hideTimeUnit ? '' : ' ' + labels[parts.length - filteredParts.length + i]}`
+        );
+
+        ref.current?.setNativeProps({ text: filtered.join(' : ') });
       } else if (props?.showDayUnit && props?.hideTimeUnit) {
-        const data = text
-          .filter((x, i) => !isNaN(Number(x)))
-          .map((d, id) => {
-            return (d + (id == 0 ? " " + t[0] + " " : ""))
-          })
-        const firstData = data[0]
-        data.splice(0, 1)
-
-        ref?.current?.setNativeProps({
-          text: firstData + " " + data.join(" : ")
-        })
+        const data = parts.map(
+          (d, i) => d + (i === 0 ? ' ' + labels[0] + ' ' : '')
+        );
+
+        const first = data[0];
+        ref.current?.setNativeProps({
+          text: first + ' ' + data.slice(1).join(' : '),
+        });
       } else {
-        ref?.current?.setNativeProps({ text: text.filter((x, i) => !isNaN(Number(x))).map((d, id) => d + (props?.hideTimeUnit ? '' : ' ' + t[id])).join(" : ") })
-      }
-      if (!expired) {
-        timmer = setTimeout(() => {
-          loop()
-        }, 1000);
+        const filtered = parts.map(
+          (d, i) => `${d}${props?.hideTimeUnit ? '' : ' ' + labels[i]}`
+        );
+        ref.current?.setNativeProps({ text: filtered.join(' : ') });
       }
+
+      if (!expired) timmerRef.current = setTimeout(loop, 1000);
+
     };
     loop()
   }

package/event/countdown_event.tsx

@@ -3,6 +3,7 @@
 
 import { EventCountdown_base } from 'esoftplay/cache/event/countdown_base/import';
 import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import esp from 'esoftplay/esp';
 import React, { useEffect } from 'react';
 import { StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';
 import Animated, { useAnimatedStyle, useSharedValue, withRepeat, withTiming } from 'react-native-reanimated';
@@ -13,6 +14,7 @@ export interface EventCountdown_eventArgs {
 }
 export interface EventCountdown_eventProps {
   date: string,
+  timezone?: string,
   containerStyle?: StyleProp<ViewStyle>
   bulletStyle?: StyleProp<ViewStyle>,
   style?: StyleProp<TextStyle>
@@ -40,6 +42,7 @@ export default function m(props: EventCountdown_eventProps): any {
         expired={props.date}
         showDayUnit
         hideTimeUnit
+        timezone={props?.timezone}
         style={[{ fontFamily: "Arial", fontSize: 11, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4a4a4a" }, props?.style]}
       />
     </View>

package/event/countdown_timestamp.tsx

@@ -0,0 +1,106 @@
+// withHooks
+// noPage
+
+import esp from 'esoftplay/esp';
+import React, { useEffect, useRef } from 'react';
+import { TextInput, View } from 'react-native';
+
+export interface EventCountdown_timestampProps {
+  expiredTimestamp: number;
+  expiredText?: string;
+  style?: any;
+  containerStyle?: any;
+  onlyDay?: boolean;
+  onExpired?: () => void;
+  hideTimeUnit?: boolean;
+  showDayUnit?: boolean;
+}
+
+const fixSingleNumber = (n: number) => (n < 10 ? "0" + n : n);
+
+export default function CountdownTimestamp(props: EventCountdown_timestampProps) {
+  const ref = useRef<TextInput>(null)
+  let timmerRef = useRef<any>(undefined)
+
+  useEffect(() => {
+    countDown()
+    return () => {
+      clearTimeout(timmerRef.current)
+      timmerRef.current = undefined
+    }
+  }, [])
+
+  function countDown(): any {
+    let expired = false
+    function loop() {
+      const labels = [esp.lang("market/countdown", "day"), esp.lang("market/countdown", "hour"), esp.lang("market/countdown", "minutes"), esp.lang("market/countdown", "second")]
+
+      const expiredTimestamp = props.expiredTimestamp
+      const now = Date.now();
+      const diffMs = expiredTimestamp - now;
+
+      if (diffMs <= 0) {
+        expired = true;
+        props.onExpired?.();
+        ref.current?.setNativeProps({
+          text: props.expiredText || esp.lang('market/countdown', 'expired'),
+        });
+        return;
+      }
+
+      const totalSeconds = Math.floor(diffMs / 1000);
+      const days = Math.floor(totalSeconds / 86400);
+      const hours = Math.floor((totalSeconds % 86400) / 3600);
+      const minutes = Math.floor((totalSeconds % 3600) / 60);
+      const seconds = totalSeconds % 60;
+
+      const parts = [
+        days,
+        fixSingleNumber(hours),
+        fixSingleNumber(minutes),
+        fixSingleNumber(seconds),
+      ];
+
+      if (parts[0] != 0 && props.onlyDay) {
+        ref.current?.setNativeProps({
+          text: parts[0] + esp.lang('market/countdown', 'days'),
+        });
+      } else if (parts[0] == 0) {
+        const filteredParts = [...parts];
+        while (filteredParts.length > 1 && (filteredParts[0] === 0 || filteredParts[0] === "00")) {
+          filteredParts.splice(0, 1);
+        }
+
+        const filtered = filteredParts.map((d, i) =>
+          `${d}${props?.hideTimeUnit ? '' : ' ' + labels[parts.length - filteredParts.length + i]}`
+        );
+
+        ref.current?.setNativeProps({ text: filtered.join(' : ') });
+      } else if (props?.showDayUnit && props?.hideTimeUnit) {
+        const data = parts.map(
+          (d, i) => d + (i === 0 ? ' ' + labels[0] + ' ' : '')
+        );
+
+        const first = data[0];
+        ref.current?.setNativeProps({
+          text: first + ' ' + data.slice(1).join(' : '),
+        });
+      } else {
+        const filtered = parts.map(
+          (d, i) => `${d}${props?.hideTimeUnit ? '' : ' ' + labels[i]}`
+        );
+        ref.current?.setNativeProps({ text: filtered.join(' : ') });
+      }
+
+      if (!expired) timmerRef.current = setTimeout(loop, 1000);
+
+    };
+    loop()
+  }
+
+  return (
+    <View style={props.containerStyle} >
+      <TextInput ref={ref} editable={false} allowFontScaling={false} style={props.style} />
+    </View>
+  )
+}

package/event/coupon.tsx

@@ -81,7 +81,7 @@ export default function m(props: EventCouponProps): any {
         renderItem={(item, index) => (
           <View style={{ flex: 1 }} key={index}>
             <TouchableOpacity onPress={() => {
-              if (item?.status == 0) {
+              if (item?.status == 0 && item?.show_qr != 0) {
                 esp.mod("lib/navigation").navigate("event/coupon_detail", { ...item })
               }
             }} style={[{ marginBottom: 4, margin: 15, borderRadius: 10, backgroundColor: '#fff' }, LibStyle.elevation(2)]}>

package/event/coupon_generate.tsx

@@ -9,6 +9,7 @@ import { EventHeader } from 'esoftplay/cache/event/header/import';
 import { EventMessage } from 'esoftplay/cache/event/message/import';
 import { LibIcon } from 'esoftplay/cache/lib/icon/import';
 import { LibInfinite } from 'esoftplay/cache/lib/infinite/import';
+import { LibKeyboard_avoid } from 'esoftplay/cache/lib/keyboard_avoid/import';
 import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
 import { LibPicture } from 'esoftplay/cache/lib/picture/import';
 import { LibScroll } from 'esoftplay/cache/lib/scroll/import';
@@ -43,7 +44,8 @@ export default function m(props: EventCoupon_generateProps): any {
 
   function load() {
     const curl = esp.mod("lib/curl")
-    new curl("event_coupon_admin_detail?event_id=" + event_id + "&coupon_id=" + getCoupon()?.coupon_id, null, (result, message) => {
+    const url = "event_coupon_admin_detail?event_id=" + event_id + "&coupon_id=" + getCoupon()?.coupon_id
+    new curl(url, null, (result, message) => {
       setData(result)()
     }, (error) => {
       setError(error?.message)
@@ -64,16 +66,12 @@ export default function m(props: EventCoupon_generateProps): any {
       esp.modProp("lib/toast").show(esp.lang("event/coupon_generate", "email_invalid"))
       return
     }
-    if (amount == "") {
-      esp.modProp("lib/toast").show(esp.lang("event/coupon_generate", "nominal_empty"))
-      return
-    }
 
     let post: any = {
       event_id,
       coupon_id: getCoupon()?.coupon_id,
       user_email_to: email,
-      amount: amount
+      amount: amount || 0
     }
 
     if (notes != "") {
@@ -104,6 +102,14 @@ export default function m(props: EventCoupon_generateProps): any {
   }
 
   function buildUrl(url: string) {
+    if (event_id) {
+      url += url.includes('?') ? '&' : '?'
+      url += 'event_id=' + event_id
+    }
+    if (getCoupon()?.coupon_id) {
+      url += url.includes('?') ? '&' : '?'
+      url += 'coupon_id=' + getCoupon()?.coupon_id
+    }
     if (t) {
       url += url.includes('?') ? '&' : '?'
       url += 't=' + t
@@ -114,13 +120,13 @@ export default function m(props: EventCoupon_generateProps): any {
   return (
     <View style={{ flex: 1 }}>
       <EventHeader title={esp.lang("event/coupon_generate", "header")} subtitle={event_name} />
-      {
+      <LibKeyboard_avoid style={{ flex: 1 }} >
         <LibScroll onRefresh={() => infiniteRef.current?.loadData()}>
           <View style={[{ backgroundColor: "white", marginHorizontal: 15, marginTop: 15, padding: 10, borderRadius: 10 }, LibStyle.elevation(3)]}>
             <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 14 }}>{event_name}</Text>
 
-            <View style={[{ marginTop: 5, borderRadius: 15, backgroundColor: '#fff' }, LibStyle.elevation(2)]}>
-              <LibPicture source={{ uri: image }} resizeMode="cover" style={{ height: imgHeight, width: imgWidth, borderRadius: 5 }} />
+            <View style={[{ marginTop: 5, borderRadius: 10, backgroundColor: '#fff' }, LibStyle.elevation(2)]}>
+              <LibPicture source={{ uri: image }} resizeMode="cover" style={{ height: imgHeight, width: imgWidth, borderRadius: 10, backgroundColor: "#f1f1f1" }} />
             </View>
           </View>
 
@@ -129,7 +135,7 @@ export default function m(props: EventCoupon_generateProps): any {
             {
               coupon &&
               <View style={[{ marginBottom: 4, borderRadius: 10, backgroundColor: '#fff' }, LibStyle.elevation(2)]}>
-                <LibPicture source={{ uri: coupon?.image }} resizeMode="cover" style={{ height: (LibStyle.width - 50) * 0.43, width: LibStyle.width - 50, borderRadius: 10 }} />
+                <LibPicture source={{ uri: coupon?.image }} resizeMode="cover" style={{ height: (LibStyle.width - 50) * 0.43, width: LibStyle.width - 50, borderRadius: 10, backgroundColor: "#f1f1f1" }} />
                 <View style={{ backgroundColor: "rgba(0, 0, 0, 0.5)", position: 'absolute', borderBottomLeftRadius: 10, borderBottomRightRadius: 10, bottom: 0, left: 0, right: 0, padding: 10 }}>
                   <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{coupon?.coupon_title}</Text>
                 </View>
@@ -146,7 +152,7 @@ export default function m(props: EventCoupon_generateProps): any {
                 setCoupon(value)()
                 load()
               })
-            }} style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 34, borderRadius: 10, marginTop: 10, flexDirection: "row", alignItems: "center", paddingHorizontal: 10 }}>
+            }} style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 40, borderRadius: 10, marginTop: 10, flexDirection: "row", alignItems: "center", paddingHorizontal: 10 }}>
               {
                 coupon ?
                   <>
@@ -154,17 +160,18 @@ export default function m(props: EventCoupon_generateProps): any {
                     <LibIcon name='pencil' size={18} />
                   </>
                   : <>
-                    <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "Arial", fontSize: 14 }}>{"Pilih Kupon"}</Text>
+                    <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "ArialBold", fontSize: 14, color: "#999999" }}>{esp.lang("event/coupon_generate", "select_coupon")}</Text>
                     <LibIcon name='chevron-right' />
                   </>
               }
             </Pressable>
-            <View style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 34, borderRadius: 10, marginTop: 10, flexDirection: "row", alignItems: "center", paddingHorizontal: 10 }}>
-              <Text>Rp. </Text>
+            <View style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 40, borderRadius: 10, marginTop: 10, flexDirection: "row", alignItems: "center", paddingHorizontal: 10 }}>
+              <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 12, color: "#4b4b4b" }} >Rp. </Text>
               <LibInput
                 ref={inputNominalRef}
                 base
                 placeholder={esp.lang("event/coupon_generate", "input_nominal")}
+                placeholderTextColor='#999999'
                 onChangeText={() => { }}
                 keyboardType='numeric'
                 mask='###.###.###.###.###.###.###.###.###.###'
@@ -176,11 +183,13 @@ export default function m(props: EventCoupon_generateProps): any {
                 style={{ flex: 1, paddingHorizontal: 5 }}
               />
             </View>
-            <View style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 34, borderRadius: 10, marginTop: 10 }}>
+            <View style={{ borderWidth: 1, borderColor: "#e6e6e6", height: 40, borderRadius: 10, marginTop: 10, flexDirection: "row", alignItems: "center", paddingHorizontal: 10 }}>
+              <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 12, color: "#4b4b4b" }} >@ </Text>
               <LibInput
                 ref={inputEmailRef}
                 base
                 placeholder={esp.lang("event/coupon_generate", "input_email")}
+                placeholderTextColor='#999999'
                 onChangeText={() => { }}
                 keyboardType='email-address'
                 returnKeyType='next'
@@ -195,6 +204,7 @@ export default function m(props: EventCoupon_generateProps): any {
                 ref={inputDescRef}
                 base
                 placeholder={"notes"}
+                placeholderTextColor='#999999'
                 multiline
                 onChangeText={() => { }}
                 returnKeyType='go'
@@ -207,10 +217,10 @@ export default function m(props: EventCoupon_generateProps): any {
                 if (getCoupon()) {
                   doSendVoucher()
                 } else {
-                  esp.modProp("lib/toast").show("Silahkan pilih kupon terlebih dahulu")
+                  esp.modProp("lib/toast").show(esp.lang("event/coupon_generate", "select_coupon_alert"))
                 }
               }}
-              style={{ backgroundColor: coupon ? LibStyle.colorGreen : "#e6e6e6", height: 34, alignItems: "center", justifyContent: "center", paddingHorizontal: 10, borderRadius: 10 }}>
+              style={{ backgroundColor: coupon ? LibStyle.colorGreen : "#e6e6e6", height: 40, alignItems: "center", justifyContent: "center", paddingHorizontal: 10, borderRadius: 10 }}>
               <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, color: "white" }}>{esp.lang("event/coupon_generate", "btn_send")}</Text>
             </Pressable>
             {
@@ -225,19 +235,22 @@ export default function m(props: EventCoupon_generateProps): any {
             data && coupon &&
             <LibInfinite
               ref={infiniteRef}
-              key={coupon?.coupon_id + buildUrl("event_coupon_admin_claimed?event_id=" + event_id + "&coupon_id=" + getCoupon()?.coupon_id)}
-              url={buildUrl("event_coupon_admin_claimed?event_id=" + event_id + "&coupon_id=" + getCoupon()?.coupon_id)}
+              key={coupon?.coupon_id + buildUrl("event_coupon_admin_claimed")}
+              url={buildUrl("event_coupon_admin_claimed")}
               errorView={(error: any) => (
                 <EventMessage message={error} />
               )}
               renderItem={(item, index) => (
-                <View style={[{ backgroundColor: "white", marginHorizontal: 15, marginTop: 10, marginBottom: 5, padding: 10, borderRadius: 10, flexDirection: "row", alignItems: "center" }, LibStyle.elevation(3)]}>
+                <View key={index} style={[{ backgroundColor: "white", marginHorizontal: 15, marginTop: 10, marginBottom: 5, padding: 10, borderRadius: 10, flexDirection: "row", alignItems: "center" }, LibStyle.elevation(3)]}>
                   <View style={{ width: 36, height: 36, borderRadius: 18, backgroundColor: "#909090", alignItems: "center", justifyContent: "center" }}>
                     <LibIcon name='send' size={20} color='#f1f1f1' />
                   </View>
                   <View style={{ flex: 1, marginLeft: 10 }}>
                     <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, marginBottom: 5 }}>{item?.coupon_title}</Text>
-                    <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 14 }}>{LibUtils.money(item?.amount)}</Text>
+                    {
+                      item?.amount && item?.amount != "" && item?.amount != 0 &&
+                      <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 14 }}>{LibUtils.money(item?.amount)}</Text>
+                    }
                     <View style={{ flexDirection: "row", marginVertical: 5 }}>
                       <Text allowFontScaling={false} style={{ flex: 1, fontFamily: "Arial", fontSize: 12 }}>{String(item?.user_email).toLowerCase()}</Text>
                       <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, color: "#606060" }}>{moment(item?.claimed_time).localeFormat("DD MMM YYYY HH:mm:ss")}</Text>
@@ -252,7 +265,7 @@ export default function m(props: EventCoupon_generateProps): any {
             />
           }
         </LibScroll>
-      }
+      </LibKeyboard_avoid>
     </View>
   )
 }

package/event/detail.tsx

@@ -12,9 +12,8 @@ import { LibWebview } from 'esoftplay/cache/lib/webview/import';
 
 import { applyStyle } from 'esoftplay';
 import { EventCountdown_event } from 'esoftplay/cache/event/countdown_event/import';
-import { EventFirebase_socket, EventFirebase_socketProperty } from 'esoftplay/cache/event/firebase_socket/import';
+import { EventFirebase_socketProperty } from 'esoftplay/cache/event/firebase_socket/import';
 import { EventHeader } from 'esoftplay/cache/event/header/import';
-import { EventIndexProperty } from 'esoftplay/cache/event/index/import';
 import { EventSlider } from 'esoftplay/cache/event/slider/import';
 import { UseCondition } from 'esoftplay/cache/use/condition/import';
 import { UseDeeplinkProperty } from 'esoftplay/cache/use/deeplink/import';
@@ -31,17 +30,16 @@ export interface EventDetailProps {
 }
 
 export default function m(props: EventDetailProps): any {
-  const { isInPricingQueueConfig } = EventFirebase_socket()
   const [result, setResult] = useSafeState<any>(undefined)
   const url = LibNavigation.getArgs(props, 'url')
   const [deeplinkParams] = UseDeeplinkProperty.params.useState()
   const [priority, setPriority] = useSafeState(false)
-  const user = UserClass.state().get()
 
   moment().locale('id')
   function loadData(): void {
     // CacheHit.doHit(url)
     new LibCurl(url, null, (res, msg) => {
+      esp.modProp("event/countdown").eventURI.set(url)
       EventFirebase_socketProperty.eventIdQueue.set(res.id)
       setResult(res)
       if (res.allotment) {
@@ -61,7 +59,7 @@ export default function m(props: EventDetailProps): any {
   }
 
   useEffect(() => {
-    if (esp.isDebug("") && user?.email == "bagus@fisip.net") {
+    if (esp.isDebug("") && UserClass?.state()?.get()?.email == "bagus@fisip.net") {
       LibNavigation.replace('event/detail2', { url: url })
     } else {
       loadData()
@@ -142,6 +140,7 @@ export default function m(props: EventDetailProps): any {
           esp.isDebug("show_countdown") && result?.countdown_booking == 1 && result?.start_date != "0000-00-00" && result.end_date != '0000-00-00' &&
           <EventCountdown_event
             date={(result?.end_date + " " + result?.end_time)}
+            timezone={result?.timezone}
             style={{ fontSize: 12 }}
             bulletStyle={{ width: 14, height: 14, borderRadius: 7, marginRight: 10 }}
             containerStyle={{ marginHorizontal: 20, marginBottom: 10 }}
@@ -274,28 +273,23 @@ export default function m(props: EventDetailProps): any {
                   {
                     result?.url_artist != "" &&
                     <TouchableOpacity onPress={() => {
-                      // LibNavigation.navigate('event/artist', { title: result?.title, url: result?.url_artist, has_addition: result?.has_addition })
                       LibNavigation.navigate('event/artist', {
                         title: result?.title,
                         url: result?.url_artist,
                         has_addition: result?.has_addition
                       })
-                    }} style={applyStyle({ width: (LibStyle.width - 30) * 0.5, borderWidth: 2, borderColor: LibStyle.colorGreen, height: 40, borderRadius: 16, backgroundColor: 'white', flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
+                    }} style={applyStyle({ width: (LibStyle.width - 30) * 0.5, borderWidth: 2, borderColor: LibStyle.colorGreen, height: 40, borderRadius: 5, backgroundColor: 'white', flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
                       <Text allowFontScaling={false} style={applyStyle({ fontFamily: "ArialBold", fontSize: 14, textAlign: "center", textAlignVertical: 'center', color: LibStyle.colorGreen })} >{esp.lang("event/detail", "line_up")}</Text>
                     </TouchableOpacity>
                   }
                   <TouchableOpacity onPress={() => {
-                    EventIndexProperty.isLogin(async () => {
-                      if (isInPricingQueueConfig(result.id)) {
-                        await LibNavigation.navigateForResult('event/queue_pricing', { event_id: result?.id })
-                      }
+                    esp.modProp("event/index").isLogin(async () => {
                       LibNavigation.navigate(
-                        user?.config?.tester == 1 ?
-                          'event/ticket_list2'
+                        (esp.isDebug("") && UserClass?.state()?.get()?.email == "bagus@fisip.net") ? 'event/ticket_list_new'
                           :
                           (result?.config?.hasOwnProperty('multiprice') && result?.config?.multiprice == 1 ? 'event/ticket_list2' : 'event/ticket_list'),
                         {
-                          url: result.url_price,
+                          url: esp.isDebug("") && UserClass?.state()?.get()?.email == "bagus@fisip.net" ? result?.url_price_v2 : result.url_price,
                           fee_platform: {
                             fee_platform_amount: result?.fee_platform_amount,
                             fee_platform_type: result?.fee_platform_type,
@@ -310,7 +304,7 @@ export default function m(props: EventDetailProps): any {
                         })
 
                     })
-                  }} style={applyStyle({ width: result?.url_artist != "" ? (LibStyle.width - 30) * 0.5 : LibStyle.width - 20, borderWidth: 2, borderColor: LibStyle.colorGreen, height: 40, borderRadius: 16, backgroundColor: LibStyle.colorGreen, flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
+                  }} style={applyStyle({ width: result?.url_artist != "" ? (LibStyle.width - 30) * 0.5 : LibStyle.width - 20, borderWidth: 2, borderColor: LibStyle.colorGreen, height: 40, borderRadius: 5, backgroundColor: LibStyle.colorGreen, flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
                     <Text allowFontScaling={false} style={applyStyle({ fontFamily: "ArialBold", fontSize: 14, textAlign: "center", textAlignVertical: 'center', color: "#fff" })} >{esp.lang("event/detail", "text_buy_ticket")}</Text>
                   </TouchableOpacity>
                   <UseCondition if={priority} >