Merge pull request #10 from ravikp/bluetooth-state-text

feat(#580): Handle error messages for Bluetooth On and Off state

locales/ara.json

@@ -284,6 +284,8 @@
     "ScanScreen": {
       "header": "مسح رمز الاستجابة السريعة",
       "noShareableVcs": "لا يمكن مشاركة {{vcLabel}}",
+      "BluetoothStateIos": "تم إيقاف تشغيل البلوتوث ، يرجى تشغيله من مركز التحكم",
+      "BluetoothStateAndroid": "تم إيقاف تشغيل البلوتوث ، يرجى تشغيله من قائمة الإعدادات السريعة",
       "sharingVc": "مشاركة {{vcLabel}}",
       "errors": {
         "locationDisabled": {

locales/en.json

@@ -297,6 +297,8 @@
     "header": "Scan QR Code",
     "noShareableVcs": "No shareable {{vcLabel}} are available.",
     "sharingVc": "Sharing {{vcLabel}}",
+    "BluetoothStateIos": "Bluetooth is turned OFF, please turn it ON from Control center",
+    "BluetoothStateAndroid": "Bluetooth is turned OFF, please turn it ON from Quick settings menu",
     "errors": {
       "locationDisabled": {
         "message": "Location services must be enabled for the scanning functionality",

locales/fil.json

@@ -280,6 +280,8 @@
   "ScanScreen": {
     "header": "I-scan ang QR Code",
     "noShareableVcs": "Walang magagamit na maibabahaging {{vcLabel}}.",
+    "BluetoothStateIos": "Naka-OFF ang Bluetooth, paki-ON ito mula sa Control center",
+    "BluetoothStateAndroid": "Naka-OFF ang Bluetooth, paki-ON ito mula sa menu ng Quick settings",
     "sharingVc": "Pagbabahagi ng {{vcLabel}}",
     "errors": {
       "locationDisabled": {

locales/hin.json

@@ -284,6 +284,8 @@
     "ScanScreen": {
       "header": "क्यूआर कोड स्कैन करे",
       "noShareableVcs": "कोई साझा करने योग्य {{vcLabel}} उपलब्ध नहीं है।",
+      "BluetoothStateIos": "ब्लूटूथ बंद है, कृपया इसे नियंत्रण केंद्र से चालू करें",
+      "BluetoothStateAndroid": "ब्लूटूथ बंद है, कृपया इसे त्वरित सेटिंग मेनू से चालू करें",
       "sharingVc": "शेयरिंग {{vcLabel}}",
       "errors": {
         "locationDisabled": {

locales/kan.json

@@ -284,6 +284,8 @@
     "ScanScreen": {
       "header": "ಸ್ಕ್ಯಾನ್ ಕ್ಯೂಆರ್ ಕೋಡ್",
       "noShareableVcs": "ಯಾವುದೇ ಹಂಚಿಕೊಳ್ಳಬಹುದಾದ {{vcLabel}} ಲಭ್ಯವಿಲ್ಲ.",
+      "BluetoothStateIos": "ಬ್ಲೂಟೂತ್ ಅನ್ನು ಆಫ್ ಮಾಡಲಾಗಿದೆ, ದಯವಿಟ್ಟು ಅದನ್ನು ನಿಯಂತ್ರಣ ಕೇಂದ್ರದಿಂದ ಆನ್ ಮಾಡಿ",
+      "BluetoothStateAndroid": "ಬ್ಲೂಟೂತ್ ಆಫ್ ಆಗಿದೆ, ದಯವಿಟ್ಟು ತ್ವರಿತ ಸೆಟ್ಟಿಂಗ್‌ಗಳ ಮೆನುವಿನಿಂದ ಅದನ್ನು ಆನ್ ಮಾಡಿ",
       "sharingVc": "ಹಂಚಿಕೆ {{vcLabel}}",
       "errors": {
         "locationDisabled": {

locales/tam.json

@@ -284,6 +284,8 @@
     "ScanScreen": {
       "header": "QR குறியீட்டை ஸ்கேன் செய்",
       "noShareableVcs": "பகிரக்கூடிய {{vcLabel}} எதுவும் இல்லை.",
+      "BluetoothStateIos": "புளூடூத் முடக்கப்பட்டுள்ளது, கட்டுப்பாட்டு மையத்திலிருந்து அதை இயக்கவும்",
+      "BluetoothStateAndroid": "புளூடூத் முடக்கப்பட்டுள்ளது, விரைவு அமைப்புகள் மெனுவிலிருந்து அதை இயக்கவும்",
       "sharingVc": "பகிர்தல் {{vcLabel}}",
       "errors": {
         "locationDisabled": {

screens/Scan/ScanScreen.strings.json

@@ -2,6 +2,8 @@
   "header": "Scan QR Code",
   "noShareableVcs": "No shareable {{vcLabel}} are available.",
   "sharingVc": "Sharing {{vcLabel}}",
+  "BluetoothStateIos": "Bluetooth is turned OFF, please turn it ON from Control center",
+  "BluetoothStateAndroid": "Bluetooth is turned OFF, please turn it ON from Quick settings menu",
   "errors": {
     "locationDisabled": {
       "message": "Location services must be enabled for the scanning functionality",

screens/Scan/ScanScreen.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { MessageOverlay } from '../../components/MessageOverlay';
 import { QrScanner } from '../../components/QrScanner';
@@ -6,10 +6,61 @@ import { Button, Centered, Column, Text } from '../../components/ui';
 import { Theme } from '../../components/ui/styleUtils';
 import { QrLogin } from '../QrLogin/QrLogin';
 import { useScanScreen } from './ScanScreenController';
+import BluetoothStateManager from 'react-native-bluetooth-state-manager';
+import { Platform } from 'react-native';
 
 export const ScanScreen: React.FC = () => {
   const { t } = useTranslation('ScanScreen');
   const controller = useScanScreen();
+  const [isBluetoothOn, setIsBluetoothOn] = useState(false);
+
+  useEffect(() => {
+    (async () => {
+      await BluetoothStateManager.onStateChange((state) => {
+        if (state === 'PoweredOff') {
+          setIsBluetoothOn(false);
+        } else {
+          setIsBluetoothOn(true);
+        }
+      }, true);
+    })();
+  }, [isBluetoothOn]);
+
+  function noShareableVcText() {
+    return (
+      <Text align="center" color={Theme.Colors.errorMessage} margin="0 10">
+        {t('noShareableVcs', { vcLabel: controller.vcLabel.plural })}
+      </Text>
+    );
+  }
+
+  function bluetoothIsOffText() {
+    return (
+      <Text align="center" color={Theme.Colors.errorMessage} margin="0 10">
+        {t(
+          Platform.OS === 'ios' ? 'BluetoothStateIos' : 'BluetoothStateAndroid'
+        )}
+      </Text>
+    );
+  }
+
+  function qrScannerComponent() {
+    return (
+      <Column crossAlign="center" margin="0 0 0 -6">
+        <QrScanner onQrFound={controller.SCAN} />
+      </Column>
+    );
+  }
+
+  function loadQRScanner() {
+    if (controller.isEmpty) {
+      return noShareableVcText();
+    }
+    if (!isBluetoothOn) {
+      return bluetoothIsOffText();
+    }
+    return qrScannerComponent();
+  }
 
   return (
     <Column
@@ -36,18 +87,7 @@ export const ScanScreen: React.FC = () => {
             />
           </Column>
         ) : null}
-
-        {!controller.isEmpty ? (
-          controller.isScanning && (
-            <Column crossAlign="center" margin="0 0 0 -6">
-              <QrScanner onQrFound={controller.SCAN} />
-            </Column>
-          )
-        ) : (
-          <Text align="center" color={Theme.Colors.errorMessage}>
-            {t('noShareableVcs', { vcLabel: controller.vcLabel.plural })}
-          </Text>
-        )}
+        {loadQRScanner()}
         {controller.isQrLogin && (
           <QrLogin
             isVisible={controller.isQrLogin}