From 5ea750599d08229d4b5b10d0e724ca14c73735f5 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Mon, 28 Nov 2022 16:46:58 +0000
Subject: upload images in composer v1

---
 src/view/com/composer/ComposePost.tsx | 181 +++++++++++++++++++++++++++++++++-
 1 file changed, 178 insertions(+), 3 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index bb175f166..10305adb6 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -9,10 +9,13 @@ import {
   TextInput,
   TouchableOpacity,
   View,
+  ScrollView,
+  Image,
 } from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {UserAutocompleteViewModel} from '../../../state/models/user-autocomplete-view'
+import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
 import {Autocomplete} from './Autocomplete'
 import Toast from '../util/Toast'
 import ProgressCircle from '../util/ProgressCircle'
@@ -22,6 +25,7 @@ import * as apilib from '../../../state/lib/api'
 import {ComposerOpts} from '../../../state/models/shell-ui'
 import {s, colors, gradients} from '../../lib/styles'
 import {detectLinkables} from '../../../lib/strings'
+import {openPicker, openCamera} from 'react-native-image-crop-picker'
 
 const MAX_TEXT_LENGTH = 256
 const WARNING_TEXT_LENGTH = 200
@@ -40,15 +44,24 @@ export const ComposePost = observer(function ComposePost({
   const [isProcessing, setIsProcessing] = useState(false)
   const [error, setError] = useState('')
   const [text, setText] = useState('')
+  const [photoUris, setPhotoUris] = useState<string[]>([])
   const autocompleteView = useMemo<UserAutocompleteViewModel>(
     () => new UserAutocompleteViewModel(store),
     [],
   )
+  const localPhotos = useMemo<UserLocalPhotosModel>(
+    () => new UserLocalPhotosModel(store),
+    [],
+  )
 
   useEffect(() => {
     autocompleteView.setup()
   })
 
+  useEffect(() => {
+    localPhotos.setup()
+  }, [])
+
   const onChangeText = (newText: string) => {
     setText(newText)
 
@@ -183,12 +196,109 @@ export const ComposePost = observer(function ComposePost({
           multiline
           scrollEnabled
           onChangeText={(text: string) => onChangeText(text)}
-          placeholder={replyTo ? 'Write your reply' : "What's up?"}
+          placeholder={
+            replyTo
+              ? 'Write your reply'
+              : photoUris.length === 0
+              ? "What's up?"
+              : 'Add a comment...'
+          }
           style={styles.textInput}>
           {textDecorated}
         </TextInput>
-        <View
-          style={[s.flexRow, {alignItems: 'center'}, s.pt10, s.pb10, s.pr5]}>
+        {photoUris.length !== 0 && (
+          <View style={styles.selectedImageContainer}>
+            {photoUris.length !== 0 &&
+              photoUris.map(item => (
+                <View
+                  style={[
+                    styles.selectedImage,
+                    photoUris.length === 1
+                      ? styles.selectedImage250
+                      : photoUris.length === 2
+                      ? styles.selectedImage175
+                      : styles.selectedImage85,
+                  ]}>
+                  <TouchableOpacity
+                    onPress={() => {
+                      setPhotoUris(
+                        photoUris.filter(filterItem => filterItem !== item),
+                      )
+                    }}
+                    style={styles.removePhotoButton}>
+                    <FontAwesomeIcon
+                      icon="xmark"
+                      size={16}
+                      style={{color: colors.white}}
+                    />
+                  </TouchableOpacity>
+
+                  <Image
+                    style={[
+                      styles.selectedImage,
+                      photoUris.length === 1
+                        ? styles.selectedImage250
+                        : photoUris.length === 2
+                        ? styles.selectedImage175
+                        : styles.selectedImage85,
+                    ]}
+                    source={{uri: item}}
+                  />
+                </View>
+              ))}
+          </View>
+        )}
+        {localPhotos.photos != null && text === '' && photoUris.length === 0 && (
+          <ScrollView
+            horizontal
+            style={styles.photosContainer}
+            showsHorizontalScrollIndicator={false}>
+            <TouchableOpacity
+              style={[styles.galleryButton, styles.photo]}
+              onPress={() => {
+                openCamera({multiple: true, maxFiles: 4}).then()
+              }}>
+              <FontAwesomeIcon
+                icon="camera"
+                size={24}
+                style={{color: colors.blue3}}
+              />
+            </TouchableOpacity>
+            {localPhotos.photos.map(item => (
+              <TouchableOpacity
+                style={styles.photoButton}
+                onPress={() => {
+                  setPhotoUris([item.node.image.uri, ...photoUris])
+                }}>
+                <Image
+                  style={styles.photo}
+                  source={{uri: item.node.image.uri}}
+                />
+              </TouchableOpacity>
+            ))}
+            <TouchableOpacity
+              style={[styles.galleryButton, styles.photo]}
+              onPress={() => {
+                openPicker({multiple: true, maxFiles: 4}).then(items => {
+                  setPhotoUris([
+                    ...items.reduce(
+                      (accum, cur) => accum.concat(cur.sourceURL!),
+                      [] as string[],
+                    ),
+                    ...photoUris,
+                  ])
+                })
+              }}>
+              <FontAwesomeIcon
+                icon="image"
+                style={{color: colors.blue3}}
+                size={24}
+              />
+            </TouchableOpacity>
+          </ScrollView>
+        )}
+        <View style={styles.separator} />
+        <View style={[s.flexRow, s.pt10, s.pb10, s.pr5, styles.contentCenter]}>
           <View style={s.flex1} />
           <Text style={[s.mr10, {color: progressColor}]}>
             {MAX_TEXT_LENGTH - text.length}
@@ -275,4 +385,69 @@ const styles = StyleSheet.create({
     marginTop: 5,
     marginBottom: 10,
   },
+  contentCenter: {alignItems: 'center'},
+  selectedImageContainer: {
+    flex: 10,
+    flexDirection: 'row',
+  },
+  selectedImage: {
+    borderRadius: 8,
+    margin: 2,
+  },
+  selectedImage250: {
+    width: 250,
+    height: 250,
+  },
+  selectedImage175: {
+    width: 175,
+    height: 175,
+  },
+  selectedImage85: {
+    width: 85,
+    height: 85,
+  },
+  photosContainer: {
+    width: '100%',
+    maxHeight: 96,
+    padding: 8,
+    overflow: 'hidden',
+  },
+  removePhotoButton: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    width: 24,
+    height: 24,
+    borderRadius: 12,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: colors.black,
+    zIndex: 1,
+  },
+  galleryButton: {
+    borderWidth: 1,
+    borderColor: colors.gray3,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  photoButton: {
+    width: 75,
+    height: 75,
+    marginRight: 8,
+    borderWidth: 1,
+    borderRadius: 16,
+    borderColor: colors.gray3,
+  },
+  photo: {
+    width: 75,
+    height: 75,
+    marginRight: 8,
+    borderRadius: 16,
+  },
+  separator: {
+    borderBottomColor: 'black',
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    width: '110%',
+    marginLeft: -16,
+  },
 })
-- 
cgit 1.4.1


From acfdea2518ad047896079b2ab7b716fa9544baee Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 10:59:32 +0000
Subject: reafctor image carousel into new component; fix photo overlapping
 text in composer

---
 ios/app.xcodeproj/project.pbxproj             |  90 ++++++------
 src/view/com/composer/ComposePost.tsx         | 197 ++++----------------------
 src/view/com/composer/PhotoCarouselPicker.tsx | 192 +++++++++++++++++++++++++
 3 files changed, 265 insertions(+), 214 deletions(-)
 create mode 100644 src/view/com/composer/PhotoCarouselPicker.tsx

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/ios/app.xcodeproj/project.pbxproj b/ios/app.xcodeproj/project.pbxproj
index 323cf87b0..f964b1232 100644
--- a/ios/app.xcodeproj/project.pbxproj
+++ b/ios/app.xcodeproj/project.pbxproj
@@ -8,13 +8,13 @@
 
 /* Begin PBXBuildFile section */
 		00E356F31AD99517003FC87E /* appTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* appTests.m */; };
-		03CEA62EF4246066A4356DBF /* libPods-app.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 40C05267EED8EC1DA4212FD4 /* libPods-app.a */; };
 		13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.mm */; };
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
-		64B2214C33449E5F5EB4EA8C /* libPods-app-appTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D5A91013937D8724CBF0A625 /* libPods-app-appTests.a */; };
+		6D37A166CEFC7E8937DE72CB /* libPods-app.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */; };
 		81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
 		E4BBD590292C1F5200296224 /* app.entitlements in Resources */ = {isa = PBXBuildFile; fileRef = E4437C9E28581FA7006DA9E7 /* app.entitlements */; };
+		F19C1FC2EC3C7162CB25E815 /* libPods-app-appTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -31,19 +31,19 @@
 		00E356EE1AD99517003FC87E /* appTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = appTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		00E356F21AD99517003FC87E /* appTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = appTests.m; sourceTree = "<group>"; };
+		0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.debug.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.debug.xcconfig"; sourceTree = "<group>"; };
 		13B07F961A680F5B00A75B9A /* app.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = app.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = app/AppDelegate.h; sourceTree = "<group>"; };
 		13B07FB01A68108700A75B9A /* AppDelegate.mm */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.objcpp; name = AppDelegate.mm; path = app/AppDelegate.mm; sourceTree = "<group>"; };
 		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = app/Images.xcassets; sourceTree = "<group>"; };
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = app/Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = app/main.m; sourceTree = "<group>"; };
-		1F5A3A10A9E763C1649E35A2 /* Pods-app-appTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.release.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.release.xcconfig"; sourceTree = "<group>"; };
-		40C05267EED8EC1DA4212FD4 /* libPods-app.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app.a"; sourceTree = BUILT_PRODUCTS_DIR; };
+		16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app-appTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
+		30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.release.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.release.xcconfig"; sourceTree = "<group>"; };
+		4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.debug.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.debug.xcconfig"; sourceTree = "<group>"; };
+		596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app.a"; sourceTree = BUILT_PRODUCTS_DIR; };
+		685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.release.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.release.xcconfig"; sourceTree = "<group>"; };
 		81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = app/LaunchScreen.storyboard; sourceTree = "<group>"; };
-		9778B24B11B793045DA74F2B /* Pods-app.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.debug.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.debug.xcconfig"; sourceTree = "<group>"; };
-		AA52915648F9E2111DA9ADD8 /* Pods-app.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.release.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.release.xcconfig"; sourceTree = "<group>"; };
-		CC31CE4B797ED8DCD20C1535 /* Pods-app-appTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.debug.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.debug.xcconfig"; sourceTree = "<group>"; };
-		D5A91013937D8724CBF0A625 /* libPods-app-appTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app-appTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
 		E4437C9E28581FA7006DA9E7 /* app.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; name = app.entitlements; path = app/app.entitlements; sourceTree = "<group>"; };
 		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
 /* End PBXFileReference section */
@@ -53,7 +53,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				64B2214C33449E5F5EB4EA8C /* libPods-app-appTests.a in Frameworks */,
+				F19C1FC2EC3C7162CB25E815 /* libPods-app-appTests.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -61,7 +61,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				03CEA62EF4246066A4356DBF /* libPods-app.a in Frameworks */,
+				6D37A166CEFC7E8937DE72CB /* libPods-app.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -103,8 +103,8 @@
 			isa = PBXGroup;
 			children = (
 				ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
-				40C05267EED8EC1DA4212FD4 /* libPods-app.a */,
-				D5A91013937D8724CBF0A625 /* libPods-app-appTests.a */,
+				596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */,
+				16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */,
 			);
 			name = Frameworks;
 			sourceTree = "<group>";
@@ -143,10 +143,10 @@
 		BBD78D7AC51CEA395F1C20DB /* Pods */ = {
 			isa = PBXGroup;
 			children = (
-				9778B24B11B793045DA74F2B /* Pods-app.debug.xcconfig */,
-				AA52915648F9E2111DA9ADD8 /* Pods-app.release.xcconfig */,
-				CC31CE4B797ED8DCD20C1535 /* Pods-app-appTests.debug.xcconfig */,
-				1F5A3A10A9E763C1649E35A2 /* Pods-app-appTests.release.xcconfig */,
+				0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */,
+				30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */,
+				4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */,
+				685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */,
 			);
 			path = Pods;
 			sourceTree = "<group>";
@@ -158,11 +158,11 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "appTests" */;
 			buildPhases = (
-				5D162178C88ED1C10D55B6A4 /* [CP] Check Pods Manifest.lock */,
+				D25A2C8B8B280E54CDBF5192 /* [CP] Check Pods Manifest.lock */,
 				00E356EA1AD99517003FC87E /* Sources */,
 				00E356EB1AD99517003FC87E /* Frameworks */,
 				00E356EC1AD99517003FC87E /* Resources */,
-				431D96626A2B8B60C16D4F56 /* [CP] Copy Pods Resources */,
+				93C4A008E3B1F5BDF90AA282 /* [CP] Copy Pods Resources */,
 			);
 			buildRules = (
 			);
@@ -178,13 +178,13 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "app" */;
 			buildPhases = (
-				467B75E7982670E38F3A3036 /* [CP] Check Pods Manifest.lock */,
+				E5C10128C4EC047B9CD6EEFB /* [CP] Check Pods Manifest.lock */,
 				FD10A7F022414F080027D42C /* Start Packager */,
 				13B07F871A680F5B00A75B9A /* Sources */,
 				13B07F8C1A680F5B00A75B9A /* Frameworks */,
 				13B07F8E1A680F5B00A75B9A /* Resources */,
 				00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
-				55D43DDC59A5C9BA3D615BAB /* [CP] Copy Pods Resources */,
+				29E5C2625DDCB23B01CF3257 /* [CP] Copy Pods Resources */,
 			);
 			buildRules = (
 			);
@@ -266,63 +266,63 @@
 			shellPath = /bin/sh;
 			shellScript = "set -e\n\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n";
 		};
-		431D96626A2B8B60C16D4F56 /* [CP] Copy Pods Resources */ = {
+		29E5C2625DDCB23B01CF3257 /* [CP] Copy Pods Resources */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
 			);
 			inputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources-${CONFIGURATION}-input-files.xcfilelist",
+				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-input-files.xcfilelist",
 			);
 			name = "[CP] Copy Pods Resources";
 			outputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources-${CONFIGURATION}-output-files.xcfilelist",
+				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-output-files.xcfilelist",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources.sh\"\n";
+			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources.sh\"\n";
 			showEnvVarsInLog = 0;
 		};
-		467B75E7982670E38F3A3036 /* [CP] Check Pods Manifest.lock */ = {
+		93C4A008E3B1F5BDF90AA282 /* [CP] Copy Pods Resources */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
 			);
 			inputFileListPaths = (
+				"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources-${CONFIGURATION}-input-files.xcfilelist",
 			);
-			inputPaths = (
-				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
-				"${PODS_ROOT}/Manifest.lock",
-			);
-			name = "[CP] Check Pods Manifest.lock";
+			name = "[CP] Copy Pods Resources";
 			outputFileListPaths = (
-			);
-			outputPaths = (
-				"$(DERIVED_FILE_DIR)/Pods-app-checkManifestLockResult.txt",
+				"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources-${CONFIGURATION}-output-files.xcfilelist",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
+			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources.sh\"\n";
 			showEnvVarsInLog = 0;
 		};
-		55D43DDC59A5C9BA3D615BAB /* [CP] Copy Pods Resources */ = {
+		D25A2C8B8B280E54CDBF5192 /* [CP] Check Pods Manifest.lock */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
 			);
 			inputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-input-files.xcfilelist",
 			);
-			name = "[CP] Copy Pods Resources";
+			inputPaths = (
+				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
+				"${PODS_ROOT}/Manifest.lock",
+			);
+			name = "[CP] Check Pods Manifest.lock";
 			outputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-output-files.xcfilelist",
+			);
+			outputPaths = (
+				"$(DERIVED_FILE_DIR)/Pods-app-appTests-checkManifestLockResult.txt",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources.sh\"\n";
+			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
 			showEnvVarsInLog = 0;
 		};
-		5D162178C88ED1C10D55B6A4 /* [CP] Check Pods Manifest.lock */ = {
+		E5C10128C4EC047B9CD6EEFB /* [CP] Check Pods Manifest.lock */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
@@ -337,7 +337,7 @@
 			outputFileListPaths = (
 			);
 			outputPaths = (
-				"$(DERIVED_FILE_DIR)/Pods-app-appTests-checkManifestLockResult.txt",
+				"$(DERIVED_FILE_DIR)/Pods-app-checkManifestLockResult.txt",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
@@ -396,7 +396,7 @@
 /* Begin XCBuildConfiguration section */
 		00E356F61AD99517003FC87E /* Debug */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = CC31CE4B797ED8DCD20C1535 /* Pods-app-appTests.debug.xcconfig */;
+			baseConfigurationReference = 4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */;
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				BUNDLE_LOADER = "$(TEST_HOST)";
@@ -424,7 +424,7 @@
 		};
 		00E356F71AD99517003FC87E /* Release */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 1F5A3A10A9E763C1649E35A2 /* Pods-app-appTests.release.xcconfig */;
+			baseConfigurationReference = 685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */;
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				BUNDLE_LOADER = "$(TEST_HOST)";
@@ -449,7 +449,7 @@
 		};
 		13B07F941A680F5B00A75B9A /* Debug */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 9778B24B11B793045DA74F2B /* Pods-app.debug.xcconfig */;
+			baseConfigurationReference = 0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
@@ -478,7 +478,7 @@
 		};
 		13B07F951A680F5B00A75B9A /* Release */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = AA52915648F9E2111DA9ADD8 /* Pods-app.release.xcconfig */;
+			baseConfigurationReference = 30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index ce42ee17e..2f8c29e7c 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -9,13 +9,10 @@ import {
   TextInput,
   TouchableOpacity,
   View,
-  ScrollView,
-  Image,
 } from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {UserAutocompleteViewModel} from '../../../state/models/user-autocomplete-view'
-import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
 import {Autocomplete} from './Autocomplete'
 import * as Toast from '../util/Toast'
 import ProgressCircle from '../util/ProgressCircle'
@@ -26,7 +23,8 @@ import * as apilib from '../../../state/lib/api'
 import {ComposerOpts} from '../../../state/models/shell-ui'
 import {s, colors, gradients} from '../../lib/styles'
 import {detectLinkables} from '../../../lib/strings'
-import {openPicker, openCamera} from 'react-native-image-crop-picker'
+import {PhotoCarouselPicker} from './PhotoCarouselPicker'
+import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
 
 const MAX_TEXT_LENGTH = 256
 const DANGER_TEXT_LENGTH = MAX_TEXT_LENGTH
@@ -45,7 +43,8 @@ export const ComposePost = observer(function ComposePost({
   const [isProcessing, setIsProcessing] = useState(false)
   const [error, setError] = useState('')
   const [text, setText] = useState('')
-  const [photoUris, setPhotoUris] = useState<string[]>([])
+  const [selectedPhotos, setSelectedPhotos] = useState<string[]>([])
+
   const autocompleteView = useMemo<UserAutocompleteViewModel>(
     () => new UserAutocompleteViewModel(store),
     [],
@@ -58,6 +57,11 @@ export const ComposePost = observer(function ComposePost({
   useEffect(() => {
     autocompleteView.setup()
   })
+
+  useEffect(() => {
+    localPhotos.setup()
+  }, [])
+
   useEffect(() => {
     // HACK
     // wait a moment before focusing the input to resolve some layout bugs with the keyboard-avoiding-view
@@ -75,10 +79,6 @@ export const ComposePost = observer(function ComposePost({
     }
   }, [textInput.current])
 
-  useEffect(() => {
-    localPhotos.setup()
-  }, [])
-
   const onChangeText = (newText: string) => {
     setText(newText)
 
@@ -207,7 +207,13 @@ export const ComposePost = observer(function ComposePost({
             </View>
           </View>
         ) : undefined}
-        <View style={styles.textInputLayout}>
+        <View
+          style={[
+            styles.textInputLayout,
+            selectedPhotos.length !== 0
+              ? styles.textInputLayoutWithPhoto
+              : styles.textInputLayoutWithoutPhoto,
+          ]}>
           <UserAvatar
             handle={store.me.handle || ''}
             displayName={store.me.displayName}
@@ -223,100 +229,12 @@ export const ComposePost = observer(function ComposePost({
             {textDecorated}
           </TextInput>
         </View>
-        {photoUris.length !== 0 && (
-          <View style={styles.selectedImageContainer}>
-            {photoUris.length !== 0 &&
-              photoUris.map((item, index) => (
-                <View
-                  key={`selected-image-${index}`}
-                  style={[
-                    styles.selectedImage,
-                    photoUris.length === 1
-                      ? styles.selectedImage250
-                      : photoUris.length === 2
-                      ? styles.selectedImage175
-                      : styles.selectedImage85,
-                  ]}>
-                  <TouchableOpacity
-                    onPress={() => {
-                      setPhotoUris(
-                        photoUris.filter(filterItem => filterItem !== item),
-                      )
-                    }}
-                    style={styles.removePhotoButton}>
-                    <FontAwesomeIcon
-                      icon="xmark"
-                      size={16}
-                      style={{color: colors.white}}
-                    />
-                  </TouchableOpacity>
-
-                  <Image
-                    style={[
-                      styles.selectedImage,
-                      photoUris.length === 1
-                        ? styles.selectedImage250
-                        : photoUris.length === 2
-                        ? styles.selectedImage175
-                        : styles.selectedImage85,
-                    ]}
-                    source={{uri: item}}
-                  />
-                </View>
-              ))}
-          </View>
-        )}
-        {localPhotos.photos != null && text === '' && photoUris.length === 0 && (
-          <ScrollView
-            horizontal
-            style={styles.photosContainer}
-            showsHorizontalScrollIndicator={false}>
-            <TouchableOpacity
-              style={[styles.galleryButton, styles.photo]}
-              onPress={() => {
-                openCamera({multiple: true, maxFiles: 4}).then()
-              }}>
-              <FontAwesomeIcon
-                icon="camera"
-                size={24}
-                style={{color: colors.blue3}}
-              />
-            </TouchableOpacity>
-            {localPhotos.photos.map((item, index) => (
-              <TouchableOpacity
-                key={`local-image-${index}`}
-                style={styles.photoButton}
-                onPress={() => {
-                  setPhotoUris([item.node.image.uri, ...photoUris])
-                }}>
-                <Image
-                  style={styles.photo}
-                  source={{uri: item.node.image.uri}}
-                />
-              </TouchableOpacity>
-            ))}
-            <TouchableOpacity
-              style={[styles.galleryButton, styles.photo]}
-              onPress={() => {
-                openPicker({multiple: true, maxFiles: 4}).then(items => {
-                  setPhotoUris([
-                    ...items.reduce(
-                      (accum, cur) => accum.concat(cur.sourceURL!),
-                      [] as string[],
-                    ),
-                    ...photoUris,
-                  ])
-                })
-              }}>
-              <FontAwesomeIcon
-                icon="image"
-                style={{color: colors.blue3}}
-                size={24}
-              />
-            </TouchableOpacity>
-          </ScrollView>
-        )}
-        <View style={styles.separator} />
+        <PhotoCarouselPicker
+          selectedPhotos={selectedPhotos}
+          setSelectedPhotos={setSelectedPhotos}
+          localPhotos={localPhotos}
+          inputText={text}
+        />
         <View style={[s.flexRow, s.pt10, s.pb10, s.pr5, styles.contentCenter]}>
           <View style={s.flex1} />
           <Text style={[s.mr10, {color: progressColor}]}>
@@ -390,9 +308,14 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     marginRight: 5,
   },
+  textInputLayoutWithPhoto: {
+    flexWrap: 'wrap',
+  },
+  textInputLayoutWithoutPhoto: {
+    flex: 1,
+  },
   textInputLayout: {
     flexDirection: 'row',
-    flex: 1,
     borderTopWidth: 1,
     borderTopColor: colors.gray2,
     paddingTop: 16,
@@ -416,68 +339,4 @@ const styles = StyleSheet.create({
     paddingRight: 8,
   },
   contentCenter: {alignItems: 'center'},
-  selectedImageContainer: {
-    flex: 10,
-    flexDirection: 'row',
-  },
-  selectedImage: {
-    borderRadius: 8,
-    margin: 2,
-  },
-  selectedImage250: {
-    width: 250,
-    height: 250,
-  },
-  selectedImage175: {
-    width: 175,
-    height: 175,
-  },
-  selectedImage85: {
-    width: 85,
-    height: 85,
-  },
-  photosContainer: {
-    width: '100%',
-    maxHeight: 96,
-    padding: 8,
-    overflow: 'hidden',
-  },
-  removePhotoButton: {
-    position: 'absolute',
-    top: 8,
-    right: 8,
-    width: 24,
-    height: 24,
-    borderRadius: 12,
-    alignItems: 'center',
-    justifyContent: 'center',
-    backgroundColor: colors.black,
-    zIndex: 1,
-  },
-  galleryButton: {
-    borderWidth: 1,
-    borderColor: colors.gray3,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  photoButton: {
-    width: 75,
-    height: 75,
-    marginRight: 8,
-    borderWidth: 1,
-    borderRadius: 16,
-    borderColor: colors.gray3,
-  },
-  photo: {
-    width: 75,
-    height: 75,
-    marginRight: 8,
-    borderRadius: 16,
-  },
-  separator: {
-    borderBottomColor: 'black',
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    width: '110%',
-    marginLeft: -16,
-  },
 })
diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx
new file mode 100644
index 000000000..f3c3b89c0
--- /dev/null
+++ b/src/view/com/composer/PhotoCarouselPicker.tsx
@@ -0,0 +1,192 @@
+import React from 'react'
+import {
+  Image,
+  StyleSheet,
+  TouchableOpacity,
+  View,
+  ScrollView,
+} from 'react-native'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {colors} from '../../lib/styles'
+import {openPicker, openCamera} from 'react-native-image-crop-picker'
+import {observer} from 'mobx-react-lite'
+
+export const PhotoCarouselPicker = observer(function PhotoCarouselPicker({
+  selectedPhotos,
+  setSelectedPhotos,
+  inputText,
+  localPhotos,
+}: {
+  selectedPhotos: string[]
+  setSelectedPhotos: React.Dispatch<React.SetStateAction<string[]>>
+  inputText: string
+  localPhotos: any
+}) {
+  return (
+    <>
+      {selectedPhotos.length !== 0 && (
+        <View style={styles.selectedImageContainer}>
+          {selectedPhotos.length !== 0 &&
+            selectedPhotos.map((item, index) => (
+              <View
+                key={`selected-image-${index}`}
+                style={[
+                  styles.selectedImage,
+                  selectedPhotos.length === 1
+                    ? styles.selectedImage250
+                    : selectedPhotos.length === 2
+                    ? styles.selectedImage175
+                    : styles.selectedImage85,
+                ]}>
+                <TouchableOpacity
+                  onPress={() => {
+                    setSelectedPhotos(
+                      selectedPhotos.filter(filterItem => filterItem !== item),
+                    )
+                  }}
+                  style={styles.removePhotoButton}>
+                  <FontAwesomeIcon
+                    icon="xmark"
+                    size={16}
+                    style={{color: colors.white}}
+                  />
+                </TouchableOpacity>
+
+                <Image
+                  style={[
+                    styles.selectedImage,
+                    selectedPhotos.length === 1
+                      ? styles.selectedImage250
+                      : selectedPhotos.length === 2
+                      ? styles.selectedImage175
+                      : styles.selectedImage85,
+                  ]}
+                  source={{uri: item}}
+                />
+              </View>
+            ))}
+        </View>
+      )}
+      {localPhotos.photos != null &&
+        inputText === '' &&
+        selectedPhotos.length === 0 && (
+          <ScrollView
+            horizontal
+            style={styles.photosContainer}
+            showsHorizontalScrollIndicator={false}>
+            <TouchableOpacity
+              style={[styles.galleryButton, styles.photo]}
+              onPress={() => {
+                openCamera({multiple: true, maxFiles: 4}).then()
+              }}>
+              <FontAwesomeIcon
+                icon="camera"
+                size={24}
+                style={{color: colors.blue3}}
+              />
+            </TouchableOpacity>
+            {localPhotos.photos.map((item: any, index: number) => (
+              <TouchableOpacity
+                key={`local-image-${index}`}
+                style={styles.photoButton}
+                onPress={() => {
+                  setSelectedPhotos([item.node.image.uri, ...selectedPhotos])
+                }}>
+                <Image
+                  style={styles.photo}
+                  source={{uri: item.node.image.uri}}
+                />
+              </TouchableOpacity>
+            ))}
+            <TouchableOpacity
+              style={[styles.galleryButton, styles.photo]}
+              onPress={() => {
+                openPicker({multiple: true, maxFiles: 4}).then(items => {
+                  setSelectedPhotos([
+                    ...items.reduce(
+                      (accum, cur) => accum.concat(cur.sourceURL!),
+                      [] as string[],
+                    ),
+                    ...selectedPhotos,
+                  ])
+                })
+              }}>
+              <FontAwesomeIcon
+                icon="image"
+                style={{color: colors.blue3}}
+                size={24}
+              />
+            </TouchableOpacity>
+          </ScrollView>
+        )}
+      <View style={styles.separator} />
+    </>
+  )
+})
+
+const styles = StyleSheet.create({
+  selectedImageContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    marginTop: 16,
+  },
+  selectedImage: {
+    borderRadius: 8,
+    margin: 2,
+  },
+  selectedImage250: {
+    width: 250,
+    height: 250,
+  },
+  selectedImage175: {
+    width: 175,
+    height: 175,
+  },
+  selectedImage85: {
+    width: 85,
+    height: 85,
+  },
+  photosContainer: {
+    width: '100%',
+    maxHeight: 96,
+    padding: 8,
+    overflow: 'hidden',
+  },
+  removePhotoButton: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    width: 24,
+    height: 24,
+    borderRadius: 12,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: colors.black,
+    zIndex: 1,
+  },
+  galleryButton: {
+    borderWidth: 1,
+    borderColor: colors.gray3,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  photoButton: {
+    width: 75,
+    height: 75,
+    marginRight: 8,
+    borderWidth: 1,
+    borderRadius: 16,
+    borderColor: colors.gray3,
+  },
+  photo: {
+    width: 75,
+    height: 75,
+    marginRight: 8,
+    borderRadius: 16,
+  },
+  separator: {
+    borderBottomColor: 'black',
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    width: '100%',
+  },
+})
-- 
cgit 1.4.1


From 31be6fbbac5091ebdf1734fecf4eae50d2ad3159 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 15:35:49 +0000
Subject: further refactoring code into different components

---
 src/view/com/composer/ComposePost.tsx         |  27 ++--
 src/view/com/composer/PhotoCarouselPicker.tsx | 191 +++++++-------------------
 src/view/com/composer/SelectedPhoto.tsx       |  83 +++++++++++
 3 files changed, 147 insertions(+), 154 deletions(-)
 create mode 100644 src/view/com/composer/SelectedPhoto.tsx

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index 2f8c29e7c..114586f47 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -23,8 +23,9 @@ import * as apilib from '../../../state/lib/api'
 import {ComposerOpts} from '../../../state/models/shell-ui'
 import {s, colors, gradients} from '../../lib/styles'
 import {detectLinkables} from '../../../lib/strings'
-import {PhotoCarouselPicker} from './PhotoCarouselPicker'
 import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
+import {PhotoCarouselPicker} from './PhotoCarouselPicker'
+import {SelectedPhoto} from './SelectedPhoto'
 
 const MAX_TEXT_LENGTH = 256
 const DANGER_TEXT_LENGTH = MAX_TEXT_LENGTH
@@ -60,7 +61,7 @@ export const ComposePost = observer(function ComposePost({
 
   useEffect(() => {
     localPhotos.setup()
-  }, [])
+  }, [localPhotos])
 
   useEffect(() => {
     // HACK
@@ -130,6 +131,10 @@ export const ComposePost = observer(function ComposePost({
 
   const canPost = text.length <= MAX_TEXT_LENGTH
   const progressColor = text.length > DANGER_TEXT_LENGTH ? '#e60000' : undefined
+  const selectTextInputLayout =
+    selectedPhotos.length !== 0
+      ? styles.textInputLayoutWithPhoto
+      : styles.textInputLayoutWithoutPhoto
 
   const textDecorated = useMemo(() => {
     let i = 0
@@ -207,13 +212,7 @@ export const ComposePost = observer(function ComposePost({
             </View>
           </View>
         ) : undefined}
-        <View
-          style={[
-            styles.textInputLayout,
-            selectedPhotos.length !== 0
-              ? styles.textInputLayoutWithPhoto
-              : styles.textInputLayoutWithoutPhoto,
-          ]}>
+        <View style={[styles.textInputLayout, selectTextInputLayout]}>
           <UserAvatar
             handle={store.me.handle || ''}
             displayName={store.me.displayName}
@@ -229,12 +228,17 @@ export const ComposePost = observer(function ComposePost({
             {textDecorated}
           </TextInput>
         </View>
+        <SelectedPhoto
+          selectedPhotos={selectedPhotos}
+          setSelectedPhotos={setSelectedPhotos}
+        />
         <PhotoCarouselPicker
           selectedPhotos={selectedPhotos}
           setSelectedPhotos={setSelectedPhotos}
           localPhotos={localPhotos}
           inputText={text}
         />
+        <View style={styles.separator} />
         <View style={[s.flexRow, s.pt10, s.pb10, s.pr5, styles.contentCenter]}>
           <View style={s.flex1} />
           <Text style={[s.mr10, {color: progressColor}]}>
@@ -339,4 +343,9 @@ const styles = StyleSheet.create({
     paddingRight: 8,
   },
   contentCenter: {alignItems: 'center'},
+  separator: {
+    borderBottomColor: 'black',
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    width: '100%',
+  },
 })
diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx
index f3c3b89c0..17be8a5f5 100644
--- a/src/view/com/composer/PhotoCarouselPicker.tsx
+++ b/src/view/com/composer/PhotoCarouselPicker.tsx
@@ -1,11 +1,5 @@
 import React from 'react'
-import {
-  Image,
-  StyleSheet,
-  TouchableOpacity,
-  View,
-  ScrollView,
-} from 'react-native'
+import {Image, StyleSheet, TouchableOpacity, ScrollView} from 'react-native'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {colors} from '../../lib/styles'
 import {openPicker, openCamera} from 'react-native-image-crop-picker'
@@ -22,148 +16,60 @@ export const PhotoCarouselPicker = observer(function PhotoCarouselPicker({
   inputText: string
   localPhotos: any
 }) {
-  return (
-    <>
-      {selectedPhotos.length !== 0 && (
-        <View style={styles.selectedImageContainer}>
-          {selectedPhotos.length !== 0 &&
-            selectedPhotos.map((item, index) => (
-              <View
-                key={`selected-image-${index}`}
-                style={[
-                  styles.selectedImage,
-                  selectedPhotos.length === 1
-                    ? styles.selectedImage250
-                    : selectedPhotos.length === 2
-                    ? styles.selectedImage175
-                    : styles.selectedImage85,
-                ]}>
-                <TouchableOpacity
-                  onPress={() => {
-                    setSelectedPhotos(
-                      selectedPhotos.filter(filterItem => filterItem !== item),
-                    )
-                  }}
-                  style={styles.removePhotoButton}>
-                  <FontAwesomeIcon
-                    icon="xmark"
-                    size={16}
-                    style={{color: colors.white}}
-                  />
-                </TouchableOpacity>
-
-                <Image
-                  style={[
-                    styles.selectedImage,
-                    selectedPhotos.length === 1
-                      ? styles.selectedImage250
-                      : selectedPhotos.length === 2
-                      ? styles.selectedImage175
-                      : styles.selectedImage85,
-                  ]}
-                  source={{uri: item}}
-                />
-              </View>
-            ))}
-        </View>
-      )}
-      {localPhotos.photos != null &&
-        inputText === '' &&
-        selectedPhotos.length === 0 && (
-          <ScrollView
-            horizontal
-            style={styles.photosContainer}
-            showsHorizontalScrollIndicator={false}>
-            <TouchableOpacity
-              style={[styles.galleryButton, styles.photo]}
-              onPress={() => {
-                openCamera({multiple: true, maxFiles: 4}).then()
-              }}>
-              <FontAwesomeIcon
-                icon="camera"
-                size={24}
-                style={{color: colors.blue3}}
-              />
-            </TouchableOpacity>
-            {localPhotos.photos.map((item: any, index: number) => (
-              <TouchableOpacity
-                key={`local-image-${index}`}
-                style={styles.photoButton}
-                onPress={() => {
-                  setSelectedPhotos([item.node.image.uri, ...selectedPhotos])
-                }}>
-                <Image
-                  style={styles.photo}
-                  source={{uri: item.node.image.uri}}
-                />
-              </TouchableOpacity>
-            ))}
-            <TouchableOpacity
-              style={[styles.galleryButton, styles.photo]}
-              onPress={() => {
-                openPicker({multiple: true, maxFiles: 4}).then(items => {
-                  setSelectedPhotos([
-                    ...items.reduce(
-                      (accum, cur) => accum.concat(cur.sourceURL!),
-                      [] as string[],
-                    ),
-                    ...selectedPhotos,
-                  ])
-                })
-              }}>
-              <FontAwesomeIcon
-                icon="image"
-                style={{color: colors.blue3}}
-                size={24}
-              />
-            </TouchableOpacity>
-          </ScrollView>
-        )}
-      <View style={styles.separator} />
-    </>
-  )
+  return localPhotos.photos != null &&
+    inputText === '' &&
+    selectedPhotos.length === 0 ? (
+    <ScrollView
+      horizontal
+      style={styles.photosContainer}
+      showsHorizontalScrollIndicator={false}>
+      <TouchableOpacity
+        style={[styles.galleryButton, styles.photo]}
+        onPress={() => {
+          openCamera({multiple: true, maxFiles: 4}).then()
+        }}>
+        <FontAwesomeIcon
+          icon="camera"
+          size={24}
+          style={{color: colors.blue3}}
+        />
+      </TouchableOpacity>
+      {localPhotos.photos.map((item: any, index: number) => (
+        <TouchableOpacity
+          key={`local-image-${index}`}
+          style={styles.photoButton}
+          onPress={() => {
+            setSelectedPhotos([item.node.image.uri, ...selectedPhotos])
+          }}>
+          <Image style={styles.photo} source={{uri: item.node.image.uri}} />
+        </TouchableOpacity>
+      ))}
+      <TouchableOpacity
+        style={[styles.galleryButton, styles.photo]}
+        onPress={() => {
+          openPicker({multiple: true, maxFiles: 4}).then(items => {
+            setSelectedPhotos([
+              ...items.reduce(
+                (accum, cur) => accum.concat(cur.sourceURL!),
+                [] as string[],
+              ),
+              ...selectedPhotos,
+            ])
+          })
+        }}>
+        <FontAwesomeIcon icon="image" style={{color: colors.blue3}} size={24} />
+      </TouchableOpacity>
+    </ScrollView>
+  ) : null
 })
 
 const styles = StyleSheet.create({
-  selectedImageContainer: {
-    flex: 1,
-    flexDirection: 'row',
-    marginTop: 16,
-  },
-  selectedImage: {
-    borderRadius: 8,
-    margin: 2,
-  },
-  selectedImage250: {
-    width: 250,
-    height: 250,
-  },
-  selectedImage175: {
-    width: 175,
-    height: 175,
-  },
-  selectedImage85: {
-    width: 85,
-    height: 85,
-  },
   photosContainer: {
     width: '100%',
     maxHeight: 96,
     padding: 8,
     overflow: 'hidden',
   },
-  removePhotoButton: {
-    position: 'absolute',
-    top: 8,
-    right: 8,
-    width: 24,
-    height: 24,
-    borderRadius: 12,
-    alignItems: 'center',
-    justifyContent: 'center',
-    backgroundColor: colors.black,
-    zIndex: 1,
-  },
   galleryButton: {
     borderWidth: 1,
     borderColor: colors.gray3,
@@ -184,9 +90,4 @@ const styles = StyleSheet.create({
     marginRight: 8,
     borderRadius: 16,
   },
-  separator: {
-    borderBottomColor: 'black',
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    width: '100%',
-  },
 })
diff --git a/src/view/com/composer/SelectedPhoto.tsx b/src/view/com/composer/SelectedPhoto.tsx
new file mode 100644
index 000000000..1fe147483
--- /dev/null
+++ b/src/view/com/composer/SelectedPhoto.tsx
@@ -0,0 +1,83 @@
+import React from 'react'
+import {Image, StyleSheet, TouchableOpacity, View} from 'react-native'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {colors} from '../../lib/styles'
+import {observer} from 'mobx-react-lite'
+
+export const SelectedPhoto = ({
+  selectedPhotos,
+  setSelectedPhotos,
+}: {
+  selectedPhotos: string[]
+  setSelectedPhotos: React.Dispatch<React.SetStateAction<string[]>>
+}) => {
+  const imageStyle =
+    selectedPhotos.length === 1
+      ? styles.image250
+      : selectedPhotos.length === 2
+      ? styles.image175
+      : styles.image85
+
+  return selectedPhotos.length !== 0 ? (
+    <View style={styles.imageContainer}>
+      {selectedPhotos.length !== 0 &&
+        selectedPhotos.map((item, index) => (
+          <View
+            key={`selected-image-${index}`}
+            style={[styles.image, imageStyle]}>
+            <TouchableOpacity
+              onPress={() => {
+                setSelectedPhotos(
+                  selectedPhotos.filter(filterItem => filterItem !== item),
+                )
+              }}
+              style={styles.removePhotoButton}>
+              <FontAwesomeIcon
+                icon="xmark"
+                size={16}
+                style={{color: colors.white}}
+              />
+            </TouchableOpacity>
+
+            <Image style={[styles.image, imageStyle]} source={{uri: item}} />
+          </View>
+        ))}
+    </View>
+  ) : null
+}
+
+const styles = StyleSheet.create({
+  imageContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    marginTop: 16,
+  },
+  image: {
+    borderRadius: 8,
+    margin: 2,
+  },
+  image250: {
+    width: 250,
+    height: 250,
+  },
+  image175: {
+    width: 175,
+    height: 175,
+  },
+  image85: {
+    width: 85,
+    height: 85,
+  },
+  removePhotoButton: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    width: 24,
+    height: 24,
+    borderRadius: 12,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: colors.black,
+    zIndex: 1,
+  },
+})
-- 
cgit 1.4.1


From 23ea5929870c180a688433faabcbeafd2353db11 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 16:00:21 +0000
Subject: move show carousel out of the component

---
 ios/Podfile                                   |  1 -
 ios/Podfile.lock                              |  2 +-
 ios/app.xcodeproj/project.pbxproj             | 88 +++++++++++++--------------
 src/view/com/composer/ComposePost.tsx         | 15 +++--
 src/view/com/composer/PhotoCarouselPicker.tsx |  8 +--
 src/view/com/composer/SelectedPhoto.tsx       |  1 -
 6 files changed, 56 insertions(+), 59 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/ios/Podfile b/ios/Podfile
index b4fa1f55f..abdbbf1d8 100644
--- a/ios/Podfile
+++ b/ios/Podfile
@@ -20,7 +20,6 @@ target 'app' do
     :app_path => "#{Pod::Config.instance.installation_root}/.."
   )
 
-  pod 'react-native-cameraroll', :path => '../node_modules/@react-native-camera-roll/camera-roll'
 
   target 'appTests' do
     inherit! :complete
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 37e55dacd..39f1ead9e 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -540,6 +540,6 @@ SPEC CHECKSUMS:
   TOCropViewController: edfd4f25713d56905ad1e0b9f5be3fbe0f59c863
   Yoga: 99652481fcd320aefa4a7ef90095b95acd181952
 
-PODFILE CHECKSUM: 1c470a84819c5f003f8861cf58774e2fedb862b3
+PODFILE CHECKSUM: 95dad1cd550c9983fb5c851af858b806e8250502
 
 COCOAPODS: 1.11.3
diff --git a/ios/app.xcodeproj/project.pbxproj b/ios/app.xcodeproj/project.pbxproj
index f964b1232..50db4563a 100644
--- a/ios/app.xcodeproj/project.pbxproj
+++ b/ios/app.xcodeproj/project.pbxproj
@@ -11,10 +11,10 @@
 		13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.mm */; };
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
-		6D37A166CEFC7E8937DE72CB /* libPods-app.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */; };
+		56F0250941FE75DA8CF8094A /* libPods-app-appTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = F5D2424078D205E2F98F0707 /* libPods-app-appTests.a */; };
 		81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
+		BFADB63545C91424F7C8293A /* libPods-app.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 9C668306DD1C0A63684EDCB0 /* libPods-app.a */; };
 		E4BBD590292C1F5200296224 /* app.entitlements in Resources */ = {isa = PBXBuildFile; fileRef = E4437C9E28581FA7006DA9E7 /* app.entitlements */; };
-		F19C1FC2EC3C7162CB25E815 /* libPods-app-appTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -31,21 +31,21 @@
 		00E356EE1AD99517003FC87E /* appTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = appTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		00E356F21AD99517003FC87E /* appTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = appTests.m; sourceTree = "<group>"; };
-		0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.debug.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.debug.xcconfig"; sourceTree = "<group>"; };
 		13B07F961A680F5B00A75B9A /* app.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = app.app; sourceTree = BUILT_PRODUCTS_DIR; };
 		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = app/AppDelegate.h; sourceTree = "<group>"; };
 		13B07FB01A68108700A75B9A /* AppDelegate.mm */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.objcpp; name = AppDelegate.mm; path = app/AppDelegate.mm; sourceTree = "<group>"; };
 		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = app/Images.xcassets; sourceTree = "<group>"; };
 		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = app/Info.plist; sourceTree = "<group>"; };
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = app/main.m; sourceTree = "<group>"; };
-		16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app-appTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
-		30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.release.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.release.xcconfig"; sourceTree = "<group>"; };
-		4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.debug.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.debug.xcconfig"; sourceTree = "<group>"; };
-		596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app.a"; sourceTree = BUILT_PRODUCTS_DIR; };
-		685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.release.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.release.xcconfig"; sourceTree = "<group>"; };
+		3D3D4D80CD734363E3EADE03 /* Pods-app.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.release.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.release.xcconfig"; sourceTree = "<group>"; };
+		65D2EDDD9D88DA37994C7743 /* Pods-app-appTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.debug.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.debug.xcconfig"; sourceTree = "<group>"; };
 		81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = app/LaunchScreen.storyboard; sourceTree = "<group>"; };
+		9C668306DD1C0A63684EDCB0 /* libPods-app.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app.a"; sourceTree = BUILT_PRODUCTS_DIR; };
+		A79BD0E1A3F5B868AD4F5D68 /* Pods-app.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app.debug.xcconfig"; path = "Target Support Files/Pods-app/Pods-app.debug.xcconfig"; sourceTree = "<group>"; };
+		AA0AD1B60CF7C90FFDB948B9 /* Pods-app-appTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-app-appTests.release.xcconfig"; path = "Target Support Files/Pods-app-appTests/Pods-app-appTests.release.xcconfig"; sourceTree = "<group>"; };
 		E4437C9E28581FA7006DA9E7 /* app.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; name = app.entitlements; path = app/app.entitlements; sourceTree = "<group>"; };
 		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
+		F5D2424078D205E2F98F0707 /* libPods-app-appTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-app-appTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -53,7 +53,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				F19C1FC2EC3C7162CB25E815 /* libPods-app-appTests.a in Frameworks */,
+				56F0250941FE75DA8CF8094A /* libPods-app-appTests.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -61,7 +61,7 @@
 			isa = PBXFrameworksBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
-				6D37A166CEFC7E8937DE72CB /* libPods-app.a in Frameworks */,
+				BFADB63545C91424F7C8293A /* libPods-app.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -103,8 +103,8 @@
 			isa = PBXGroup;
 			children = (
 				ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
-				596ED3134AA9EF6DBAB6EB96 /* libPods-app.a */,
-				16A4C892E71787BF5849EC83 /* libPods-app-appTests.a */,
+				9C668306DD1C0A63684EDCB0 /* libPods-app.a */,
+				F5D2424078D205E2F98F0707 /* libPods-app-appTests.a */,
 			);
 			name = Frameworks;
 			sourceTree = "<group>";
@@ -143,10 +143,10 @@
 		BBD78D7AC51CEA395F1C20DB /* Pods */ = {
 			isa = PBXGroup;
 			children = (
-				0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */,
-				30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */,
-				4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */,
-				685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */,
+				A79BD0E1A3F5B868AD4F5D68 /* Pods-app.debug.xcconfig */,
+				3D3D4D80CD734363E3EADE03 /* Pods-app.release.xcconfig */,
+				65D2EDDD9D88DA37994C7743 /* Pods-app-appTests.debug.xcconfig */,
+				AA0AD1B60CF7C90FFDB948B9 /* Pods-app-appTests.release.xcconfig */,
 			);
 			path = Pods;
 			sourceTree = "<group>";
@@ -158,11 +158,11 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget "appTests" */;
 			buildPhases = (
-				D25A2C8B8B280E54CDBF5192 /* [CP] Check Pods Manifest.lock */,
+				A8646FFAA087C80271BB2CC6 /* [CP] Check Pods Manifest.lock */,
 				00E356EA1AD99517003FC87E /* Sources */,
 				00E356EB1AD99517003FC87E /* Frameworks */,
 				00E356EC1AD99517003FC87E /* Resources */,
-				93C4A008E3B1F5BDF90AA282 /* [CP] Copy Pods Resources */,
+				8DC349844744C81F79F94A1E /* [CP] Copy Pods Resources */,
 			);
 			buildRules = (
 			);
@@ -178,13 +178,13 @@
 			isa = PBXNativeTarget;
 			buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "app" */;
 			buildPhases = (
-				E5C10128C4EC047B9CD6EEFB /* [CP] Check Pods Manifest.lock */,
+				AFA1F7779F8B1AF36C3A7914 /* [CP] Check Pods Manifest.lock */,
 				FD10A7F022414F080027D42C /* Start Packager */,
 				13B07F871A680F5B00A75B9A /* Sources */,
 				13B07F8C1A680F5B00A75B9A /* Frameworks */,
 				13B07F8E1A680F5B00A75B9A /* Resources */,
 				00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
-				29E5C2625DDCB23B01CF3257 /* [CP] Copy Pods Resources */,
+				EEF3465D9B31EDDCEB2438EA /* [CP] Copy Pods Resources */,
 			);
 			buildRules = (
 			);
@@ -266,24 +266,7 @@
 			shellPath = /bin/sh;
 			shellScript = "set -e\n\nexport NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n";
 		};
-		29E5C2625DDCB23B01CF3257 /* [CP] Copy Pods Resources */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-input-files.xcfilelist",
-			);
-			name = "[CP] Copy Pods Resources";
-			outputFileListPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-output-files.xcfilelist",
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources.sh\"\n";
-			showEnvVarsInLog = 0;
-		};
-		93C4A008E3B1F5BDF90AA282 /* [CP] Copy Pods Resources */ = {
+		8DC349844744C81F79F94A1E /* [CP] Copy Pods Resources */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
@@ -300,7 +283,7 @@
 			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app-appTests/Pods-app-appTests-resources.sh\"\n";
 			showEnvVarsInLog = 0;
 		};
-		D25A2C8B8B280E54CDBF5192 /* [CP] Check Pods Manifest.lock */ = {
+		A8646FFAA087C80271BB2CC6 /* [CP] Check Pods Manifest.lock */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
@@ -322,7 +305,7 @@
 			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
 			showEnvVarsInLog = 0;
 		};
-		E5C10128C4EC047B9CD6EEFB /* [CP] Check Pods Manifest.lock */ = {
+		AFA1F7779F8B1AF36C3A7914 /* [CP] Check Pods Manifest.lock */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
@@ -344,6 +327,23 @@
 			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
 			showEnvVarsInLog = 0;
 		};
+		EEF3465D9B31EDDCEB2438EA /* [CP] Copy Pods Resources */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputFileListPaths = (
+				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-input-files.xcfilelist",
+			);
+			name = "[CP] Copy Pods Resources";
+			outputFileListPaths = (
+				"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources-${CONFIGURATION}-output-files.xcfilelist",
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-app/Pods-app-resources.sh\"\n";
+			showEnvVarsInLog = 0;
+		};
 		FD10A7F022414F080027D42C /* Start Packager */ = {
 			isa = PBXShellScriptBuildPhase;
 			buildActionMask = 2147483647;
@@ -396,7 +396,7 @@
 /* Begin XCBuildConfiguration section */
 		00E356F61AD99517003FC87E /* Debug */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 4DFF35494A5D1C813CE7EF11 /* Pods-app-appTests.debug.xcconfig */;
+			baseConfigurationReference = 65D2EDDD9D88DA37994C7743 /* Pods-app-appTests.debug.xcconfig */;
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				BUNDLE_LOADER = "$(TEST_HOST)";
@@ -424,7 +424,7 @@
 		};
 		00E356F71AD99517003FC87E /* Release */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 685FA16DF9AC2B99AE3B5DBD /* Pods-app-appTests.release.xcconfig */;
+			baseConfigurationReference = AA0AD1B60CF7C90FFDB948B9 /* Pods-app-appTests.release.xcconfig */;
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				BUNDLE_LOADER = "$(TEST_HOST)";
@@ -449,7 +449,7 @@
 		};
 		13B07F941A680F5B00A75B9A /* Debug */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 0C0949EE4E80361188F0C002 /* Pods-app.debug.xcconfig */;
+			baseConfigurationReference = A79BD0E1A3F5B868AD4F5D68 /* Pods-app.debug.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
@@ -478,7 +478,7 @@
 		};
 		13B07F951A680F5B00A75B9A /* Release */ = {
 			isa = XCBuildConfiguration;
-			baseConfigurationReference = 30A0A65C98339E6009F0927D /* Pods-app.release.xcconfig */;
+			baseConfigurationReference = 3D3D4D80CD734363E3EADE03 /* Pods-app.release.xcconfig */;
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index 114586f47..9fe6b78b3 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -232,12 +232,15 @@ export const ComposePost = observer(function ComposePost({
           selectedPhotos={selectedPhotos}
           setSelectedPhotos={setSelectedPhotos}
         />
-        <PhotoCarouselPicker
-          selectedPhotos={selectedPhotos}
-          setSelectedPhotos={setSelectedPhotos}
-          localPhotos={localPhotos}
-          inputText={text}
-        />
+        {localPhotos.photos != null &&
+          text === '' &&
+          selectedPhotos.length === 0 && (
+            <PhotoCarouselPicker
+              selectedPhotos={selectedPhotos}
+              setSelectedPhotos={setSelectedPhotos}
+              localPhotos={localPhotos}
+            />
+          )}
         <View style={styles.separator} />
         <View style={[s.flexRow, s.pt10, s.pb10, s.pr5, styles.contentCenter]}>
           <View style={s.flex1} />
diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx
index 17be8a5f5..9671dd29f 100644
--- a/src/view/com/composer/PhotoCarouselPicker.tsx
+++ b/src/view/com/composer/PhotoCarouselPicker.tsx
@@ -8,17 +8,13 @@ import {observer} from 'mobx-react-lite'
 export const PhotoCarouselPicker = observer(function PhotoCarouselPicker({
   selectedPhotos,
   setSelectedPhotos,
-  inputText,
   localPhotos,
 }: {
   selectedPhotos: string[]
   setSelectedPhotos: React.Dispatch<React.SetStateAction<string[]>>
-  inputText: string
   localPhotos: any
 }) {
-  return localPhotos.photos != null &&
-    inputText === '' &&
-    selectedPhotos.length === 0 ? (
+  return (
     <ScrollView
       horizontal
       style={styles.photosContainer}
@@ -60,7 +56,7 @@ export const PhotoCarouselPicker = observer(function PhotoCarouselPicker({
         <FontAwesomeIcon icon="image" style={{color: colors.blue3}} size={24} />
       </TouchableOpacity>
     </ScrollView>
-  ) : null
+  )
 })
 
 const styles = StyleSheet.create({
diff --git a/src/view/com/composer/SelectedPhoto.tsx b/src/view/com/composer/SelectedPhoto.tsx
index 1fe147483..87f7fbb8c 100644
--- a/src/view/com/composer/SelectedPhoto.tsx
+++ b/src/view/com/composer/SelectedPhoto.tsx
@@ -2,7 +2,6 @@ import React from 'react'
 import {Image, StyleSheet, TouchableOpacity, View} from 'react-native'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {colors} from '../../lib/styles'
-import {observer} from 'mobx-react-lite'
 
 export const SelectedPhoto = ({
   selectedPhotos,
-- 
cgit 1.4.1


From 3b899bfc66deff242567bdafd9ecce90f5216965 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 16:45:44 +0000
Subject: change post test with photo attached; remove auto linking settings

---
 android/settings.gradle               | 4 ----
 ios/Podfile                           | 1 -
 src/view/com/composer/ComposePost.tsx | 8 +++++++-
 3 files changed, 7 insertions(+), 6 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/android/settings.gradle b/android/settings.gradle
index e6c53dc6b..3c22b7a2c 100644
--- a/android/settings.gradle
+++ b/android/settings.gradle
@@ -1,8 +1,4 @@
 rootProject.name = 'app'
-include ':@react-native-camera-roll_camera-roll'
-project(':@react-native-camera-roll_camera-roll').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-camera-roll/camera-roll/android')
-include ':@react-native-camera-roll_camera-roll'
-project(':@react-native-camera-roll_camera-roll').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-camera-roll/camera-roll/android')
 apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
 include ':app'
 includeBuild('../node_modules/react-native-gradle-plugin')
diff --git a/ios/Podfile b/ios/Podfile
index abdbbf1d8..f9a45704c 100644
--- a/ios/Podfile
+++ b/ios/Podfile
@@ -20,7 +20,6 @@ target 'app' do
     :app_path => "#{Pod::Config.instance.installation_root}/.."
   )
 
-
   target 'appTests' do
     inherit! :complete
     # Pods for testing
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index 9fe6b78b3..ec0b0bf8d 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -223,7 +223,13 @@ export const ComposePost = observer(function ComposePost({
             multiline
             scrollEnabled
             onChangeText={(text: string) => onChangeText(text)}
-            placeholder={replyTo ? 'Write your reply' : "What's up?"}
+            placeholder={
+              replyTo
+                ? 'Write your reply'
+                : selectedPhotos.length !== 0
+                ? 'Write a comment'
+                : "What's up?"
+            }
             style={styles.textInput}>
             {textDecorated}
           </TextInput>
-- 
cgit 1.4.1


From 68e1abf4a9d082e019e5f78732ded12f0d5d8bc0 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 17:51:06 +0000
Subject: react-hooks/exhaustive-deps fixes

---
 src/view/com/composer/ComposePost.tsx | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index ec0b0bf8d..7b41f95fc 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -48,20 +48,17 @@ export const ComposePost = observer(function ComposePost({
 
   const autocompleteView = useMemo<UserAutocompleteViewModel>(
     () => new UserAutocompleteViewModel(store),
-    [],
+    [store],
   )
   const localPhotos = useMemo<UserLocalPhotosModel>(
     () => new UserLocalPhotosModel(store),
-    [],
+    [store],
   )
 
   useEffect(() => {
     autocompleteView.setup()
-  })
-
-  useEffect(() => {
     localPhotos.setup()
-  }, [localPhotos])
+  }, [autocompleteView, localPhotos])
 
   useEffect(() => {
     // HACK
@@ -78,7 +75,7 @@ export const ComposePost = observer(function ComposePost({
         clearTimeout(to)
       }
     }
-  }, [textInput.current])
+  }, [])
 
   const onChangeText = (newText: string) => {
     setText(newText)
-- 
cgit 1.4.1


From 90942ae1466333bf8fcdffeaf5432aa65fbb2747 Mon Sep 17 00:00:00 2001
From: João Ferreiro <ferreiro@pinkroom.dev>
Date: Tue, 29 Nov 2022 18:32:07 +0000
Subject: moving placeholder condition

---
 src/view/com/composer/ComposePost.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index 7b41f95fc..b43f4ab9e 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -128,10 +128,16 @@ export const ComposePost = observer(function ComposePost({
 
   const canPost = text.length <= MAX_TEXT_LENGTH
   const progressColor = text.length > DANGER_TEXT_LENGTH ? '#e60000' : undefined
+
   const selectTextInputLayout =
     selectedPhotos.length !== 0
       ? styles.textInputLayoutWithPhoto
       : styles.textInputLayoutWithoutPhoto
+  const selectTextInputPlaceholder = replyTo
+    ? 'Write your reply'
+    : selectedPhotos.length !== 0
+    ? 'Write a comment'
+    : "What's up?"
 
   const textDecorated = useMemo(() => {
     let i = 0
@@ -220,13 +226,7 @@ export const ComposePost = observer(function ComposePost({
             multiline
             scrollEnabled
             onChangeText={(text: string) => onChangeText(text)}
-            placeholder={
-              replyTo
-                ? 'Write your reply'
-                : selectedPhotos.length !== 0
-                ? 'Write a comment'
-                : "What's up?"
-            }
+            placeholder={selectTextInputPlaceholder}
             style={styles.textInput}>
             {textDecorated}
           </TextInput>
-- 
cgit 1.4.1


From 8a43040ec6e1f2970b16610dc497d20e0dea5664 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Fri, 2 Dec 2022 10:48:57 -0600
Subject: Hide images behind a build flag until ready

---
 src/build-flags.ts                    |  1 +
 src/view/com/composer/ComposePost.tsx | 19 +++++++++++--------
 2 files changed, 12 insertions(+), 8 deletions(-)

(limited to 'src/view/com/composer/ComposePost.tsx')

diff --git a/src/build-flags.ts b/src/build-flags.ts
index 155230e5d..f57e15840 100644
--- a/src/build-flags.ts
+++ b/src/build-flags.ts
@@ -1,2 +1,3 @@
 export const LOGIN_INCLUDE_DEV_SERVERS = true
 export const TABS_ENABLED = false
+export const IMAGES_ENABLED = false
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx
index b43f4ab9e..10d9f4b1c 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost.tsx
@@ -26,6 +26,7 @@ import {detectLinkables} from '../../../lib/strings'
 import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
 import {PhotoCarouselPicker} from './PhotoCarouselPicker'
 import {SelectedPhoto} from './SelectedPhoto'
+import {IMAGES_ENABLED} from '../../../build-flags'
 
 const MAX_TEXT_LENGTH = 256
 const DANGER_TEXT_LENGTH = MAX_TEXT_LENGTH
@@ -235,7 +236,8 @@ export const ComposePost = observer(function ComposePost({
           selectedPhotos={selectedPhotos}
           setSelectedPhotos={setSelectedPhotos}
         />
-        {localPhotos.photos != null &&
+        {IMAGES_ENABLED &&
+          localPhotos.photos != null &&
           text === '' &&
           selectedPhotos.length === 0 && (
             <PhotoCarouselPicker
@@ -244,8 +246,7 @@ export const ComposePost = observer(function ComposePost({
               localPhotos={localPhotos}
             />
           )}
-        <View style={styles.separator} />
-        <View style={[s.flexRow, s.pt10, s.pb10, s.pr5, styles.contentCenter]}>
+        <View style={styles.bottomBar}>
           <View style={s.flex1} />
           <Text style={[s.mr10, {color: progressColor}]}>
             {MAX_TEXT_LENGTH - text.length}
@@ -348,10 +349,12 @@ const styles = StyleSheet.create({
     paddingLeft: 13,
     paddingRight: 8,
   },
-  contentCenter: {alignItems: 'center'},
-  separator: {
-    borderBottomColor: 'black',
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    width: '100%',
+  bottomBar: {
+    flexDirection: 'row',
+    paddingVertical: 10,
+    paddingRight: 5,
+    alignItems: 'center',
+    borderTopWidth: 1,
+    borderTopColor: colors.gray2,
   },
 })
-- 
cgit 1.4.1

