muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

Audio title editing

Browse source
This commit is contained in:
Fedor Katurov 2020-03-16 16:52:16 +07:00
parent da47da9d6a
commit fff3770b1e
7 changed files with 304 additions and 242 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/editors/AudioGrid/index.tsx
View file

@ -28,9 +28,21 @@ const AudioGrid: FC<IProps> = ({ files, setFiles, locked }) => {
[setFiles, files]
);
const onTitleChange = useCallback(
(changeId: IFile['id'], title: IFile['metadata']['title']) => {
setFiles(
files.map(file =>
file && file.id === changeId ? { ...file, metadata: { ...file.metadata, title } } : file
)
);
},
[setFiles, files]
);
return (
<SortableAudioGrid
onDrop={onDrop}
onTitleChange={onTitleChange}
onSortEnd={onMove}
axis="xy"
items={files}

4
src/components/editors/SortableAudioGrid/index.tsx
View file

@ -12,17 +12,19 @@ const SortableAudioGrid = SortableContainer(
items,
locked,
onDrop,
onTitleChange,
}: {
items: IFile[];
locked: IUploadStatus[];
onDrop: (file_id: IFile['id']) => void;
onTitleChange: (file_id: IFile['id'], title: IFile['metadata']['title']) => void;
}) => (
<div className={styles.grid}>
{items
.filter(file => file && file.id)
.map((file, index) => (
<SortableImageGridItem key={file.id} index={index} collection={0}>
<AudioPlayer file={file} onDrop={onDrop} nonInteractive />
<AudioPlayer file={file} onDrop={onDrop} onTitleChange={onTitleChange} isEditing />
</SortableImageGridItem>
))}