github.com/minio/console@v1.4.1/web-app/src/screens/Console/Support/OnlineRegistration.tsx (about) 1 // This file is part of MinIO Console Server 2 // Copyright (c) 2023 MinIO, Inc. 3 // 4 // This program is free software: you can redistribute it and/or modify 5 // it under the terms of the GNU Affero General Public License as published by 6 // the Free Software Foundation, either version 3 of the License, or 7 // (at your option) any later version. 8 // 9 // This program is distributed in the hope that it will be useful, 10 // but WITHOUT ANY WARRANTY; without even the implied warranty of 11 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 12 // GNU Affero General Public License for more details. 13 // 14 // You should have received a copy of the GNU Affero General Public License 15 // along with this program. If not, see <http://www.gnu.org/licenses/>. 16 17 import React from "react"; 18 import { 19 Box, 20 Button, 21 FormLayout, 22 InputBox, 23 OnlineRegistrationIcon, 24 UsersIcon, 25 } from "mds"; 26 import RegisterHelpBox from "./RegisterHelpBox"; 27 import { modalStyleUtils } from "../Common/FormComponents/common/styleLibrary"; 28 import { useSelector } from "react-redux"; 29 import { AppState, useAppDispatch } from "../../../store"; 30 import { setSubnetEmail, setSubnetPassword } from "./registerSlice"; 31 import { subnetLogin } from "./registerThunks"; 32 33 const OnlineRegistration = () => { 34 const dispatch = useAppDispatch(); 35 36 const subnetPassword = useSelector( 37 (state: AppState) => state.register.subnetPassword, 38 ); 39 const subnetEmail = useSelector( 40 (state: AppState) => state.register.subnetEmail, 41 ); 42 const loading = useSelector((state: AppState) => state.register.loading); 43 44 return ( 45 <FormLayout 46 icon={<OnlineRegistrationIcon />} 47 title={"Online activation of MinIO Subscription Network License"} 48 withBorders={false} 49 containerPadding={false} 50 helpBox={<RegisterHelpBox />} 51 > 52 <Box 53 sx={{ 54 fontSize: "14px", 55 display: "flex", 56 flexFlow: "column", 57 marginBottom: "30px", 58 }} 59 > 60 Use your MinIO Subscription Network login credentials to register this 61 cluster. 62 </Box> 63 <Box 64 sx={{ 65 flex: "1", 66 }} 67 > 68 <InputBox 69 id="subnet-email" 70 name="subnet-email" 71 onChange={(event: React.ChangeEvent<HTMLInputElement>) => 72 dispatch(setSubnetEmail(event.target.value)) 73 } 74 label="Email" 75 value={subnetEmail} 76 overlayIcon={<UsersIcon />} 77 /> 78 <InputBox 79 id="subnet-password" 80 name="subnet-password" 81 onChange={(event: React.ChangeEvent<HTMLInputElement>) => 82 dispatch(setSubnetPassword(event.target.value)) 83 } 84 label="Password" 85 type={"password"} 86 value={subnetPassword} 87 /> 88 89 <Box sx={modalStyleUtils.modalButtonBar}> 90 <Button 91 id={"sign-up"} 92 type="submit" 93 variant="regular" 94 onClick={(e) => { 95 e.preventDefault(); 96 window.open(`https://min.io/signup?ref=con`, "_blank"); 97 }} 98 label={"Sign up"} 99 /> 100 <Button 101 id={"register-credentials"} 102 type="submit" 103 variant="callAction" 104 disabled={ 105 loading || 106 subnetEmail.trim().length === 0 || 107 subnetPassword.trim().length === 0 108 } 109 onClick={() => dispatch(subnetLogin())} 110 label={"Register"} 111 /> 112 </Box> 113 </Box> 114 </FormLayout> 115 ); 116 }; 117 118 export default OnlineRegistration;