summaryrefslogtreecommitdiff
path: root/web/source/settings/admin/accounts/detail/handlesignup.tsx
blob: a61145a22532536854c9e6a3d3ad53802c508d88 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
/*
	GoToSocial
	Copyright (C) GoToSocial Authors admin@gotosocial.org
	SPDX-License-Identifier: AGPL-3.0-or-later

	This program is free software: you can redistribute it and/or modify
	it under the terms of the GNU Affero General Public License as published by
	the Free Software Foundation, either version 3 of the License, or
	(at your option) any later version.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU Affero General Public License for more details.

	You should have received a copy of the GNU Affero General Public License
	along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

import React from "react";
import { useLocation } from "wouter";

import { useHandleSignupMutation } from "../../../lib/query";

import MutationButton from "../../../components/form/mutation-button";

import useFormSubmit from "../../../lib/form/submit";
import {
	useValue,
	useTextInput,
	useBoolInput,
} from "../../../lib/form";

import { Checkbox, Select, TextInput } from "../../../components/form/inputs";
import { AdminAccount } from "../../../lib/types/account";

export interface HandleSignupProps {
	account: AdminAccount,
	accountsBaseUrl: string,
}

export function HandleSignup({account, accountsBaseUrl}: HandleSignupProps) {
	const form = {
		id: useValue("id", account.id),
		approveOrReject: useTextInput("approve_or_reject", { defaultValue: "approve" }),
		privateComment: useTextInput("private_comment"),
		message: useTextInput("message"),
		sendEmail: useBoolInput("send_email"),
	};

	const [_location, setLocation] = useLocation();

	const [handleSignup, result] = useFormSubmit(form, useHandleSignupMutation(), {
		changedOnly: false,
		// After submitting the form, redirect back to
		// /settings/admin/accounts if rejecting, since
		// account will no longer be available at
		// /settings/admin/accounts/:accountID endpoint.
		onFinish: (res) => {
			if (form.approveOrReject.value === "approve") {
				// An approve request:
				// stay on this page and
				// serve updated details.
				return;
			}
			
			if (res.data) {
				// "reject" successful,
				// redirect to accounts page.
				setLocation(accountsBaseUrl);
			}
		}
	});

	return (
		<form
			onSubmit={handleSignup}
			aria-labelledby="account-handle-signup"
		>
			<h3 id="account-handle-signup">Handle Account Sign-Up</h3>
			<Select
				field={form.approveOrReject}
				label="Approve or Reject"
				options={
					<>
						<option value="approve">Approve</option>
						<option value="reject">Reject</option>
					</>
				}
			>
			</Select>
			{ form.approveOrReject.value === "reject" &&
			// Only show form fields relevant
			// to "reject" if rejecting.
			// On "approve" these fields will
			// be ignored anyway.
			<>
				<TextInput
					field={form.privateComment}
					label="(Optional) private comment on why sign-up was rejected (shown to other admins only)"
				/>
				<Checkbox
					field={form.sendEmail}
					label="Send email to applicant"
				/>
				<TextInput
					field={form.message}
					label={"(Optional) message to include in email to applicant, if send email is checked"}
				/>
			</> }
			<MutationButton
				disabled={false}
				label={form.approveOrReject.value === "approve" ? "Approve" : "Reject"}
				result={result}
			/>
		</form>
	);
}