From 5def7a087dfbe2f34973ed2db2286a90effdcfdc Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sun, 1 May 2022 12:46:06 -0500
Subject: [PATCH] Convert UploadArea to tsx

---
 app/soapbox/features/delete_account/index.tsx |  6 ------
 .../{upload_area.js => upload_area.tsx}       | 20 ++++++++++---------
 2 files changed, 11 insertions(+), 15 deletions(-)
 rename app/soapbox/features/ui/components/{upload_area.js => upload_area.tsx} (83%)

diff --git a/app/soapbox/features/delete_account/index.tsx b/app/soapbox/features/delete_account/index.tsx
index 733b9554c..d5927f763 100644
--- a/app/soapbox/features/delete_account/index.tsx
+++ b/app/soapbox/features/delete_account/index.tsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import * as React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
@@ -75,9 +74,4 @@ const DeleteAccount = () => {
   );
 };
 
-DeleteAccount.propTypes = {
-  intl: PropTypes.object,
-  dispatch: PropTypes.func,
-};
-
 export default DeleteAccount;
diff --git a/app/soapbox/features/ui/components/upload_area.js b/app/soapbox/features/ui/components/upload_area.tsx
similarity index 83%
rename from app/soapbox/features/ui/components/upload_area.js
rename to app/soapbox/features/ui/components/upload_area.tsx
index 6a940c649..ebdad855c 100644
--- a/app/soapbox/features/ui/components/upload_area.js
+++ b/app/soapbox/features/ui/components/upload_area.tsx
@@ -1,15 +1,22 @@
 import classNames from 'classnames';
-import PropTypes from 'prop-types';
 import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
-import spring from 'react-motion/lib/spring';
+import { spring } from 'react-motion';
 
 import { Icon, Stack, Text } from 'soapbox/components/ui';
 
 import Motion from '../../ui/util/optional_motion';
 
-const UploadArea = ({ active, onClose }) => {
-  const handleKeyUp = (e) => {
+interface IUploadArea {
+  /** Whether the upload area is active. */
+  active: boolean,
+  /** Callback when the upload area is closed. */
+  onClose: () => void,
+}
+
+/** Component to display when a file is dragged over the UI. */
+const UploadArea: React.FC<IUploadArea> = ({ active, onClose }) => {
+  const handleKeyUp = (e: KeyboardEvent) => {
     const keyCode = e.keyCode;
 
     if (active) {
@@ -63,9 +70,4 @@ const UploadArea = ({ active, onClose }) => {
   );
 };
 
-UploadArea.propTypes = {
-  active: PropTypes.bool,
-  onClose: PropTypes.func,
-};
-
 export default UploadArea;