Page MenuHomePhabricator
Files F3378430

D3718.diff
No OneTemporary
Actions

D3718.diff
View Options

diff --git a/web/modals/threads/thread-settings-delete-tab.css b/web/modals/threads/thread-settings-delete-tab.css
new file mode 100644
--- /dev/null
+++ b/web/modals/threads/thread-settings-delete-tab.css
@@ -0,0 +1,43 @@
+div.modal_body p.confirm_account_password {
+ margin-bottom: 4px;
+ color: var(--fg);
+}
+
+div.form_title {
+ padding: 6px 6px 0 0;
+ font-size: 14px;
+ font-weight: 600;
+ vertical-align: top;
+ color: var(--fg);
+}
+div.form_content {
+ display: flex;
+ font-family: var(--font-stack);
+ color: var(--fg);
+ margin-top: 4px;
+ margin-bottom: 8px;
+}
+div.form_content input {
+ margin-bottom: 4px;
+}
+
+div.form_content textarea {
+ padding: 12px;
+ background: var(--modal-bg);
+ color: var(--fg);
+ border: 1px solid var(--border-color);
+ font-size: var(--m-font-16);
+ border-radius: 4px;
+ width: 100%;
+}
+
+.italic {
+ font-style: italic;
+ color: var(--fg);
+}
+
+div.edit_thread_account_password {
+ border-top: 2px solid #efefef;
+ padding-top: 4px;
+ margin-top: 2px;
+}
diff --git a/web/modals/threads/thread-settings-delete-tab.react.js b/web/modals/threads/thread-settings-delete-tab.react.js
new file mode 100644
--- /dev/null
+++ b/web/modals/threads/thread-settings-delete-tab.react.js
@@ -0,0 +1,51 @@
+// @flow
+
+import * as React from 'react';
+
+import css from './thread-settings-modal.css';
+
+type ThreadSettingsDeleteTabProps = {
+ +accountPassword: string,
+ +onChangeAccountPassword: (event: SyntheticEvent<HTMLInputElement>) => void,
+ +inputDisabled: boolean,
+ +accountPasswordInputRef: (accountPasswordInput: ?HTMLInputElement) => void,
+};
+
+function ThreadSettingsDeleteTab(
+ props: ThreadSettingsDeleteTabProps,
+): React.Node {
+ const {
+ accountPassword,
+ onChangeAccountPassword,
+ inputDisabled,
+ accountPasswordInputRef,
+ } = props;
+ return (
+ <>
+ <div>
+ <p className={css.italic}>
+ Your thread will be permanently deleted. There is no way to reverse
+ this.
+ </p>
+ </div>
+ <div className={css.edit_thread_account_password}>
+ <p className={css.confirm_account_password}>
+ Please enter your account password to confirm your identity
+ </p>
+ <div className={css.form_title}>Account password</div>
+ <div className={css.form_content}>
+ <input
+ type="password"
+ placeholder="Personal account password"
+ value={accountPassword}
+ onChange={onChangeAccountPassword}
+ disabled={inputDisabled}
+ ref={accountPasswordInputRef}
+ />
+ </div>
+ </div>
+ </>
+ );
+}
+
+export default ThreadSettingsDeleteTab;
diff --git a/web/modals/threads/thread-settings-modal.react.js b/web/modals/threads/thread-settings-modal.react.js
--- a/web/modals/threads/thread-settings-modal.react.js
+++ b/web/modals/threads/thread-settings-modal.react.js
@@ -40,6 +40,7 @@
import { useModalContext } from '../../modals/modal-provider.react';
import { useSelector } from '../../redux/redux-utils';
import Modal from '../modal.react';
+import ThreadSettingsDeleteTab from './thread-settings-delete-tab.react';
import ThreadSettingsGeneralTab from './thread-settings-general-tab.react';
import css from './thread-settings-modal.css';
@@ -258,30 +259,12 @@
);
} else if (this.state.currentTabType === 'delete') {
mainContent = (
- <>
- <div>
- <p className={css.italic}>
- Your thread will be permanently deleted. There is no way to
- reverse this.
- </p>
- </div>
- <div className={css.edit_thread_account_password}>
- <p className={css.confirm_account_password}>
- Please enter your account password to confirm your identity
- </p>
- <div className={css.form_title}>Account password</div>
- <div className={css.form_content}>
- <input
- type="password"
- placeholder="Personal account password"
- value={this.state.accountPassword}
- onChange={this.onChangeAccountPassword}
- disabled={inputDisabled}
- ref={this.accountPasswordInputRef}
- />
- </div>
- </div>
- </>
+ <ThreadSettingsDeleteTab
+ accountPassword={this.state.accountPassword}
+ onChangeAccountPassword={this.onChangeAccountPassword}
+ inputDisabled={inputDisabled}
+ accountPasswordInputRef={this.accountPasswordInputRef}
+ />
);
}

File Metadata

Mime Type
text/plain
Expires
Thu, Nov 28, 10:32 AM (21 h, 44 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2593771
Default Alt Text
D3718.diff (4 KB)

Event Timeline