@eohjsc/react-native-smart-city 0.2.87 → 0.2.88

package/assets/images/Common/Calendar.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.1875 3.59375H13.9062V2.34375C13.9062 2.25781 13.8359 2.1875 13.75 2.1875H12.6562C12.5703 2.1875 12.5 2.25781 12.5 2.34375V3.59375H7.5V2.34375C7.5 2.25781 7.42969 2.1875 7.34375 2.1875H6.25C6.16406 2.1875 6.09375 2.25781 6.09375 2.34375V3.59375H2.8125C2.4668 3.59375 2.1875 3.87305 2.1875 4.21875V17.1875C2.1875 17.5332 2.4668 17.8125 2.8125 17.8125H17.1875C17.5332 17.8125 17.8125 17.5332 17.8125 17.1875V4.21875C17.8125 3.87305 17.5332 3.59375 17.1875 3.59375ZM16.4062 16.4062H3.59375V8.98438H16.4062V16.4062ZM3.59375 7.65625V5H6.09375V5.9375C6.09375 6.02344 6.16406 6.09375 6.25 6.09375H7.34375C7.42969 6.09375 7.5 6.02344 7.5 5.9375V5H12.5V5.9375C12.5 6.02344 12.5703 6.09375 12.6562 6.09375H13.75C13.8359 6.09375 13.9062 6.02344 13.9062 5.9375V5H16.4062V7.65625H3.59375Z" fill="#00979D"/>
+</svg>

package/assets/images/Common/SmartPhone.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17 1.01L7 1C5.9 1 5 1.9 5 3V21C5 22.1 5.9 23 7 23H17C18.1 23 19 22.1 19 21V3C19 1.9 18.1 1.01 17 1.01ZM17 19H7V5H17V19Z" fill="#262626"/>
+</svg>

package/assets/images/Hanet/CaptureFaceID.svg

@@ -0,0 +1,25 @@
+<svg width="60" height="95" viewBox="0 0 60 95" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_8947_27591)">
+<rect x="3" y="80" width="54" height="13" fill="url(#paint0_linear_8947_27591)"/>
+<path d="M53.7062 0C54.0793 0.121452 54.45 0.245382 54.8231 0.364355C57.7639 1.30623 59.8382 4.0203 59.9781 7.12351C59.9953 7.52505 60.0002 7.92658 60.0002 8.32811C60.0002 34.4551 60.0051 60.5796 59.9855 86.7066C59.9855 87.7129 59.9094 88.7638 59.6296 89.7206C58.7066 92.861 55.8811 94.9603 52.6138 94.9826C47.93 95.0149 43.2438 94.9975 38.5576 94.9901C37.318 94.9876 36.4686 94.2143 36.4662 93.1386C36.4662 92.0653 37.3204 91.2895 38.5552 91.287C43.0573 91.2796 47.5569 91.2846 52.059 91.2821C54.8206 91.2796 56.3131 89.78 56.3205 86.9966C56.3279 84.8675 56.323 82.7359 56.323 80.5249C38.7737 80.5249 21.2833 80.5249 3.74378 80.5249C3.71924 80.7406 3.67996 80.9463 3.6775 81.1545C3.67259 83.1944 3.65787 85.2368 3.67996 87.2767C3.70451 89.7082 5.2633 91.2747 7.66163 91.2821C12.1023 91.2945 26.5406 91.2846 30.9813 91.287C31.2882 91.287 31.5975 91.2697 31.8994 91.3069C32.8249 91.4258 33.5319 92.2314 33.5319 93.141C33.5319 94.0507 32.8273 94.8513 31.8994 94.9752C31.6589 95.0074 31.4109 94.995 31.1654 94.995C26.7247 94.995 12.2865 95.0025 7.84574 94.995C3.16936 94.9876 0.00759095 91.815 0.00513616 87.0808C-0.00222821 60.7035 0.000226578 34.3287 0.00513616 7.95632C0.00513616 3.85175 2.1138 1.16247 6.07093 0.138802C6.15439 0.116494 6.22312 0.0470935 6.29922 0C22.1007 0 37.9022 0 53.7062 0ZM39.9618 31.7832C40.2932 31.1759 40.5828 30.6703 40.848 30.1498C41.2162 29.4285 41.7783 28.9823 42.5859 28.9873C43.396 28.9923 43.9385 29.4607 44.3141 30.1696C45.08 31.6121 45.8361 33.0621 46.6609 34.47C46.9236 34.9186 47.3335 35.3474 47.7754 35.6126C49.1942 36.4628 50.672 37.2138 52.1081 38.0367C53.6399 38.9116 53.6325 40.5896 52.1056 41.4844C51.4502 41.8686 50.7776 42.2255 50.0902 42.6072C50.1639 42.8452 50.2032 43.0212 50.2719 43.1897C51.3766 45.9459 51.8847 48.8112 51.8724 51.783C51.8577 55.895 51.897 60.007 51.8601 64.119C51.8184 68.6995 50.1393 72.5984 46.9064 75.8082C46.6535 76.0585 46.3491 76.2543 46.0693 76.4774C46.1159 76.5393 46.1626 76.6013 46.2092 76.6657C49.5551 76.6657 52.8985 76.6657 56.2837 76.6657C56.2837 55.957 56.2837 35.3127 56.2837 14.6139C43.8281 14.6139 31.4166 14.6139 18.9021 14.6139C19.425 15.7193 19.7883 16.7529 20.9641 17.2709C22.0811 17.7617 23.1145 18.4458 24.1922 19.0283C24.9188 19.4199 25.4171 19.9528 25.4073 20.8352C25.3975 21.7175 24.8722 22.2331 24.1529 22.6222C22.9403 23.2791 21.7251 23.9309 20.537 24.6349C20.1909 24.8406 19.8619 25.1628 19.6606 25.5123C18.9488 26.7367 18.3081 28.0033 17.6183 29.2401C16.7149 30.8537 14.9033 30.9429 14.2012 29.2748C12.8535 26.07 10.7277 23.7872 7.49716 22.5404C6.75336 22.2529 6.33113 21.6234 6.33604 20.8029C6.3385 19.9825 6.8 19.4372 7.50698 19.0605C8.56254 18.4978 9.569 17.8311 10.6565 17.3527C11.879 16.8173 12.3405 15.7788 12.8486 14.6312C9.75557 14.6312 6.7509 14.6312 3.72905 14.6312C3.72905 35.3474 3.72905 55.9892 3.72905 76.6608C7.12649 76.6608 10.465 76.6608 13.9189 76.6608C13.7544 76.4749 13.6808 76.3807 13.5949 76.2989C9.82676 72.8165 8.0544 68.4913 8.11822 63.3432C8.16732 59.4791 8.09613 55.6125 8.14522 51.7483C8.16241 50.333 8.27533 48.9054 8.50362 47.5099C10.2833 36.6437 20.5591 28.5808 31.4387 29.4359C34.4066 29.6664 37.21 30.4348 39.9618 31.7832ZM24.4843 76.6509C24.4843 75.6446 24.4843 74.6928 24.4843 73.7633C23.5049 73.4213 22.5131 73.1858 21.6196 72.7471C17.7312 70.841 15.9024 67.4726 15.706 63.2986C15.49 58.7355 15.6029 54.1526 15.6176 49.5795C15.6225 48.0676 16.7394 47.4083 18.2172 47.7925C19.749 48.1915 21.3078 48.6055 22.874 48.722C25.4392 48.9128 27.3662 47.7305 28.493 45.3684C28.9005 44.5182 29.3988 43.9035 30.4102 43.9407C31.424 43.9804 31.8806 44.6372 32.2145 45.5146C33.2995 48.3675 36.1298 49.9389 39.0805 49.3143C39.5518 49.2152 39.974 48.8855 40.4552 48.6426C39.731 47.3042 39.1173 46.0946 38.4275 44.9322C38.1919 44.5356 37.8187 44.1638 37.4211 43.9308C36.0243 43.1054 34.5956 42.3296 33.1645 41.5637C32.4329 41.1721 31.915 40.6392 31.9076 39.7767C31.9002 38.9166 32.3912 38.3663 33.1325 37.9747C34.5931 37.1989 36.0341 36.3859 37.48 35.5804C37.6985 35.4589 37.8948 35.2929 38.187 35.0896C37.8261 34.9037 37.5904 34.7724 37.345 34.6608C25.5963 29.3194 11.9477 38.0962 11.8151 51.0965C11.771 55.4538 11.7243 59.8137 11.8495 64.1686C11.8937 65.7401 12.2226 67.3784 12.7799 68.8458C14.6087 73.6468 19.7392 77.0177 24.4843 76.6509ZM56.3254 10.7844C56.3254 9.85741 56.3279 8.99982 56.3254 8.14222C56.3205 5.16294 54.882 3.71047 51.9362 3.71047C37.3081 3.71047 22.6776 3.71047 8.04949 3.71047C7.77455 3.71047 7.49716 3.70304 7.22222 3.72039C5.55542 3.82449 3.99663 5.05388 3.79042 6.6848C3.6235 8.01333 3.75606 9.37904 3.75606 10.7844C21.2464 10.7844 38.7098 10.7844 56.3254 10.7844ZM19.3955 52.0135C19.3955 56.0016 19.1402 59.8806 19.4667 63.7076C19.8079 67.7031 22.2873 69.805 26.0971 70.0875C27.6657 70.204 28.1984 70.7766 28.2033 72.3728C28.2082 73.7856 28.2033 75.2009 28.2033 76.6707C29.4258 76.6707 30.5722 76.6707 31.6916 76.6707C31.7431 76.5567 31.7873 76.5022 31.7873 76.4476C31.7947 75.2108 31.7996 73.9765 31.7971 72.7396C31.7947 70.675 32.1678 70.2536 34.1832 70.0677C37.4309 69.7678 39.4831 68.0749 40.3202 64.8775C40.5755 63.9034 40.6859 62.8698 40.7056 61.8586C40.7571 59.0776 40.7252 56.2941 40.7203 53.5131C40.7203 53.2826 40.6712 53.0521 40.6442 52.8191C35.6659 53.5131 34.3108 53.0843 30.1279 49.5176C27.1134 52.6456 23.3968 52.9207 19.3955 52.0135ZM46.8745 44.6223C46.1699 45.9137 45.4973 47.0216 44.9548 48.1915C44.6578 48.836 44.4369 49.5795 44.427 50.2835C44.3755 53.8998 44.4246 57.516 44.3902 61.1323C44.3779 62.3642 44.3534 63.6184 44.1202 64.8205C43.2905 69.0961 40.9781 72.1225 36.7067 73.3866C36.309 73.5055 35.9016 73.5997 35.5358 73.6964C35.5358 74.7399 35.5358 75.6867 35.5358 76.6608C35.7003 76.6856 35.8181 76.7178 35.9335 76.7178C42.4558 76.6583 48.0798 71.0839 48.178 64.4859C48.2467 59.9129 48.2172 55.3373 48.1755 50.7643C48.1559 48.7145 47.7238 46.7316 46.8745 44.6223ZM42.5958 44.7537C43.4353 42.2379 45.1193 40.6987 47.5225 39.7469C45.0923 38.8348 43.4721 37.2237 42.581 34.75C41.6826 37.2163 40.0256 38.815 37.6346 39.8014C40.1336 40.6491 41.6433 42.3296 42.5958 44.7537ZM12.1146 20.8302C14.0171 21.5118 15.1193 22.8676 15.9073 24.6299C16.5922 22.7189 17.8564 21.5564 19.668 20.8228C17.8588 20.0767 16.5922 18.8771 15.895 16.9908C15.1438 18.8077 13.9533 20.0866 12.1146 20.8302Z" fill="black"/>
+<path d="M39.9617 31.7832C37.2074 30.4348 34.4065 29.6664 31.4411 29.4335C20.5615 28.5783 10.2857 36.6412 8.50601 47.5074C8.27772 48.9029 8.1648 50.3306 8.14761 51.7459C8.09852 55.61 8.16971 59.4766 8.12061 63.3408C8.05433 68.4888 9.82914 72.814 13.5972 76.2965C13.6832 76.3758 13.7568 76.4724 13.9213 76.6583C10.4698 76.6583 7.12888 76.6583 3.73145 76.6583C3.73145 55.9868 3.73145 35.3474 3.73145 14.6287C6.75329 14.6287 9.75796 14.6287 12.851 14.6287C12.3429 15.7763 11.8789 16.8173 10.6589 17.3502C9.56894 17.8286 8.56247 18.4954 7.50937 19.058C6.80239 19.4348 6.34089 19.98 6.33843 20.8005C6.33598 21.6209 6.75575 22.2529 7.49955 22.538C10.7301 23.7847 12.8559 26.0675 14.2036 29.2723C14.9057 30.9429 16.7173 30.8512 17.6207 29.2376C18.3129 28.0008 18.9536 26.7342 19.663 25.5098C19.8643 25.1603 20.1933 24.8381 20.5394 24.6324C21.7251 23.9285 22.9426 23.2766 24.1553 22.6198C24.8746 22.2306 25.3999 21.7151 25.4097 20.8327C25.4195 19.9503 24.9212 19.4174 24.1946 19.0258C23.1145 18.4433 22.0835 17.7592 20.9665 17.2685C19.7907 16.7529 19.4274 15.7168 18.9045 14.6114C31.419 14.6114 43.8304 14.6114 56.2861 14.6114C56.2861 35.3102 56.2861 55.9545 56.2861 76.6633C52.9009 76.6633 49.5575 76.6633 46.2116 76.6633C46.165 76.6013 46.1183 76.5394 46.0717 76.4749C46.3515 76.2543 46.6584 76.0585 46.9088 75.8057C50.1417 72.5934 51.8208 68.6946 51.8625 64.1166C51.9018 60.0046 51.8601 55.8926 51.8748 51.7806C51.8846 48.8087 51.3789 45.9434 50.2743 43.1872C50.208 43.0187 50.1663 42.8402 50.0926 42.6048C50.78 42.2231 51.4526 41.8661 52.108 41.482C53.6324 40.5872 53.6398 38.9116 52.1105 38.0342C50.6744 37.2113 49.1966 36.4603 47.7778 35.6101C47.3334 35.3449 46.9259 34.9161 46.6633 34.4675C45.8385 33.0597 45.0824 31.6097 44.3165 30.1671C43.9409 29.4582 43.396 28.9898 42.5883 28.9848C41.7807 28.9799 41.2186 29.426 40.8503 30.1473C40.5828 30.6703 40.2931 31.1759 39.9617 31.7832Z" fill="white"/>
+<path d="M24.4842 76.6509C19.7391 77.0202 14.6085 73.6493 12.7822 68.8457C12.2249 67.3784 11.896 65.7401 11.8518 64.1686C11.7291 59.8137 11.7733 55.4538 11.8174 51.0964C11.95 38.0962 25.5986 29.3194 37.3473 34.6608C37.5927 34.7724 37.8284 34.9037 38.1893 35.0896C37.8971 35.2953 37.7008 35.4589 37.4823 35.5804C36.0364 36.3859 34.5954 37.1989 33.1348 37.9747C32.3935 38.3688 31.905 38.9191 31.9099 39.7767C31.9173 40.6392 32.4352 41.1721 33.1668 41.5637C34.5979 42.3296 36.0266 43.1054 37.4234 43.9308C37.8186 44.1638 38.1942 44.5356 38.4298 44.9322C39.1196 46.0971 39.7333 47.3042 40.4575 48.6426C39.9763 48.8855 39.5541 49.2152 39.0828 49.3143C36.1346 49.9389 33.3018 48.3675 32.2168 45.5146C31.8829 44.6372 31.4239 43.9804 30.4125 43.9407C29.4011 43.9011 28.9003 44.5157 28.4953 45.3684C27.3685 47.7305 25.4415 48.9128 22.8763 48.7219C21.3077 48.6055 19.7513 48.1915 18.2195 47.7925C16.7393 47.4083 15.6224 48.0676 15.6199 49.5795C15.6052 54.1526 15.4923 58.7355 15.7083 63.2986C15.9047 67.4726 17.7335 70.841 21.6219 72.7471C22.5154 73.1858 23.5072 73.4213 24.4866 73.7633C24.4842 74.6928 24.4842 75.6421 24.4842 76.6509Z" fill="white"/>
+<path d="M56.3253 10.7844C38.7073 10.7844 21.2439 10.7844 3.75353 10.7844C3.75353 9.37902 3.62097 8.01331 3.7879 6.68477C3.9941 5.05385 5.55289 3.82446 7.21969 3.72036C7.49463 3.70301 7.76957 3.71045 8.04696 3.71045C22.6751 3.71045 37.3056 3.71045 51.9337 3.71045C54.8795 3.71045 56.318 5.16291 56.3229 8.14219C56.3278 8.99979 56.3253 9.85739 56.3253 10.7844Z" fill="white"/>
+<path d="M19.3952 52.0135C23.3989 52.9207 27.1155 52.6456 30.1324 49.5176C34.3154 53.0843 35.6704 53.5131 40.6487 52.8191C40.6757 53.0521 40.7248 53.2826 40.7248 53.5131C40.7297 56.2941 40.7592 59.0776 40.7101 61.8586C40.6905 62.8673 40.58 63.9034 40.3247 64.8775C39.4876 68.0749 37.4354 69.7678 34.1877 70.0677C32.1723 70.2536 31.7992 70.6749 31.8017 72.7396C31.8041 73.9765 31.7992 75.2108 31.7918 76.4476C31.7918 76.5021 31.7477 76.5567 31.6961 76.6707C30.5743 76.6707 29.4303 76.6707 28.2079 76.6707C28.2079 75.2009 28.2128 73.7856 28.2079 72.3728C28.2029 70.7766 27.6703 70.204 26.1016 70.0875C22.2894 69.8074 19.81 67.7031 19.4713 63.7076C19.1399 59.8806 19.3952 56.0016 19.3952 52.0135ZM29.9606 67.3635C31.1266 67.3685 32.2828 66.9199 33.0512 66.1589C33.817 65.403 33.9079 64.352 33.2745 63.5713C32.6584 62.8103 31.6519 62.6368 30.8124 63.2614C30.2159 63.7076 29.774 63.6927 29.1824 63.2565C28.3453 62.6368 27.3339 62.8178 26.7227 63.5812C26.1139 64.3396 26.1704 65.3683 26.9044 66.097C27.7439 66.9323 28.7725 67.3561 29.9606 67.3635ZM22.7705 56.8245C22.7729 58.0812 23.502 58.9313 24.5821 58.9388C25.6573 58.9462 26.4257 58.0861 26.4404 56.8518C26.4576 55.5654 25.6941 54.6979 24.5625 54.7152C23.4652 54.7301 22.768 55.553 22.7705 56.8245ZM37.2317 56.8121C37.2317 55.5406 36.5296 54.7251 35.4249 54.7127C34.3276 54.7028 33.5765 55.5307 33.5618 56.77C33.5446 58.0514 34.3227 58.9536 35.4323 58.9363C36.5124 58.9189 37.2317 58.0712 37.2317 56.8121Z" fill="white"/>
+<path d="M46.8743 44.6223C47.7237 46.7316 48.1557 48.717 48.1754 50.7643C48.2171 55.3373 48.2466 59.9128 48.1778 64.4859C48.0796 71.0839 42.4557 76.6583 35.9333 76.7178C35.8179 76.7178 35.7001 76.6856 35.5356 76.6608C35.5356 75.6867 35.5356 74.7399 35.5356 73.6964C35.9039 73.5997 36.3089 73.5055 36.7066 73.3865C40.9779 72.12 43.2903 69.0961 44.1201 64.8205C44.3533 63.6183 44.3778 62.3642 44.3901 61.1323C44.4244 57.516 44.3754 53.8997 44.4269 50.2834C44.4367 49.5795 44.6577 48.8359 44.9547 48.1915C45.4972 47.0216 46.1698 45.9137 46.8743 44.6223Z" fill="white"/>
+<path d="M42.5954 44.7537C41.643 42.3297 40.1333 40.6467 37.6318 39.804C40.0228 38.815 41.6798 37.2188 42.5782 34.7526C43.4718 37.2237 45.0895 38.8373 47.5197 39.7494C45.1189 40.7012 43.435 42.2379 42.5954 44.7537Z" fill="#00979D"/>
+<path d="M12.1143 20.8302C13.9529 20.0891 15.141 18.8101 15.8946 16.9908C16.5943 18.8771 17.8609 20.0742 19.6677 20.8228C17.8536 21.5564 16.5893 22.7189 15.9069 24.6299C15.1214 22.8676 14.0167 21.5118 12.1143 20.8302Z" fill="#00979D"/>
+<path d="M29.9608 67.3635C28.7727 67.3561 27.7442 66.9323 26.9022 66.0945C26.1706 65.3658 26.1142 64.3397 26.7205 63.5787C27.3318 62.8128 28.3431 62.6344 29.1802 63.254C29.7718 63.6927 30.2137 63.7051 30.8102 63.259C31.6497 62.6344 32.6562 62.8079 33.2723 63.5688C33.9057 64.3496 33.8149 65.4005 33.049 66.1565C32.2806 66.9199 31.1269 67.3685 29.9608 67.3635Z" fill="black"/>
+<path d="M22.7705 56.8245C22.7681 55.553 23.4652 54.7301 24.5625 54.7127C25.6942 54.6954 26.4576 55.5629 26.4404 56.8493C26.4257 58.0836 25.6598 58.9437 24.5822 58.9363C23.5045 58.9313 22.773 58.0811 22.7705 56.8245Z" fill="black"/>
+<path d="M37.2317 56.8121C37.2317 58.0713 36.5124 58.9214 35.4298 58.9388C34.3227 58.9561 33.5446 58.0539 33.5593 56.7725C33.5765 55.5307 34.3252 54.7028 35.4225 54.7152C36.5296 54.7227 37.2317 55.5381 37.2317 56.8121Z" fill="black"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_8947_27591" x1="3" y1="80" x2="8.904" y2="104.551" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D5FFCB"/>
+<stop offset="1" stop-color="#00979D"/>
+</linearGradient>
+<clipPath id="clip0_8947_27591">
+<rect width="60" height="95" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/assets/images/Hanet/FaceFrame.svg

@@ -0,0 +1,6 @@
+<svg width="264" height="264" viewBox="0 0 264 264" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47 2H19C9.61116 2 2 9.61116 2 19V47" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M47 262H19C9.61116 262 2 254.389 2 245V217" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M217 2H245C254.389 2 262 9.61116 262 19V47" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M217 262H245C254.389 262 262 254.389 262 245V217" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.2.87",
+  "version": "0.2.88",
   "description": "TODO",
   "main": "index.js",
   "files": [
@@ -97,7 +97,7 @@
   "dependencies": {
     "@ant-design/icons-react-native": "^2.2.1",
     "@ant-design/react-native": "^4.0.5",
-    "@eohjsc/highcharts": "^1.0.3",
+    "@eohjsc/highcharts": "^1.0.6",
     "@formatjs/intl-getcanonicallocales": "^1.4.5",
     "@formatjs/intl-numberformat": "^5.6.2",
     "@formatjs/intl-pluralrules": "^3.4.7",

package/src/Images/SmartIr/Remote.svg

@@ -0,0 +1,15 @@
+<svg width="89" height="149" viewBox="0 0 89 149" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.5224 80.2346L18.1384 66.3718L8.34025 67.1697C8.34025 67.1697 4.78258 67.3691 5.01587 70.8099C4.89923 75.1981 10.9064 80.1349 14.5224 80.2346Z" fill="#F6BA90"/>
+<path d="M16.1553 80.2346L3.616 80.9327C3.616 80.9327 -0.466565 80.8829 1.46394e-05 84.2239C-0.758177 89.0609 6.9987 94.995 16.097 92.5515C25.3119 90.158 16.1553 80.2346 16.1553 80.2346Z" fill="#F6BA90"/>
+<path d="M25.895 110.254C25.895 110.254 25.4867 121.324 29.8026 130.25C26.3615 135.935 18.9546 149 18.9546 149H62.1715L49.6905 104.569L25.895 110.254Z" fill="#F6BA90"/>
+<path d="M54.8232 110.304H19.0716C16.5637 110.304 14.5225 108.559 14.5225 106.414V3.88956C14.5225 1.74531 16.5637 0 19.0716 0H54.8232C57.3311 0 59.3724 1.74531 59.3724 3.88956V106.414C59.3724 108.559 57.3311 110.304 54.8232 110.304Z" fill="#342D33"/>
+<path d="M32.7774 25.9304H22.4543C21.5212 25.9304 20.8213 25.2822 20.8213 24.5342V20.3454C20.8213 19.5476 21.5795 18.9492 22.4543 18.9492H32.7191C33.6522 18.9492 34.3521 19.5974 34.3521 20.3454V24.5342C34.4104 25.2822 33.6522 25.9304 32.7774 25.9304Z" fill="#645250"/>
+<path d="M52.0237 25.9304H41.759C40.8258 25.9304 40.126 25.2822 40.126 24.5342V20.3454C40.126 19.5476 40.8842 18.9492 41.759 18.9492H52.0237C52.9569 18.9492 53.6568 19.5974 53.6568 20.3454V24.5342C53.7151 25.2822 52.9569 25.9304 52.0237 25.9304Z" fill="#645250"/>
+<path d="M32.7774 39.6436H22.4543C21.5212 39.6436 20.8213 38.9953 20.8213 38.2473V34.0585C20.8213 33.2607 21.5795 32.6623 22.4543 32.6623H32.7191C33.6522 32.6623 34.3521 33.3106 34.3521 34.0585V38.2473C34.4104 39.0452 33.6522 39.6436 32.7774 39.6436Z" fill="#645250"/>
+<path d="M52.0237 39.6436H41.759C40.8258 39.6436 40.126 38.9953 40.126 38.2473V34.0585C40.126 33.2607 40.8842 32.6623 41.759 32.6623H52.0237C52.9569 32.6623 53.6568 33.3106 53.6568 34.0585V38.2473C53.7151 39.0452 52.9569 39.6436 52.0237 39.6436Z" fill="#645250"/>
+<path d="M32.7774 53.4066H22.4543C21.5212 53.4066 20.8213 52.7583 20.8213 52.0104V47.8216C20.8213 47.0237 21.5795 46.4254 22.4543 46.4254H32.7191C33.6522 46.4254 34.3521 47.0736 34.3521 47.8216V52.0104C34.4104 52.7583 33.6522 53.4066 32.7774 53.4066Z" fill="#645250"/>
+<path d="M52.0237 53.4066H41.759C40.8258 53.4066 40.126 52.7583 40.126 52.0104V47.8216C40.126 47.0237 40.8842 46.4254 41.759 46.4254H52.0237C52.9569 46.4254 53.6568 47.0736 53.6568 47.8216V52.0104C53.7151 52.7583 52.9569 53.4066 52.0237 53.4066Z" fill="#645250"/>
+<path d="M36.9181 85.7199C44.8419 85.7199 51.2654 80.2277 51.2654 73.4528C51.2654 66.6779 44.8419 61.1857 36.9181 61.1857C28.9943 61.1857 22.5708 66.6779 22.5708 73.4528C22.5708 80.2277 28.9943 85.7199 36.9181 85.7199Z" fill="#645250"/>
+<path d="M40.8843 134.938C40.8843 134.938 29.8613 119.579 43.8587 106.813C43.6254 102.624 42.8672 95.8926 42.8672 95.8926C42.8672 95.8926 27.2951 92.2523 21.5212 85.3708C20.1215 83.7252 17.9635 80.2845 19.2466 77.841C19.8882 76.6442 20.0048 75.248 20.8797 74.2008C21.2296 73.8019 23.0376 72.7048 23.6208 72.9043C24.6706 73.2533 44.1603 76.2036 50.1092 76.3532C64.4566 76.802 70.687 86.9167 70.687 86.9167L40.8843 134.938Z" fill="#DD9877"/>
+<path d="M59.3725 43.7825C59.3725 43.7825 85.7342 96.3912 88.2421 102.475C89.8751 103.971 88.2421 107.362 88.2421 107.362L80.1936 122.521L64.9131 149H18.9551L40.8843 134.888C40.8843 134.888 33.0691 119.23 46.3666 106.514C46.1333 102.325 45.3168 95.5435 45.3168 95.5435C45.3168 95.5435 30.0363 90.8561 22.6877 85.0716C20.4131 83.2764 18.8968 80.4839 19.2467 77.7912C19.4217 76.4947 19.9466 75.1981 20.8797 74.1509C21.2297 73.752 21.6379 73.3531 22.1628 73.0539C23.5625 72.3558 25.4289 73.3032 26.8286 73.6523C28.5783 74.0512 30.3863 74.4003 32.1943 74.6995C38.1431 75.6968 44.1503 76.3949 50.1576 77.1429C59.2558 78.24 69.2873 87.5151 69.2873 87.5151C69.2873 87.5151 64.1549 80.2346 58.206 77.841C58.206 65.8732 59.3725 43.7825 59.3725 43.7825Z" fill="#F6BA90"/>
+</svg>

package/src/Images/SmartIr/SmartIr.svg

@@ -0,0 +1,4 @@
+<svg width="52" height="52" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="52" height="52" rx="7" fill="#292525"/>
+<rect x="17.7021" y="45.3617" width="17.7021" height="2.21277" rx="1.10638" fill="#09DF6C"/>
+</svg>

package/src/Images/SmartIr/Union.svg

@@ -0,0 +1,9 @@
+<svg width="48" height="54" viewBox="0 0 48 54" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0L24 54L48 0H24H0Z" fill="url(#paint0_linear_8245_24711)"/>
+<defs>
+<linearGradient id="paint0_linear_8245_24711" x1="24" y1="54" x2="24" y2="-6.73496e-07" gradientUnits="userSpaceOnUse">
+<stop stop-color="#09DF6C"/>
+<stop offset="1" stop-color="#09DF6C" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

package/src/Images/SmartIr/index.js

@@ -4,4 +4,7 @@ import Fan from './Fan.svg';
 import Fridge from './Fridge.svg';
 import TV from './TV.svg';
 import WM from './WM.svg';
-export { AC, DIY, Fan, Fridge, TV, WM };
+import Remote from './Remote.svg';
+import SmartIr from './SmartIr.svg';
+import Union from './Union.svg';
+export { AC, DIY, Fan, Fridge, TV, WM, Remote, SmartIr, Union };

package/src/commons/ActionGroup/ColorPickerTemplate.js

@@ -0,0 +1,51 @@
+import React, { memo, useCallback, useState } from 'react';
+import { View } from 'react-native';
+import styles from './ColorPickerTemplateStyles';
+import ColorPicker from 'react-native-wheel-color-picker';
+
+const ColorPickerTemplate = memo(({ actionGroup, doAction }) => {
+  const { configuration } = actionGroup;
+  const [valueComplete, setValueComplete] = useState(0);
+  const [isFirstColor, setIsFirstColor] = useState(false);
+
+  const onChangeColor = useCallback(
+    (color) => {
+      if (!isFirstColor) {
+        setIsFirstColor(true);
+        return;
+      }
+      setValueComplete(color);
+      doAction(configuration?.action_color_data, `{"value":"${color}"}`);
+    },
+    [configuration?.action_color_data, doAction, isFirstColor]
+  );
+
+  const PreventColorPicker = useCallback(
+    ({ style, color, onChangeComplete, props }) => {
+      return (
+        <ColorPicker
+          style={style}
+          sliderHidden={true}
+          swatches={false}
+          color={color}
+          onColorChangeComplete={onChangeComplete}
+          thumbSize={16}
+          {...props}
+        />
+      );
+    },
+    []
+  );
+
+  return (
+    <View style={styles.viewPickColor}>
+      <PreventColorPicker
+        style={styles.colorPicker}
+        color={valueComplete}
+        onChangeComplete={(color) => onChangeColor(color)}
+      />
+    </View>
+  );
+});
+
+export default ColorPickerTemplate;

package/src/commons/ActionGroup/ColorPickerTemplateStyles.js

@@ -0,0 +1,17 @@
+import { StyleSheet } from 'react-native';
+
+export default StyleSheet.create({
+  wrap: {
+    flexDirection: 'row',
+    justifyContent: 'space-around',
+    paddingVertical: 30,
+  },
+  viewPickColor: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  colorPicker: {
+    width: '100%',
+    height: 'auto',
+  },
+});

package/src/commons/ActionGroup/SliderRangeTemplate.js

@@ -0,0 +1,64 @@
+import React, { memo, useCallback, useState, useMemo } from 'react';
+import { View } from 'react-native';
+import { useTranslations } from '../../hooks/Common/useTranslations';
+import styles from './SliderRangeTemplateStyles';
+import Text from '../Text';
+import { Colors } from '../../configs';
+import SvgBrightness from '../../../assets/images/brightness.svg';
+import Slider from 'react-native-slider';
+
+const SliderRangeTemplate = memo(({ actionGroup, doAction }) => {
+  const t = useTranslations();
+  const { configuration } = actionGroup;
+  const [valueBrightness, setValueBrightness] = useState(0);
+
+  const onChangeBrightness = useCallback(
+    (value) => {
+      setValueBrightness(value);
+      doAction(
+        configuration?.action_brightness_data,
+        `{"value_brness":${value}}`
+      );
+    },
+    [configuration?.action_brightness_data, doAction]
+  );
+
+  const percentBrightness = useMemo(() => {
+    return valueBrightness || 0;
+  }, [valueBrightness]);
+
+  return (
+    <View style={styles.viewBrightness}>
+      <View style={styles.LeftBrightness}>
+        <SvgBrightness />
+        <Text type="H4" style={styles.LeftTextBrightness}>
+          {t('brightness')}
+        </Text>
+      </View>
+      <View style={styles.RightBrightness}>
+        <View style={styles.slider}>
+          <Slider
+            value={valueBrightness}
+            onSlidingComplete={onChangeBrightness}
+            onValueChange={setValueBrightness}
+            step={1}
+            minimumValue={0}
+            maximumValue={100}
+            thumbTintColor={Colors.Gray3}
+            minimumTrackTintColor={Colors.Primary}
+            maximumTrackTintColor={Colors.Gray4}
+            trackStyle={styles.trackSlider}
+            thumbStyle={styles.thumbSlider}
+          />
+        </View>
+        <View style={styles.valuePercent}>
+          <Text type="Label" style={styles.textValuePercent}>
+            {`${percentBrightness}%`}
+          </Text>
+        </View>
+      </View>
+    </View>
+  );
+});
+
+export default SliderRangeTemplate;

package/src/commons/ActionGroup/{LightActionTemplateStyles.js → SliderRangeTemplateStyles.js}

@@ -7,10 +7,6 @@ export default StyleSheet.create({
     justifyContent: 'space-around',
     paddingVertical: 30,
   },
-  viewPickColor: {
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
   viewBrightness: {
     paddingTop: 16,
     flexDirection: 'row',
@@ -28,10 +24,6 @@ export default StyleSheet.create({
     width: 20,
     height: 20,
   },
-  colorPicker: {
-    width: '100%',
-    height: 'auto',
-  },
   valuePercent: {
     width: 40,
     flexDirection: 'row',

package/src/commons/ActionGroup/SmartTiviActionTemplate/SmartTiviActionTemplate.js

@@ -4,6 +4,7 @@ import { View, ScrollView, Alert } from 'react-native';
 import styles from './SmartTiviActionTemplateStyles';
 import Text from '../../Text';
 import { Colors } from '../../../configs';
+import { SMART_TIVI_BUTTON } from '../../../configs/Constants';
 import { IconOutline } from '@ant-design/icons-react-native';
 import CircleButton from './component/CircleButton';
 import RectangleButton from './component/RectangleButton';
@@ -47,57 +48,30 @@ const SmartTiviActionTemplate = memo(
         link: '...',
       },
     ];
-    const onPressOnOff = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressExit = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressVolumeUp = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressVolumeDown = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressChUp = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressChDown = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressUp = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressDown = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressLeft = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressRight = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressOk = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressPrev = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressStop = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressNext = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressHome = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressBack = useCallback(() => {
-      return Alert.alert(t('feature_under_development'));
-    }, [t]);
-    const onPressChannel = useCallback(
-      (item) => {
-        return Alert.alert(t('feature_under_development'));
+    const onPressButton = useCallback(
+      (button, item) => () => {
+        switch (button) {
+          case SMART_TIVI_BUTTON.ONOFF_BUTTON:
+          case SMART_TIVI_BUTTON.EXIT_BUTTON:
+          case SMART_TIVI_BUTTON.VOLUME_UP_BUTTON:
+          case SMART_TIVI_BUTTON.VOLUME_DOWN_BUTTON:
+          case SMART_TIVI_BUTTON.CH_UP:
+          case SMART_TIVI_BUTTON.CH_DOWN:
+          case SMART_TIVI_BUTTON.UP_BUTTON:
+          case SMART_TIVI_BUTTON.DOWN_BUTTON:
+          case SMART_TIVI_BUTTON.LEFT_BUTTON:
+          case SMART_TIVI_BUTTON.RIGHT_BUTTON:
+          case SMART_TIVI_BUTTON.OK_BUTTON:
+          case SMART_TIVI_BUTTON.PREV_BUTTON:
+          case SMART_TIVI_BUTTON.STOP_BUTTON:
+          case SMART_TIVI_BUTTON.NEXT_BUTTON:
+          case SMART_TIVI_BUTTON.HOME_BUTTON:
+          case SMART_TIVI_BUTTON.BACK_BUTTON:
+          case SMART_TIVI_BUTTON.CHANNEL_BUTTON:
+            return Alert.alert(t('feature_under_development'));
+          default:
+            return <></>;
+        }
       },
       [t]
     );
@@ -130,13 +104,13 @@ const SmartTiviActionTemplate = memo(
                     style={styles.iconButton}
                   />
                 }
-                onPress={onPressOnOff}
+                onPress={onPressButton(SMART_TIVI_BUTTON.ONOFF_BUTTON)}
                 testID={TESTID.SMART_TIVI_TEMPLATE.ONOFF_BUTTON}
               />
               <CircleButton
                 type="small"
                 icon={<SvgInput size={20} style={styles.iconButtonExit} />}
-                onPress={onPressExit}
+                onPress={onPressButton(SMART_TIVI_BUTTON.EXIT_BUTTON)}
                 testID={TESTID.SMART_TIVI_TEMPLATE.EXIT_BUTTON}
               />
             </View>
@@ -144,18 +118,20 @@ const SmartTiviActionTemplate = memo(
               <RectangleButton
                 type="column"
                 icon={<VolumeUp width={20} height={20} />}
-                onPressUp={onPressVolumeUp}
-                onPressDown={onPressVolumeDown}
+                onPressUp={onPressButton(SMART_TIVI_BUTTON.VOLUME_UP_BUTTON)}
+                onPressDown={onPressButton(
+                  SMART_TIVI_BUTTON.VOLUME_DOWN_BUTTON
+                )}
                 testID={TESTID.SMART_TIVI_TEMPLATE.VOLUME_BUTTON}
               />
               <CircleButton
                 type="big"
                 wrapStyle={styles.circleBigButton}
-                onPressUp={onPressUp}
-                onPressDown={onPressDown}
-                onPressLeft={onPressLeft}
-                onPressRight={onPressRight}
-                onPressOk={onPressOk}
+                onPressUp={onPressButton(SMART_TIVI_BUTTON.UP_BUTTON)}
+                onPressDown={onPressButton(SMART_TIVI_BUTTON.DOWN_BUTTON)}
+                onPressLeft={onPressButton(SMART_TIVI_BUTTON.LEFT_BUTTON)}
+                onPressRight={onPressButton(SMART_TIVI_BUTTON.RIGHT_BUTTON)}
+                onPressOk={onPressButton(SMART_TIVI_BUTTON.OK_BUTTON)}
                 testID={TESTID.SMART_TIVI_TEMPLATE.BIG_BUTTON}
               />
               <RectangleButton
@@ -165,29 +141,29 @@ const SmartTiviActionTemplate = memo(
                     CH
                   </Text>
                 }
-                onPressUp={onPressChUp}
-                onPressDown={onPressChDown}
+                onPressUp={onPressButton(SMART_TIVI_BUTTON.CH_UP)}
+                onPressDown={onPressButton(SMART_TIVI_BUTTON.CH_DOWN)}
                 testID={TESTID.SMART_TIVI_TEMPLATE.CH_BUTTON}
               />
             </View>
             <View style={styles.controlPlay}>
               <ControlPlay
-                onPressPrev={onPressPrev}
-                onPressStop={onPressStop}
-                onPressNext={onPressNext}
+                onPressPrev={onPressButton(SMART_TIVI_BUTTON.PREV_BUTTON)}
+                onPressStop={onPressButton(SMART_TIVI_BUTTON.STOP_BUTTON)}
+                onPressNext={onPressButton(SMART_TIVI_BUTTON.NEXT_BUTTON)}
                 testID={TESTID.SMART_TIVI_TEMPLATE.CONTROL_BUTTON}
               />
             </View>
             <View style={styles.controlHome}>
               <RectangleButton
                 type="row"
-                onPress={onPressHome}
+                onPress={onPressButton(SMART_TIVI_BUTTON.HOME_BUTTON)}
                 icon={<Home />}
                 testID={TESTID.SMART_TIVI_TEMPLATE.HOME_BUTTON}
               />
               <RectangleButton
                 type="row"
-                onPress={onPressBack}
+                onPress={onPressButton(SMART_TIVI_BUTTON.BACK_BUTTON)}
                 icon={<KeyboardReturn />}
                 testID={TESTID.SMART_TIVI_TEMPLATE.BACK_BUTTON}
               />
@@ -198,7 +174,10 @@ const SmartTiviActionTemplate = memo(
                   return (
                     <RectangleButton
                       type="row"
-                      onPress={() => onPressChannel(item)}
+                      onPress={onPressButton(
+                        SMART_TIVI_BUTTON.CHANNEL_BUTTON,
+                        item
+                      )}
                       icon={iconChannels(item)}
                       wrapStyle={styles.buttonChannel}
                       index={index}

package/src/commons/ActionGroup/index.js

@@ -10,7 +10,8 @@ import OnOffTemplate from './OnOffTemplate';
 import TimerActionTemplate from './TimerActionTemplate';
 import CurtainButtonTemplate from './CurtainButtonTemplate';
 import SmartTiviActionTemplate from './SmartTiviActionTemplate/SmartTiviActionTemplate';
-import LightActionTemplate from './LightActionTemplate';
+import ColorPickerTemplate from './ColorPickerTemplate';
+import SliderRangeTemplate from './SliderRangeTemplate';
 import OnOffSmartLock from './OnOffSmartLock/OnOffSmartLock';
 
 export const getActionComponent = (template) => {
@@ -39,8 +40,10 @@ export const getActionComponent = (template) => {
       return CurtainButtonTemplate;
     case 'SmartTiviActionTemplate':
       return SmartTiviActionTemplate;
-    case 'light_action_template':
-      return LightActionTemplate;
+    case 'color_picker_template':
+      return ColorPickerTemplate;
+    case 'slider_range_template':
+      return SliderRangeTemplate;
     default:
       return null;
   }

package/src/commons/BottomSheet/index.js

@@ -10,6 +10,7 @@ const BottomSheet = ({
   onHide,
   title,
   children,
+  style,
 }) => {
   return (
     <ModalCustom
@@ -22,7 +23,7 @@ const BottomSheet = ({
       useNativeDriverForBackdrop={true}
     >
       <View style={styles.popoverStyle}>
-        <View style={styles.modalWrapper}>
+        <View style={[styles.modalWrapper, style]}>
           {!!title && (
             <View style={styles.modalHeader}>
               <Text semibold style={styles.modalHeaderText}>

package/src/commons/Device/Hanet/ItemHanetDevice.js

@@ -0,0 +1,109 @@
+import React, { memo } from 'react';
+import {
+  StyleSheet,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  View,
+} from 'react-native';
+import { IconFill, IconOutline } from '@ant-design/icons-react-native';
+import { useNavigation } from '@react-navigation/native';
+
+import Text from '../../Text';
+import FImage from '../../FImage';
+import { Colors } from '../../../configs';
+import { DEVICE_SIZE } from '../../../configs/Constants';
+import Routes from '../../../utils/Route';
+
+const ItemHanetDevice = memo(
+  ({ svgMain, title, sensor, unit, station, wrapStyle }) => {
+    const { navigate } = useNavigation();
+
+    const goToDetail = () => {
+      navigate(Routes.HanetCameraStack, {
+        screen: Routes.HanetCameraDetail,
+        params: {
+          unit,
+          station,
+          sensor,
+          title,
+        },
+      });
+    };
+
+    const displayIconSensor = () => {
+      const iconKit = sensor.icon_kit;
+      return iconKit ? (
+        <FImage source={{ uri: iconKit }} style={styles.iconSensor} />
+      ) : (
+        <IconFill name={svgMain} size={32} color={Colors.Red6} />
+      );
+    };
+
+    return (
+      <TouchableWithoutFeedback onPress={goToDetail}>
+        <View style={[styles.container, wrapStyle]}>
+          <View style={styles.boxIcon}>
+            <TouchableOpacity onPress={goToDetail}>
+              {displayIconSensor()}
+            </TouchableOpacity>
+          </View>
+          <TouchableOpacity onPress={goToDetail}>
+            <Text
+              numberOfLines={1}
+              semibold
+              size={14}
+              color={Colors.Gray9}
+              style={styles.lineHeight22}
+            >
+              {title}
+            </Text>
+            <View style={styles.row}>
+              <IconOutline name="right" size={12} />
+            </View>
+          </TouchableOpacity>
+        </View>
+      </TouchableWithoutFeedback>
+    );
+  }
+);
+
+export default ItemHanetDevice;
+
+const styles = StyleSheet.create({
+  container: {
+    padding: 12,
+    borderRadius: 10,
+    shadowColor: Colors.Shadow,
+    shadowOffset: {
+      width: 0,
+      height: 2,
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 3,
+    elevation: 4,
+    width: DEVICE_SIZE.width,
+    height: DEVICE_SIZE.height,
+    backgroundColor: Colors.White,
+    borderColor: Colors.Gray4,
+    justifyContent: 'space-between',
+    marginBottom: 8,
+    borderWidth: 1,
+  },
+  boxIcon: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+  row: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    alignItems: 'center',
+  },
+  lineHeight22: {
+    lineHeight: 22,
+  },
+  iconSensor: {
+    width: 40,
+    height: 40,
+    resizeMode: 'contain',
+  },
+});

package/src/commons/Device/HistoryChart.js

@@ -234,7 +234,7 @@ const HistoryChart = memo(
         )}
         <DateTimePickerModal
           isVisible={eventPicker.showModalStart}
-          date={eventPicker.startTime.toDate()}
+          date={eventPicker.startTime.utc().toDate()}
           mode={formatType || 'datetime'}
           onConfirm={onConfirmStart}
           onCancel={onCancel}
@@ -242,7 +242,7 @@ const HistoryChart = memo(
         />
         <DateTimePickerModal
           isVisible={eventPicker.showModalEnd}
-          date={eventPicker.startTime.toDate()}
+          date={eventPicker.endTime.utc().toDate()}
           mode={formatType || 'datetime'}
           onConfirm={onConfirmEnd}
           onCancel={onCancel}