diff --git a/src/state/gallery.ts b/src/state/gallery.ts index 75ab28a90f..428f01353e 100644 --- a/src/state/gallery.ts +++ b/src/state/gallery.ts @@ -20,7 +20,7 @@ import {getDataUriSize} from '#/lib/media/util' import {isIOS, isNative} from '#/platform/detection' export type ImageTransformation = { - crop?: ActionCrop['crop'] & {aspect: number} + crop?: ActionCrop['crop'] } export type ImageMeta = { diff --git a/src/view/com/composer/photos/EditImageDialog.web.tsx b/src/view/com/composer/photos/EditImageDialog.web.tsx index bc5859b79a..719cbce0b7 100644 --- a/src/view/com/composer/photos/EditImageDialog.web.tsx +++ b/src/view/com/composer/photos/EditImageDialog.web.tsx @@ -2,13 +2,12 @@ import 'react-image-crop/dist/ReactCrop.css' import React from 'react' import {View} from 'react-native' -import {Path, Svg} from 'react-native-svg' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' import ReactCrop, {PercentCrop} from 'react-image-crop' import {manipulateImage} from '#/state/gallery' -import {atoms as a, useTheme} from '#/alf' +import {atoms as a} from '#/alf' import {Button, ButtonText} from '#/components/Button' import * as Dialog from '#/components/Dialog' import {Text} from '#/components/Typography' @@ -24,17 +23,14 @@ export const EditImageDialog = (props: EditImageDialogProps) => { const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { const {_} = useLingui() - const t = useTheme() const source = image.source const manips = image.manips - const {initialCrop, initialAspect, sourceAspect} = React.useMemo(() => { + const {initialCrop} = React.useMemo(() => { const initialArea = manips?.crop - const originalAspect = source.width / source.height let crop: PercentCrop | undefined - let aspect = originalAspect if (initialArea) { crop = { @@ -44,19 +40,14 @@ const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { width: (initialArea.width / source.width) * 100, height: (initialArea.height / source.height) * 100, } - - aspect = initialArea.aspect } return { initialCrop: crop, - initialAspect: aspect, - sourceAspect: originalAspect, } }, [source, manips]) const [crop, setCrop] = React.useState(initialCrop) - const [aspect, setAspect] = React.useState(initialAspect) const isEmpty = !crop || (crop.width || crop.height) === 0 const isNew = initialCrop ? true : !isEmpty @@ -65,7 +56,6 @@ const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { const result = await manipulateImage(image, { crop: !isEmpty ? { - aspect: aspect, originX: (crop.x * source.width) / 100, originY: (crop.y * source.height) / 100, width: (crop.width * source.width) / 100, @@ -76,14 +66,7 @@ const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { onChange(result) control.close() - }, [crop, isEmpty, aspect, image, source, control, onChange]) - - const changeAspect = (next: number) => { - if (next !== aspect) { - setAspect(next) - setCrop(undefined) - } - } + }, [crop, isEmpty, image, source, control, onChange]) return ( @@ -95,7 +78,6 @@ const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { setCrop(next)} className="ReactCrop--no-animate"> @@ -104,55 +86,6 @@ const EditImageInner = ({control, image, onChange}: EditImageDialogProps) => { - - changeAspect(sourceAspect)}> - - - - - - changeAspect(16 / 9)}> - - - - - - changeAspect(1 / 1)}> - - - - - - - ) -}