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

fixed audio grid on mobile

Browse source
This commit is contained in:
muerwre 2020-03-16 19:34:33 +07:00
parent c989d50277
commit 44045e7764
6 changed files with 26 additions and 14784 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -2,7 +2,7 @@ import React from 'react';
import { SortableContainer } from 'react-sortable-hoc';
import { AudioUpload } from '~/components/upload/AudioUpload';
import * as styles from './styles.scss';
import { SortableImageGridItem } from '~/components/editors/SortableImageGridItem';
import { SortableAudioGridItem } from '~/components/editors/SortableAudioGridItem';
import { IFile } from '~/redux/types';
import { IUploadStatus } from '~/redux/uploads/reducer';
import { AudioPlayer } from '~/components/media/AudioPlayer';
@ -19,22 +19,22 @@ const SortableAudioGrid = SortableContainer(
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} onTitleChange={onTitleChange} isEditing />
</SortableImageGridItem>
))}
<div className={styles.grid}>
{items
.filter(file => file && file.id)
.map((file, index) => (
<SortableAudioGridItem key={file.id} index={index} collection={0}>
<AudioPlayer file={file} onDrop={onDrop} onTitleChange={onTitleChange} isEditing />
</SortableAudioGridItem>
))}
{locked.map((item, index) => (
<SortableImageGridItem key={item.temp_id} index={index} collection={1} disabled>
<AudioUpload title={item.name} progress={item.progress} is_uploading />
</SortableImageGridItem>
))}
</div>
)
{locked.map((item, index) => (
<SortableAudioGridItem key={item.temp_id} index={index} collection={1} disabled>
<AudioUpload title={item.name} progress={item.progress} is_uploading />
</SortableAudioGridItem>
))}
</div>
)
);
export { SortableAudioGrid };