muba-posting 4.0.5 → 4.1.0

package/EditHead.js

@@ -7,10 +7,10 @@ export default class EditHead extends React.Component {
     super(props);
 
     let mainPictureUrl = null;
-    let mainPicture = this.props.postingAd?.images.filter(item => item.photo.mainPicture === true)[0];
+    let mainPicture = this.props.postingAd?.images.filter(item => item.mainPicture === true)[0];
 
     if (mainPicture !== undefined) {
-      mainPictureUrl = mainPicture.photo.url;
+      mainPictureUrl = mainPicture.uri;
     }
 
     this.state = {
@@ -21,10 +21,10 @@ export default class EditHead extends React.Component {
   componentDidUpdate(prevProps) {
     if (!this.isSameList(prevProps.postingAd.images, this.props.postingAd.images)) {
       let mainPictureUrl = '';
-      let mainPicture = this.props.postingAd.images.filter(item => item.photo.mainPicture === true)[0];
+      let mainPicture = this.props.postingAd.images.filter(item => item.mainPicture === true)[0];
 
       if (mainPicture !== undefined) {
-        mainPictureUrl = mainPicture.photo.url;
+        mainPictureUrl = mainPicture.uri;
       }
       this.setState({ mainPictureUrl: mainPictureUrl })
     }
@@ -44,7 +44,7 @@ export default class EditHead extends React.Component {
 
   render() {
     return (
-      <ImageBackground style={{ width: '100%' }} source={this.state.mainPictureUrl} resizeMode='cover'>
+      <ImageBackground style={{ width: '100%' }} source={{ uri: this.state.mainPictureUrl }} resizeMode='cover'>
         <View style={commonStyles.editBar}>
           {this.props.postingAd.reference && this.props.postingAd.reference != '' ?
             <View style={commonStyles.editRef}>

package/PopupSpendProduct.js

@@ -7,8 +7,8 @@ import Icon from '@expo/vector-icons/FontAwesome';
 import { strings } from 'muba-i18n';
 import commonStyles from './commonStyles';
 
-export const PROMOTE_AD = '/api/posting/PromoteAd';
-const GET_COUNTRY_PHONE = '/api/common/GetCountryPhone';
+export const PROMOTE_AD = { method: 'PUT', url: '/controller/ad/{adId}/promote' };
+const COUNTRY_PHONE = { method: 'GET', url: '/controller/countries/{countryCode}/phones' };
 
 export default class PopupSpendProduct extends React.Component {
   constructor(props) {
@@ -21,9 +21,9 @@ export default class PopupSpendProduct extends React.Component {
   }
 
   async componentDidMount() {
-    const resultJson = await this.props.request(this, GET_COUNTRY_PHONE);
-    if (resultJson.success) {
-      this.setState({ countryPhone: resultJson.countryPhones[0].formattedPhone });
+    const resultJson = await this.props.request(this, COUNTRY_PHONE);
+    if (resultJson.status === 200) {
+      this.setState({ countryPhone: resultJson.list[0].formattedPhone });
     }
   }
 
@@ -42,7 +42,7 @@ export default class PopupSpendProduct extends React.Component {
     });
 
     this.props.hideLoading();
-    if (responseJson.success && responseJson.remaining >= -1) {
+    if (responseJson.status === 200 && responseJson.remaining >= -1) {
       if (responseJson.remaining > -1) {
         result = 1;
       }
@@ -65,7 +65,7 @@ export default class PopupSpendProduct extends React.Component {
     });
 
     this.props.hideLoading();
-    if (responseJson.success && responseJson.remaining >= -1) {
+    if (responseJson.status === 200 && responseJson.remaining >= -1) {
       if (responseJson.remaining > -1) {
         result = 1;
       }

package/Posting.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { BackHandler, Text, TouchableOpacity, View } from 'react-native';
-import { manipulateAsync } from 'expo-image-manipulator';
 import CustomScrollView from 'muba-custom-scroll-view';
 import { CommonActions } from '@react-navigation/native';
 import { loadLocaleData, currentLocale, strings } from 'muba-i18n';
@@ -22,17 +21,18 @@ import Preview from './Preview';
 import PublishProgressBar from './PublishProgressBar.js';
 import EditHead from './EditHead.js';
 import PictureSelector from 'muba-picture';
-import ProgressBar from './shared/ProgressBar.js';
 import PopupPermissions from 'muba-popup-permissions';
 import { createIconSetFromFontello } from 'react-native-vector-icons';
 import fontelloConfig from './fonts/config.json';
 const FontAwesomeIcon = createIconSetFromFontello(fontelloConfig);
 
-const SET_AD = '/api/posting/SetAd';
-const GET_AD = '/api/posting/GetPostingAd';
-const GET_BUSINESS_PRODUCTS = '/api/posting/GetBusinessProducts';
-const GET_MAX_PICTURES = '/api/posting/GetMaxPictures';
-const GET_COUNTRY_PHONE = '/api/common/GetCountryPhone';
+const CREATE_AD = { method: 'POST', url: '/controller/ads' };
+const UPDATE_AD = { method: 'PUT', url: '/controller/ads/{adId}' };
+const AD = { method: 'GET', url: '/controller/ads/{adId}' };
+const BUSINESS_ID = { method: 'GET', url: '/controller/users/{userId}/businessId' };
+const BUSINESS_PRODUCTS = { method: 'GET', url: '/controller/products/{key}/remaining' };
+const MAX_PICTURES = { method: 'GET', url: '/controller/max-pictures' };
+const COUNTRY_PHONE = { method: 'GET', url: '/controller/countries/{countryCode}/phones' };
 
 export default class Posting extends React.Component {
   constructor(props) {
@@ -47,10 +47,10 @@ export default class Posting extends React.Component {
     });
 
     this.state = {
-      loading: false,
       progress: 0,
       view: null,
       originView: this.props.adId ? Views.EDIT_SELECTOR : Views.PUBLISH_1,
+      fullPosting: this.props.adId == null,
       prevViews: [],
       currentScreen: 1,
       fontLoaded: false,
@@ -66,10 +66,11 @@ export default class Posting extends React.Component {
         category: null,
         subCategory: null,
         subCategoryDetails: [],
-        isExactlyLocated: true,
+        exactlyLocated: true,
         latitude: null,
         longitude: null,
         address: null,
+        country: this.props.country,
         region: null,
         city: null,
         district: null,
@@ -116,7 +117,6 @@ export default class Posting extends React.Component {
         internet: false,
         phones: this.props.phones ? this.props.phones.includes('###') ? this.props.phones.split('###') : Array.isArray(this.props.phones) ? this.props.phones : [this.props.phones] : [],
         reference: null,
-        mail: null,
         id: null,
         languageId: currentLocale().toUpperCase(),
         languages: [{ language: currentLocale().toUpperCase(), title: null, description: null, automatic: true }],
@@ -158,7 +158,6 @@ export default class Posting extends React.Component {
       }
     ]);
     this.setState({ fontLoaded: true });
-
     this.popupPermissions.open();
   }
 
@@ -184,12 +183,13 @@ export default class Posting extends React.Component {
 
   loadData = async (canPublish) => {
     if (canPublish) {
-      const resultJson = await this.props.request(this, GET_COUNTRY_PHONE);
-      if (resultJson.success) {
-        this.setState({ countryPhone: resultJson.countryPhones[0].formattedPhone });
+      const resultJson = await this.props.request(this, COUNTRY_PHONE, { code: this.props.country });
+      if (resultJson.status === 200) {
+        this.setState({ countryPhone: resultJson.list[0].formattedPhone });
       }
 
       this.getMaxPictures();
+      this.readBusinessId();
       const hasListings = await this.checkListings();
       if (this.state.adId != null) {
         this.setState({ view: this.state.originView });
@@ -228,18 +228,23 @@ export default class Posting extends React.Component {
   }
 
   async checkListings() {
-    const response = await this.props.request(this, GET_BUSINESS_PRODUCTS, {});
-    this.setState({
-      businessId: response.businessId
-    })
+    const response = await this.props.request(this, BUSINESS_PRODUCTS, { key: 'LISTING' });
+    return response > 0;
+  }
 
-    return response.success && response.listings > 0;
+  async readBusinessId() {
+    const response = await this.props.request(this, BUSINESS_ID, { userId: this.props.userId });
+    if (response.status !== 404) {
+      this.setState({
+        businessId: response
+      });
+    }
   }
 
   async getMaxPictures() {
-    const response = await this.props.request(this, GET_MAX_PICTURES, {});
+    const response = await this.props.request(this, MAX_PICTURES, {});
     this.setState({
-      maxPictures: response.maxPictures
+      maxPictures: response
     })
   }
 
@@ -256,6 +261,15 @@ export default class Posting extends React.Component {
 
     prevViews.unshift(this.state.view);
 
+    if (!this.state.postingAd.id && this.state.postingAd.town) {
+      const response = await this.props.request(this, CREATE_AD, this.state.postingAd);
+      if (response.status === 200) {
+        await this.setState({
+          postingAd: { ...this.state.postingAd, id: response.id }
+        })
+      }
+    }
+
     await this.setState({ prevViews: prevViews, editingStepOne: editingStepOne });
     await this._updateCurrentScreen(view, params);
   }
@@ -333,81 +347,39 @@ export default class Posting extends React.Component {
   }
 
   async _saveEditAd() {
-    this.setState({ loading: true });
-
-    const formData = new FormData();
-
-    let i = 0;
-    for (let imageObject of this.state.postingAd.images) {
-      if (imageObject.photo.url) {
-        if (imageObject.photo.extension === 'heic' || imageObject.photo.extension === 'heif') {
-          const manipResult = await manipulateAsync(
-            imageObject.photo.url.uri, [], {}
-          );
-
-          imageObject.photo.url.uri = manipResult.uri;
-        }
-
-        formData.append('photo' + i, {
-          uri: imageObject.photo.url.uri,
-          name: imageObject.photo.fileName ? imageObject.photo.fileName : 'photo_' + i + '.' + imageObject.photo.extension,
-          type: 'image/jpeg'
-        });
-        if (imageObject.photo.id !== 0) {
-          formData.append('photo' + i + 'Id', imageObject.photo.id);
-        }
-        formData.append('photo' + i + 'ReferenceType', 'AD');
-        formData.append('photo' + i + 'ReferenceId', this.state.adId);
-        formData.append('photo' + i + 'ExtraInfo', i);
-        i++;
+    const response = await this.props.request(this, UPDATE_AD, { ...this.state.postingAd, id: { adId: this.state.postingAd.id } });
+    if (this.props.adId) {
+      if (this.state.originView === Views.EDIT_SELECTOR) {
+        this.setState({ isLoading: true });
+        await this.loadAd();
+        this.editSelector.refresh();
+        this._goToPage(Views.EDIT_SELECTOR);
+      } else {
+        this.props.navigation.goBack();
       }
+    } else {
+      await this.setState({ postingAd: { ...this.state.postingAd, adId: response.id } });
+      this._goToPage(Views.PREVIEW, null, response);
     }
 
-    this.props.request(this, SET_AD, this.state.postingAd, formData,
-      this.updateProgress.bind(this),
-      async (responseJson) => {
-        await this.setState({ loading: false, progress: 0 });
-
-        if (responseJson.success) {
-          if (this.props.adId) {
-            if (this.state.originView === Views.EDIT_SELECTOR) {
-              this.setState({ isLoading: true });
-              await this.loadAd();
-              this.editSelector.refresh();
-              this._goToPage(Views.EDIT_SELECTOR);
-            } else {
-              this.props.navigation.goBack();
-            }
-          } else {
-            await this.setState({ postingAd: { ...this.state.postingAd, adId: responseJson.adId } });
-            this._goToPage(Views.PREVIEW, null, responseJson);
-          }
-
-          if (this.props.showRatingPopup) {
-            this.props.showRatingPopup();
-          }
-        }
-      });
-  }
-
-  updateProgress(oEvent) {
-    if (oEvent.lengthComputable) {
-      var progress = oEvent.loaded / oEvent.total;
-      var picturesUploaded = Math.round(this.state.postingAd.images.length * progress);
-      this.setState({ progress: progress, picturesUploaded: picturesUploaded });
-    } else {
-      // Unable to compute progress information since the total size is unknown
+    if (this.props.showRatingPopup) {
+      this.props.showRatingPopup();
     }
   }
 
-  _showLoading() {
+  async _showLoading() {
     this.setState({ isLoading: true });
   }
 
-  _hideLoading() {
+  async _hideLoading() {
+    await this.sleep(500);
     this.setState({ isLoading: false });
   }
 
+  sleep = (ms) => {
+    return new Promise(resolve => setTimeout(resolve, ms));
+  }
+
   _openPictureSelector() {
     this.setState({ showImageBrowser: true })
   }
@@ -416,12 +388,12 @@ export default class Posting extends React.Component {
     await this.setState({ showImageBrowser: false });
 
     for (let photo of photos) {
-      this.publish4Screen.loadImage(photo.uri);
+      this.publish4Screen.loadImage(photo);
     }
   }
 
   getAd = async (id) => {
-    const responseJson = await this.props.request(this, GET_AD, {
+    const responseJson = await this.props.request(this, AD, {
       adId: id
     });
 
@@ -431,7 +403,7 @@ export default class Posting extends React.Component {
   _savePicture = async (picture) => {
     await this.setState({ showImageBrowser: false })
     this.setState({ view: Views.PUBLISH_4 }, () => {
-      this.publish4Screen.loadImage(picture.uri);
+      this.publish4Screen.loadImage(picture);
     })
   }
 
@@ -474,6 +446,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   scroll={(ref) => this.scroll.scrollIntoView(ref)}
+                  fullPosting={this.state.fullPosting}
                   goToPage={(view, editingStepOne) => this._goToPage(view, editingStepOne)}
                   saveEditAd={() => this._saveEditAd()}
                   showView={this.state.view === Views.PUBLISH_1}
@@ -492,6 +465,7 @@ export default class Posting extends React.Component {
                   hideLoading={() => this._hideLoading()}
                   hereAppId={this.props.hereAppId} hereAppCode={this.props.hereAppCode}
                   showView={this.state.view === Views.PUBLISH_2}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight} />
 
@@ -506,6 +480,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   showView={this.state.view === Views.PUBLISH_2_B}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight} />
 
@@ -521,6 +496,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   showView={this.state.view === Views.PUBLISH_3}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight} />
 
@@ -533,6 +509,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   showView={this.state.view === Views.PUBLISH_4}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight}
                   openPictureSelector={() => this._openPictureSelector()}
@@ -548,6 +525,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   showView={this.state.view === Views.PUBLISH_5}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight} />
 
@@ -562,6 +540,7 @@ export default class Posting extends React.Component {
                   showLoading={() => this._showLoading()}
                   hideLoading={() => this._hideLoading()}
                   showView={this.state.view === Views.PUBLISH_6}
+                  fullPosting={this.state.fullPosting}
                   progressBarHeight={this.state.progressBarHeight}
                   headerHeight={this.state.headerHeight} />
 
@@ -583,16 +562,6 @@ export default class Posting extends React.Component {
                   topBar={this.props.topBar}
                   goToPage={(view) => this._goToPage(view)} />
 
-                <ProgressBar loading={this.state.loading} progress={(this.state.progress * 100).toFixed(0)}>
-                  <View style={commonStyles.loadingPicturesNote}>
-                    {this.state.picturesUploaded == this.state.postingAd.images.length ?
-                      <Text style={commonStyles.mapNoteText}>{strings('setup.savingAd')}</Text>
-                      :
-                      <Text style={commonStyles.mapNoteText}>{strings('setup.uploadingPicture')} {this.state.picturesUploaded} / {this.state.postingAd.images.length}</Text>
-                    }
-                  </View>
-                </ProgressBar>
-
               </CustomScrollView>
               <PopupAdvice icon={<FontAwesomeIcon name='block' />} title={strings('setup.noPromoteTitle', { product: '' })} headerColor={commonStyles.red} ref={(popupAdvice) => { this.popupNoListings = popupAdvice; }}
                 onClose={async () => this.state.view !== Views.PREVIEW ? this.goBack() : null} hideButton={true}>

package/PostingEdit.js

@@ -10,12 +10,12 @@ export default class PostingEdit extends React.Component {
     super(props);
 
     this.state = {
-      showFunctionalities: null
+      showFunctionalities: this.props.postingAd.subCategoryDetails.filter(function (detail) { return detail.value == "floorType" }).length > 0
     };
   }
 
   componentDidUpdate = (prevProps) => {
-    if (prevProps.postingAd.adId !== this.props.postingAd.adId) {
+    if (prevProps.postingAd.id !== this.props.postingAd.id) {
       this.refresh();
     }
   }
@@ -27,7 +27,7 @@ export default class PostingEdit extends React.Component {
   }
 
   navigateToPublish2() {
-    if (this.props.postingAd.isExactlyLocated) {
+    if (this.props.postingAd.exactlyLocated) {
       this.props.goToPage(Views.PUBLISH_2);
     } else {
       this.props.goToPage(Views.PUBLISH_2_B);

package/Preview.js

@@ -198,7 +198,7 @@ export default class Preview extends React.Component {
             </View>
           </View>
           : null}
-        <PopupSpendProduct adId={this.props.postingAd.adId} ref={(popupShowAdvice) => { this.popupShowAdvice = popupShowAdvice }} businessId={this.props.businessId} request={this.props.request}
+        <PopupSpendProduct adId={this.props.postingAd.id} ref={(popupShowAdvice) => { this.popupShowAdvice = popupShowAdvice }} businessId={this.props.businessId} request={this.props.request}
           showLoading={this.props.showLoading} hideLoading={this.props.hideLoading} />
       </View>
     );

package/Publish1.js

@@ -6,7 +6,7 @@ import RadioButtonGroup from 'muba-radio-button-group';
 import { Views } from './utils/Views';
 const window = Dimensions.get('window');
 
-const GET_CATEGORIES = '/api/common/GetPostingCategories';
+const GET_CATEGORIES = { method: 'GET', url: '/controller/categories' };
 
 export default class Publish1 extends React.Component {
   constructor(props) {
@@ -31,11 +31,11 @@ export default class Publish1 extends React.Component {
       });
 
       const responseJson = await this.props.request(this.props.context, GET_CATEGORIES, {
-        userEmail: this.props.postingAd.userEmail
+        userId: this.props.postingAd.userId
       });
 
-      if (responseJson.success) {
-        this.jsonCategories = responseJson.categoryList;
+      if (responseJson.status === 200) {
+        this.jsonCategories = responseJson.list;
         this.props.postingAd.category = this.props.postingAd.category != null ? this.props.postingAd.category : this.jsonCategories[0].value;
         this.props.postingAd.subCategory = this.props.postingAd.subCategory != null ? this.props.postingAd.subCategory : this.jsonCategories[0].subCategoryList[0].value;
 
@@ -113,7 +113,7 @@ export default class Publish1 extends React.Component {
         }
       }
 
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         if (this.props.postingAd.isExactlyLocated) {
           this.props.goToPage(Views.PUBLISH_2);
         } else {
@@ -166,7 +166,7 @@ export default class Publish1 extends React.Component {
           <View style={commonStyles.buttomButton}>
             <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
               <Text style={commonStyles.actionButtonText}>
-                {this.props.postingAd.adId == null || this.props.fullPosting || this.oldCategory != this.state.transactionOptions.selectedItem || this.oldSubCategory != this.state.typeBienOptions.selectedItem ?
+                {this.props.postingAd.id == null || this.props.fullPosting || this.oldCategory != this.state.transactionOptions.selectedItem || this.oldSubCategory != this.state.typeBienOptions.selectedItem ?
                   strings('setup.next').toUpperCase()
                   :
                   strings('setup.enregistrer').toUpperCase()}

package/Publish2.js

@@ -10,7 +10,7 @@ import fontelloConfig from './fonts/config.json';
 const FontAwesomeIcon = createIconSetFromFontello(fontelloConfig);
 const window = Dimensions.get('window');
 
-const GET_LOCATION_FROM_COORDINATES = '/api/common/GetLocationFromCoordinates';
+const GET_LOCATION_FROM_COORDINATES = { method: 'GET', url: '/controller/location' };
 
 export default class Publish2 extends React.Component {
   constructor(props) {
@@ -42,7 +42,7 @@ export default class Publish2 extends React.Component {
 
   async nextStep() {
     if (await this.validateLocation()) {
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         this.props.goToPage(Views.PUBLISH_3);
       } else {
         this.props.saveEditAd()
@@ -63,11 +63,11 @@ export default class Publish2 extends React.Component {
     });
 
     if (responseJson.success) {
-      if (responseJson.isExactlyLocated) {
-        this.props.postingAd.isExactlyLocated = true;
+      if (responseJson.exactlyLocated) {
+        this.props.postingAd.exactlyLocated = true;
         validateLocation = true;
       } else {
-        this.props.postingAd.isExactlyLocated = false;
+        this.props.postingAd.exactlyLocated = false;
       }
 
       if (responseJson.region !== undefined) {
@@ -131,9 +131,9 @@ export default class Publish2 extends React.Component {
           : null}
         <View style={commonStyles.buttomButton} onLayout={this.onLayout}>
           <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
-            <Text style={commonStyles.actionButtonText}>{this.props.postingAd.adId == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
+            <Text style={commonStyles.actionButtonText}>{this.props.postingAd.id == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
           </TouchableHighlight>
-          <TouchableHighlight underlayColor="rgba(0,0,0,0)" onPress={() => { this.props.postingAd.isExactlyLocated = false; this.props.replacePage(Views.PUBLISH_2_B) }}>
+          <TouchableHighlight underlayColor="rgba(0,0,0,0)" onPress={() => { this.props.postingAd.exactlyLocated = false; this.props.replacePage(Views.PUBLISH_2_B) }}>
             <Text style={[commonStyles.carteNote, commonStyles.carteNoteMap]}>{strings('setup.notUseMap')}</Text>
           </TouchableHighlight>
         </View>

package/Publish2b.js

@@ -7,7 +7,10 @@ import InputText from 'muba-input-text';
 import { Views } from './utils/Views';
 const window = Dimensions.get('window');
 
-const GET_LOCATIONS = '/api/common/GetLocations';
+const GET_REGIONS = { method: 'GET', url: '/controller/countries/{countryCode}/regions' };
+const GET_CITIES_FROM_REGION = { method: 'GET', url: '/controller/regions/{regionId}/cities' };
+const GET_DISTRICTS_FROM_CITY = { method: 'GET', url: '/controller/cities/{cityId}/districts' };
+const GET_TOWNS_FROM_DISTRICT = { method: 'GET', url: '/controller/districts/{districtId}/towns' };
 
 export default class Publish2b extends React.Component {
   constructor(props) {
@@ -89,17 +92,15 @@ export default class Publish2b extends React.Component {
 
   async loadRegions() {
     if (this.state.regionOptions.elements.length <= 1) {
-      const responseJson = await this.props.request(this.props.context, GET_LOCATIONS, {
-        locationLevel: '1'
-      });
+      const responseJson = await this.props.request(this.props.context, GET_REGIONS, {});
 
-      if (responseJson.success) {
+      if (responseJson.status === 200) {
         const regionOptions = {
           elements: [this.state.regionOptions.elements[0]],
           selectedItem: this.props.postingAd.region
         };
 
-        responseJson.resultList.map((item) => {
+        responseJson.list.map((item) => {
           regionOptions.elements.push(item);
         });
 
@@ -115,18 +116,17 @@ export default class Publish2b extends React.Component {
 
     this.props.postingAd.region = value;
 
-    const responseJson = await this.props.request(this.props.context, GET_LOCATIONS, {
-      locationLevel: '3',
-      parentId: this.props.postingAd.region
+    const responseJson = await this.props.request(this.props.context, GET_CITIES_FROM_REGION, {
+      regionId: this.props.postingAd.region
     });
 
-    if (responseJson.success) {
+    if (responseJson.status === 200) {
       var cityOptions = {
         elements: [this.state.cityOptions.elements[0]],
         selectedItem: null
       };
 
-      responseJson.resultList.map((item) => {
+      responseJson.list.map((item) => {
         cityOptions.elements.push(item);
       });
 
@@ -153,30 +153,29 @@ export default class Publish2b extends React.Component {
 
     this.props.postingAd.city = value;
 
-    const responseJson = await this.props.request(this.props.context, GET_LOCATIONS, {
-      locationLevel: '4',
-      parentId: this.props.postingAd.city
+    const responseJson = await this.props.request(this.props.context, GET_DISTRICTS_FROM_CITY, {
+      cityId: this.props.postingAd.city
     });
 
-    if (responseJson.success) {
+    if (responseJson.status === 200) {
       let districtOptions = {
         elements: [this.state.districtOptions.elements[0]],
         selectedItem: null
       };
 
-      responseJson.resultList.map((item) => {
+      responseJson.list.map((item) => {
         districtOptions.elements.push(item);
       });
 
-      if (responseJson.resultList.length == 1) {
-        districtOptions.selectedItem = responseJson.resultList[0].value;
+      if (responseJson.list.length == 1) {
+        districtOptions.selectedItem = responseJson.list[0].value;
       }
 
       await this.setState({ districtOptions: districtOptions });
       this.props.postingAd.district = null;
       this.props.postingAd.town = null;
 
-      if (responseJson.resultList.length == 1) {
+      if (responseJson.list.length == 1) {
         this.inputSelectDistrict?.onSubmitValidate();
         await this.loadTowns(districtOptions.selectedItem);
       } else {
@@ -196,29 +195,28 @@ export default class Publish2b extends React.Component {
 
     this.props.postingAd.district = value;
 
-    const responseJson = await this.props.request(this.props.context, GET_LOCATIONS, {
-      locationLevel: '5',
-      parentId: this.props.postingAd.district
+    const responseJson = await this.props.request(this.props.context, GET_TOWNS_FROM_DISTRICT, {
+      districtId: this.props.postingAd.district
     });
 
-    if (responseJson.success) {
+    if (responseJson.status === 200) {
       var townOptions = {
         elements: [this.state.townOptions.elements[0]],
         selectedItem: null
       };
 
-      responseJson.resultList.map((item) => {
+      responseJson.list.map((item) => {
         townOptions.elements.push(item);
       });
 
-      if (responseJson.resultList.length == 1) {
-        townOptions.selectedItem = responseJson.resultList[0].value;
+      if (responseJson.list.length == 1) {
+        townOptions.selectedItem = responseJson.list[0].value;
         this.props.postingAd.town = townOptions.selectedItem;
       }
 
       await this.setState({ townOptions: townOptions });
 
-      if (responseJson.resultList.length == 1) {
+      if (responseJson.list.length == 1) {
         this.inputSelectTown?.onSubmitValidate();
       }
     }
@@ -230,7 +228,7 @@ export default class Publish2b extends React.Component {
 
   async nextStep() {
     if (this.validateForm()) {
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         this.props.goToPage(Views.PUBLISH_3);
       } else {
         this.props.saveEditAd();
@@ -318,9 +316,9 @@ export default class Publish2b extends React.Component {
             </View>
             <View style={commonStyles.buttomButton}>
               <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
-                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.adId == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
+                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.id == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
               </TouchableHighlight>
-              <TouchableHighlight underlayColor="rgba(0,0,0,0)" onPress={() => { this.props.postingAd.isExactlyLocated = true; this.props.replacePage(Views.PUBLISH_2) }}>
+              <TouchableHighlight underlayColor="rgba(0,0,0,0)" onPress={() => { this.props.postingAd.exactlyLocated = true; this.props.replacePage(Views.PUBLISH_2) }}>
                 <Text style={[commonStyles.carteNote, commonStyles.carteNoteMap]}>{strings('setup.useMap')}</Text>
               </TouchableHighlight>
             </View>

package/Publish3.js

@@ -9,7 +9,7 @@ import InputText from 'muba-input-text';
 import { Views } from './utils/Views';
 const window = Dimensions.get('window');
 
-const GET_CURRENCIES = '/api/mubawabapp/GetCurrencyList';
+const GET_CURRENCIES = { method: 'GET', url: '/controller/countries/{countryCode}/currencies' };
 
 export default class Publish3 extends React.Component {
   constructor(props) {
@@ -64,8 +64,8 @@ export default class Publish3 extends React.Component {
     const responseJson = await this.props.request(this.props.context, GET_CURRENCIES, {});
     const priceOptions = this.state.priceOptions;
 
-    if (responseJson.success) {
-      responseJson.currencyList.map((item) => {
+    if (responseJson.status === 200) {
+      responseJson.list.map((item) => {
         priceOptions.elements.push(item);
       });
       priceOptions.selectedItem = priceOptions.elements[1]?.value;
@@ -157,7 +157,7 @@ export default class Publish3 extends React.Component {
         this.props.postingAd.pricePeriod = null;
       }
 
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         this.props.goToPage(Views.PUBLISH_4);
       } else {
         if (this.props.editingStepOne && this.props.postingAd.subCategoryDetails.filter(function (detail) { return detail.value == "floorType" }).length > 0) {
@@ -385,7 +385,7 @@ export default class Publish3 extends React.Component {
             <View style={commonStyles.buttomButton}>
               <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
                 <Text style={commonStyles.actionButtonText}>
-                  {this.props.postingAd.adId == null || this.props.fullPosting || (this.props.editingStepOne && this.props.postingAd.subCategoryDetails.filter(function (detail) { return detail.value == "floorType" }).length > 0) ?
+                  {this.props.postingAd.id == null || this.props.fullPosting || (this.props.editingStepOne && this.props.postingAd.subCategoryDetails.filter(function (detail) { return detail.value == "floorType" }).length > 0) ?
                     strings('setup.next').toUpperCase()
                     :
                     strings('setup.enregistrer').toUpperCase()}

package/Publish4.js

@@ -3,7 +3,6 @@ import { Text, View, TouchableHighlight, TouchableOpacity, ImageBackground, Dime
 import PopupAdvice from 'muba-popup-advice';
 import { strings } from 'muba-i18n';
 import commonStyles from './commonStyles';
-import { canOpenCamera } from './utils/Common.js';
 import { Views } from './utils/Views';
 import { createIconSetFromFontello } from 'react-native-vector-icons';
 import fontelloConfig from './fonts/config.json';
@@ -47,12 +46,16 @@ export default class Publish4 extends React.Component {
 
   async loadImage(imgUri) {
     if (imgUri) {
+      let fileType = imgUri.substring(imgUri.lastIndexOf('.') + 1).toLowerCase();
+
       const image = {
-        photo: {
-          id: 0,
-          url: { uri: imgUri },
-          extension: imgUri.substring(imgUri.lastIndexOf('.') + 1)
-        }
+        uri: imgUri,
+        name: 'photo_' + this.props.postingAd.images.length + '.' + fileType,
+        type: 'image/' + fileType,
+        mainPicture: this.props.postingAd.images.length === 0,
+        referenceType: 'AD',
+        referenceId: this.props.postingAd.id,
+        extraInfo: this.props.postingAd.images.length
       }
 
       let imagesArray = this.props.postingAd.images;
@@ -70,11 +73,11 @@ export default class Publish4 extends React.Component {
   }
 
   async deleteImage(itemDeleted) {
-    if (itemDeleted.photo.id) {
+    if (itemDeleted.id) {
       if (!this.props.postingAd.deletedPictures) {
         this.props.postingAd.deletedPictures = [];
       }
-      this.props.postingAd.deletedPictures.push(itemDeleted.photo.id);
+      this.props.postingAd.deletedPictures.push(itemDeleted.id);
     }
 
     let filteredArray = this.props.postingAd.images.filter(item => item !== itemDeleted);
@@ -90,15 +93,22 @@ export default class Publish4 extends React.Component {
     let imagesArray = this.props.postingAd.images.slice();
 
     for (let imageObject of imagesArray) {
-      imageObject.photo.mainPicture = false;
+      imageObject.mainPicture = false;
 
-      if (imageObject.photo.url === itemSelected.photo.url) {
-        imageObject.photo.mainPicture = true;
-        this.props.postingAd.images.splice(this.props.postingAd.images.indexOf(imageObject), 1);
-        this.props.postingAd.images.splice(0, 0, imageObject);
+      if (imageObject.uri === itemSelected.uri) {
+        imageObject.mainPicture = true;
+        imagesArray.splice(imagesArray.indexOf(imageObject), 1);
+        imagesArray.splice(0, 0, imageObject);
       }
     }
+    let index = 0;
+    for (let imageObject of imagesArray) {
+      imageObject.name = 'photo_' + index + (imageObject.id ? '_' + imageObject.id : '') + imageObject.name.substring(imageObject.name.indexOf('.'));
+      imageObject.extraInfo = index;
+      ++index;
+    }
 
+    this.props.postingAd.images = imagesArray;
     this.setState({ updateMainPhoto: true });
   }
 
@@ -107,8 +117,7 @@ export default class Publish4 extends React.Component {
       this.setState({ showErrorNoSelectedImages: true });
     } else {
       this.setState({ showErrorNoSelectedImages: false });
-
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         if (this.props.postingAd.subCategoryDetails.filter(function (detail) { return detail.value == "floorType" }).length > 0) {
           this.props.goToPage(Views.PUBLISH_5);
         } else {
@@ -160,14 +169,14 @@ export default class Publish4 extends React.Component {
                     }
                     {this.props.postingAd.images.map((item, index) => {
                       return (
-                        <ImageBackground style={[commonStyles.photoBox, commonStyles.photoBoxImage]} source={item.photo.url} borderRadius={10} key={index}>
+                        <ImageBackground style={[commonStyles.photoBox, commonStyles.photoBoxImage]} source={{ uri: item.uri }} borderRadius={10} key={index}>
                           <ImageBackground style={[commonStyles.photoControls, commonStyles.row]} source={require('./assets/images/bg-shadow.png')} resizeMode='stretch' borderRadius={1.5}>
 
                             <TouchableHighlight style={commonStyles.leftIcon} onPress={() => this.deleteImage(item)}>
                               <FontAwesomeIcon style={commonStyles.whiteIcon} name="cancel-circled" />
                             </TouchableHighlight>
                             <TouchableHighlight style={commonStyles.rightIcon} onPress={() => this.selectMainPhoto(item)}>
-                              <FontAwesomeIcon style={[commonStyles.heartIcon, item.photo.mainPicture ? '' : commonStyles.whiteIcon]} name={item.photo.mainPicture ? 'heart' : 'heart-empty'} />
+                              <FontAwesomeIcon style={[commonStyles.heartIcon, item.mainPicture ? '' : commonStyles.whiteIcon]} name={item.mainPicture ? 'heart' : 'heart-empty'} />
                             </TouchableHighlight>
 
                           </ImageBackground>
@@ -186,7 +195,7 @@ export default class Publish4 extends React.Component {
             </View>
             <View style={commonStyles.buttomButton}>
               <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
-                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.adId == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
+                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.id == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
               </TouchableHighlight>
             </View>
 

package/Publish5.js

@@ -124,7 +124,7 @@ export default class Publish5 extends React.Component {
 
   nextStep() {
     if (this.validateForm()) {
-      if (this.props.postingAd.adId == null || this.props.fullPosting) {
+      if (this.props.postingAd.id == null || this.props.fullPosting) {
         this.props.goToPage(Views.PUBLISH_6);
       } else {
         this.props.saveEditAd();
@@ -464,7 +464,7 @@ export default class Publish5 extends React.Component {
             <View style={commonStyles.buttomButton}>
               <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={() => this.nextStep()}>
                 <Text style={commonStyles.actionButtonText}>
-                  {this.props.postingAd.adId == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}
+                  {this.props.postingAd.id == null || this.props.fullPosting ? strings('setup.next').toUpperCase() : strings('setup.enregistrer').toUpperCase()}
                 </Text>
               </TouchableHighlight>
             </View>

package/Publish6.js

@@ -8,10 +8,10 @@ import PopupAdvice from 'muba-popup-advice';
 import { createIconSetFromFontello } from 'react-native-vector-icons';
 import fontelloConfig from './fonts/config.json';
 const FontAwesomeIcon = createIconSetFromFontello(fontelloConfig);
-const GET_GENERATE_TITLE_DESCRIPTION = '/api/posting/GetGeneratedAdTitleDescription';
-const GET_PHONE_REGISTERED = '/api/posting/GetPhoneRegistered';
+
+const GENERATE_TITLE_DESCRIPTION = { method: 'POST', url: '/controller/generate-title-description' };
+const PHONE_REGISTERED = { method: 'GET', url: '/controller/phone-registered' };
 const window = Dimensions.get('window');
-const OK_MESSAGE = 'ok';
 const PHONE_SEPARATOR = '###';
 
 let submitClicked;
@@ -74,10 +74,11 @@ export default class Publish6 extends React.Component {
       this.props.postingAd.languages[0].description === undefined || this.props.postingAd.languages[0].description === null) {
 
       this.props.showLoading();
+      const ad = { ...this.props.postingAd };
+      delete ad.images;
+      const responseJson = await this.props.request(this.props.context, GENERATE_TITLE_DESCRIPTION, ad);
 
-      const responseJson = await this.props.request(this.props.context, GET_GENERATE_TITLE_DESCRIPTION, this.props.postingAd);
-
-      if (responseJson.success) {
+      if (responseJson?.status === 200) {
         if (this.props.postingAd.languages[0].title === undefined || this.props.postingAd.languages[0].title === null) {
           this.props.postingAd.languages[0].title = responseJson.title;
         }
@@ -92,6 +93,7 @@ export default class Publish6 extends React.Component {
     } else {
       this.setState({ titleDescriptionLoaded: true });
     }
+    this.props.hideLoading();
   }
 
   async nextStep() {
@@ -117,19 +119,17 @@ export default class Publish6 extends React.Component {
       const phones = this.props.postingAd.phones.join(PHONE_SEPARATOR);
 
       const body = {
-        adId: this.props.postingAd.adId,
+        adId: this.props.postingAd.id,
         userId: this.props.postingAd.userId,
-        phone: phones
+        phones: phones
       };
 
+
       this.setState({ loading: true });
 
-      const responseJson = await this.props.request(this.props.context, GET_PHONE_REGISTERED, body);
-      if (responseJson.success) {
-        const phoneFree = (responseJson.responseStatus === OK_MESSAGE);
-        validate = phoneFree && validate;
-        this.setState({ existingPhoneError: !phoneFree });
-      }
+      const phoneFree = await this.props.request(this.props.context, PHONE_REGISTERED, body);
+      validate = phoneFree && validate;
+      this.setState({ existingPhoneError: !phoneFree });
 
       this.languageItem.forEach(element => validate = element.validateLanguageItem() && validate);
     }
@@ -228,7 +228,7 @@ export default class Publish6 extends React.Component {
                 <Text style={commonStyles.legalNoteText}>{strings('setup.legalNote')}</Text>
               </View>
               <TouchableHighlight style={commonStyles.actionButton} underlayColor="#ff5d00" onPress={async () => this.nextStep()}>
-                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.adId == null || this.props.fullPosting ? strings('setup.publish').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
+                <Text style={commonStyles.actionButtonText}>{this.props.postingAd.id == null || this.props.fullPosting ? strings('setup.publish').toUpperCase() : strings('setup.enregistrer').toUpperCase()}</Text>
               </TouchableHighlight>
             </View>
             <PopupAdvice width={0.9} dialogStyle={commonStyles.popupBox} ref={(popupShowAdvice) => { this.popupShowAdvice = popupShowAdvice; }}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "muba-posting",
-  "version": "4.0.5",
+  "version": "4.1.0",
   "description": "Posting",
   "main": "Posting.js",
   "scripts": {
@@ -18,7 +18,6 @@
   "homepage": "https://github.com/Mubawab/muba-posting#readme",
   "dependencies": {
     "@react-native-async-storage/async-storage": "~1.15.0",
-    "expo-image-manipulator": "~10.2.0",
     "muba-custom-scroll-view": "4",
     "muba-display-price": "4",
     "muba-font": "4",

package/shared/PercentageCircle.js

@@ -1,177 +0,0 @@
-/** React Native Percentage Circle
- ** @github  https://github.com/JackPu/react-native-percentage-circle
- ** React Native Version >=0.25
- ** to fixed react native version
- **/
-
-import React, { Component } from 'react';
-import {
-  StyleSheet,
-  View,
-  Text,
-} from 'react-native';
-
-const styles = StyleSheet.create({
-  circle: {
-    overflow: 'hidden',
-    position: 'relative',
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: '#e3e3e3',
-  },
-  leftWrap: {
-    overflow: 'hidden',
-    position: 'absolute',
-    top: 0,
-  },
-  rightWrap: {
-    position: 'absolute',
-
-  },
-
-  loader: {
-    position: 'absolute',
-    left: 0,
-    top: 0,
-    borderRadius: 1000,
-
-  },
-
-  innerCircle: {
-    overflow: 'hidden',
-    position: 'relative',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  text: {
-    fontSize: 11,
-    color: '#888',
-  },
-});
-
-class PercentageCircle extends Component {
-  constructor(props) {
-    super(props);
-    let percent = this.props.percent;
-    let leftTransformerDegree = '0deg';
-    let rightTransformerDegree = '0deg';
-    if (percent >= 50) {
-      rightTransformerDegree = '180deg';
-      leftTransformerDegree = (percent - 50) * 3.6 + 'deg';
-    } else {
-      rightTransformerDegree = percent * 3.6 + 'deg';
-      leftTransformerDegree = '180deg';
-    }
-
-    this.state = {
-      percent: this.props.percent,
-      borderWidth: this.props.borderWidth < 2 || !this.props.borderWidth ? 2 : this.props.borderWidth,
-      leftTransformerDegree: leftTransformerDegree,
-      rightTransformerDegree: rightTransformerDegree,
-      textStyle: this.props.textStyle ? this.props.textStyle : null
-    };
-  }
-
-  componentDidUpdate = (prevProps) => {
-    if (prevProps.percent !== this.props.percent) {
-      const percent = this.props.percent;
-      let leftTransformerDegree = '0deg';
-      let rightTransformerDegree = '0deg';
-      if (percent >= 50) {
-        rightTransformerDegree = '180deg';
-        leftTransformerDegree = (percent - 50) * 3.6 + 'deg';
-      } else {
-        rightTransformerDegree = percent * 3.6 + 'deg';
-        leftTransformerDegree = "180deg";
-      }
-      this.setState({
-        percent: percent,
-        borderWidth: this.props.borderWidth < 2 || !this.props.borderWidth ? 2 : this.props.borderWidth,
-        leftTransformerDegree: leftTransformerDegree,
-        rightTransformerDegree: rightTransformerDegree
-      });
-    }
-  }
-
-  render() {
-    if (this.props.disabled) {
-      return (
-        <View style={[styles.circle, {
-          width: this.props.radius * 2,
-          height: this.props.radius * 2,
-          borderRadius: this.props.radius
-        }]}>
-          <Text style={styles.text}>{this.props.disabledText}</Text>
-        </View>
-      );
-    }
-    return (
-      <View style={[styles.circle, {
-        width: this.props.radius * 2,
-        height: this.props.radius * 2,
-        borderRadius: this.props.radius,
-        backgroundColor: this.props.bgcolor
-      }]}>
-        <View style={[styles.leftWrap, {
-          left: this.props.radius,
-          width: this.props.radius,
-          height: this.props.radius * 2,
-        }]}>
-          <View style={[styles.loader, {
-            left: -this.props.radius,
-            width: this.props.radius,
-            height: this.props.radius * 2,
-            borderTopRightRadius: 0,
-            borderBottomRightRadius: 0,
-            backgroundColor: this.props.color,
-            transform: [{ translateX: this.props.radius / 2 }, { rotate: this.state.rightTransformerDegree }, { translateX: -this.props.radius / 2 }],
-          }]}></View>
-        </View>
-
-
-        <View style={[styles.leftWrap, {
-          width: this.props.radius,
-          height: this.props.radius * 2,
-          left: 0,
-        }]}>
-          <View style={[styles.loader, {
-            left: this.props.radius,
-            width: this.props.radius,
-            height: this.props.radius * 2,
-            borderTopLeftRadius: 0,
-            borderBottomLeftRadius: 0,
-            backgroundColor: this.props.percent >= 50 ? this.props.color : this.props.bgcolor,    // changed this line
-            transform: [{ translateX: -this.props.radius / 2 }, { rotate: this.state.leftTransformerDegree }, { translateX: this.props.radius / 2 }],
-          }]}></View>
-        </View>
-
-
-
-
-
-
-
-
-
-        <View style={[styles.innerCircle, {
-          width: (this.props.radius - this.state.borderWidth) * 2,
-          height: (this.props.radius - this.state.borderWidth) * 2,
-          borderRadius: this.props.radius - this.state.borderWidth,
-          backgroundColor: this.props.innerColor,
-        }]}>
-          {this.props.children ? this.props.children :
-            <Text style={[styles.text, this.state.textStyle]}>{this.props.percent}%</Text>}
-        </View>
-
-      </View>
-    );
-  }
-}
-
-// set some attributes default value
-PercentageCircle.defaultProps = {
-  bgcolor: '#e3e3e3',
-  innerColor: '#fff'
-};
-
-module.exports = PercentageCircle;

package/shared/ProgressBar.js

@@ -1,43 +0,0 @@
-import React from 'react';
-import { StyleSheet, View, Modal, Text, ActivityIndicator } from 'react-native';
-import PercentageCircle from './PercentageCircle.js';
-import { isRTL } from 'muba-i18n';
-import commonStyles from '../commonStyles';
-
-const ProgressBar = props => {
-  const {
-    loading,
-    progress,
-    ...attributes
-  } = props;
-
-  return (
-    <Modal transparent={true} animationType={'none'} visible={loading}>
-      <View style={styles.modalBackground}>
-        {isRTL() ?
-          <View>
-            <ActivityIndicator size="large" color="#ffffff" />
-            <Text style={[commonStyles.percentage]}>{progress} %</Text>
-          </View>
-          :
-          <PercentageCircle radius={50} percent={progress} color={"#00afca"} borderWidth={5} textStyle={{ fontSize: 22, fontFamily: 'PostingSemiBold', color: '#00afca', alignSelf: 'center' }}></PercentageCircle>
-        }
-        <View>
-          {props.children}
-        </View>
-      </View>
-    </Modal>
-  )
-}
-
-const styles = StyleSheet.create({
-  modalBackground: {
-    flex: 1,
-    alignItems: 'center',
-    flexDirection: 'column',
-    justifyContent: 'center',
-    backgroundColor: '#00000080'
-  }
-});
-
-export default ProgressBar;