tloncorp/landscape
1
1
Fork 0
mirror of https://github.com/tloncorp/landscape.git synced 2024-12-01 02:45:49 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #207 from tloncorp/land-498-show-spinner-while-loading-storage-settings

Browse Source 
storage: show loading spinner while loading storage settings
This commit is contained in:
Hunter Miller 2023-07-25 10:15:05 -05:00 committed by GitHub
commit a7f306b005
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 67 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

119
ui/src/preferences/StoragePrefs.tsx
View File

@ -89,78 +89,93 @@ export const StoragePrefs = () => {
<label className="font-semibold" htmlFor="endpoint">
Endpoint<span title="Required field">*</span>
</label>
<input
disabled={!loaded}
required
id="endpoint"
type="url"
autoCorrect="off"
defaultValue={s3.credentials?.endpoint}
{...register('endpoint', { required: true })}
className="input default-ring bg-gray-50"
/>
<div className="relative">
<input
disabled={!loaded}
required
id="endpoint"
type="url"
autoCorrect="off"
defaultValue={s3.credentials?.endpoint}
{...register('endpoint', { required: true })}
className="input default-ring bg-gray-50"
/>
{!loaded && <Spinner className="absolute top-1 right-2" />}
</div>
</div>
<div className="mb-8 flex flex-col space-y-2">
<label className="font-semibold" htmlFor="key">
Access Key ID<span title="Required field">*</span>
</label>
<input
disabled={!loaded}
required
id="key"
type="text"
autoCorrect="off"
spellCheck="false"
defaultValue={s3.credentials?.accessKeyId}
{...register('accessId', { required: true })}
className="input default-ring bg-gray-50"
/>
<div className="relative">
<input
disabled={!loaded}
required
id="key"
type="text"
autoCorrect="off"
spellCheck="false"
defaultValue={s3.credentials?.accessKeyId}
{...register('accessId', { required: true })}
className="input default-ring bg-gray-50"
/>
{!loaded && <Spinner className="absolute top-1 right-2" />}
</div>
</div>
<div className="mb-8 flex flex-col space-y-2">
<label className="font-semibold" htmlFor="secretAccessKey">
Secret Access Key<span title="Required field">*</span>
</label>
<input
disabled={!loaded}
required
id="secretAccessKey"
type="text"
autoCorrect="off"
spellCheck="false"
defaultValue={s3.credentials?.secretAccessKey}
{...register('accessSecret', { required: true })}
className="input default-ring bg-gray-50"
/>
<div className="relative">
<input
disabled={!loaded}
required
id="secretAccessKey"
type="text"
autoCorrect="off"
spellCheck="false"
defaultValue={s3.credentials?.secretAccessKey}
{...register('accessSecret', { required: true })}
className="input default-ring bg-gray-50"
/>
{!loaded && <Spinner className="absolute top-1 right-2" />}
</div>
</div>
<div className="mb-8 flex flex-col space-y-2">
<label className="font-semibold" htmlFor="region">
Region<span title="Required field">*</span>
</label>
<input
disabled={!loaded}
required
id="region"
type="text"
autoCorrect="off"
defaultValue={s3.configuration?.region}
{...register('region', { required: true })}
className="input default-ring bg-gray-50"
/>
<div className="relative">
<input
disabled={!loaded}
required
id="region"
type="text"
autoCorrect="off"
defaultValue={s3.configuration?.region}
{...register('region', { required: true })}
className="input default-ring bg-gray-50"
/>
{!loaded && <Spinner className="absolute top-1 right-2" />}
</div>
</div>
<div className="mb-8 flex flex-col space-y-2">
<label className="font-semibold" htmlFor="bucket">
Bucket Name<span title="Required field">*</span>
</label>
<input
disabled={!loaded}
required
id="bucket"
type="text"
autoCorrect="off"
defaultValue={s3.configuration.currentBucket}
{...register('bucket', { required: true })}
className="input default-ring bg-gray-50"
/>
<div className="relative">
<input
disabled={!loaded}
required
id="bucket"
type="text"
autoCorrect="off"
defaultValue={s3.configuration.currentBucket}
{...register('bucket', { required: true })}
className="input default-ring bg-gray-50"
/>
{!loaded && <Spinner className="absolute top-1 right-2" />}
</div>
</div>
<Button
type="submit"