ui(admin): too many changes, not enough commits

This commit is contained in:
Matthew Penner 2021-05-20 16:00:46 -06:00
parent bca2338863
commit 8aa9641ec2
44 changed files with 1955 additions and 334 deletions

View file

@ -1,12 +1,5 @@
import React, { useState } from 'react';
import {
faBoxOpen,
faCloudDownloadAlt,
faEllipsisH,
faLock,
faTrashAlt,
faUnlock,
} from '@fortawesome/free-solid-svg-icons';
import { faBoxOpen, faCloudDownloadAlt, faEllipsisH, faLock, faTrashAlt, faUnlock } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import DropdownMenu, { DropdownButtonRow } from '@/components/elements/DropdownMenu';
import getBackupDownloadUrl from '@/api/server/backups/getBackupDownloadUrl';
@ -56,8 +49,8 @@ export default ({ backup }: Props) => {
clearFlashes('backups');
deleteBackup(uuid, backup.uuid)
.then(() => mutate(data => ({
...data,
items: data.items.filter(b => b.uuid !== backup.uuid),
...data!,
items: data!.items.filter(b => b.uuid !== backup.uuid),
}), false))
.catch(error => {
console.error(error);
@ -90,8 +83,8 @@ export default ({ backup }: Props) => {
http.post(`/api/client/servers/${uuid}/backups/${backup.uuid}/lock`)
.then(() => mutate(data => ({
...data,
items: data.items.map(b => b.uuid !== backup.uuid ? b : {
...data!,
items: data!.items.map(b => b.uuid !== backup.uuid ? b : {
...b,
isLocked: !b.isLocked,
}),
@ -124,13 +117,13 @@ export default ({ backup }: Props) => {
not be able to control the server power state, access the file manager, or create additional backups
until it has completed.
</p>
<p css={tw`text-neutral-300 mt-4`}>
<p css={tw`mt-4 text-neutral-300`}>
Are you sure you want to continue?
</p>
<p css={tw`mt-4 -mb-2 bg-neutral-900 p-3 rounded`}>
<p css={tw`p-3 mt-4 -mb-2 rounded bg-neutral-900`}>
<label
htmlFor={'restore_truncate'}
css={tw`text-base text-neutral-200 flex items-center cursor-pointer`}
css={tw`flex items-center text-base cursor-pointer text-neutral-200`}
>
<Input
type={'checkbox'}
@ -160,7 +153,7 @@ export default ({ backup }: Props) => {
renderToggle={onClick => (
<button
onClick={onClick}
css={tw`text-neutral-200 transition-colors duration-150 hover:text-neutral-100 p-2`}
css={tw`p-2 transition-colors duration-150 text-neutral-200 hover:text-neutral-100`}
>
<FontAwesomeIcon icon={faEllipsisH}/>
</button>
@ -185,7 +178,7 @@ export default ({ backup }: Props) => {
<FontAwesomeIcon
fixedWidth
icon={backup.isLocked ? faUnlock : faLock}
css={tw`text-xs mr-2`}
css={tw`mr-2 text-xs`}
/>
{backup.isLocked ? 'Unlock' : 'Lock'}
</DropdownButtonRow>
@ -202,7 +195,7 @@ export default ({ backup }: Props) => {
:
<button
onClick={() => setModal('delete')}
css={tw`text-neutral-200 transition-colors duration-150 hover:text-neutral-100 p-2`}
css={tw`p-2 transition-colors duration-150 text-neutral-200 hover:text-neutral-100`}
>
<FontAwesomeIcon icon={faTrashAlt}/>
</button>

View file

@ -26,8 +26,8 @@ export default ({ backup, className }: Props) => {
const parsed = JSON.parse(data);
mutate(data => ({
...data,
items: data.items.map(b => b.uuid !== backup.uuid ? b : ({
...data!,
items: data!.items.map(b => b.uuid !== backup.uuid ? b : ({
...b,
isSuccessful: parsed.is_successful || true,
checksum: (parsed.checksum_type || '') + ':' + (parsed.checksum || ''),

View file

@ -81,7 +81,7 @@ export default () => {
clearFlashes('backups:create');
createServerBackup(uuid, values)
.then(backup => {
mutate(data => ({ ...data, items: data.items.concat(backup) }), false);
mutate(data => ({ ...data!, items: data!.items.concat(backup) }), false);
setVisible(false);
})
.catch(error => {

View file

@ -31,7 +31,7 @@ const ChmodFileModal = ({ files, ...props }: OwnProps) => {
const submit = ({ mode }: FormikValues, { setSubmitting }: FormikHelpers<FormikValues>) => {
clearFlashes('files');
mutate(data => data.map(f => f.name === files[0].file ? { ...f, mode: fileBitsToString(mode, !f.isFile), modeBits: mode } : f), false);
mutate(data => data!.map(f => f.name === files[0].file ? { ...f, mode: fileBitsToString(mode, !f.isFile), modeBits: mode } : f), false);
const data = files.map(f => ({ file: f.file, mode: mode }));

View file

@ -75,7 +75,7 @@ const FileDropdownMenu = ({ file }: { file: FileObject }) => {
// For UI speed, immediately remove the file from the listing before calling the deletion function.
// If the delete actually fails, we'll fetch the current directory contents again automatically.
mutate(files => files.filter(f => f.key !== file.key), false);
mutate(files => files!.filter(f => f.key !== file.key), false);
deleteFiles(uuid, directory, [ file.name ]).catch(error => {
mutate();

View file

@ -51,7 +51,7 @@ const MassActionsBar = () => {
deleteFiles(uuid, directory, selectedFiles)
.then(() => {
mutate(files => files.filter(f => selectedFiles.indexOf(f.name) < 0), false);
mutate(files => files!.filter(f => selectedFiles.indexOf(f.name) < 0), false);
setSelectedFiles([]);
})
.catch(error => {

View file

@ -55,7 +55,7 @@ export default ({ className }: WithClassname) => {
const submit = ({ directoryName }: Values, { setSubmitting }: FormikHelpers<Values>) => {
createDirectory(uuid, directory, directoryName)
.then(() => mutate(data => [ ...data, generateDirectoryData(directoryName) ], false))
.then(() => mutate(data => [ ...data!, generateDirectoryData(directoryName) ], false))
.then(() => setVisible(false))
.catch(error => {
console.error(error);

View file

@ -30,10 +30,10 @@ const RenameFileModal = ({ files, useMoveTerminology, ...props }: OwnProps) => {
if (files.length === 1) {
if (!useMoveTerminology && len === 1) {
// Rename the file within this directory.
mutate(data => data.map(f => f.name === files[0] ? { ...f, name } : f), false);
mutate(data => data!.map(f => f.name === files[0] ? { ...f, name } : f), false);
} else if ((useMoveTerminology || len > 1)) {
// Remove the file from this directory since they moved it elsewhere.
mutate(data => data.filter(f => f.name !== files[0]), false);
mutate(data => data!.filter(f => f.name !== files[0]), false);
}
}

View file

@ -35,7 +35,7 @@ interface Values {
const schema = object().shape({
action: string().required().oneOf([ 'command', 'power', 'backup' ]),
payload: string().when('action', {
is: v => v !== 'backup',
is: (v: string) => v !== 'backup',
then: string().required('A task payload must be provided.'),
otherwise: string(),
}),

View file

@ -32,9 +32,9 @@ const VariableBox = ({ variable }: Props) => {
updateStartupVariable(uuid, variable.envVariable, value)
.then(([ response, invocation ]) => mutate(data => ({
...data,
...data!,
invocation,
variables: (data.variables || []).map(v => v.envVariable === response.envVariable ? response : v),
variables: (data!.variables || []).map(v => v.envVariable === response.envVariable ? response : v),
}), false))
.catch(error => {
console.error(error);