From 76264e3fe86d1ac3c9f6d91290e77db8d9272d1a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=9F=E3=81=84=E3=81=A1=20=E3=81=B2?=
 <taichi221228@icloud.com>
Date: Mon, 8 May 2023 18:12:53 +0900
Subject: [PATCH] Rewrite RadioButton component as FC (#24897)

---
 .../mastodon/components/radio_button.jsx      | 35 -------------------
 .../mastodon/components/radio_button.tsx      | 30 ++++++++++++++++
 2 files changed, 30 insertions(+), 35 deletions(-)
 delete mode 100644 app/javascript/mastodon/components/radio_button.jsx
 create mode 100644 app/javascript/mastodon/components/radio_button.tsx

diff --git a/app/javascript/mastodon/components/radio_button.jsx b/app/javascript/mastodon/components/radio_button.jsx
deleted file mode 100644
index 0496fa2868a..00000000000
--- a/app/javascript/mastodon/components/radio_button.jsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-
-export default class RadioButton extends React.PureComponent {
-
-  static propTypes = {
-    value: PropTypes.string.isRequired,
-    checked: PropTypes.bool,
-    name: PropTypes.string.isRequired,
-    onChange: PropTypes.func.isRequired,
-    label: PropTypes.node.isRequired,
-  };
-
-  render () {
-    const { name, value, checked, onChange, label } = this.props;
-
-    return (
-      <label className='radio-button'>
-        <input
-          name={name}
-          type='radio'
-          value={value}
-          checked={checked}
-          onChange={onChange}
-        />
-
-        <span className={classNames('radio-button__input', { checked })} />
-
-        <span>{label}</span>
-      </label>
-    );
-  }
-
-}
diff --git a/app/javascript/mastodon/components/radio_button.tsx b/app/javascript/mastodon/components/radio_button.tsx
new file mode 100644
index 00000000000..9ba098f78d3
--- /dev/null
+++ b/app/javascript/mastodon/components/radio_button.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import classNames from 'classnames';
+
+type Props = {
+  value: string;
+  checked: boolean;
+  name: string;
+  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+  label: React.ReactNode;
+};
+
+export const RadioButton: React.FC<Props> = ({ name, value, checked, onChange, label }) => {
+  return (
+    <label className='radio-button'>
+      <input
+        name={name}
+        type='radio'
+        value={value}
+        checked={checked}
+        onChange={onChange}
+      />
+
+      <span className={classNames('radio-button__input', { checked })} />
+
+      <span>{label}</span>
+    </label>
+  );
+};
+
+export default RadioButton;