Split image cropping into secondary step (#473)

* Split image cropping into secondary step

* Use ImageModel and GalleryModel

* Add fix for pasting image URLs

* Move models to state folder

* Fix things that broke after rebase

* Latest -- has image display bug

* Remove contentFit

* Fix iOS display in gallery

* Tuneup the api signatures and implement compress/resize on web

* Fix await

* Lint fix and remove unused function

* Fix android image pathing

* Fix external embed x button on android

* Remove min-height from composer (no longer useful and was mispositioning the composer on android)

* Fix e2e picker

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

src/view/com/util/images/ImageLayoutGrid.tsx

@@ -1,4 +1,5 @@
-import React from 'react'
+import {Dimensions} from 'lib/media/types'
+import React, {useState} from 'react'
 import {
   LayoutChangeEvent,
   StyleProp,
@@ -11,11 +12,6 @@ import {Image, ImageStyle} from 'expo-image'
 
 export const DELAY_PRESS_IN = 500
 
-interface Dim {
-  width: number
-  height: number
-}
-
 export type ImageLayoutGridType = 'two' | 'three' | 'four'
 
 export function ImageLayoutGrid({
@@ -33,7 +29,7 @@ export function ImageLayoutGrid({
   onPressIn?: (index: number) => void
   style?: StyleProp<ViewStyle>
 }) {
-  const [containerInfo, setContainerInfo] = React.useState<Dim | undefined>()
+  const [containerInfo, setContainerInfo] = useState<Dimensions | undefined>()
 
   const onLayout = (evt: LayoutChangeEvent) => {
     setContainerInfo({
@@ -71,7 +67,7 @@ function ImageLayoutGridInner({
   onPress?: (index: number) => void
   onLongPress?: (index: number) => void
   onPressIn?: (index: number) => void
-  containerInfo: Dim
+  containerInfo: Dimensions
 }) {
   const size1 = React.useMemo<ImageStyle>(() => {
     if (type === 'three') {