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

Merge branch 'master' of https://github.com/muerwre/vault-frontend

Browse source
This commit is contained in:
Fedor Katurov 2020-04-01 19:56:54 +07:00
commit a759566590
6 changed files with 26 additions and 14784 deletions
Download patch file Download diff file Expand all files Collapse all files

14754
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

12
package.json
View file

@ -14,6 +14,10 @@
"url": "https://github.com/muerwre/my-empty-react-project" "url": "https://github.com/muerwre/my-empty-react-project"
}, },
"devDependencies": { "devDependencies": {
"@types/classnames": "^2.2.7",
"@types/node": "^11.13.22",
"@types/ramda": "^0.26.33",
"@types/react": "16.9.23",
"@babel/cli": "^7.6.4", "@babel/cli": "^7.6.4",
"@babel/preset-env": "^7.6.3", "@babel/preset-env": "^7.6.3",
"@babel/types": "7.5.5", "@babel/types": "7.5.5",
@ -50,10 +54,6 @@
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@hot-loader/react-dom": "^16.10.2", "@hot-loader/react-dom": "^16.10.2",
"@types/classnames": "^2.2.7",
"@types/node": "^11.13.22",
"@types/ramda": "^0.26.33",
"@types/react": "16.8.23",
"@typescript-eslint/eslint-plugin": "^1.13.0", "@typescript-eslint/eslint-plugin": "^1.13.0",
"@typescript-eslint/parser": "^1.13.0", "@typescript-eslint/parser": "^1.13.0",
"axios": "^0.18.0", "axios": "^0.18.0",
@ -87,8 +87,8 @@
"node-sass": "^4.11.0", "node-sass": "^4.11.0",
"raleway-cyrillic": "^4.0.2", "raleway-cyrillic": "^4.0.2",
"ramda": "^0.26.1", "ramda": "^0.26.1",
"react": "16.8.6", "react": "16.13.0",
"react-dom": "^16.10.2", "react-dom": "^16.13.0",
"react-hot-loader": "^4.12.15", "react-hot-loader": "^4.12.15",
"react-packery-component": "^1.0.2", "react-packery-component": "^1.0.2",
"react-redux": "^6.0.1", "react-redux": "^6.0.1",

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

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

4
src/components/editors/SortableAudioGrid/styles.scss
View file

@ -6,8 +6,4 @@
grid-row-gap: $gap; grid-row-gap: $gap;
grid-template-columns: auto; grid-template-columns: auto;
grid-template-rows: $comment_height; grid-template-rows: $comment_height;
@media (max-width: 600px) {
grid-template-columns: repeat(auto-fill, minmax(30vw, 1fr));
}
} }

2
src/components/editors/SortableAudioGridItem/index.tsx
View file

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { SortableElement } from 'react-sortable-hoc'; import { SortableElement } from 'react-sortable-hoc';
import * as styles from './styles.scss'; import styles from './styles.scss';
const SortableAudioGridItem = SortableElement(({ children }) => ( const SortableAudioGridItem = SortableElement(({ children }) => (
<div className={styles.item}>{children}</div> <div className={styles.item}>{children}</div>

4
src/components/input/InputText/index.tsx
View file

@ -1,4 +1,4 @@
import React, { FC, ChangeEvent, useCallback, useState, useEffect } from 'react'; import React, { FC, ChangeEvent, useCallback, useState, useEffect, LegacyRef } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import * as styles from '~/styles/inputs.scss'; import * as styles from '~/styles/inputs.scss';
import { Icon } from '~/components/input/Icon'; import { Icon } from '~/components/input/Icon';
@ -19,7 +19,7 @@ const InputText: FC<IInputTextProps> = ({
...props ...props
}) => { }) => {
const [focused, setFocused] = useState(false); const [focused, setFocused] = useState(false);
const [inner_ref, setInnerRef] = useState(); const [inner_ref, setInnerRef] = useState<HTMLInputElement>(null);
const onInput = useCallback( const onInput = useCallback(
({ target }: ChangeEvent<HTMLInputElement>) => handler(target.value), ({ target }: ChangeEvent<HTMLInputElement>) => handler(target.value),