diff --git a/web/invite-links/manage-invite-links-modal.react.js b/web/invite-links/manage-invite-links-modal.react.js
index 859d5e207..fda766fc8 100644
--- a/web/invite-links/manage-invite-links-modal.react.js
+++ b/web/invite-links/manage-invite-links-modal.react.js
@@ -1,69 +1,40 @@
 // @flow
 
 import * as React from 'react';
 
 import { useModalContext } from 'lib/components/modal-provider.react.js';
 import { primaryInviteLinksSelector } from 'lib/selectors/invite-links-selectors.js';
 import type { InviteLink } from 'lib/types/link-types.js';
 
-import CopyInviteLinkButton from './copy-invite-link-button.react.js';
-import css from './manage-invite-links-modal.css';
-import Button from '../components/button.react.js';
+import EmptyLinkContent from './manage/empty-link-content.react.js';
+import ExistingLinkContent from './manage/existing-link-content.react.js';
+import css from './manage/manage-invite-links-modal.css';
 import Modal from '../modals/modal.react.js';
 import { useSelector } from '../redux/redux-utils.js';
 
 type Props = {
   +communityID: string,
 };
 
-const buttonColor = {
-  color: 'var(--purple-link)',
-};
-
 function ManageInviteLinksModal(props: Props): React.Node {
   const { communityID } = props;
   const inviteLink: ?InviteLink = useSelector(primaryInviteLinksSelector)[
     communityID
   ];
   const { popModal } = useModalContext();
 
-  let enableLinkButton = null;
-  let publicLinkSection = null;
+  let content;
   if (inviteLink) {
-    publicLinkSection = (
-      <div>
-        <CopyInviteLinkButton inviteLink={inviteLink} />
-        <div className={css.description}>
-          {'Public links allow unlimited uses and never expire. '}
-          <Button
-            variant="text"
-            buttonColor={buttonColor}
-            className={css.inlineButton}
-          >
-            Edit public link
-          </Button>
-        </div>
-      </div>
-    );
+    content = <ExistingLinkContent inviteLink={inviteLink} />;
   } else {
-    enableLinkButton = (
-      <Button variant="text" buttonColor={buttonColor}>
-        Enable
-      </Button>
-    );
+    content = <EmptyLinkContent />;
   }
 
   return (
     <Modal name="Manage invite links" onClose={popModal} size="large">
-      <div className={css.container}>
-        <div className={css.sectionHeaderRow}>
-          <div className={css.sectionHeaderText}>Public link</div>
-          {enableLinkButton}
-        </div>
-        {publicLinkSection}
-      </div>
+      <div className={css.container}>{content}</div>
     </Modal>
   );
 }
 
 export default ManageInviteLinksModal;
diff --git a/web/invite-links/manage/empty-link-content.react.js b/web/invite-links/manage/empty-link-content.react.js
new file mode 100644
index 000000000..ebec414d8
--- /dev/null
+++ b/web/invite-links/manage/empty-link-content.react.js
@@ -0,0 +1,23 @@
+// @flow
+
+import * as React from 'react';
+
+import css from './manage-invite-links-modal.css';
+import Button from '../../components/button.react.js';
+
+const buttonColor = {
+  color: 'var(--purple-link)',
+};
+
+function EmptyLinkContent(): React.Node {
+  return (
+    <div className={css.sectionHeaderRow}>
+      <div className={css.sectionHeaderText}>Public link</div>
+      <Button variant="text" buttonColor={buttonColor}>
+        Enable
+      </Button>
+    </div>
+  );
+}
+
+export default EmptyLinkContent;
diff --git a/web/invite-links/manage/existing-link-content.react.js b/web/invite-links/manage/existing-link-content.react.js
new file mode 100644
index 000000000..d43ddbf5e
--- /dev/null
+++ b/web/invite-links/manage/existing-link-content.react.js
@@ -0,0 +1,42 @@
+// @flow
+
+import * as React from 'react';
+
+import type { InviteLink } from 'lib/types/link-types.js';
+
+import css from './manage-invite-links-modal.css';
+import Button from '../../components/button.react.js';
+import CopyInviteLinkButton from '../copy-invite-link-button.react.js';
+
+const buttonColor = {
+  color: 'var(--purple-link)',
+};
+
+type Props = {
+  +inviteLink: InviteLink,
+};
+function ExistingLinkContent(props: Props): React.Node {
+  const { inviteLink } = props;
+  return (
+    <>
+      <div className={css.sectionHeaderRow}>
+        <div className={css.sectionHeaderText}>Public link</div>
+      </div>
+      <div>
+        <CopyInviteLinkButton inviteLink={inviteLink} />
+        <div className={css.description}>
+          {'Public links allow unlimited uses and never expire. '}
+          <Button
+            variant="text"
+            buttonColor={buttonColor}
+            className={css.inlineButton}
+          >
+            Edit public link
+          </Button>
+        </div>
+      </div>
+    </>
+  );
+}
+
+export default ExistingLinkContent;
diff --git a/web/invite-links/manage-invite-links-modal.css b/web/invite-links/manage/manage-invite-links-modal.css
similarity index 100%
rename from web/invite-links/manage-invite-links-modal.css
rename to web/invite-links/manage/manage-invite-links-modal.css