@plusscommunities/pluss-core-app 6.0.8-auth.0 → 6.0.8-beta.0

package/src/apis/fileActions.js

@@ -1,34 +1,41 @@
-import Axios from 'axios';
+import mime from 'mime-types';
+import { Storage } from 'aws-amplify';
 import { getUrl, generateImageName, randomString } from '../helper';
 import { authedFunction } from '../session';
+import Config from '../config';
 
 export const fileActions = {
-  getPresignedUrl: async (filename, contentType) => {
-    // const newFilename = filename.replace(/[^a-z0-9+.]+/gi, '').toLowerCase();
-    const signedUrlRes = await authedFunction({
-      method: 'GET',
-      url: getUrl('media', 'get/presignedurl', { filename, contentType }),
-    });
-    return signedUrlRes.data;
-  },
   getUploadUrl: (userId, fileName) => {
     const newFilename = fileName.replace(/[^a-z0-9+.]+/gi, '').toLowerCase();
     return `uploads/users/${userId}/public/${randomString()}/${newFilename}`;
   },
-  uploadUserMediaWithProgress: async (blob, url, progressCallback = null) => {
-    return fileActions.uploadBlobAWS(url, blob, progressCallback);
+  uploadUserMediaWithProgress: async (imageUri, url, progressCallback = null) => {
+    const blob = await fileActions.imageToBlob(imageUri);
+    return fileActions.uploadBlobAWS(Config.env.awsUploadsBucket, url, blob, '', progressCallback);
   },
+  // uploadUserMedia: async (userId, image, fileName) => {
+  //   const blob = await fileActions.imageToBlob(image.uri);
+  //   const url = fileActions.getUploadUrl(userId, fileName);
+  //   return fileActions.uploadBlobAWS(Config.env.awsUploadsBucket, url, blob);
+  // },
+  // uploadSignatureImage: async (image, name) => {
+  //   const blob = await fileActions.imageToBlob(image);
+  //   const newImageName = generateImageName(name, 'signature.png');
+  //   return fileActions.uploadBlobAWS(Config.env.awsStorageBucket, newImageName, blob, 'images/');
+  // },
   imageToBlob: async imageUri => {
     const response = await fetch(imageUri);
     return response.blob();
   },
-  uploadBlobAWS: async (uri, blob, progressCallback = null) => {
-    return Axios.put(uri, blob, {
-      headers: {
-        'Content-Type': blob.type,
-      },
-      transformRequest: d => d,
-      onUploadProgress: progress =>
+  uploadBlobAWS: (bucket, uri, blob, prefix = '', progressCallback = null) => {
+    const imageName = prefix ? uri.replace(/^.*[\\/]/, '') : uri;
+    const fileType = mime.lookup(uri);
+    const access = {
+      level: 'public',
+      bucket,
+      contentType: fileType,
+      customPrefix: { public: '' },
+      progressCallback: progress =>
         progressCallback &&
         progressCallback({
           uri,
@@ -36,7 +43,8 @@ export const fileActions = {
           total: progress.total,
           percentage: `${Math.floor((progress.loaded / progress.total) * 100)}%`,
         }),
-    });
+    };
+    return Storage.put(`${prefix}${imageName}`, blob, access);
   },
   getStockPhotos: async () => {
     const response = await authedFunction({

package/src/components/CommentSection.js

@@ -416,7 +416,7 @@ class CommentSection extends Component {
       content = (
         <View style={styles.multiReplyContainer}>
           {profilePics.map((c, i) => {
-            return <ProfilePic style={{ marginRight: -10 }} Diameter={20} ProfilePic={c.User.profilePic} />;
+            return <ProfilePic key={c.Id} style={{ marginRight: -10 }} Diameter={20} ProfilePic={c.User.profilePic} />;
           })}
           <Text style={[styles.commentRepliesText, { marginLeft: 20, color: this.props.colourBrandingMain }]}>{`${
             threadComments.length

package/src/components/Forbidden.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import _ from 'lodash';
+import { View } from 'react-native';
+import { TextStyle } from './TextStyle';
+import { getMainBrandingColourFromState } from '../colours';
+import { InlineButton } from './InlineButton';
+import { Services } from '../config';
+import { connect } from 'react-redux';
+import Header from './Header';
+
+const Forbidden = ({ colourBrandingMain, title, description }) => {
+  const goBack = () => {
+    Services.navigation.goBack();
+  };
+
+  return (
+    <View
+      style={{
+        flex: 1,
+        backgroundColor: '#fff',
+      }}
+    >
+      <Header leftIcon="angle-left" onPressLeft={goBack} />
+      <View
+        style={{
+          padding: 16,
+        }}
+      >
+        <TextStyle type="pageHeading" style={{ color: colourBrandingMain }}>
+          {!_.isEmpty(title) ? title : 'Oops!'}
+        </TextStyle>
+        <TextStyle type="body" style={{ marginTop: 10 }}>
+          {!_.isEmpty(description)
+            ? description
+            : 'It seems this item is no longer accessible. It may have been removed or your access might have changed.'}
+        </TextStyle>
+        <View style={{ marginTop: 20 }}>
+          <InlineButton onPress={goBack} color={colourBrandingMain}>
+            Go back
+          </InlineButton>
+        </View>
+      </View>
+    </View>
+  );
+};
+
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: getMainBrandingColourFromState(state),
+  };
+};
+
+const forbidden = connect(mapStateToProps, {}, null, { forwardRef: true })(Forbidden);
+export { forbidden as Forbidden };

package/src/components/ImageUploader.js

@@ -142,25 +142,23 @@ class ImageUploader extends Component {
     let uploadUri;
     try {
       const fileName = `${getValueOrDefault(this.props.fileName, DEFAULT_IMAGE_NAME)}.${DEFULAT_IMAGE_TYPE}`;
+      uploadUri = fileActions.getUploadUrl(this.props.userId, fileName);
 
+      this.props.onUploadStarted(uploadUri, imageUri);
       this.hideUploadMenu();
 
       const resized = await this.resizeImageAsync(imageUri);
-      const blob = await fileActions.imageToBlob(resized.uri);
-      const presignedUriRes = await fileActions.getPresignedUrl(_.last(resized.uri.split('/')), blob.type);
-      uploadUri = presignedUriRes.key;
-      this.props.onUploadStarted(uploadUri, imageUri);
       if (this.props.onlySelectImage) {
         this.props.onImageSelected(resized, fileName);
         return;
       }
 
-      const uploadResult = await fileActions.uploadUserMediaWithProgress(blob, presignedUriRes.url, progress => {
+      const res = await fileActions.uploadUserMediaWithProgress(resized.uri, uploadUri, progress => {
         if (this.props.onUploadProgress) this.props.onUploadProgress(progress);
       });
 
-      this.props.onUploadSuccess(Config.env.baseUploadsUrl + uploadUri, uploadUri);
-      console.log('upload success', Config.env.baseUploadsUrl + uploadUri);
+      this.props.onUploadSuccess(Config.env.baseUploadsUrl + res.key, uploadUri);
+      console.log('upload success', Config.env.baseUploadsUrl + res.key);
     } catch (e) {
       console.log('handleImagePicked error', e);
       this.props.onUploadFailed(uploadUri);
@@ -172,6 +170,7 @@ class ImageUploader extends Component {
     const imagesUploaded = imagesSelected.map(image => {
       const fileName = `${getValueOrDefault(this.props.fileName, DEFAULT_IMAGE_NAME)}.${DEFULAT_IMAGE_TYPE}`;
       const uploadUri = fileActions.getUploadUrl(this.props.userId, fileName);
+      if (!this.props.onlySelectImage) this.props.onUploadStarted(uploadUri, image.uri);
       return { imageUri: image.uri, uploadUri, fileName };
     });
     this.hideUploadMenu();
@@ -182,21 +181,16 @@ class ImageUploader extends Component {
       const { imageUri, uploadUri, fileName } = image;
       try {
         const resized = await this.resizeImageAsync(imageUri);
-        const blob = await fileActions.imageToBlob(resized.uri);
         if (this.props.onlySelectImage) {
           this.props.onImageSelected(resized, fileName);
           return;
         }
-        const presignedUriRes = await fileActions.getPresignedUrl(_.last(resized.uri.split('/')), blob.type);
-        const uploadUri = presignedUriRes.key;
-        if (!this.props.onlySelectImage) this.props.onUploadStarted(uploadUri, imageUri);
 
-        const uploadResult = await fileActions.uploadUserMediaWithProgress(blob, presignedUriRes.url, progress => {
+        const res = await fileActions.uploadUserMediaWithProgress(resized.uri, uploadUri, progress => {
           if (this.props.onUploadProgress) this.props.onUploadProgress(progress);
         });
-
-        this.props.onUploadSuccess(Config.env.baseUploadsUrl + uploadUri, uploadUri);
-        console.log('upload success', Config.env.baseUploadsUrl + uploadUri);
+        this.props.onUploadSuccess(Config.env.baseUploadsUrl + res.key, uploadUri);
+        console.log('upload success', Config.env.baseUploadsUrl + res.key);
       } catch (e) {
         console.log('handleMultiImagePicked error', e);
         this.props.onUploadFailed(uploadUri);
@@ -209,19 +203,17 @@ class ImageUploader extends Component {
     try {
       const fileType = uri.substring(uri.lastIndexOf('.') + 1);
       const fileName = `${getValueOrDefault(this.props.fileName, DEFAULT_VIDEO_NAME)}.${fileType}`;
-      const blob = await fileActions.imageToBlob(uri);
-      const presignedUriRes = await fileActions.getPresignedUrl(fileName, blob.type);
-      uploadUri = presignedUriRes.key;
+      uploadUri = fileActions.getUploadUrl(this.props.userId, fileName);
 
       this.props.onUploadStarted(uploadUri, uri);
       this.hideUploadMenu();
 
-      const uploadResult = await fileActions.uploadUserMediaWithProgress(blob, presignedUriRes.url, progress => {
+      const res = await fileActions.uploadUserMediaWithProgress(uri, uploadUri, progress => {
         if (this.props.onUploadProgress) this.props.onUploadProgress(progress);
       });
 
-      this.props.onUploadSuccess(Config.env.baseUploadsUrl + uploadUri, uploadUri);
-      console.log('upload success', Config.env.baseUploadsUrl + uploadUri);
+      this.props.onUploadSuccess(Config.env.baseUploadsUrl + res.key, uploadUri);
+      console.log('upload success', Config.env.baseUploadsUrl + res.key);
     } catch (e) {
       console.log('handleVideoPicked error', e);
       this.props.onUploadFailed(uploadUri);
@@ -264,7 +256,7 @@ class ImageUploader extends Component {
   askPermissionsAsync = async () => {
     const cameraPermission = await Camera.requestCameraPermissionsAsync();
     const rollPermission = await MediaLibrary.requestPermissionsAsync();
-    if (cameraPermission.status !== 'granted' || rollPermission.status !== 'granted') {
+    if (cameraPermission.status !== 'granted' || (Platform.OS === 'ios' && rollPermission.status !== 'granted')) {
       this.showWarningPopup(cameraPermission.status !== 'granted', rollPermission.status !== 'granted');
       return false;
     }
@@ -274,7 +266,6 @@ class ImageUploader extends Component {
   };
 
   isEditingEnabled = () => {
-    return false;
     return !this.props.multiple && !this.props.allowVideo && getValueOrDefault(this.props.allowsEditing, DEFAULT_ALLOWS_EDITING);
   };
 
@@ -323,6 +314,24 @@ class ImageUploader extends Component {
   };
 
   openPhotos = async () => {
+    if (Platform.OS === 'android') {
+      const result = await ImagePicker.launchImageLibraryAsync({
+        allowsEditing: this.isEditingEnabled(),
+        aspect: getValueOrDefault(this.props.aspect, DEFAULT_ASPECT),
+        exif: getValueOrDefault(this.props.exif, DEFAULT_EXIF),
+        mediaTypes: this.props.allowVideo ? ImagePicker.MediaTypeOptions.All : ImagePicker.MediaTypeOptions.Images,
+      });
+      if (!result.cancelled) {
+        if (result.assets.length === 1 && result.assets[0].type === 'video') {
+          this.handleVideoPicked(result.assets[0].uri);
+        } else {
+          this.handleMultiImagePicked(result.assets);
+        }
+      }
+      return;
+    }
+
+    // iOS behaviour
     if (!(await this.askPermissionsAsync())) return;
 
     this.setState({
@@ -381,7 +390,6 @@ class ImageUploader extends Component {
       } else {
         if (mediaSelected[0].mediaType === MediaLibrary.MediaType.video) {
           const uri = mediaSelected[0].localUri || mediaSelected[0].uri;
-          console.log('picked a video');
           this.handleVideoPicked(uri);
         } else {
           this.handleMultiImagePicked(mediaSelected);

package/src/components/MediaPlayer.js

@@ -1,12 +1,9 @@
 import React, { Component } from 'react';
-import { Platform, View, StyleSheet, Dimensions } from 'react-native';
-import * as ScreenOrientation from 'expo-screen-orientation';
-import { DeviceMotion } from 'expo-sensors';
+import { View, StyleSheet, Dimensions } from 'react-native';
 import YoutubePlayer, { getYoutubeMeta } from 'react-native-youtube-iframe';
 import { Vimeo } from 'react-native-vimeo-iframe';
 import { WebView } from 'react-native-webview';
 import { Video } from 'expo-av';
-import VideoPlayer from 'expo-video-player';
 import { Spinner } from './Spinner';
 
 const SCREEN_HEIGHT = Dimensions.get('window').height;
@@ -40,20 +37,10 @@ class MediaPlayer extends Component {
 
   componentDidMount = async () => {
     await this.setupForPlaying();
-
-    ScreenOrientation.lockAsync(Platform.OS === 'ios' ? ScreenOrientation.OrientationLock.DEFAULT : ScreenOrientation.OrientationLock.ALL);
-    const motionAvailalble = await DeviceMotion.isAvailableAsync();
-    // console.log('motionAvailalble', motionAvailalble);
-    if (motionAvailalble) {
-      DeviceMotion.setUpdateInterval(500);
-      DeviceMotion.addListener(this.onMotionChange);
-    }
   };
 
   componentWillUnmount = () => {
     if (this.checkStreamLoaded) clearInterval(this.checkStreamLoaded);
-    DeviceMotion.removeAllListeners();
-    ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.PORTRAIT_UP);
   };
 
   getYoutubeVideoId = url => {
@@ -292,20 +279,20 @@ class MediaPlayer extends Component {
     />
   );
 
-  getVideoPlayer = (embedUrl, width, height, autoPlay) => (
-    <VideoPlayer
-      videoProps={{
-        shouldPlay: autoPlay,
-        resizeMode: Video.RESIZE_MODE_CONTAIN,
-        source: { uri: embedUrl },
-      }}
-      showFullscreenButton={false}
-      errorCallback={this.onVideoPlayError}
-      playbackCallback={this.onVideoPlayStatusUpdate}
-      height={height}
-      width={width}
-    />
-  );
+  // getVideoPlayer = (embedUrl, width, height, autoPlay) => (
+  //   <VideoPlayer
+  //     videoProps={{
+  //       shouldPlay: autoPlay,
+  //       resizeMode: Video.RESIZE_MODE_CONTAIN,
+  //       source: { uri: embedUrl },
+  //     }}
+  //     showFullscreenButton={false}
+  //     errorCallback={this.onVideoPlayError}
+  //     playbackCallback={this.onVideoPlayStatusUpdate}
+  //     height={height}
+  //     width={width}
+  //   />
+  // );
 
   render() {
     let width, height;
@@ -351,7 +338,7 @@ class MediaPlayer extends Component {
       } else if (useVideoPlayer) {
         embedUrl = source;
         // console.log('getVideoPlayer', embedUrl, width, height, autoPlay);
-        player = this.getVideoPlayer(embedUrl, width, height, autoPlay);
+        player = this.getStreamPlayer(embedUrl, width, height, autoPlay);
       }
     }
     if (!player && isUrlLink) {

package/src/components/TickIcon.js

@@ -0,0 +1,25 @@
+import React, { PureComponent } from 'react';
+import { View } from 'react-native';
+import stylez from '../styles';
+import { Pl60Icon } from '../fonts';
+
+class TickIcon extends PureComponent {
+  render() {
+    const size = this.props.diameter || 20;
+    const radius = size / 2;
+    return (
+      <View
+        style={[
+          stylez.tickBox,
+          { height: size, width: size, borderRadius: radius },
+          this.props.color && { backgroundColor: this.props.color },
+          this.props.style,
+        ]}
+      >
+        <Pl60Icon name="tick" style={stylez.tickIcon} />
+      </View>
+    );
+  }
+}
+
+export { TickIcon };

package/src/components/index.js

@@ -1,5 +1,6 @@
 export * from './InlineButton';
 export * from './AddToCalendarButton';
+export * from './Forbidden';
 export * from './FormCard';
 export * from './FormCardSection';
 export * from './FormCardSectionOptionLauncher';
@@ -23,6 +24,7 @@ export * from './GenericInput';
 export * from './RadioButton';
 export * from './PDFPopup';
 export * from './TextStyle';
+export * from './TickIcon';
 export * from './Toggle';
 export * from './Input';
 export * from './StickyFooter';

package/src/config.js

@@ -18,11 +18,6 @@ const CoreConfig = {
     strings: {},
     newEventDefaults: '',
     defaultAllowComments: true,
-    AuthStrategy: {
-      getAccessToken: async () => null,
-      getCurrentUserId: async () => null,
-      hasActiveSession: async () => false,
-    },
   },
   init: (environment, navigation) => {
     CoreConfig.env = environment;

package/src/helper.js

@@ -256,6 +256,18 @@ const getPluralOptions = (count, singular, plural) => {
   return plural;
 };
 
+const isEmail = email => {
+  if (_.isEmpty(email)) {
+    return false;
+  }
+  const atpos = email.indexOf('@');
+  const dotpos = email.lastIndexOf('.');
+  if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= email.length) {
+    return false;
+  }
+  return true;
+};
+
 const randomString = (name = '') => {
   return `xxxxxxxx4xxxyxxxxxxxxxxxxx${name}`.replace(/[xy]/g, c => {
     // eslint-disable-next-line
@@ -469,6 +481,7 @@ export {
   imageExists,
   getPluralS,
   getPluralOptions,
+  isEmail,
   formatTime,
   minutesToString,
   randomString,

package/src/session.js

@@ -1,10 +1,10 @@
 import _ from 'lodash';
 import axios from 'axios';
 import { Auth } from 'aws-amplify';
-import Config from './config';
 
 export const getSessionTokenAWS = async prefix => {
-  const token = await Config.env.AuthStrategy.getAccessToken();
+  const data = await Auth.currentSession();
+  const token = data.accessToken.jwtToken;
   if (_.isUndefined(prefix)) return token;
   return `${prefix} ${token}`;
 };