From 6c4be4a5152ba7204d5dc9fd54e8a5ba373ca3a9 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Mon, 26 Jul 2021 15:07:35 -0500
Subject: [PATCH] Create EditFederationModal

---
 .../ui/components/edit_federation_modal.js    | 51 +++++++++++++++++++
 .../features/ui/components/modal_root.js      |  2 +
 .../components/federation-restrictions.scss   |  6 +++
 3 files changed, 59 insertions(+)
 create mode 100644 app/soapbox/features/ui/components/edit_federation_modal.js

diff --git a/app/soapbox/features/ui/components/edit_federation_modal.js b/app/soapbox/features/ui/components/edit_federation_modal.js
new file mode 100644
index 000000000..c83ba6557
--- /dev/null
+++ b/app/soapbox/features/ui/components/edit_federation_modal.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import { connect } from 'react-redux';
+import { SimpleForm, Checkbox } from 'soapbox/features/forms';
+import { makeGetRemoteInstance } from 'soapbox/selectors';
+
+const getRemoteInstance = makeGetRemoteInstance();
+
+const mapStateToProps = (state, { host }) => {
+  return {
+    remoteInstance: getRemoteInstance(state, host),
+  };
+};
+
+export default @connect(mapStateToProps)
+class EditFederationModal extends React.PureComponent {
+
+  static propTypes = {
+    host: PropTypes.string.isRequired,
+    remoteInstance: ImmutablePropTypes.map,
+  };
+
+  render() {
+    const { remoteInstance } = this.props;
+
+    const {
+      avatar_removal,
+      banner_removal,
+      federated_timeline_removal,
+      followers_only,
+      media_nsfw,
+      media_removal,
+      reject,
+    } = remoteInstance.get('federation').toJS();
+
+    return (
+      <div className='modal-root__modal edit-federation-modal'>
+        <h3>{remoteInstance.get('host')}</h3>
+        <SimpleForm>
+          <Checkbox label='reject' checked={reject} />
+          <Checkbox label='media removal' checked={avatar_removal && banner_removal && media_removal} />
+          <Checkbox label='force nsfw' checked={media_nsfw} />
+          <Checkbox label='unlisted' checked={federated_timeline_removal} />
+          <Checkbox label='followers only' checked={followers_only} />
+        </SimpleForm>
+      </div>
+    );
+  }
+
+}
diff --git a/app/soapbox/features/ui/components/modal_root.js b/app/soapbox/features/ui/components/modal_root.js
index 657df1a26..ab690d44e 100644
--- a/app/soapbox/features/ui/components/modal_root.js
+++ b/app/soapbox/features/ui/components/modal_root.js
@@ -15,6 +15,7 @@ import HotkeysModal from './hotkeys_modal';
 import ComposeModal from './compose_modal';
 import UnauthorizedModal from './unauthorized_modal';
 import CryptoDonateModal from './crypto_donate_modal';
+import EditFederationModal from './edit_federation_modal';
 
 import {
   MuteModal,
@@ -41,6 +42,7 @@ const MODAL_COMPONENTS = {
   'COMPOSE': () => Promise.resolve({ default: ComposeModal }),
   'UNAUTHORIZED': () => Promise.resolve({ default: UnauthorizedModal }),
   'CRYPTO_DONATE': () => Promise.resolve({ default: CryptoDonateModal }),
+  'EDIT_FEDERATION': () => Promise.resolve({ default: EditFederationModal }),
 };
 
 export default class ModalRoot extends React.PureComponent {
diff --git a/app/styles/components/federation-restrictions.scss b/app/styles/components/federation-restrictions.scss
index b14b601f4..c18dae67d 100644
--- a/app/styles/components/federation-restrictions.scss
+++ b/app/styles/components/federation-restrictions.scss
@@ -63,3 +63,9 @@
     }
   }
 }
+
+.edit-federation-modal {
+  background: var(--foreground-color);
+  border-radius: 8px;
+  padding: 20px;
+}