@eohjsc/react-native-smart-city 0.3.35 → 0.3.36

package/assets/images/AddNewDevice/on-icon.svg

@@ -0,0 +1,5 @@
+<svg width="70" height="70" viewBox="0 0 70 70" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M35 67C52.6731 67 67 52.6731 67 35C67 17.3269 52.6731 3 35 3C17.3269 3 3 17.3269 3 35C3 52.6731 17.3269 67 35 67ZM35 70C54.33 70 70 54.33 70 35C70 15.67 54.33 0 35 0C15.67 0 0 15.67 0 35C0 54.33 15.67 70 35 70Z" fill="#00979D"/>
+<path d="M34.0401 34.9093C34.0401 36.8684 33.6732 38.5463 32.9393 39.9431C32.2113 41.3339 31.217 42.3993 29.9563 43.1391C28.7016 43.8789 27.2782 44.2488 25.6861 44.2488C24.094 44.2488 22.6676 43.8789 21.407 43.1391C20.1522 42.3933 19.1579 41.325 18.424 39.9342C17.696 38.5374 17.332 36.8624 17.332 34.9093C17.332 32.9503 17.696 31.2753 18.424 29.8845C19.1579 28.4877 20.1522 27.4194 21.407 26.6796C22.6676 25.9397 24.094 25.5698 25.6861 25.5698C27.2782 25.5698 28.7016 25.9397 29.9563 26.6796C31.217 27.4194 32.2113 28.4877 32.9393 29.8845C33.6732 31.2753 34.0401 32.9503 34.0401 34.9093ZM30.7287 34.9093C30.7287 33.5303 30.5127 32.3673 30.0806 31.4203C29.6545 30.4674 29.0626 29.7483 28.305 29.263C27.5475 28.7718 26.6745 28.5261 25.6861 28.5261C24.6977 28.5261 23.8247 28.7718 23.0671 29.263C22.3095 29.7483 21.7147 30.4674 21.2827 31.4203C20.8565 32.3673 20.6435 33.5303 20.6435 34.9093C20.6435 36.2883 20.8565 37.4543 21.2827 38.4072C21.7147 39.3542 22.3095 40.0733 23.0671 40.5645C23.8247 41.0498 24.6977 41.2925 25.6861 41.2925C26.6745 41.2925 27.5475 41.0498 28.305 40.5645C29.0626 40.0733 29.6545 39.3542 30.0806 38.4072C30.5127 37.4543 30.7287 36.2883 30.7287 34.9093Z" fill="#00979D"/>
+<path d="M52.0954 25.8184V44.0002H49.1657L40.5986 31.6156H40.4477V44.0002H37.154V25.8184H40.1015L48.6597 38.2119H48.8195V25.8184H52.0954Z" fill="#00979D"/>
+</svg>

package/assets/images/AddNewDevice/router-connect-icon.svg

@@ -0,0 +1,3 @@
+<svg width="133" height="59" viewBox="0 0 133 59" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M127.202 34.4313C128.51 34.4315 129.8 34.3786 131.002 33.7424C131.461 33.2829 131.885 32.8588 132.345 32.3639C133.228 30.7026 133.21 29.0234 132.344 27.3441L131.018 26.0183C129.799 25.3995 128.508 25.3463 127.2 25.3461C122.033 25.3543 116.866 25.3536 111.699 25.353L111.691 25.353C106.521 25.3523 101.35 25.3516 96.1801 25.3598C95.9524 25.3598 95.7173 25.4111 95.4419 25.4712C95.2898 25.5044 95.1252 25.5403 94.9428 25.5717C94.9528 25.0269 94.9657 24.5051 94.9782 23.9998L94.9783 23.9992C95.0095 22.7342 95.0383 21.5724 95.0129 20.4105C94.9064 17.1936 92.4138 14.6303 89.1969 14.5946C85.7827 14.5447 82.3772 14.5553 78.9682 14.566H78.968L78.9673 14.566L78.9667 14.566L78.966 14.566L78.9654 14.566L78.9647 14.566L78.964 14.566L78.9634 14.566L78.9627 14.5661C77.5026 14.5706 76.0418 14.5752 74.5794 14.575C73.4481 14.5749 72.9356 15.1227 72.9181 16.2716C72.9065 16.8662 72.9257 17.4608 72.9452 18.0656C72.9553 18.3777 72.9654 18.6924 72.9715 19.0113C70.9035 18.9934 68.9945 18.9931 67.0856 18.9929C65.4064 19.0103 64.0455 19.6995 63.1619 21.1488C61.3241 24.1887 63.3749 27.9361 66.963 28.025C68.271 28.0605 69.579 28.0332 70.887 28.0058C71.541 27.9922 72.1949 27.9785 72.8489 27.9727C72.849 28.6342 72.8446 29.264 72.8402 29.8851L72.8402 29.8884L72.8402 29.8884L72.8402 29.8895C72.8359 30.495 72.8317 31.0921 72.8317 31.7022C72.6949 31.7022 72.5539 31.7063 72.4088 31.7106L72.4079 31.7106L72.4075 31.7106L72.4072 31.7106H72.4072H72.4071C72.2529 31.7151 72.0939 31.7198 71.9303 31.7198C71.5144 31.7197 71.0995 31.7185 70.6853 31.7174H70.6852H70.6852H70.6851H70.6851H70.685H70.685H70.6849H70.6849C69.4444 31.7139 68.2089 31.7105 66.9635 31.7368C64.3476 31.8072 62.4036 33.8572 62.4923 36.3848C62.5633 38.8594 64.4901 40.7156 67.0707 40.7512C68.2884 40.7735 69.4992 40.7612 70.703 40.7489C71.4213 40.7415 72.1372 40.7342 72.8506 40.7343C72.8614 40.8313 72.8722 40.8757 72.8789 40.9036C72.8833 40.9215 72.886 40.9326 72.886 40.9464C72.9037 41.7418 72.9038 42.5195 72.9039 43.2973C72.9218 44.6583 73.4168 45.1886 74.7601 45.1888C76.3024 45.189 77.8428 45.1911 79.382 45.1932L79.3842 45.1932H79.3865H79.3887L79.4166 45.1932L79.438 45.1933L79.4593 45.1933H79.4613C82.5876 45.1976 85.7087 45.202 88.8297 45.1906C92.4708 45.1911 94.9981 42.6285 95.033 38.9873C95.0441 38.032 95.0266 37.0767 95.0078 36.0486L95.0078 36.0474C94.997 35.4591 94.9858 34.8469 94.9793 34.1973C95.1655 34.226 95.3372 34.2634 95.5003 34.2989C95.7397 34.351 95.9605 34.399 96.1813 34.4096C101.351 34.4191 106.521 34.4198 111.691 34.4204C116.861 34.4211 122.031 34.4218 127.202 34.4313ZM76.6686 42.1488C76.4565 42.1488 76.2444 42.1488 76.0147 42.1311C76.0136 33.9297 76.0125 25.8344 76.0291 17.6507C76.1487 17.6507 76.2847 17.6425 76.4252 17.634L76.4255 17.634C76.5759 17.6249 76.7314 17.6154 76.8776 17.6155C78.1681 17.6156 79.4607 17.6139 80.7545 17.6121L80.7634 17.6121L80.767 17.612L80.7679 17.612L80.769 17.612L80.7741 17.612C83.3721 17.6085 85.9754 17.6049 88.5787 17.617C90.7351 17.6173 91.9725 18.8547 91.9728 21.0464L91.9751 38.7572C91.9754 40.9489 90.8089 42.1507 88.6526 42.1504L76.6687 42.1488H76.6686ZM95.3067 31.3678C95.2362 31.3595 95.1694 31.3516 95.1027 31.3516C95.1202 30.3796 95.1201 29.4253 95.1199 28.365L95.1199 28.3645L95.1258 28.3645C98.3584 28.3826 101.591 28.4007 104.841 28.4011L127.784 28.4041C128.049 28.3864 128.332 28.3865 128.615 28.4219C129.481 28.5457 130.011 29.1467 129.958 29.9421C129.905 30.7728 129.446 31.2323 128.615 31.356C128.438 31.3913 128.226 31.3913 128.05 31.3912L95.5622 31.387C95.4689 31.387 95.3855 31.3771 95.3067 31.3678ZM72.8835 21.9984H72.8835C72.863 22.6147 72.8366 23.1891 72.8111 23.7426L72.8111 23.7436C72.7927 24.1423 72.7749 24.5301 72.7602 24.9149C72.4677 24.9202 72.1732 24.926 71.877 24.9318C70.2397 24.9641 68.5506 24.9973 66.8743 24.9671C66.0435 24.9493 65.4778 24.2422 65.5131 23.4645C65.5306 22.6338 66.1138 22.0506 67.0506 22.033C68.9594 21.9979 70.8682 21.9982 72.8831 21.9984H72.8831H72.8832H72.8832H72.8833H72.8833H72.8834H72.8834H72.8835ZM70.5785 34.8483C71.3364 34.8626 72.0982 34.877 72.8675 34.8838C72.8617 35.1842 72.8578 35.4867 72.8539 35.7891C72.8461 36.394 72.8383 36.9989 72.8148 37.5881L72.4526 37.5978L71.9783 37.6109C70.2556 37.6585 68.5216 37.7063 66.7875 37.6757C65.9921 37.6579 65.5148 37.0392 65.5324 36.2085C65.5323 35.3954 66.0271 34.8299 66.8579 34.8123C68.0992 34.8015 69.3338 34.8248 70.5785 34.8483ZM34.2029 34.3223C34.3625 34.2948 34.5334 34.2653 34.724 34.2425C34.7241 34.863 34.722 35.4522 34.7201 36.0222L34.7201 36.0232C34.7164 37.1088 34.7129 38.1249 34.7246 39.1562C34.7958 42.6206 37.3237 45.1839 40.7881 45.2197C45.5251 45.2557 50.2797 45.2386 55.0344 45.2215C56.307 45.2217 56.8372 44.6915 56.8371 43.3835C56.8367 40.392 56.8382 37.4024 56.8398 34.4141V34.4049V34.4049V34.4048V34.4048V34.4047V34.4046V34.4046V34.4045V34.4044C56.843 28.4267 56.8461 22.4542 56.8336 16.4816C56.8334 15.1383 56.3207 14.6256 54.942 14.6255C50.2934 14.6072 45.6271 14.6066 40.9785 14.6237C37.2667 14.6232 34.7218 17.1681 34.7046 20.8622C34.7048 22.347 34.7226 23.8494 34.7582 25.5816C34.5829 25.5565 34.4253 25.527 34.2776 25.4993C34.0084 25.4489 33.772 25.4047 33.5209 25.4047C24.4213 25.3858 15.3393 25.3846 6.2573 25.3834L6.24781 25.3834L6.2477 25.3834C5.75282 25.3834 5.25795 25.3833 4.76309 25.4539C1.75833 25.9131 0.044255 29.2535 1.47631 31.958C2.39566 33.6904 3.93351 34.4152 5.8778 34.4155C10.4999 34.4073 15.122 34.4079 19.7441 34.4085L19.7452 34.4085H19.7515L19.7558 34.4085L19.7579 34.4085C24.3754 34.4091 28.9929 34.4097 33.6105 34.4014C33.8014 34.3914 33.9924 34.3585 34.2029 34.3223ZM53.3192 17.6115L53.3192 17.6115C53.4388 17.6162 53.5493 17.6206 53.6345 17.6301V17.6383C53.6355 25.8016 53.6366 33.9295 53.62 42.0751C53.5614 42.0751 53.4846 42.0812 53.3947 42.0883C53.2675 42.0983 53.114 42.1104 52.9483 42.1104C49.0421 42.1276 45.1358 42.1447 41.2295 42.1266C38.9671 42.1263 37.7473 40.9065 37.747 38.6794L37.7447 20.9687C37.7445 18.7769 38.9286 17.5928 41.0849 17.5931C43.7375 17.5817 46.3901 17.586 49.0375 17.5902L49.0445 17.5902C50.3639 17.5924 51.682 17.5945 52.9981 17.5947C53.1049 17.6029 53.2154 17.6073 53.3191 17.6114L53.3192 17.6115ZM5.62956 28.4058L34.6879 28.4096C34.6703 29.4167 34.6704 30.3355 34.6706 31.3249L34.6706 31.325L34.6706 31.3261C34.5824 31.3319 34.4962 31.3397 34.41 31.3476L34.4094 31.3476C34.2365 31.3633 34.0637 31.379 33.8752 31.379L6.23092 31.3754C6.03649 31.393 5.85973 31.393 5.6653 31.3753C4.60478 31.3398 3.98606 30.7564 4.00362 29.855C4.02118 28.9536 4.6044 28.4057 5.62956 28.4058ZM57.9637 8.13901C58.1405 8.31578 58.3192 8.49059 58.4979 8.66541C58.8554 9.01503 59.2129 9.36466 59.5547 9.73C60.1734 10.3841 60.1735 11.1971 59.5903 11.8157C58.9894 12.4519 58.1057 12.4872 57.4339 11.8508C56.3556 10.8078 55.3126 9.76479 54.2696 8.68646C53.6332 8.01471 53.6508 7.14862 54.287 6.54774C54.8879 5.98221 55.7186 5.96464 56.3727 6.58337C56.7964 6.95408 57.1804 7.34463 57.5693 7.74015L57.5695 7.7404L57.5698 7.74066L57.5701 7.74092L57.5703 7.74117L57.5706 7.74142L57.5708 7.74169L57.5711 7.74195C57.7008 7.87393 57.8312 8.00647 57.9637 8.13901ZM73.3279 10.8139C73.5026 10.6352 73.6774 10.4565 73.8541 10.2798C74.0322 10.1017 74.2122 9.92567 74.3909 9.75092C74.7443 9.40535 75.0924 9.06496 75.4094 8.72456C76.0633 8.03531 76.0455 7.16921 75.4091 6.56816C74.8257 5.9848 73.9773 5.98469 73.3411 6.58557C72.263 7.62828 71.2203 8.67099 70.1776 9.74905C69.5237 10.4383 69.5415 11.3044 70.1779 11.9054C70.7789 12.4711 71.6273 12.4712 72.2635 11.8704C72.6288 11.5287 72.9783 11.1713 73.3279 10.8139ZM71.7031 51.5692C71.5316 51.3976 71.36 51.23 71.1891 51.0631L71.1889 51.0629C70.8492 50.731 70.5121 50.4017 70.1828 50.0489C69.5464 49.3771 69.564 48.5111 70.1825 47.8925C70.7834 47.327 71.6142 47.3094 72.2682 47.9281C73.3466 48.9711 74.3896 50.0141 75.4325 51.0924C76.0689 51.7642 76.0514 52.6303 75.4328 53.2488C74.8319 53.8143 74.0189 53.8142 73.3471 53.2132L73.2764 53.1425L71.7031 51.5692ZM56.4247 48.9499L56.4246 48.95L56.4245 48.9501L56.4244 48.9502C56.2576 49.1209 56.0901 49.2923 55.9187 49.4637C55.7368 49.6457 55.5509 49.8277 55.3643 50.0103C54.9893 50.3775 54.6115 50.7473 54.2575 51.125C53.6743 51.7789 53.6744 52.6273 54.2577 53.2107C54.8411 53.7941 55.7072 53.8472 56.3434 53.2463C57.4392 52.186 58.5172 51.1079 59.5776 50.0122C60.1785 49.3759 60.1607 48.5098 59.5773 47.9265C58.9763 47.2901 58.1279 47.29 57.4386 47.9439C57.0859 48.2731 56.7567 48.6101 56.4249 48.9497L56.4247 48.9499ZM66.0227 1.06991C66.0732 1.26605 66.1254 1.4391 66.1732 1.5975C66.2762 1.93871 66.3587 2.21194 66.3588 2.50166C66.3943 3.80964 66.3944 5.11762 66.3593 6.42559C66.3417 7.43308 65.7232 8.08699 64.8394 8.08687C63.9556 8.08676 63.3723 7.43269 63.3368 6.40752C63.3016 5.07556 63.3185 3.76098 63.3358 2.41209V2.41206V2.41203V2.41199L63.3363 2.37754C63.3538 1.6882 63.6366 1.08727 64.3082 0.945956C64.6995 0.867739 65.1198 0.933931 65.5547 1.00243L65.5547 1.00244L65.5547 1.00244L65.5547 1.00245C65.7091 1.02676 65.8653 1.05137 66.0227 1.06991ZM65.4472 58.815C65.6085 58.7848 65.765 58.7555 65.9065 58.7446C65.982 58.5593 66.0654 58.4034 66.1393 58.2653L66.1393 58.2653C66.2557 58.0478 66.3483 57.8748 66.3483 57.7018C66.3518 57.5432 66.3555 57.3848 66.3591 57.2265L66.3593 57.2214L66.3594 57.2163C66.3925 55.7905 66.4254 54.3759 66.33 52.9471C66.2945 52.1341 65.6405 51.6921 64.8274 51.7273C64.0143 51.7626 63.4488 52.2574 63.4136 53.0705C63.3431 54.5906 63.3256 56.1283 63.4318 57.6484C63.4496 58.0903 63.9799 58.656 64.4041 58.8328C64.6977 58.9552 65.0845 58.8828 65.4472 58.815ZM86.0882 30.9616C85.4871 30.3605 85.487 29.4768 86.0525 28.8759C86.6358 28.2573 87.5372 28.2397 88.1382 28.8054C88.7746 29.4065 88.7924 30.3433 88.1739 30.9618C87.5907 31.545 86.6892 31.5273 86.0882 30.9616ZM42.6421 30.9559C43.2255 31.5393 44.1269 31.5217 44.7278 30.9208C45.311 30.3376 45.3109 29.4538 44.7275 28.8351C44.1265 28.2341 43.2604 28.2163 42.6418 28.7995C42.0056 29.4004 42.0057 30.3549 42.6421 30.9559Z" fill="#00979D"/>
+</svg>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eohjsc/react-native-smart-city",
   "title": "React Native Smart Home",
-  "version": "0.3.35",
+  "version": "0.3.36",
   "description": "TODO",
   "main": "index.js",
   "files": [

package/src/commons/Device/HorizontalBarChart.js

@@ -33,7 +33,7 @@ const HorizontalBarChart = memo(({ datas, config }) => {
     },
     yAxis: {
       min: 0,
-      minRange: 0.5,
+      minRange: 0,
       title: {
         text: null,
       },
@@ -87,6 +87,7 @@ const HorizontalBarChart = memo(({ datas, config }) => {
             );
           },
           align: 'right',
+          inside: false,
         },
         labels: {
           style: {
@@ -129,9 +130,6 @@ const HorizontalBarChart = memo(({ datas, config }) => {
       ...options,
       chart: {
         ...options.chart,
-        scrollablePlotArea: {
-          minHeight: dataY.length * 32,
-        },
       },
       xAxis: {
         ...options.xAxis,
@@ -139,8 +137,6 @@ const HorizontalBarChart = memo(({ datas, config }) => {
       },
       series: [
         {
-          marker: { enabled: true },
-          color: Colors.Primary + '50',
           name: JSON.stringify(config),
           data: dataY,
         },

package/src/configs/Constants.js

@@ -81,6 +81,8 @@ export const DEVICE_TYPE = {
   HANET: 'HANET',
   ZIGBEE: 'ZIGBEE',
   GOOGLE_HOME: 'GOOGLE_HOME',
+  WIFI_DEVICE: 'WIFI_DEVICE',
+  MODBUS: 'MODBUS',
 };
 
 const marginItem = 12;

package/src/navigations/AddGatewayStack.js

@@ -19,6 +19,8 @@ import ShareWifiPassword from '../screens/AddNewGateway/ShareWifiPassword';
 import ScanGatewayQR from '../screens/AddNewGateway/ScanGatewayQR';
 import RenameNewDevices from '../screens/AddNewGateway/RenameNewDevices';
 import ConnectingWifiGuide from '../screens/AddNewGateway/ConnectingWifiGuide';
+import ConnectRouterGuide from '../screens/AddNewGateway/PlugAndPlay/ConnectRouterGuide';
+import ZigbeeDeviceConnectGuide from '../screens/AddNewGateway/PlugAndPlay/ZigbeeDeviceConnectGuide';
 
 const Stack = createStackNavigator();
 
@@ -82,6 +84,14 @@ export const AddGatewayStack = memo(() => {
         name={Route.ConnectingWifiGuide}
         component={ConnectingWifiGuide}
       />
+      <Stack.Screen
+        name={Route.ConnectRouterGuide}
+        component={ConnectRouterGuide}
+      />
+      <Stack.Screen
+        name={Route.ZigbeeDeviceConnectGuide}
+        component={ZigbeeDeviceConnectGuide}
+      />
     </Stack.Navigator>
   );
 });

package/src/screens/AddNewGateway/ConnectingModbusDevice.js

@@ -35,7 +35,6 @@ const ConnectingModbusDevice = ({ route }) => {
           channel_name: channelName,
         }
       );
-
       if (!success) {
         addingModbusDeviceFail(JSON.stringify(problem || data));
         return;

package/src/screens/AddNewGateway/PlugAndPlay/ConnectRouterGuide.js

@@ -0,0 +1,49 @@
+import React, { useCallback } from 'react';
+import { View } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import { HeaderCustom } from '../../../commons/Header';
+import { ViewButtonBottom } from '../../../commons';
+import RouterConnectIcon from '../../../../assets/images/AddNewDevice/router-connect-icon.svg';
+import Routes from '../../../utils/Route';
+import { Colors } from '../../../configs';
+import Text from '../../../commons/Text';
+import styles from './ConnectRouterGuideStyles';
+
+const ConnectRouterGuide = ({ route }) => {
+  const t = useTranslations();
+  const { navigate, goBack } = useNavigation();
+
+  const onRight = useCallback(() => {
+    navigate(Routes.SelectZigbeeGateway, {
+      ...route?.params,
+    });
+  }, [navigate, route]);
+
+  return (
+    <View style={styles.container}>
+      <HeaderCustom isShowSeparator />
+      <View style={styles.contentContainer}>
+        <View style={styles.guideContent}>
+          <RouterConnectIcon width={94} height={94} />
+          <Text type="H4" semibold style={styles.txtContent}>
+            {t('connect_to_router')}
+          </Text>
+          <Text style={styles.txtContent}>{t('connect_router_content')}</Text>
+          <Text semibold color={Colors.Gray7} style={styles.txtContent}>
+            {t('read_device_manual_guide')}
+          </Text>
+        </View>
+        <ViewButtonBottom
+          leftTitle={t('cancel')}
+          onLeftClick={goBack}
+          rightTitle={t('text_next')}
+          onRightClick={onRight}
+          styleButtonLeftText={styles.buttonLeftText}
+        />
+      </View>
+    </View>
+  );
+};
+
+export default ConnectRouterGuide;

package/src/screens/AddNewGateway/PlugAndPlay/ConnectRouterGuideStyles.js

@@ -0,0 +1,31 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from '../../../configs';
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: Colors.White,
+  },
+  contentContainer: {
+    flex: 1,
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    paddingVertical: 16,
+  },
+  guideContent: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginBottom: 80,
+  },
+  txtContent: {
+    marginVertical: 7,
+    paddingHorizontal: 40,
+    textAlign: 'center',
+  },
+  buttonLeftText: {
+    color: Colors.Gray6,
+  },
+});
+
+export default styles;

package/src/screens/AddNewGateway/PlugAndPlay/ZigbeeDeviceConnectGuide.js

@@ -0,0 +1,51 @@
+import React, { useCallback } from 'react';
+import { View } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import { useTranslations } from '../../../hooks/Common/useTranslations';
+import Text from '../../../commons/Text';
+import { HeaderCustom } from '../../../commons/Header';
+import { ViewButtonBottom } from '../../../commons';
+import TurnOnIcon from '../../../../assets/images/AddNewDevice/on-icon.svg';
+import Routes from '../../../utils/Route';
+import { Colors } from '../../../configs';
+import styles from './ConnectRouterGuideStyles';
+
+const ZigbeeDeviceConnectGuide = ({ route }) => {
+  const t = useTranslations();
+  const { navigate, goBack } = useNavigation();
+
+  const onRight = useCallback(() => {
+    navigate(Routes.ConnectingZigbeeDevice, {
+      ...route?.params,
+    });
+  }, [navigate, route]);
+
+  return (
+    <View style={styles.container}>
+      <HeaderCustom title={t('turn_on_zigbee_device')} isShowSeparator />
+      <View style={styles.contentContainer}>
+        <View style={styles.guideContent}>
+          <TurnOnIcon />
+          <Text type="H4" semibold style={styles.txtContent}>
+            {t('turn_on_device_to_connect')}
+          </Text>
+          <Text style={styles.txtContent}>
+            {t('turn_on_zigbee_device_content')}
+          </Text>
+          <Text semibold color={Colors.Gray7} style={styles.txtContent}>
+            {t('read_device_manual_guide')}
+          </Text>
+        </View>
+        <ViewButtonBottom
+          leftTitle={t('cancel')}
+          onLeftClick={goBack}
+          rightTitle={t('text_next')}
+          onRightClick={onRight}
+          styleButtonLeftText={styles.buttonLeftText}
+        />
+      </View>
+    </View>
+  );
+};
+
+export default ZigbeeDeviceConnectGuide;

package/src/screens/AddNewGateway/ScanGatewayQR.js

@@ -1,16 +1,13 @@
 import React, { memo, useCallback, useState } from 'react';
 import { View, StyleSheet } from 'react-native';
-import QRScan from '../ScanChipQR/components/QRScan';
-import Routes from '../../utils/Route';
-import { useTranslations } from '../../hooks/Common/useTranslations';
 import { useNavigation } from '@react-navigation/native';
-import BottomSheet from '../../commons/BottomSheet';
-import Text from '../../commons/Text';
-import { ViewButtonBottom } from '../../commons';
+
+import Routes from '../../utils/Route';
+import QRScan from '../ScanChipQR/components/QRScan';
+import InvalidQRCode from '../ScanChipQR/components/InvalidQRCode';
 
 const ScanGatewayQR = memo(({ route }) => {
   // same as Scan Wifi Device, not sure if we should separated it
-  const t = useTranslations();
   const { unitId, stationId } = route?.params || {};
   const [isInvalidQrCode, setIsInvalidQrCode] = useState(false);
   const { navigate, goBack } = useNavigation();
@@ -35,13 +32,13 @@ const ScanGatewayQR = memo(({ route }) => {
       }
       navigate(Routes.ConnectingWifiGuide, {
         unitId,
-        stationId,
+        stationId: stationId,
         prefix: devicePrefixName,
         qrData: data,
       });
       setLoading(true);
     },
-    [navigate, unitId, stationId]
+    [navigate, stationId, unitId]
   );
 
   const onRetry = useCallback(() => {
@@ -53,17 +50,11 @@ const ScanGatewayQR = memo(({ route }) => {
   return (
     <View style={styles.container}>
       <QRScan onScan={onScan} />
-      <BottomSheet isVisible={isInvalidQrCode} title={t('invalid_qr_code')}>
-        <Text style={styles.warningContainer}>
-          {t('invalid_qr_code_warning')}
-        </Text>
-        <ViewButtonBottom
-          leftTitle={t('cancel')}
-          onLeftClick={goBack}
-          rightTitle={t('retry')}
-          onRightClick={onRetry}
-        />
-      </BottomSheet>
+      <InvalidQRCode
+        isInvalidQrCode={isInvalidQrCode}
+        goBack={goBack}
+        onRetry={onRetry}
+      />
     </View>
   );
 });
@@ -72,9 +63,6 @@ const styles = StyleSheet.create({
   container: {
     flex: 1,
   },
-  warningContainer: {
-    paddingHorizontal: 16,
-  },
 });
 
 export default ScanGatewayQR;

package/src/screens/AddNewGateway/ScanModbusQR.js

@@ -1,15 +1,23 @@
-import React, { memo, useCallback } from 'react';
+import React, { memo, useCallback, useEffect, useState } from 'react';
 import { View, StyleSheet } from 'react-native';
-import QRScan from '../ScanChipQR/components/QRScan';
+import { useNavigation } from '@react-navigation/native';
+
 import Routes from '../../utils/Route';
-import { ToastBottomHelper } from '../../utils/Utils';
 import { useTranslations } from '../../hooks/Common/useTranslations';
-import { useNavigation } from '@react-navigation/native';
+import { ModalCustom } from '../../commons/Modal';
+import { ViewButtonBottom } from '../../commons';
+import useBoolean from '../../hooks/Common/useBoolean';
+import Text from '../../commons/Text';
+import QRScan from '../ScanChipQR/components/QRScan';
+import InvalidQRCode from '../ScanChipQR/components/InvalidQRCode';
+import { Colors } from '../../configs';
 
 const ScanModbusQR = memo(({ route }) => {
   const t = useTranslations();
   const { unitId, stationId, chipId } = route?.params || {};
-  const navigation = useNavigation();
+  const { navigate, goBack } = useNavigation();
+  const [showPopupGuide, setShowPopupGuide, setHidePopupGuide] = useBoolean();
+  const [isInvalidQrCode, setIsInvalidQrCode] = useState(false);
 
   const onScan = useCallback(
     (body, setLoading) => {
@@ -17,29 +25,66 @@ const ScanModbusQR = memo(({ route }) => {
       try {
         data = JSON.parse(body);
       } catch (e) {
-        ToastBottomHelper.error(t('wrong_qr_format'));
+        setIsInvalidQrCode(true);
         setLoading(false);
         return;
       }
       const devicePrefixName = data?.imei?.split('-')[0]; // todo Bang change QR format
       if (devicePrefixName !== 'SENSOR') {
-        ToastBottomHelper.error(t('wrong_qr_format'));
+        setIsInvalidQrCode(true);
         setLoading(false);
         return;
       }
-      navigation.navigate(Routes.ConnectingModbusDevice, {
+      navigate(Routes.ConnectingModbusDevice, {
         unitId,
-        stationId,
+        stationId: stationId,
         chipId,
         qrData: data,
       });
     },
-    [navigation, unitId, stationId, chipId, t]
+    [navigate, unitId, stationId, chipId]
   );
 
+  const onRetry = useCallback(() => {
+    if (isInvalidQrCode) {
+      setIsInvalidQrCode(false);
+    }
+  }, [isInvalidQrCode]);
+
+  useEffect(() => {
+    setShowPopupGuide();
+  }, [setShowPopupGuide]);
+
   return (
     <View style={styles.container}>
-      <QRScan onScan={onScan} />
+      <QRScan isScanReady={!showPopupGuide} onScan={onScan} />
+      <ModalCustom
+        onBackButtonPress={goBack}
+        isVisible={showPopupGuide}
+        style={styles.modal}
+      >
+        <View style={styles.modalWrapper}>
+          <View style={styles.modalContent}>
+            <Text type="H4" semibold style={styles.txtCenter}>
+              {t('turn_off_device')}
+            </Text>
+            <Text style={styles.txtCenter}>
+              {t('turn_off_device_when_scan_qr_guide')}
+            </Text>
+          </View>
+          <ViewButtonBottom
+            leftTitle={t('cancel')}
+            onLeftClick={goBack}
+            rightTitle={t('ok')}
+            onRightClick={setHidePopupGuide}
+          />
+        </View>
+      </ModalCustom>
+      <InvalidQRCode
+        isInvalidQrCode={isInvalidQrCode}
+        goBack={goBack}
+        onRetry={onRetry}
+      />
     </View>
   );
 });
@@ -48,6 +93,25 @@ const styles = StyleSheet.create({
   container: {
     flex: 1,
   },
+  modal: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  modalWrapper: {
+    backgroundColor: Colors.White,
+    borderRadius: 10,
+    justifyContent: 'center',
+    alignItems: 'center',
+    width: 280,
+  },
+  modalContent: {
+    paddingHorizontal: 16,
+    paddingTop: 16,
+  },
+  txtCenter: {
+    textAlign: 'center',
+  },
 });
 
 export default ScanModbusQR;

package/src/screens/AddNewGateway/ScanWifiDeviceQR.js

@@ -1,15 +1,14 @@
-import React, { memo, useCallback } from 'react';
+import React, { memo, useCallback, useState } from 'react';
 import { View, StyleSheet } from 'react-native';
 import QRScan from '../ScanChipQR/components/QRScan';
 import Routes from '../../utils/Route';
-import { ToastBottomHelper } from '../../utils/Utils';
-import { useTranslations } from '../../hooks/Common/useTranslations';
 import { useNavigation } from '@react-navigation/native';
+import InvalidQRCode from '../ScanChipQR/components/InvalidQRCode';
 
 const ScanWifiDeviceQR = memo(({ route }) => {
-  const t = useTranslations();
   const { unitId, stationId } = route?.params || {};
-  const navigation = useNavigation();
+  const [isInvalidQrCode, setIsInvalidQrCode] = useState(false);
+  const { navigate, goBack } = useNavigation();
 
   const onScan = useCallback(
     (body, setLoading) => {
@@ -17,18 +16,18 @@ const ScanWifiDeviceQR = memo(({ route }) => {
       try {
         data = JSON.parse(body);
       } catch (e) {
-        ToastBottomHelper.error(t('wrong_qr_format'));
+        setIsInvalidQrCode(true);
         setLoading(false);
         return;
       }
       const devicePrefixName = data?.imei?.split('-')[0];
       // todo Bang change QR format
       if (['ROBOT'].indexOf(devicePrefixName) === -1) {
-        ToastBottomHelper.error(t('wrong_qr_format'));
+        setIsInvalidQrCode(true);
         setLoading(false);
         return;
       }
-      navigation.navigate(Routes.ShareWifiPassword, {
+      navigate(Routes.ConnectingWifiGuide, {
         unitId,
         stationId,
         prefix: devicePrefixName,
@@ -36,12 +35,23 @@ const ScanWifiDeviceQR = memo(({ route }) => {
       });
       setLoading(true);
     },
-    [navigation, unitId, stationId, t]
+    [navigate, unitId, stationId]
   );
 
+  const onRetry = useCallback(() => {
+    if (isInvalidQrCode) {
+      setIsInvalidQrCode(false);
+    }
+  }, [isInvalidQrCode]);
+
   return (
     <View style={styles.container}>
       <QRScan onScan={onScan} />
+      <InvalidQRCode
+        isInvalidQrCode={isInvalidQrCode}
+        goBack={goBack}
+        onRetry={onRetry}
+      />
     </View>
   );
 });

package/src/screens/AddNewGateway/SelectDeviceSubUnit.js

@@ -4,20 +4,39 @@ import { useCallback } from 'react';
 import { useTranslations } from '../../hooks/Common/useTranslations';
 import { useNavigation } from '@react-navigation/native';
 import Routes from '../../utils/Route';
+import { DEVICE_TYPE } from '../../configs/Constants';
 
 const SelectDeviceSubUnit = ({ route }) => {
-  const { unitId, unitName } = route?.params || {};
+  const { unitId, unitName, deviceType } = route?.params || {};
   const t = useTranslations();
   const navigation = useNavigation();
   const onPressNext = useCallback(
     (unit, subUnit) => {
-      navigation.navigate(Routes.SelectDeviceType, {
-        unitId,
-        unitName,
-        stationId: subUnit?.id,
-      });
+      switch (deviceType) {
+        case DEVICE_TYPE.WIFI_DEVICE:
+          navigation.navigate(Routes.ScanWifiDeviceQR, {
+            unitId,
+            unitName,
+            stationId: subUnit?.id,
+          });
+          break;
+        case DEVICE_TYPE.MODBUS:
+          navigation.navigate(Routes.SelectModbusGateway, {
+            unitId,
+            unitName,
+            stationId: subUnit?.id,
+          });
+          break;
+        case DEVICE_TYPE.ZIGBEE:
+          navigation.navigate(Routes.ConnectRouterGuide, {
+            unitId,
+            unitName,
+            stationId: subUnit?.id,
+          });
+          break;
+      }
     },
-    [navigation, unitId, unitName]
+    [deviceType, navigation, unitId, unitName]
   );
   return (
     <SelectSubUnit

package/src/screens/AddNewGateway/SelectDeviceType.js

@@ -13,6 +13,7 @@ import AddModbusDeviceIcon from '../../../assets/images/AddNewDevice/add-modbus-
 import AddZigbeeDeviceIcon from '../../../assets/images/AddNewDevice/add-zigbee-device-icon.svg';
 import styles from './SelectDeviceTypeStyles';
 import AccessibilityLabel from '../../configs/AccessibilityLabel';
+import { DEVICE_TYPE } from '../../configs/Constants';
 
 const SelectDeviceGrid = ({ options, onSelect }) => {
   const [selectIndexes, setSelectIndexes] = useState();
@@ -76,6 +77,8 @@ const SelectDeviceType = ({ route }) => {
         data: {
           unitId,
           unitName,
+          stationId,
+          deviceType: DEVICE_TYPE.WIFI_DEVICE,
         },
         title: t('wifi_device'),
         subtitle: t('device_connect_without_gateway'),
@@ -89,6 +92,8 @@ const SelectDeviceType = ({ route }) => {
         data: {
           unitId,
           unitName,
+          stationId,
+          deviceType: DEVICE_TYPE.MODBUS,
         },
         title: t('modbus'),
         subtitle: t('device_connect_directly_to_the_gateway'),
@@ -97,11 +102,13 @@ const SelectDeviceType = ({ route }) => {
         id: 4,
         image: <AddZigbeeDeviceIcon width={60} height={60} />,
         route: stationId
-          ? Routes.SelectZigbeeGateway
+          ? Routes.ConnectRouterGuide
           : Routes.SelectDeviceSubUnit,
         data: {
           unitId,
           unitName,
+          stationId,
+          deviceType: DEVICE_TYPE.ZIGBEE,
         },
         title: t('zigbee'),
         subtitle: t('device_connect_remotely_to_the_gateway'),

package/src/screens/AddNewGateway/SelectZigbeeGateway.js

@@ -11,7 +11,7 @@ const SelectZigbeeGateway = ({ route }) => {
 
   const onPressNext = useCallback(
     (gateway) => {
-      navigation.navigate(Routes.ConnectingZigbeeDevice, {
+      navigation.navigate(Routes.ZigbeeDeviceConnectGuide, {
         unitId,
         stationId,
         chipId: gateway.id,

package/src/screens/AddNewGateway/ShareWifiPassword.js

@@ -92,12 +92,11 @@ const ShareWifiPassword = ({ route }) => {
         } catch (e) {
           return;
         }
-
         if (ssid !== currentSsid) {
           clearInterval(checkWifiInterval);
           navigation.navigate(Routes.ConnectingWifiDevice, {
             unitId,
-            stationId,
+            stationId: stationId,
             gateway: gatewayInfo,
             selectedWifi: {
               ssid: selectedWifi,

package/src/screens/AddNewGateway/__test__/ScanModbusQR.test.js

@@ -5,7 +5,6 @@ import ScanModbusQR from '../ScanModbusQR';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
 import QRScan from '../../ScanChipQR/components/QRScan';
-import Toast from 'react-native-toast-message';
 import { getTranslate } from '../../../utils/I18n';
 import Routes from '../../../utils/Route';
 
@@ -57,12 +56,11 @@ describe('test scan modbus QR', () => {
 
   test('on scan wrong QR code', async () => {
     await scanQRCode({ imei: 'SAMSUNG-xxx' });
-    expect(Toast.show).toBeCalledWith({
-      type: 'error',
-      position: 'bottom',
-      text1: getTranslate('en', 'wrong_qr_format'),
-      visibilityTime: 1000,
+    const instance = tree.root;
+    const bottomSheet = instance.findByProps({
+      title: getTranslate('en', 'invalid_qr_code'),
     });
+    expect(bottomSheet.props.isVisible).toBe(true);
   });
 
   test('on scan correct QR code', async () => {

package/src/screens/AddNewGateway/__test__/ScanWifiDeviceQR.test.js

@@ -5,7 +5,6 @@ import ScanWifiDeviceQR from '../ScanWifiDeviceQR';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
 import QRScan from '../../ScanChipQR/components/QRScan';
-import Toast from 'react-native-toast-message';
 import { getTranslate } from '../../../utils/I18n';
 import Routes from '../../../utils/Route';
 
@@ -57,17 +56,16 @@ describe('test scan wifi device QR', () => {
 
   test('on scan wrong QR code', async () => {
     await scanQRCode({ imei: 'SAMSUNG-xxx' });
-    expect(Toast.show).toBeCalledWith({
-      type: 'error',
-      position: 'bottom',
-      text1: getTranslate('en', 'wrong_qr_format'),
-      visibilityTime: 1000,
+    const instance = tree.root;
+    const bottomSheet = instance.findByProps({
+      title: getTranslate('en', 'invalid_qr_code'),
     });
+    expect(bottomSheet.props.isVisible).toBe(true);
   });
 
   test('on scan correct QR code', async () => {
     await scanQRCode({ imei: 'ROBOT-xxx' }, jest.fn());
     expect(mockedNavigate).toHaveBeenCalled();
-    expect(mockedNavigate.mock.calls[0][0]).toEqual(Routes.ShareWifiPassword);
+    expect(mockedNavigate.mock.calls[0][0]).toEqual(Routes.ConnectingWifiGuide);
   });
 });

package/src/screens/AddNewGateway/__test__/SelectDeviceSubUnit.test.js

@@ -5,6 +5,7 @@ import SelectDeviceSubUnit from '../SelectDeviceSubUnit';
 import { ViewButtonBottom } from '../../../commons';
 import { SCProvider } from '../../../context';
 import { mockSCStore } from '../../../context/mockStore';
+import { DEVICE_TYPE } from '../../../configs/Constants';
 
 const mockedGoBack = jest.fn();
 const mockedNavigate = jest.fn();
@@ -33,7 +34,7 @@ describe('Test SelectSubUnit', () => {
   let tree;
 
   test('test ViewButtonBottom onRightClick', async () => {
-    const route = { params: { addType: 'AddNewGateway' } };
+    const route = { params: { deviceType: DEVICE_TYPE.WIFI_DEVICE } };
     await act(async () => {
       tree = renderer.create(wrapComponent(route));
     });

package/src/screens/AddNewGateway/__test__/SelectZigbeeGateway.test.js

@@ -68,7 +68,7 @@ describe('Test select zigbee gateway', () => {
       selectGateway.props.onPressNext({ id: 3 });
     });
 
-    expect(mockedNavigate).toBeCalledWith(Routes.ConnectingZigbeeDevice, {
+    expect(mockedNavigate).toBeCalledWith(Routes.ZigbeeDeviceConnectGuide, {
       unitId: 1,
       stationId: 2,
       chipId: 3,

package/src/screens/ScanChipQR/components/InvalidQRCode/index.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { StyleSheet } from 'react-native';
+
+import { useTranslations } from '../../../../hooks/Common/useTranslations';
+import Text from '../../../../commons/Text';
+import { ViewButtonBottom } from '../../../../commons';
+import BottomSheet from '../../../../commons/BottomSheet';
+
+const InvalidQRCode = ({ isInvalidQrCode, goBack, onRetry }) => {
+  const t = useTranslations();
+
+  return (
+    <BottomSheet isVisible={isInvalidQrCode} title={t('invalid_qr_code')}>
+      <Text style={styles.warningContainer}>
+        {t('invalid_qr_code_warning')}
+      </Text>
+      <ViewButtonBottom
+        leftTitle={t('cancel')}
+        onLeftClick={goBack}
+        rightTitle={t('retry')}
+        onRightClick={onRetry}
+      />
+    </BottomSheet>
+  );
+};
+
+export default InvalidQRCode;
+
+const styles = StyleSheet.create({
+  warningContainer: {
+    paddingHorizontal: 16,
+  },
+});

package/src/screens/ScanChipQR/components/QRScan/index.js

@@ -46,7 +46,7 @@ const VerifingQRCode = memo(() => {
   );
 });
 
-const QRScan = ({ onScan }) => {
+const QRScan = ({ isScanReady = true, onScan }) => {
   const t = useTranslations();
   const navigation = useNavigation();
   const isFocused = useIsFocused();
@@ -55,12 +55,14 @@ const QRScan = ({ onScan }) => {
 
   const onBarCodeRead = useCallback(
     (e) => {
-      setLoading(true);
-      if (!loading) {
-        onScan(e.data, setLoading);
+      if (isScanReady) {
+        setLoading(true);
+        if (!loading) {
+          onScan(e.data, setLoading);
+        }
       }
     },
-    [loading, onScan]
+    [isScanReady, loading, onScan]
   );
 
   const onPressClose = useCallback(() => {

package/src/screens/SmartAccount/ListDevice/index.js

@@ -113,7 +113,6 @@ const ListDeviceSmartAccount = ({ route }) => {
       setListDeviceSuccess([]);
       circleOfSelectAll.current = false;
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [listSelectAll, listSelectedDevice.length, listDevices]);
 
   return (

package/src/utils/I18n/translations/en.json

@@ -1032,5 +1032,13 @@
   "warning_connecting_smart_account": "Don't turn off the device or close this app during the setup process. Setup may take few minutes to complete.",
   "unidentified": "Unidentified",
   "select_all": "Select All",
+  "turn_off_device": "Turn off device",
+  "turn_off_device_when_scan_qr_guide": "Turn off the device you want to add new before scanning the QR code. Press ‘’OK’’ to continue.",
+  "connect_to_router": "Connect to the Router",
+  "connect_router_content": "Please plug in the gatewayand connect it to the router, making sure your phone and the gatewayare under the same network. Then, comfirm that the light is on and press “Next”",
+  "turn_on_zigbee_device": "Turn on zigbee device",
+  "turn_on_device_to_connect": "Turn on device to connect",
+  "turn_on_zigbee_device_content": "Power ON the device and keep the device connected to the router. Make sure the end device still ON",
+  "read_device_manual_guide": "Read Device's manual guide for more details.",
   "click_here_to_setup_device": "Click here to setup device"
 }

package/src/utils/I18n/translations/vi.json

@@ -1030,5 +1030,13 @@
   "warning_connecting_smart_account": "Đừng tắt thiết bị hoặc đóng ứng dụng này trong quá trình thiết lập. Quá trình thiết lập có thể mất vài phút để hoàn thành.",
   "unidentified": "Chưa xếp vào phòng",
   "select_all": "Chọn tất cả",
+  "turn_off_device": "Tắt thiết bị",
+  "turn_off_device_when_scan_qr_guide": "Tắt thiết bị bạn muốn thêm mới trước khi quét mã QR. Nhấn ‘’OK’’ để tiếp tục.",
+  "connect_to_router": "Kết nối với Bộ định tuyến",
+  "connect_router_content": "Vui lòng cắm cổng vào và kết nối nó với bộ định tuyến, đảm bảo rằng điện thoại của bạn và cổng kết nối nằm trong cùng một mạng. Sau đó, xác nhận rằng đèn đã sáng và nhấn “Tiếp theo”",
+  "turn_on_zigbee_device": "Bật thiết bị zigbee",
+  "turn_on_device_to_connect": "Bật thiết bị để kết nối",
+  "turn_on_zigbee_device_content": "BẬT nguồn thiết bị và giữ thiết bị kết nối với bộ định tuyến. Đảm bảo thiết bị cuối vẫn BẬT",
+  "read_device_manual_guide": "Đọc hướng dẫn sử dụng của Thiết bị để biết thêm chi tiết.",
   "click_here_to_setup_device": "Chọn thiết bị thêm vào phòng"
 }

package/src/utils/Route/index.js

@@ -66,6 +66,7 @@ const Routes = {
   SelectZigbeeGateway: 'SelectZigbeeGateway',
   ConnectingZigbeeDevice: 'ConnectingZigbeeDevice',
   ScanModbusQR: 'ScanModbusQR',
+  ScanZigbeeGateway: 'ScanZigbeeGateway',
   ConnectingModbusDevice: 'ConnectingModbusDevice',
   ScanWifiDeviceQR: 'ScanWifiDeviceQR',
   ScanGatewayQR: 'ScanGatewayQR',
@@ -139,6 +140,8 @@ const Routes = {
   SmartAccountConnecting: 'SmartAccountConnecting',
   EmergencySetting: 'EmergencySetting',
   FirstWarning: 'FirstWarning',
+  ConnectRouterGuide: 'ConnectRouterGuide',
+  ZigbeeDeviceConnectGuide: 'ZigbeeDeviceConnectGuide',
   ConfirmUnitDeletion: 'ConfirmUnitDeletion',
   SmartAccount: 'SmartAccount',
   SmartHomeDashboard: 'SmartHomeDashboard',