Minor fixes

ios/Podfile.lock

@@ -358,7 +358,7 @@ PODS:
   - React-jsinspector (0.64.2)
   - react-native-appearance (0.3.4):
     - React
-  - react-native-blob-util (0.13.17):
+  - react-native-blob-util (0.13.16):
     - React-Core
   - react-native-camera (3.44.3):
     - React-Core
@@ -368,13 +368,13 @@ PODS:
     - React-Core
   - react-native-camera/RN (3.44.3):
     - React-Core
-  - react-native-google-maps (0.29.4):
+  - react-native-google-maps (0.29.3):
     - Google-Maps-iOS-Utils (= 2.1.0)
     - GoogleMaps (= 3.5.0)
     - React-Core
   - react-native-location (2.5.0):
     - React
-  - react-native-maps (0.29.4):
+  - react-native-maps (0.29.3):
     - React-Core
   - react-native-orientation-locker (1.3.1):
     - React-Core
@@ -384,7 +384,7 @@ PODS:
     - React
   - react-native-splash-screen (3.2.0):
     - React
-  - react-native-webview (11.14.3):
+  - react-native-webview (11.14.2):
     - React-Core
   - React-perflogger (0.64.2)
   - React-RCTActionSheet (0.64.2):
@@ -768,7 +768,7 @@ SPEC CHECKSUMS:
   DoubleConversion: cf9b38bf0b2d048436d9a82ad2abe1404f11e7de
   Fabric: ea977e3cd9c20425516d3dafd3bf8c941c51223f
   FBLazyVector: e686045572151edef46010a6f819ade377dfeb4b
-  FBReactNativeSpec: 6ad80628fb64b13af43b7a67ee3e2489cfd29615
+  FBReactNativeSpec: 52a80ca1a343877d4c72738fffcf539ac4a64dec
   Firebase: 8db6f2d1b2c5e2984efba4949a145875a8f65fe5
   FirebaseAnalytics: 5dd088bd2e67bb9d13dbf792d1164ceaf3052193
   FirebaseCore: d889d9e12535b7f36ac8bfbf1713a0836a3012cd
@@ -807,16 +807,16 @@ SPEC CHECKSUMS:
   React-jsiexecutor: 80c46bd381fd06e418e0d4f53672dc1d1945c4c3
   React-jsinspector: cc614ec18a9ca96fd275100c16d74d62ee11f0ae
   react-native-appearance: 0f0e5fc2fcef70e03d48c8fe6b00b9158c2ba8aa
-  react-native-blob-util: d2919a2243cba497cd5713f72faeec283c69fde4
+  react-native-blob-util: 6e75bea8ffce35c4009c0e519cd0a96432a93e2b
   react-native-camera: b8cc03e2feec0c04403d0998e37cf519d8fd4c6f
-  react-native-google-maps: 34517207071d54f3bc23c68752bbec0217bfc79e
+  react-native-google-maps: d6a30377b40a338bd09d6ad36ce48dc5d12b5792
   react-native-location: 5a40ec1cc6abf2f6d94df979f98ec76c3a415681
-  react-native-maps: a421fe6aeb74279597c4ea9598f25796108e2d89
+  react-native-maps: 41d01d8e0afcebe32bec9eea3bd945adc1b18f7a
   react-native-orientation-locker: 998c0744e26624407dac068c04c605b4af7304a2
   react-native-safe-area-context: 584dc04881deb49474363f3be89e4ca0e854c057
   react-native-sensitive-info: 400c6e3d27945e15c8cddb5b4b92233c85ee06f8
   react-native-splash-screen: 200d11d188e2e78cea3ad319964f6142b6384865
-  react-native-webview: b83cf1aa6b4453fe53ffcc5896c36cdf37f0383f
+  react-native-webview: cc4ac8f021a832dce2979e1f48c5595341dd2fb5
   React-perflogger: 25373e382fed75ce768a443822f07098a15ab737
   React-RCTActionSheet: af7796ba49ffe4ca92e7277a5d992d37203f7da5
   React-RCTAnimation: 6a2e76ab50c6f25b428d81b76a5a45351c4d77aa
@@ -852,4 +852,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: b8dc8cd1a42309e725520e15610740f459384595
 
-COCOAPODS: 1.10.1
+COCOAPODS: 1.11.2

src/components/site-area/SiteAreaComponent.tsx

@@ -20,7 +20,6 @@ interface State {}
 export default class SiteAreaComponent extends React.Component<Props, State> {
   public state: State;
   public props: Props;
-  private counter = 0;
 
   // eslint-disable-next-line no-useless-constructor
   public constructor(props: Props) {

src/screens/auth/eula/Eula.tsx

@@ -69,18 +69,12 @@ export default class Eula extends BaseScreen<Props, State> {
         <HeaderComponent
           navigation={this.props.navigation}
           title={I18n.t('authentication.eula')}
-          leftAction={() => {
-            this.props.navigation.navigate('Login');
-            return true;
-          }}
-          leftActionIcon={'navigate-before'}
-          hideHomeAction
         />
         {loading ? (
           <Spinner style={style.spinner} color="grey" />
         ) : (
           <ScrollView style={style.container}>
-            <HTMLView value={eulaTextHtml} />
+            <HTMLView textComponentProps={{style: {color: Utils.getCurrentCommonColor().textColor}}} value={eulaTextHtml} />
           </ScrollView>
         )}
       </Container>

src/screens/base-screen/BaseScreen.tsx

@@ -6,7 +6,7 @@ import CentralServerProvider from '../../provider/CentralServerProvider';
 import ProviderFactory from '../../provider/ProviderFactory';
 import SecurityProvider from '../../provider/SecurityProvider';
 import BaseProps from '../../types/BaseProps';
-import { AppStateStatus, BackHandler, NativeEventSubscription } from 'react-native';
+import { BackHandler, NativeEventSubscription } from 'react-native';
 
 export interface Props extends BaseProps {}
 

src/screens/charging-stations/list/ChargingStations.tsx

@@ -87,7 +87,8 @@ export default class ChargingStations extends BaseAutoRefreshScreen<Props, State
 
   public async componentDidMount() {
     // Get initial filters
-    await super.componentDidMount();
+    await super.componentDidMount()
+    this.siteArea = Utils.getParamFromNavigation(this.props.route, 'siteArea', null) as unknown as SiteArea;
     const { navigation } = this.props;
     await this.loadInitialFilters();
     // Enable swipe for opening sidebar

src/screens/charging-stations/list/ChargingStationsStyles.tsx

@@ -63,7 +63,6 @@ export default function computeStyleSheet(): StyleSheet.NamedStyles<any> {
     },
     chargingStationMarker: {
       fontSize: '30@s',
-      backgroundColor: commonColor.listBg
     },
     qrcodeButton: {
       backgroundColor: commonColor.primary,

src/screens/sidebar/SideBar.tsx

@@ -39,8 +39,8 @@ export default class SideBar extends React.Component<Props, State> {
 
   public constructor(props: Props) {
     super(props);
-    this.componentFocusUnsubscribe = this.props.navigation?.addListener('focus', () => this.componentDidFocus());
-    this.componentBlurUnsubscribe = this.props.navigation?.addListener('blur', () => this.componentDidFocus());
+   // this.componentFocusUnsubscribe = this.props.navigation?.addListener('focus', () => this.componentDidFocus());
+   // this.componentBlurUnsubscribe = this.props.navigation?.addListener('blur', () => this.componentDidFocus());
     this.state = {
       userToken: null,
       tenantName: '',
@@ -58,7 +58,7 @@ export default class SideBar extends React.Component<Props, State> {
     super.setState(state, callback);
   };
 
-  public async componentDidFocus(): Promise<void> {
+  public async componentDidMount() {
     this.centralServerProvider = await ProviderFactory.getProvider();
     this.securityProvider = this.centralServerProvider?.getSecurityProvider();
     await this.getUpdateDate();
@@ -85,7 +85,6 @@ export default class SideBar extends React.Component<Props, State> {
   public getUserInfo = async () => {
     // Logoff
     const userInfo = this.centralServerProvider.getUserInfo();
-    // Add sites(
     this.setState({
       userToken: this.centralServerProvider.getUserInfo(),
       isComponentOrganizationActive: this.securityProvider ? this.securityProvider.isComponentOrganizationActive() : false,

src/screens/site-areas/SiteAreas.tsx

@@ -78,6 +78,7 @@ export default class SiteAreas extends BaseAutoRefreshScreen<Props, State> {
 
   public async componentDidMount(triggerRefresh: boolean = true): Promise<void> {
     super.componentDidMount(triggerRefresh);
+    this.site = Utils.getParamFromNavigation(this.props.route, 'site', null) as unknown as Site;
   }
 
   public componentDidFocus() {
@@ -332,12 +333,13 @@ export default class SiteAreas extends BaseAutoRefreshScreen<Props, State> {
           renderMarker={(siteArea, index) => (
             <Marker
               key={`${siteArea.id}${index}${siteArea.name}`}
-              image={Utils.buildSiteStatusMarker(siteArea?.connectorStats)}
               tracksViewChanges={false}
               coordinate={{ longitude: siteArea.address.coordinates[0], latitude: siteArea.address.coordinates[1] }}
               title={siteArea.name}
               onPress={() => this.showMapSiteAreaDetail(siteArea)}
-            />
+            >
+              <Icon type={'MaterialIcons'} name={'location-pin'} style={[style.siteAreaMarker, Utils.computeSiteMarkerStyle(siteArea?.connectorStats)]} />
+            </Marker>
           )}
           initialRegion={this.currentRegion}
           onMapRegionChangeComplete={(region) => this.onMapRegionChangeComplete(region)}

src/screens/site-areas/SiteAreasStyles.tsx

@@ -49,6 +49,9 @@ export default function computeStyleSheet(): StyleSheet.NamedStyles<any> {
     outlinedImage: {
       borderColor: commonColor.listItemBackground,
       borderWidth: 2
+    },
+    siteAreaMarker: {
+      fontSize: '40@s'
     }
   });
   const portraitStyles = {};

src/screens/sites/Sites.tsx

@@ -27,6 +27,12 @@ import standardLightLayout from '../../../assets/map/standard-light.png';
 import satelliteLayout from '../../../assets/map/satellite.png';
 import computeFabStyles from '../../components/fab/FabComponentStyles';
 import ThemeManager from '../../custom-theme/ThemeManager';
+import ConnectorStats from '../../types/ConnectorStats';
+import statusMarkerAvailable from '../../../assets/icon/charging_station_available.png';
+import statusMarkerChargingOrOccupied from '../../../assets/icon/charging_station_charging.png';
+import statusMarkerUnavailable from '../../../assets/icon/charging_station_unavailable.png';
+import computeConnectorStatusStyles
+  from '../../components/connector-status/ConnectorStatusComponentStyles';
 
 export interface Props extends BaseProps {}
 
@@ -335,17 +341,20 @@ export default class Sites extends BaseAutoRefreshScreen<Props, State> {
           renderMarker={(site, index) => (
             <Marker
               key={`${site.id}${index}${site.name}`}
-              image={Utils.buildSiteStatusMarker(site?.connectorStats)}
               tracksViewChanges={false}
               coordinate={{ longitude: site.address.coordinates[0], latitude: site.address.coordinates[1] }}
               title={site.name}
               onPress={() => this.showMapSiteDetail(site)}
-            />
+            >
+              <Icon type={'MaterialIcons'} name={'location-pin'} style={[style.siteMarker, Utils.computeSiteMarkerStyle(site?.connectorStats)]} />
+            </Marker>
           )}
           initialRegion={this.currentRegion}
           onMapRegionChangeComplete={(region) => this.onMapRegionChangeComplete(region)}
         />
       </View>
     )
   }
+
+
 }

src/screens/sites/SitesStyles.tsx

@@ -44,7 +44,10 @@ export default function computeStyleSheet(): StyleSheet.NamedStyles<any> {
     outlinedImage: {
       borderColor: commonColor.listItemBackground,
       borderWidth: 2
-    }
+    },
+    siteMarker: {
+      fontSize: '40@s',
+    },
   });
   const portraitStyles = {};
   const landscapeStyles = {};

src/utils/Utils.tsx

@@ -32,6 +32,8 @@ import Constants from './Constants';
 import Message from './Message';
 import { Region } from 'react-native-maps';
 import LocationManager from '../location/LocationManager';
+import computeConnectorStatusStyles
+  from '../components/connector-status/ConnectorStatusComponentStyles';
 
 export default class Utils {
   public static getEndpointCloud(): EndpointCloud[] {
@@ -947,42 +949,16 @@ export default class Utils {
     return `${Utils.formatTimer(hours)}:${Utils.formatTimer(minutes)}`;
   };
 
-  public static buildChargingStationStatusMarker(connectors: Connector[], inactive: boolean): any {
-    if (inactive) {
-      //TODO handle reserved status when implemented
-      return statusMarkerUnavailable;
-    } else if (connectors.find((connector) => connector.status === ChargePointStatus.AVAILABLE)) {
-      return statusMarkerAvailable;
-    } else if (
-      connectors.find((connector) => connector.status === ChargePointStatus.FINISHING) ||
-      connectors.find((connector) => connector.status === ChargePointStatus.PREPARING)
-    ) {
-      return statusMarkerPreparingOrFinishing;
-    } else if (
-      connectors.find((connector) => connector.status === ChargePointStatus.CHARGING) ||
-      connectors.find((connector) => connector.status === ChargePointStatus.OCCUPIED)
-    ) {
-      return statusMarkerChargingOrOccupied;
-    } else if (
-      connectors.find((connector) => connector.status === ChargePointStatus.SUSPENDED_EVSE) ||
-      connectors.find((connector) => connector.status === ChargePointStatus.SUSPENDED_EV)
-    ) {
-      return statusMarkerSuspended;
-    } else if (connectors.find((connector) => connector.status === ChargePointStatus.FAULTED)) {
-      return statusMarkerFaulted;
-    }
-    return statusMarkerUnavailable;
-  }
-
-  public static buildSiteStatusMarker(connectorStats: ConnectorStats): any {
+  public static computeSiteMarkerStyle(connectorStats: ConnectorStats) {
+    const connectorStatusStyles = computeConnectorStatusStyles();
     if (connectorStats.availableConnectors > 0) {
-      return statusMarkerAvailable;
+      return connectorStatusStyles.availableConnectorDescription;
     } else if (connectorStats.chargingConnectors > 0) {
-      return statusMarkerChargingOrOccupied;
+      return connectorStatusStyles.chargingConnectorDescription;
     } else if (connectorStats.unavailableConnectors > 0) {
-      return statusMarkerUnavailable;
+      return connectorStatusStyles.unavailableConnectorDescription;
     } else {
-      return statusMarkerUnavailable;
+      return connectorStatusStyles.unavailableConnectorDescription;
     }
   }