@plusscommunities/pluss-maintenance-app-forms 8.0.8 → 8.0.9-beta.2

package/dist/module/core.config.js

@@ -2,7 +2,6 @@
 import * as PlussCore from "@plusscommunities/pluss-core-app";
 const {
   Apis,
-  Fonts,
   Actions,
   ActionTypes,
   Config,
@@ -13,5 +12,5 @@ const {
   Constants,
   Colours
 } = PlussCore;
-export { Apis, Fonts, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours };
+export { Apis, Actions, ActionTypes, Config, Components, Styles, Session, Helper, Constants, Colours };
 //# sourceMappingURL=core.config.js.map

package/dist/module/core.config.js.map

@@ -1 +1 @@
-{"version":3,"names":["PlussCore","Apis","Fonts","Actions","ActionTypes","Config","Components","Styles","Session","Helper","Constants","Colours"],"sources":["core.config.js"],"sourcesContent":["// import * as PlussCore from '../../pluss-core/src';\nimport * as PlussCore from \"@plusscommunities/pluss-core-app\";\n\nconst {\n\tApis,\n\tFonts,\n\tActions,\n\tActionTypes,\n\tConfig,\n\tComponents,\n\tStyles,\n\tSession,\n\tHelper,\n\tConstants,\n\tColours,\n} = PlussCore;\nexport {\n\tApis,\n\tFonts,\n\tActions,\n\tActionTypes,\n\tConfig,\n\tComponents,\n\tStyles,\n\tSession,\n\tHelper,\n\tConstants,\n\tColours,\n};\n"],"mappings":"AAAA;AACA,OAAO,KAAKA,SAAS,MAAM,kCAAkC;AAE7D,MAAM;EACLC,IAAI;EACJC,KAAK;EACLC,OAAO;EACPC,WAAW;EACXC,MAAM;EACNC,UAAU;EACVC,MAAM;EACNC,OAAO;EACPC,MAAM;EACNC,SAAS;EACTC;AACD,CAAC,GAAGX,SAAS;AACb,SACCC,IAAI,EACJC,KAAK,EACLC,OAAO,EACPC,WAAW,EACXC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,EACPC,MAAM,EACNC,SAAS,EACTC,OAAO","ignoreList":[]}
+{"version":3,"names":["PlussCore","Apis","Actions","ActionTypes","Config","Components","Styles","Session","Helper","Constants","Colours"],"sources":["core.config.js"],"sourcesContent":["// import * as PlussCore from '../../pluss-core/src';\nimport * as PlussCore from \"@plusscommunities/pluss-core-app\";\n\nconst {\n\tApis,\n\tActions,\n\tActionTypes,\n\tConfig,\n\tComponents,\n\tStyles,\n\tSession,\n\tHelper,\n\tConstants,\n\tColours,\n} = PlussCore;\nexport {\n\tApis,\n\tActions,\n\tActionTypes,\n\tConfig,\n\tComponents,\n\tStyles,\n\tSession,\n\tHelper,\n\tConstants,\n\tColours,\n};\n"],"mappings":"AAAA;AACA,OAAO,KAAKA,SAAS,MAAM,kCAAkC;AAE7D,MAAM;EACLC,IAAI;EACJC,OAAO;EACPC,WAAW;EACXC,MAAM;EACNC,UAAU;EACVC,MAAM;EACNC,OAAO;EACPC,MAAM;EACNC,SAAS;EACTC;AACD,CAAC,GAAGV,SAAS;AACb,SACCC,IAAI,EACJC,OAAO,EACPC,WAAW,EACXC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,EACPC,MAAM,EACNC,SAAS,EACTC,OAAO","ignoreList":[]}

package/dist/module/screens/MaintenanceUserPicker.js

@@ -3,7 +3,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React, { Component } from "react";
 import _ from "lodash";
-import { TouchableOpacity, View, ScrollView, Text } from "react-native";
+import { TouchableOpacity, View, ScrollView, Text, TextInput, Keyboard } from "react-native";
 import { connect } from "react-redux";
 import { Icon } from "@rneui/themed";
 import { Services } from "../feature.config";
@@ -12,7 +12,29 @@ class MaintenanceUserPicker extends Component {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "state", {
-      currentUser: null
+      currentUser: null,
+      searchText: ""
+    });
+    _defineProperty(this, "onChangeSearch", text => {
+      this.setState({
+        searchText: text
+      });
+    });
+    _defineProperty(this, "getFilteredUsers", () => {
+      const {
+        searchText
+      } = this.state;
+      const {
+        users
+      } = this.props;
+      if (!users) return [];
+      if (!searchText || searchText.length === 0) return users;
+      const searchLower = searchText.toLowerCase();
+      return users.filter(user => {
+        const displayName = (user.displayName || "").toLowerCase();
+        const unit = (user.unit || "").toLowerCase();
+        return displayName.includes(searchLower) || unit.includes(searchLower);
+      });
     });
   }
   UNSAFE_componentWillMount() {
@@ -24,6 +46,7 @@ class MaintenanceUserPicker extends Component {
     Services.navigation.goBack();
   }
   onUserPress(user) {
+    Keyboard.dismiss();
     this.props.onSelectUser(user);
     this.setState({
       currentUser: user
@@ -40,14 +63,22 @@ class MaintenanceUserPicker extends Component {
         }
       }, /*#__PURE__*/React.createElement(Components.Spinner, null));
     }
+    const filteredUsers = this.getFilteredUsers();
+    if (filteredUsers.length === 0 && this.state.searchText.length > 0) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles.noResultsContainer
+      }, /*#__PURE__*/React.createElement(Text, {
+        style: styles.noResultsText
+      }, "No users found"));
+    }
     return /*#__PURE__*/React.createElement(Components.FormCard, {
       style: {
         marginTop: 16
       }
-    }, this.renderOptions());
+    }, this.renderOptions(filteredUsers));
   }
-  renderOptions() {
-    return this.props.users.map((user, index) => {
+  renderOptions(users) {
+    return users.map((user, index) => {
       return /*#__PURE__*/React.createElement(TouchableOpacity, {
         key: index,
         onPress: this.onUserPress.bind(this, user)
@@ -80,6 +111,31 @@ class MaintenanceUserPicker extends Component {
       }))));
     });
   }
+  renderSearch() {
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.searchContainer
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "search",
+      type: "font-awesome",
+      iconStyle: styles.searchIcon
+    }), /*#__PURE__*/React.createElement(TextInput, {
+      placeholder: "Search by name or unit",
+      autoCorrect: false,
+      placeholderTextColor: Colours.TEXT_MID_ALPHA50,
+      onChangeText: this.onChangeSearch,
+      value: this.state.searchText,
+      style: styles.searchText,
+      underlineColorAndroid: Colours.COLOUR_TRANSPARENT,
+      returnKeyType: "search"
+    }), this.state.searchText.length > 0 && /*#__PURE__*/React.createElement(TouchableOpacity, {
+      onPress: () => this.onChangeSearch(""),
+      style: styles.clearButton
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "times-circle",
+      type: "font-awesome",
+      iconStyle: styles.clearIcon
+    })));
+  }
   render() {
     return /*#__PURE__*/React.createElement(View, {
       style: styles.container
@@ -87,10 +143,12 @@ class MaintenanceUserPicker extends Component {
       leftIcon: "angle-left",
       onPressLeft: this.onPressBack.bind(this),
       text: "Select user"
-    }), /*#__PURE__*/React.createElement(ScrollView, {
+    }), this.renderSearch(), /*#__PURE__*/React.createElement(ScrollView, {
       style: {
         flex: 1
-      }
+      },
+      keyboardShouldPersistTaps: "handled",
+      keyboardDismissMode: "on-drag"
     }, this.renderMain()));
   }
 }
@@ -100,17 +158,6 @@ const styles = {
     position: "relative",
     backgroundColor: "#f0f0f5"
   },
-  row: {
-    flexDirection: "row",
-    alignItems: "center",
-    minHeight: 22
-  },
-  text: {
-    flex: 1,
-    fontFamily: "sf-regular",
-    fontSize: 14,
-    color: Colours.TEXT_DARK
-  },
   rowContainer: {
     flexDirection: "row",
     justifyContent: "space-between"
@@ -124,6 +171,45 @@ const styles = {
     fontSize: 16,
     color: Colours.TEXT_DARK,
     marginLeft: 8
+  },
+  searchContainer: {
+    flexDirection: "row",
+    alignItems: "center",
+    margin: 15,
+    backgroundColor: "#fff",
+    borderRadius: 8,
+    paddingHorizontal: 12,
+    paddingVertical: 8
+  },
+  searchIcon: {
+    fontSize: 16,
+    marginRight: 10,
+    color: Colours.TEXT_MID_ALPHA50
+  },
+  searchText: {
+    flex: 1,
+    fontSize: 16,
+    fontFamily: "sf-regular",
+    color: Colours.TEXT_DARK,
+    padding: 0
+  },
+  clearButton: {
+    padding: 4
+  },
+  clearIcon: {
+    fontSize: 16,
+    color: Colours.TEXT_MID_ALPHA50
+  },
+  noResultsContainer: {
+    alignItems: "center",
+    justifyContent: "center",
+    paddingVertical: 40
+  },
+  noResultsText: {
+    fontSize: 16,
+    fontFamily: "sf-regular",
+    color: Colours.TEXT_LIGHT,
+    textAlign: "center"
   }
 };
 export default connect(null, {})(MaintenanceUserPicker);

package/dist/module/screens/MaintenanceUserPicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Component","_","TouchableOpacity","View","ScrollView","Text","connect","Icon","Services","Components","Colours","MaintenanceUserPicker","constructor","args","_defineProperty","currentUser","UNSAFE_componentWillMount","setState","props","onPressBack","navigation","goBack","onUserPress","user","onSelectUser","setTimeout","renderMain","isEmpty","users","createElement","style","marginTop","Spinner","FormCard","renderOptions","map","index","key","onPress","bind","FormCardSection","label","displayName","labelStyle","height","margin","hasUnderline","hasContent","styles","rowContainer","userContainer","ProfilePic","profilePic","Diameter","labelText","name","type","iconStyle","color","fontSize","isEqual","state","COLOUR_GREEN","render","container","Header","leftIcon","onPressLeft","text","flex","position","backgroundColor","row","flexDirection","alignItems","minHeight","fontFamily","TEXT_DARK","justifyContent","marginLeft"],"sources":["MaintenanceUserPicker.js"],"sourcesContent":["import React, { Component } from \"react\";\nimport _ from \"lodash\";\nimport { TouchableOpacity, View, ScrollView, Text } from \"react-native\";\nimport { connect } from \"react-redux\";\nimport { Icon } from \"@rneui/themed\";\nimport { Services } from \"../feature.config\";\nimport { Components, Colours } from \"../core.config\";\n\nclass MaintenanceUserPicker extends Component {\n\tstate = {\n\t\tcurrentUser: null,\n\t};\n\n\tUNSAFE_componentWillMount() {\n\t\tthis.setState({ currentUser: this.props.currentUser });\n\t}\n\n\tonPressBack() {\n\t\tServices.navigation.goBack();\n\t}\n\n\tonUserPress(user) {\n\t\tthis.props.onSelectUser(user);\n\t\tthis.setState({ currentUser: user });\n\t\tsetTimeout(() => {\n\t\t\tthis.onPressBack();\n\t\t}, 200);\n\t}\n\n\trenderMain() {\n\t\tif (_.isEmpty(this.props.users)) {\n\t\t\treturn (\n\t\t\t\t<View style={{ marginTop: 16 }}>\n\t\t\t\t\t<Components.Spinner />\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Components.FormCard style={{ marginTop: 16 }}>\n\t\t\t\t{this.renderOptions()}\n\t\t\t</Components.FormCard>\n\t\t);\n\t}\n\n\trenderOptions() {\n\t\treturn this.props.users.map((user, index) => {\n\t\t\treturn (\n\t\t\t\t<TouchableOpacity\n\t\t\t\t\tkey={index}\n\t\t\t\t\tonPress={this.onUserPress.bind(this, user)}\n\t\t\t\t>\n\t\t\t\t\t<Components.FormCardSection\n\t\t\t\t\t\tlabel={user.displayName}\n\t\t\t\t\t\tlabelStyle={{ height: 0, margin: 0 }}\n\t\t\t\t\t\thasUnderline\n\t\t\t\t\t\thasContent\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={styles.rowContainer}>\n\t\t\t\t\t\t\t<View style={styles.userContainer}>\n\t\t\t\t\t\t\t\t<Components.ProfilePic\n\t\t\t\t\t\t\t\t\tProfilePic={user.profilePic}\n\t\t\t\t\t\t\t\t\tDiameter={30}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<Text style={styles.labelText}>{user.displayName}</Text>\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tname=\"check-circle\"\n\t\t\t\t\t\t\t\ttype=\"font-awesome\"\n\t\t\t\t\t\t\t\ticonStyle={[\n\t\t\t\t\t\t\t\t\t{ color: \"#d5d9e0\", fontSize: 20 },\n\t\t\t\t\t\t\t\t\t_.isEqual(user, this.state.currentUser) && {\n\t\t\t\t\t\t\t\t\t\tcolor: Colours.COLOUR_GREEN,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</Components.FormCardSection>\n\t\t\t\t</TouchableOpacity>\n\t\t\t);\n\t\t});\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<View style={styles.container}>\n\t\t\t\t<Components.Header\n\t\t\t\t\tleftIcon=\"angle-left\"\n\t\t\t\t\tonPressLeft={this.onPressBack.bind(this)}\n\t\t\t\t\ttext=\"Select user\"\n\t\t\t\t/>\n\t\t\t\t<ScrollView style={{ flex: 1 }}>{this.renderMain()}</ScrollView>\n\t\t\t</View>\n\t\t);\n\t}\n}\n\nconst styles = {\n\tcontainer: {\n\t\tflex: 1,\n\t\tposition: \"relative\",\n\t\tbackgroundColor: \"#f0f0f5\",\n\t},\n\trow: {\n\t\tflexDirection: \"row\",\n\t\talignItems: \"center\",\n\t\tminHeight: 22,\n\t},\n\ttext: {\n\t\tflex: 1,\n\t\tfontFamily: \"sf-regular\",\n\t\tfontSize: 14,\n\t\tcolor: Colours.TEXT_DARK,\n\t},\n\trowContainer: {\n\t\tflexDirection: \"row\",\n\t\tjustifyContent: \"space-between\",\n\t},\n\tuserContainer: {\n\t\tflexDirection: \"row\",\n\t\talignItems: \"center\",\n\t},\n\tlabelText: {\n\t\tfontFamily: \"sf-medium\",\n\t\tfontSize: 16,\n\t\tcolor: Colours.TEXT_DARK,\n\t\tmarginLeft: 8,\n\t},\n};\n\nexport default connect(null, {})(MaintenanceUserPicker);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Component","_","TouchableOpacity","View","ScrollView","Text","TextInput","Keyboard","connect","Icon","Services","Components","Colours","MaintenanceUserPicker","constructor","args","_defineProperty","currentUser","searchText","text","setState","state","users","props","length","searchLower","toLowerCase","filter","user","displayName","unit","includes","UNSAFE_componentWillMount","onPressBack","navigation","goBack","onUserPress","dismiss","onSelectUser","setTimeout","renderMain","isEmpty","createElement","style","marginTop","Spinner","filteredUsers","getFilteredUsers","styles","noResultsContainer","noResultsText","FormCard","renderOptions","map","index","key","onPress","bind","FormCardSection","label","labelStyle","height","margin","hasUnderline","hasContent","rowContainer","userContainer","ProfilePic","profilePic","Diameter","labelText","name","type","iconStyle","color","fontSize","isEqual","COLOUR_GREEN","renderSearch","searchContainer","searchIcon","placeholder","autoCorrect","placeholderTextColor","TEXT_MID_ALPHA50","onChangeText","onChangeSearch","value","underlineColorAndroid","COLOUR_TRANSPARENT","returnKeyType","clearButton","clearIcon","render","container","Header","leftIcon","onPressLeft","flex","keyboardShouldPersistTaps","keyboardDismissMode","position","backgroundColor","flexDirection","justifyContent","alignItems","fontFamily","TEXT_DARK","marginLeft","borderRadius","paddingHorizontal","paddingVertical","marginRight","padding","TEXT_LIGHT","textAlign"],"sources":["MaintenanceUserPicker.js"],"sourcesContent":["import React, { Component } from \"react\";\nimport _ from \"lodash\";\nimport { TouchableOpacity, View, ScrollView, Text, TextInput, Keyboard } from \"react-native\";\nimport { connect } from \"react-redux\";\nimport { Icon } from \"@rneui/themed\";\nimport { Services } from \"../feature.config\";\nimport { Components, Colours } from \"../core.config\";\n\nclass MaintenanceUserPicker extends Component {\n\tstate = {\n\t\tcurrentUser: null,\n\t\tsearchText: \"\",\n\t};\n\n\tUNSAFE_componentWillMount() {\n\t\tthis.setState({ currentUser: this.props.currentUser });\n\t}\n\n\tonPressBack() {\n\t\tServices.navigation.goBack();\n\t}\n\n\tonUserPress(user) {\n\t\tKeyboard.dismiss();\n\t\tthis.props.onSelectUser(user);\n\t\tthis.setState({ currentUser: user });\n\t\tsetTimeout(() => {\n\t\t\tthis.onPressBack();\n\t\t}, 200);\n\t}\n\n\tonChangeSearch = (text) => {\n\t\tthis.setState({ searchText: text });\n\t};\n\n\tgetFilteredUsers = () => {\n\t\tconst { searchText } = this.state;\n\t\tconst { users } = this.props;\n\t\tif (!users) return [];\n\t\tif (!searchText || searchText.length === 0) return users;\n\t\tconst searchLower = searchText.toLowerCase();\n\t\treturn users.filter((user) => {\n\t\t\tconst displayName = (user.displayName || \"\").toLowerCase();\n\t\t\tconst unit = (user.unit || \"\").toLowerCase();\n\t\t\treturn displayName.includes(searchLower) || unit.includes(searchLower);\n\t\t});\n\t};\n\n\trenderMain() {\n\t\tif (_.isEmpty(this.props.users)) {\n\t\t\treturn (\n\t\t\t\t<View style={{ marginTop: 16 }}>\n\t\t\t\t\t<Components.Spinner />\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\n\t\tconst filteredUsers = this.getFilteredUsers();\n\t\tif (filteredUsers.length === 0 && this.state.searchText.length > 0) {\n\t\t\treturn (\n\t\t\t\t<View style={styles.noResultsContainer}>\n\t\t\t\t\t<Text style={styles.noResultsText}>No users found</Text>\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Components.FormCard style={{ marginTop: 16 }}>\n\t\t\t\t{this.renderOptions(filteredUsers)}\n\t\t\t</Components.FormCard>\n\t\t);\n\t}\n\n\trenderOptions(users) {\n\t\treturn users.map((user, index) => {\n\t\t\treturn (\n\t\t\t\t<TouchableOpacity\n\t\t\t\t\tkey={index}\n\t\t\t\t\tonPress={this.onUserPress.bind(this, user)}\n\t\t\t\t>\n\t\t\t\t\t<Components.FormCardSection\n\t\t\t\t\t\tlabel={user.displayName}\n\t\t\t\t\t\tlabelStyle={{ height: 0, margin: 0 }}\n\t\t\t\t\t\thasUnderline\n\t\t\t\t\t\thasContent\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={styles.rowContainer}>\n\t\t\t\t\t\t\t<View style={styles.userContainer}>\n\t\t\t\t\t\t\t\t<Components.ProfilePic\n\t\t\t\t\t\t\t\t\tProfilePic={user.profilePic}\n\t\t\t\t\t\t\t\t\tDiameter={30}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<Text style={styles.labelText}>{user.displayName}</Text>\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\tname=\"check-circle\"\n\t\t\t\t\t\t\t\ttype=\"font-awesome\"\n\t\t\t\t\t\t\t\ticonStyle={[\n\t\t\t\t\t\t\t\t\t{ color: \"#d5d9e0\", fontSize: 20 },\n\t\t\t\t\t\t\t\t\t_.isEqual(user, this.state.currentUser) && {\n\t\t\t\t\t\t\t\t\t\tcolor: Colours.COLOUR_GREEN,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</Components.FormCardSection>\n\t\t\t\t</TouchableOpacity>\n\t\t\t);\n\t\t});\n\t}\n\n\trenderSearch() {\n\t\treturn (\n\t\t\t<View style={styles.searchContainer}>\n\t\t\t\t<Icon name=\"search\" type=\"font-awesome\" iconStyle={styles.searchIcon} />\n\t\t\t\t<TextInput\n\t\t\t\t\tplaceholder=\"Search by name or unit\"\n\t\t\t\t\tautoCorrect={false}\n\t\t\t\t\tplaceholderTextColor={Colours.TEXT_MID_ALPHA50}\n\t\t\t\t\tonChangeText={this.onChangeSearch}\n\t\t\t\t\tvalue={this.state.searchText}\n\t\t\t\t\tstyle={styles.searchText}\n\t\t\t\t\tunderlineColorAndroid={Colours.COLOUR_TRANSPARENT}\n\t\t\t\t\treturnKeyType=\"search\"\n\t\t\t\t/>\n\t\t\t\t{this.state.searchText.length > 0 && (\n\t\t\t\t\t<TouchableOpacity onPress={() => this.onChangeSearch(\"\")} style={styles.clearButton}>\n\t\t\t\t\t\t<Icon name=\"times-circle\" type=\"font-awesome\" iconStyle={styles.clearIcon} />\n\t\t\t\t\t</TouchableOpacity>\n\t\t\t\t)}\n\t\t\t</View>\n\t\t);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<View style={styles.container}>\n\t\t\t\t<Components.Header\n\t\t\t\t\tleftIcon=\"angle-left\"\n\t\t\t\t\tonPressLeft={this.onPressBack.bind(this)}\n\t\t\t\t\ttext=\"Select user\"\n\t\t\t\t/>\n\t\t\t\t{this.renderSearch()}\n\t\t\t\t<ScrollView style={{ flex: 1 }} keyboardShouldPersistTaps=\"handled\" keyboardDismissMode=\"on-drag\">\n\t\t\t\t\t{this.renderMain()}\n\t\t\t\t</ScrollView>\n\t\t\t</View>\n\t\t);\n\t}\n}\n\nconst styles = {\n\tcontainer: {\n\t\tflex: 1,\n\t\tposition: \"relative\",\n\t\tbackgroundColor: \"#f0f0f5\",\n\t},\n\trowContainer: {\n\t\tflexDirection: \"row\",\n\t\tjustifyContent: \"space-between\",\n\t},\n\tuserContainer: {\n\t\tflexDirection: \"row\",\n\t\talignItems: \"center\",\n\t},\n\tlabelText: {\n\t\tfontFamily: \"sf-medium\",\n\t\tfontSize: 16,\n\t\tcolor: Colours.TEXT_DARK,\n\t\tmarginLeft: 8,\n\t},\n\tsearchContainer: {\n\t\tflexDirection: \"row\",\n\t\talignItems: \"center\",\n\t\tmargin: 15,\n\t\tbackgroundColor: \"#fff\",\n\t\tborderRadius: 8,\n\t\tpaddingHorizontal: 12,\n\t\tpaddingVertical: 8,\n\t},\n\tsearchIcon: {\n\t\tfontSize: 16,\n\t\tmarginRight: 10,\n\t\tcolor: Colours.TEXT_MID_ALPHA50,\n\t},\n\tsearchText: {\n\t\tflex: 1,\n\t\tfontSize: 16,\n\t\tfontFamily: \"sf-regular\",\n\t\tcolor: Colours.TEXT_DARK,\n\t\tpadding: 0,\n\t},\n\tclearButton: {\n\t\tpadding: 4,\n\t},\n\tclearIcon: {\n\t\tfontSize: 16,\n\t\tcolor: Colours.TEXT_MID_ALPHA50,\n\t},\n\tnoResultsContainer: {\n\t\talignItems: \"center\",\n\t\tjustifyContent: \"center\",\n\t\tpaddingVertical: 40,\n\t},\n\tnoResultsText: {\n\t\tfontSize: 16,\n\t\tfontFamily: \"sf-regular\",\n\t\tcolor: Colours.TEXT_LIGHT,\n\t\ttextAlign: \"center\",\n\t},\n};\n\nexport default connect(null, {})(MaintenanceUserPicker);\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@plusscommunities/pluss-maintenance-app-forms",
-	"version": "8.0.8",
+	"version": "8.0.9-beta.2",
 	"description": "Extension package to enable maintenance on Pluss Communities Platform",
 	"main": "dist/module/index.js",
 	"module": "dist/module/index.js",
@@ -51,4 +51,4 @@
 			"module"
 		]
 	}
-}
+}

package/src/core.config.js

@@ -3,7 +3,6 @@ import * as PlussCore from "@plusscommunities/pluss-core-app";
 
 const {
 	Apis,
-	Fonts,
 	Actions,
 	ActionTypes,
 	Config,
@@ -16,7 +15,6 @@ const {
 } = PlussCore;
 export {
 	Apis,
-	Fonts,
 	Actions,
 	ActionTypes,
 	Config,

package/src/screens/MaintenanceUserPicker.js

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import _ from "lodash";
-import { TouchableOpacity, View, ScrollView, Text } from "react-native";
+import { TouchableOpacity, View, ScrollView, Text, TextInput, Keyboard } from "react-native";
 import { connect } from "react-redux";
 import { Icon } from "@rneui/themed";
 import { Services } from "../feature.config";
@@ -9,6 +9,7 @@ import { Components, Colours } from "../core.config";
 class MaintenanceUserPicker extends Component {
 	state = {
 		currentUser: null,
+		searchText: "",
 	};
 
 	UNSAFE_componentWillMount() {
@@ -20,6 +21,7 @@ class MaintenanceUserPicker extends Component {
 	}
 
 	onUserPress(user) {
+		Keyboard.dismiss();
 		this.props.onSelectUser(user);
 		this.setState({ currentUser: user });
 		setTimeout(() => {
@@ -27,6 +29,23 @@ class MaintenanceUserPicker extends Component {
 		}, 200);
 	}
 
+	onChangeSearch = (text) => {
+		this.setState({ searchText: text });
+	};
+
+	getFilteredUsers = () => {
+		const { searchText } = this.state;
+		const { users } = this.props;
+		if (!users) return [];
+		if (!searchText || searchText.length === 0) return users;
+		const searchLower = searchText.toLowerCase();
+		return users.filter((user) => {
+			const displayName = (user.displayName || "").toLowerCase();
+			const unit = (user.unit || "").toLowerCase();
+			return displayName.includes(searchLower) || unit.includes(searchLower);
+		});
+	};
+
 	renderMain() {
 		if (_.isEmpty(this.props.users)) {
 			return (
@@ -36,15 +55,24 @@ class MaintenanceUserPicker extends Component {
 			);
 		}
 
+		const filteredUsers = this.getFilteredUsers();
+		if (filteredUsers.length === 0 && this.state.searchText.length > 0) {
+			return (
+				<View style={styles.noResultsContainer}>
+					<Text style={styles.noResultsText}>No users found</Text>
+				</View>
+			);
+		}
+
 		return (
 			<Components.FormCard style={{ marginTop: 16 }}>
-				{this.renderOptions()}
+				{this.renderOptions(filteredUsers)}
 			</Components.FormCard>
 		);
 	}
 
-	renderOptions() {
-		return this.props.users.map((user, index) => {
+	renderOptions(users) {
+		return users.map((user, index) => {
 			return (
 				<TouchableOpacity
 					key={index}
@@ -81,6 +109,29 @@ class MaintenanceUserPicker extends Component {
 		});
 	}
 
+	renderSearch() {
+		return (
+			<View style={styles.searchContainer}>
+				<Icon name="search" type="font-awesome" iconStyle={styles.searchIcon} />
+				<TextInput
+					placeholder="Search by name or unit"
+					autoCorrect={false}
+					placeholderTextColor={Colours.TEXT_MID_ALPHA50}
+					onChangeText={this.onChangeSearch}
+					value={this.state.searchText}
+					style={styles.searchText}
+					underlineColorAndroid={Colours.COLOUR_TRANSPARENT}
+					returnKeyType="search"
+				/>
+				{this.state.searchText.length > 0 && (
+					<TouchableOpacity onPress={() => this.onChangeSearch("")} style={styles.clearButton}>
+						<Icon name="times-circle" type="font-awesome" iconStyle={styles.clearIcon} />
+					</TouchableOpacity>
+				)}
+			</View>
+		);
+	}
+
 	render() {
 		return (
 			<View style={styles.container}>
@@ -89,7 +140,10 @@ class MaintenanceUserPicker extends Component {
 					onPressLeft={this.onPressBack.bind(this)}
 					text="Select user"
 				/>
-				<ScrollView style={{ flex: 1 }}>{this.renderMain()}</ScrollView>
+				{this.renderSearch()}
+				<ScrollView style={{ flex: 1 }} keyboardShouldPersistTaps="handled" keyboardDismissMode="on-drag">
+					{this.renderMain()}
+				</ScrollView>
 			</View>
 		);
 	}
@@ -101,17 +155,6 @@ const styles = {
 		position: "relative",
 		backgroundColor: "#f0f0f5",
 	},
-	row: {
-		flexDirection: "row",
-		alignItems: "center",
-		minHeight: 22,
-	},
-	text: {
-		flex: 1,
-		fontFamily: "sf-regular",
-		fontSize: 14,
-		color: Colours.TEXT_DARK,
-	},
 	rowContainer: {
 		flexDirection: "row",
 		justifyContent: "space-between",
@@ -126,6 +169,45 @@ const styles = {
 		color: Colours.TEXT_DARK,
 		marginLeft: 8,
 	},
+	searchContainer: {
+		flexDirection: "row",
+		alignItems: "center",
+		margin: 15,
+		backgroundColor: "#fff",
+		borderRadius: 8,
+		paddingHorizontal: 12,
+		paddingVertical: 8,
+	},
+	searchIcon: {
+		fontSize: 16,
+		marginRight: 10,
+		color: Colours.TEXT_MID_ALPHA50,
+	},
+	searchText: {
+		flex: 1,
+		fontSize: 16,
+		fontFamily: "sf-regular",
+		color: Colours.TEXT_DARK,
+		padding: 0,
+	},
+	clearButton: {
+		padding: 4,
+	},
+	clearIcon: {
+		fontSize: 16,
+		color: Colours.TEXT_MID_ALPHA50,
+	},
+	noResultsContainer: {
+		alignItems: "center",
+		justifyContent: "center",
+		paddingVertical: 40,
+	},
+	noResultsText: {
+		fontSize: 16,
+		fontFamily: "sf-regular",
+		color: Colours.TEXT_LIGHT,
+		textAlign: "center",
+	},
 };
 
 export default connect(null, {})(MaintenanceUserPicker);