StarMC/Astral-nook
StarMC/Astral-nook
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Slightly better logic for dropdown menus

Browse source
This commit is contained in:
Dane Everitt 2019-08-05 21:02:36 -07:00
parent 456473ad0f
commit 34e54b4944
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
2 changed files with 50 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

45
resources/scripts/components/server/files/RenameFileModal.tsx
View file

@ -6,14 +6,15 @@ import { join } from 'path';
import renameFile from '@/api/server/files/renameFile';
import { ServerContext } from '@/state/server';
import { FileObject } from '@/api/server/files/loadDirectory';
import classNames from 'classnames';
interface FormikValues {
name: string;
}
type Props = RequiredModalProps & { file: FileObject };
type Props = RequiredModalProps & { file: FileObject; useMoveTerminology?: boolean };
export default ({ file, ...props }: Props) => {
export default ({ file, useMoveTerminology, ...props }: Props) => {
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
const directory = ServerContext.useStoreState(state => state.files.directory);
const pushFile = ServerContext.useStoreActions(actions => actions.files.pushFile);
@ -38,22 +39,36 @@ export default ({ file, ...props }: Props) => {
onSubmit={submit}
initialValues={{ name: file.name }}
>
{({ isSubmitting }) => (
{({ isSubmitting, values }) => (
<Modal {...props} dismissable={!isSubmitting} showSpinnerOverlay={isSubmitting}>
<Form className={'m-0'}>
<Field
type={'string'}
id={'file_name'}
name={'name'}
label={'File Name'}
description={'Enter the new name of this file or folder.'}
autoFocus={true}
/>
<div className={'mt-6 text-right'}>
<button className={'btn btn-sm btn-primary'}>
Rename
</button>
<div className={classNames('flex', {
'items-center': useMoveTerminology,
'items-end': !useMoveTerminology,
})}>
<div className={'flex-1 mr-6'}>
<Field
type={'string'}
id={'file_name'}
name={'name'}
label={'File Name'}
description={useMoveTerminology
? 'Enter the new name and directory of this file or folder, relative to the current directory.'
: undefined
}
autoFocus={true}
/>
</div>
<div>
<button className={'btn btn-sm btn-primary'}>
{useMoveTerminology ? 'Move' : 'Rename'}
</button>
</div>
</div>
<p className={'text-xs mt-2 text-neutral-400'}>
<strong className={'text-neutral-200'}>New location:</strong>
&nbsp;/home/container/{join(directory, values.name).replace(/^(\.\.\/|\/)+/, '')}
</p>
</Form>
</Modal>
)}