From 57cfd9b18e0c7e3977e5ef9c32f9fff6c0cb64e5 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Mon, 9 May 2022 22:39:57 -0500
Subject: [PATCH] EditFederationModal: convert to tsx

---
 app/soapbox/features/forms/index.tsx          |   1 +
 .../ui/components/edit_federation_modal.js    | Bin 4732 -> 0 bytes
 .../ui/components/edit_federation_modal.tsx   | 122 ++++++++++++++++++
 3 files changed, 123 insertions(+)
 delete mode 100644 app/soapbox/features/ui/components/edit_federation_modal.js
 create mode 100644 app/soapbox/features/ui/components/edit_federation_modal.tsx

diff --git a/app/soapbox/features/forms/index.tsx b/app/soapbox/features/forms/index.tsx
index c458cd6b1f..9504d05606 100644
--- a/app/soapbox/features/forms/index.tsx
+++ b/app/soapbox/features/forms/index.tsx
@@ -167,6 +167,7 @@ interface ICheckbox {
   hint?: React.ReactNode,
   name?: string,
   checked?: boolean,
+  disabled?: boolean,
   onChange?: React.ChangeEventHandler<HTMLInputElement>,
   required?: boolean,
 }
diff --git a/app/soapbox/features/ui/components/edit_federation_modal.js b/app/soapbox/features/ui/components/edit_federation_modal.js
deleted file mode 100644
index 53e21078f3474b8639149aba0cc0e17ccad8cf87..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4732
zcmcIoOK;mo5WeeIOfMk?=y8{=Ab{PpE}%59(zCE4M;2?6%W_w;3`YOGGyC96l4TTb
zkb}6K_k8p1&`DOvQbPp`QGihJkYzh9)+y5S2oeQH*pxDZAn`APn?YigzL&E2@mipA
zA_YB<H6JuGk0>JT-k1Elc~!gW+c9$E+Tob(_RKcAyAtmt#gk*+@zd5PnQ`QWngA+@
zag*e@K&8YJD#|zi8zcRY>$J|>1w%(|#YpBkN%o{ljCThT^98D4SHwc&qTJMyN{V7F
z4^t{dB6Bs(%1vWf<sy1si_#UWFY8}73KcA=87Y31Wj2DlEt0xCoH*N{&{PC9-H=?X
zI~8Q&8Gl3lh?&&*kSi_n2v77Crj)HLS#?0UD-BO4O7ru^!eOnGxkAIdSNX6S0F=nZ
zpAi<5cm@H+iC%3m#!_&lCiZnOVpXwAwd)#5J{m<3X$oA`eWDYBARI?zG$S*Dv)haG
zqG=<vDy`Hx4@+Gpg|+4EQXwP!rZz7ZjT(tnP9o<lQp2duLTeFiGlH%HEn$sR!txno
zP?#%9V~@_=E>9Dsk?L}xI$q$iuR<#FQp?%$Y-F0s7cAAEdHQ<McrCS(BzDfl?@5ec
zJ>Vh2LUTH`noB~7Jzn&|FV9(C^0^IG?V^YfblHS`f6hv^rR<5yYB<3Qk)55+*qA@I
zU@D5Grm_7YnVA%!HKe)FIHKaS9XJkQ{uwN0X|8hflL6cwqS@()cr$Ed$ml%Y4Cwy=
z4~B#tu;GhimoV!FG8}wq2x<_eLMix_rsQj#)k4N11w3fX;}(~H?~r6QAkUmo5&=`I
zrSQ2+f@7OOP015Q(9fSHiF(9;b_p>Y$9<Y>L&)CZgravjI)6x&<e~u(DT-O=t_f{D
zIJE6+Oe2q`1zh{O*Z`J#s$QjuuI8Y(iJEXa>c+S*&kD6M6B5-Mm)#akh{VF60YxyR
z*0TDM<EU?p`y^h-U9Kq-8@{pK4wE_VjMiU<{llWfy+M-Ke`gvdk7NVkFNtc55D~Uv
zHtH2)=$(Kq$!VAzs0(&0@;JqND$O1JeBuT@<EsZZciF(3%BMw1#cCm++vxM)+BQuv
zvtpazVmN67D@^D#ByS^UdlK>Og|Y7eg;*EW#<^&5IRnE-#f0FLDT-z|eSjuBhY%Co
z#Q4vUQZhFW=OXqLQ|T{(nKx+B4zLz<;a`5;xj}l$hFRFfIY_nvXR}=H)>)z{Kk9}h
z8J`DHKdm8j0Vb*tI@*p58;wBbcd1l-YoCt6n=LW`^VY(8R|%N|$PE=_I5aW<6TQVe
zw6j=i_<dyJm^tM5CcI+^e?5o(&i67c5*;?yBhJT}uj+!i#9Gr;60u=f52DY`)}=cb
z|FIm-q)WStit}Lbr;bN3Ug;#mlom^mrdq<^w&ou7rxrWBD0ELa9oky_q1}J%6L;ER
zSj#__X2D{7+0Zw;H0@1FHw*amsRw61=^&WyBsS>B-xcFFPWE7~oo^z;d64mKGcKjn
ztCjf;yt9oPJ{_CW;Iq>QU<=KYeQsMktG}Xp>J(dMIJT<WZA;}0++fJ`=KtMJ`!1V>
znFhxW+q|-jZrIQs9ou12pnkP(nPwNMSYtY`-om}@TPG;ibc8jhJb3MG$IPz@`i7A^
zq21F&+T$>=YTaZ3rXLoz!Na44;7Rbr0Q`*@Uy8m?t`Ej{rP)SrSK;H*tM~V-xxvq$
z-Qnnl)as-iAs*zu$klE(s{da{>vf!W{i|vBQ)pV+A+f&L)lBOs?6*WOj*n}w|Iq0<
zpxv{FUG8r;sD4gO>UPmS!|;8T>t(oT>KXvnJFR67{0EVFpv<xmyn{oXWS1X^M&F_?
d{wC|y?{;eax9!|c8%}M`JIvd9@T>B1@Gmvf>{kE)

diff --git a/app/soapbox/features/ui/components/edit_federation_modal.tsx b/app/soapbox/features/ui/components/edit_federation_modal.tsx
new file mode 100644
index 0000000000..3d4456a75c
--- /dev/null
+++ b/app/soapbox/features/ui/components/edit_federation_modal.tsx
@@ -0,0 +1,122 @@
+import { Map as ImmutableMap } from 'immutable';
+import React, { useState, useEffect } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+
+import { updateMrf } from 'soapbox/actions/mrf';
+import snackbar from 'soapbox/actions/snackbar';
+import { SimpleForm, Checkbox } from 'soapbox/features/forms';
+import { useAppSelector, useAppDispatch } from 'soapbox/hooks';
+import { makeGetRemoteInstance } from 'soapbox/selectors';
+
+const getRemoteInstance = makeGetRemoteInstance();
+
+const messages = defineMessages({
+  reject: { id: 'edit_federation.reject', defaultMessage: 'Reject all activities' },
+  mediaRemoval: { id: 'edit_federation.media_removal', defaultMessage: 'Strip media' },
+  forceNsfw: { id: 'edit_federation.force_nsfw', defaultMessage: 'Force attachments to be marked sensitive' },
+  unlisted: { id: 'edit_federation.unlisted', defaultMessage: 'Force posts unlisted' },
+  followersOnly: { id: 'edit_federation.followers_only', defaultMessage: 'Hide posts except to followers' },
+  save: { id: 'edit_federation.save', defaultMessage: 'Save' },
+  success: { id: 'edit_federation.success', defaultMessage: '{host} federation was updated' },
+});
+
+interface IEditFederationModal {
+  host: string,
+  onClose: () => void,
+}
+
+/** Modal for moderators to edit federation with a remote instance. */
+const EditFederationModal: React.FC<IEditFederationModal> = ({ host, onClose }) => {
+  const intl = useIntl();
+  const dispatch = useAppDispatch();
+
+  const remoteInstance = useAppSelector(state => getRemoteInstance(state, host));
+
+  const [data, setData] = useState(ImmutableMap<string, any>());
+
+  useEffect(() => {
+    setData(remoteInstance.get('federation') as any);
+  }, [remoteInstance]);
+
+  const handleDataChange = (key: string): React.ChangeEventHandler<HTMLInputElement> => {
+    return ({ target }) => {
+      setData(data.set(key, target.checked));
+    };
+  };
+
+  const handleMediaRemoval: React.ChangeEventHandler<HTMLInputElement> = ({ target: { checked } }) => {
+    const newData = data.merge({
+      avatar_removal: checked,
+      banner_removal: checked,
+      media_removal: checked,
+    });
+
+    setData(newData);
+  };
+
+  const handleSubmit: React.FormEventHandler = () => {
+    dispatch(updateMrf(host, data))
+      .then(() => dispatch(snackbar.success(intl.formatMessage(messages.success, { host }))))
+      .catch(() => {});
+
+    onClose();
+  };
+
+  const {
+    avatar_removal,
+    banner_removal,
+    federated_timeline_removal,
+    followers_only,
+    media_nsfw,
+    media_removal,
+    reject,
+  } = data.toJS() as Record<string, boolean>;
+
+  const fullMediaRemoval = avatar_removal && banner_removal && media_removal;
+
+  return (
+    <div className='modal-root__modal edit-federation-modal'>
+      <div>
+        <div className='edit-federation-modal__title'>
+          {host}
+        </div>
+        <SimpleForm onSubmit={handleSubmit}>
+          <Checkbox
+            label={intl.formatMessage(messages.reject)}
+            checked={reject}
+            onChange={handleDataChange('reject')}
+          />
+          <Checkbox
+            label={intl.formatMessage(messages.mediaRemoval)}
+            disabled={reject}
+            checked={fullMediaRemoval}
+            onChange={handleMediaRemoval}
+          />
+          <Checkbox
+            label={intl.formatMessage(messages.forceNsfw)}
+            disabled={reject || media_removal}
+            checked={media_nsfw}
+            onChange={handleDataChange('media_nsfw')}
+          />
+          <Checkbox
+            label={intl.formatMessage(messages.followersOnly)}
+            disabled={reject}
+            checked={followers_only}
+            onChange={handleDataChange('followers_only')}
+          />
+          <Checkbox
+            label={intl.formatMessage(messages.unlisted)}
+            disabled={reject || followers_only}
+            checked={federated_timeline_removal}
+            onChange={handleDataChange('federated_timeline_removal')}
+          />
+          <button type='submit' className='edit-federation-modal__submit'>
+            {intl.formatMessage(messages.save)}
+          </button>
+        </SimpleForm>
+      </div>
+    </div>
+  );
+};
+
+export default EditFederationModal;