github.com/minio/console@v1.4.1/web-app/src/screens/Console/Buckets/ListBuckets/AddBucket/AddBucketName.tsx (about) 1 // This file is part of MinIO Console Server 2 // Copyright (c) 2022 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 { InputBox } from "mds"; 19 import { useSelector } from "react-redux"; 20 import { setIsDirty, setName } from "./addBucketsSlice"; 21 import { AppState, useAppDispatch } from "../../../../../store"; 22 23 const AddBucketName = ({ hasErrors }: { hasErrors: boolean }) => { 24 const dispatch = useAppDispatch(); 25 26 const bucketName = useSelector((state: AppState) => state.addBucket.name); 27 return ( 28 <InputBox 29 id="bucket-name" 30 name="bucket-name" 31 error={hasErrors ? "Invalid bucket name" : ""} 32 onFocus={() => { 33 dispatch(setIsDirty(true)); 34 }} 35 onChange={(event: React.ChangeEvent<HTMLInputElement>) => { 36 dispatch(setName(event.target.value)); 37 }} 38 label="Bucket Name" 39 value={bucketName} 40 required 41 /> 42 ); 43 }; 44 45 export default AddBucketName;