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

removed player reducer, migrated to CRA 5

Browse source
This commit is contained in:
Fedor Katurov 2022-01-07 18:32:22 +07:00
parent 88f8fe21f7
commit 558e8f8a4f
211 changed files with 7131 additions and 10318 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/components/comment/Comment/index.tsx
View file

@ -1,11 +1,11 @@
import React, { FC, HTMLAttributes, memo } from 'react';
import { CommentWrapper } from '~/components/containers/CommentWrapper';
import { IComment, ICommentGroup, IFile } from '~/redux/types';
import { CommentContent } from '~/components/comment/CommentContent';
import styles from './styles.module.scss';
import { CommendDeleted } from '../../node/CommendDeleted';
import classNames from 'classnames';
import { NEW_COMMENT_CLASSNAME } from '~/constants/comment';
import React, { FC, HTMLAttributes, memo } from "react";
import { CommentWrapper } from "~/components/containers/CommentWrapper";
import { IComment, ICommentGroup, IFile } from "~/redux/types";
import { CommentContent } from "~/components/comment/CommentContent";
import styles from "./styles.module.scss";
import { CommendDeleted } from "../../node/CommendDeleted";
import classNames from "classnames";
import { NEW_COMMENT_CLASSNAME } from "~/constants/comment";
type IProps = HTMLAttributes<HTMLDivElement> & {
nodeId: number;

14
src/components/comment/CommentAvatar/index.tsx
View file

@ -1,10 +1,10 @@
import React, { FC, useCallback, useState } from 'react';
import { IUser } from '~/redux/auth/types';
import { Avatar } from '~/components/common/Avatar';
import { path } from 'ramda';
import { Manager, Popper, Reference } from 'react-popper';
import styles from './styles.module.scss';
import { useRandomPhrase } from '~/constants/phrases';
import React, { FC, useCallback, useState } from "react";
import { IUser } from "~/redux/auth/types";
import { Avatar } from "~/components/common/Avatar";
import { path } from "ramda";
import { Manager, Popper, Reference } from "react-popper";
import styles from "./styles.module.scss";
import { useRandomPhrase } from "~/constants/phrases";
interface Props {
user: IUser;

30
src/components/comment/CommentContent/index.tsx
View file

@ -1,18 +1,18 @@
import React, { createElement, FC, Fragment, memo, useCallback, useMemo, useState } from 'react';
import { IComment, IFile } from '~/redux/types';
import { append, assocPath, path } from 'ramda';
import { formatCommentText, getPrettyDate, getURL } from '~/utils/dom';
import { Group } from '~/components/containers/Group';
import styles from './styles.module.scss';
import { UploadType } from '~/constants/uploads';
import reduce from 'ramda/es/reduce';
import { AudioPlayer } from '~/components/media/AudioPlayer';
import classnames from 'classnames';
import classNames from 'classnames';
import { PRESETS } from '~/constants/urls';
import { COMMENT_BLOCK_RENDERERS } from '~/constants/comment';
import { CommentMenu } from '../CommentMenu';
import { CommentForm } from '~/components/comment/CommentForm';
import React, { createElement, FC, Fragment, memo, useCallback, useMemo, useState } from "react";
import { IComment, IFile } from "~/redux/types";
import { append, assocPath, path } from "ramda";
import { formatCommentText, getPrettyDate, getURL } from "~/utils/dom";
import { Group } from "~/components/containers/Group";
import styles from "./styles.module.scss";
import { UploadType } from "~/constants/uploads";
import reduce from "ramda/es/reduce";
import { AudioPlayer } from "~/components/media/AudioPlayer";
import classnames from "classnames";
import classNames from "classnames";
import { PRESETS } from "~/constants/urls";
import { COMMENT_BLOCK_RENDERERS } from "~/constants/comment";
import { CommentMenu } from "../CommentMenu";
import { CommentForm } from "~/components/comment/CommentForm";
interface IProps {
nodeId: number;

92
src/components/comment/CommentEmbedBlock/index.tsx
View file

@ -1,75 +1,45 @@
import React, { FC, memo, useEffect, useMemo } from 'react';
import { ICommentBlockProps } from '~/constants/comment';
import styles from './styles.module.scss';
import { getYoutubeThumb } from '~/utils/dom';
import { selectPlayer } from '~/redux/player/selectors';
import { connect } from 'react-redux';
import * as PLAYER_ACTIONS from '~/redux/player/actions';
import { Icon } from '~/components/input/Icon';
import { path } from 'ramda';
import React, { FC, memo, useMemo } from "react";
import { ICommentBlockProps } from "~/constants/comment";
import styles from "./styles.module.scss";
import { getYoutubeThumb } from "~/utils/dom";
import { Icon } from "~/components/input/Icon";
import { useYoutubeMetadata } from "~/hooks/metadata/useYoutubeMetadata";
const mapStateToProps = state => ({
youtubes: selectPlayer(state).youtubes,
});
type Props = ICommentBlockProps & {};
const mapDispatchToProps = {
playerGetYoutubeInfo: PLAYER_ACTIONS.playerGetYoutubeInfo,
};
const CommentEmbedBlock: FC<Props> = memo(({ block }) => {
const id = useMemo(() => {
const match = block.content.match(
/https?:\/\/(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch)?(?:\?v=)?([\w\-\=]+)/
);
type Props = ReturnType<typeof mapStateToProps> &
typeof mapDispatchToProps &
ICommentBlockProps & {};
return (match && match[1]) || '';
}, [block.content]);
const CommentEmbedBlockUnconnected: FC<Props> = memo(
({ block, youtubes, playerGetYoutubeInfo }) => {
const id = useMemo(() => {
const match = block.content.match(
/https?:\/\/(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch)?(?:\?v=)?([\w\-\=]+)/
);
const url = useMemo(() => `https://youtube.com/watch?v=${id}`, [id]);
return (match && match[1]) || '';
}, [block.content]);
const preview = useMemo(() => getYoutubeThumb(block.content), [block.content]);
const url = useMemo(() => `https://youtube.com/watch?v=${id}`, [id]);
const metadata = useYoutubeMetadata(id);
const title = metadata?.metadata?.title || '';
const preview = useMemo(() => getYoutubeThumb(block.content), [block.content]);
return (
<div className={styles.embed}>
<a href={url} target="_blank" rel="noreferrer" />
useEffect(() => {
if (!id) return;
playerGetYoutubeInfo(id);
}, [id, playerGetYoutubeInfo]);
const title = useMemo<string>(() => {
if (!id) {
return block.content;
}
return path([id, 'metadata', 'title'], youtubes) || block.content;
}, [id, youtubes, block.content]);
return (
<div className={styles.embed}>
<a href={url} target="_blank" />
<div className={styles.preview}>
<div style={{ backgroundImage: `url("${preview}")` }}>
<div className={styles.backdrop}>
<div className={styles.play}>
<Icon icon="play" size={32} />
</div>
<div className={styles.title}>{title}</div>
<div className={styles.preview}>
<div style={{ backgroundImage: `url("${preview}")` }}>
<div className={styles.backdrop}>
<div className={styles.play}>
<Icon icon="play" size={32} />
</div>
<div className={styles.title}>{title}</div>
</div>
</div>
</div>
);
}
);
const CommentEmbedBlock = connect(
mapStateToProps,
mapDispatchToProps
)(CommentEmbedBlockUnconnected);
</div>
);
});
export { CommentEmbedBlock };

40
src/components/comment/CommentForm/index.tsx
View file

@ -1,23 +1,23 @@
import React, { FC, useCallback, useState } from 'react';
import { useCommentFormFormik } from '~/hooks/comments/useCommentFormFormik';
import { FormikProvider } from 'formik';
import { LocalCommentFormTextarea } from '~/components/comment/LocalCommentFormTextarea';
import { Button } from '~/components/input/Button';
import { UploadSubject, UploadTarget } from '~/constants/uploads';
import { CommentFormAttachButtons } from '~/components/comment/CommentFormAttachButtons';
import { CommentFormFormatButtons } from '~/components/comment/CommentFormFormatButtons';
import { CommentFormAttaches } from '~/components/comment/CommentFormAttaches';
import { LoaderCircle } from '~/components/input/LoaderCircle';
import { IComment, INode } from '~/redux/types';
import { EMPTY_COMMENT } from '~/constants/node';
import { UploadDropzone } from '~/components/upload/UploadDropzone';
import styles from './styles.module.scss';
import { ERROR_LITERAL } from '~/constants/errors';
import { useInputPasteUpload } from '~/hooks/dom/useInputPasteUpload';
import { Filler } from '~/components/containers/Filler';
import { useUploader } from '~/hooks/data/useUploader';
import { UploaderContextProvider } from '~/utils/context/UploaderContextProvider';
import { observer } from 'mobx-react-lite';
import React, { FC, useCallback, useState } from "react";
import { useCommentFormFormik } from "~/hooks/comments/useCommentFormFormik";
import { FormikProvider } from "formik";
import { LocalCommentFormTextarea } from "~/components/comment/LocalCommentFormTextarea";
import { Button } from "~/components/input/Button";
import { UploadSubject, UploadTarget } from "~/constants/uploads";
import { CommentFormAttachButtons } from "~/components/comment/CommentFormAttachButtons";
import { CommentFormFormatButtons } from "~/components/comment/CommentFormFormatButtons";
import { CommentFormAttaches } from "~/components/comment/CommentFormAttaches";
import { LoaderCircle } from "~/components/input/LoaderCircle";
import { IComment, INode } from "~/redux/types";
import { EMPTY_COMMENT } from "~/constants/node";
import { UploadDropzone } from "~/components/upload/UploadDropzone";
import styles from "./styles.module.scss";
import { ERROR_LITERAL } from "~/constants/errors";
import { useInputPasteUpload } from "~/hooks/dom/useInputPasteUpload";
import { Filler } from "~/components/containers/Filler";
import { useUploader } from "~/hooks/data/useUploader";
import { UploaderContextProvider } from "~/utils/context/UploaderContextProvider";
import { observer } from "mobx-react-lite";
interface IProps {
comment?: IComment;

8
src/components/comment/CommentFormAttachButtons/index.tsx
View file

@ -1,7 +1,7 @@
import React, { FC, useCallback } from 'react';
import { ButtonGroup } from '~/components/input/ButtonGroup';
import { Button } from '~/components/input/Button';
import { COMMENT_FILE_TYPES } from '~/constants/uploads';
import React, { FC, useCallback } from "react";
import { ButtonGroup } from "~/components/input/ButtonGroup";
import { Button } from "~/components/input/Button";
import { COMMENT_FILE_TYPES } from "~/constants/uploads";
interface IProps {
onUpload: (files: File[]) => void;

10
src/components/comment/CommentFormFormatButtons/index.tsx
View file

@ -1,8 +1,8 @@
import React, { FC, useCallback, useEffect } from 'react';
import { ButtonGroup } from '~/components/input/ButtonGroup';
import { Button } from '~/components/input/Button';
import { useFormatWrapper, wrapTextInsideInput } from '~/hooks/dom/useFormatWrapper';
import styles from './styles.module.scss';
import React, { FC, useCallback, useEffect } from "react";
import { ButtonGroup } from "~/components/input/ButtonGroup";
import { Button } from "~/components/input/Button";
import { useFormatWrapper, wrapTextInsideInput } from "~/hooks/dom/useFormatWrapper";
import styles from "./styles.module.scss";
interface IProps {
element: HTMLTextAreaElement;

4
src/components/comment/CommentMenu/index.tsx
View file

@ -1,5 +1,5 @@
import React, { FC, useCallback, useState } from 'react';
import styles from './styles.module.scss';
import React, { FC, useCallback, useState } from "react";
import styles from "./styles.module.scss";
interface IProps {
onEdit: () => void;

12
src/components/comment/CommentTextBlock/index.tsx
View file

@ -1,9 +1,9 @@
import React, { FC, useMemo } from 'react';
import { ICommentBlockProps } from '~/constants/comment';
import styles from './styles.module.scss';
import classNames from 'classnames';
import markdown from '~/styles/common/markdown.module.scss';
import { formatText } from '~/utils/dom';
import React, { FC, useMemo } from "react";
import { ICommentBlockProps } from "~/constants/comment";
import styles from "./styles.module.scss";
import classNames from "classnames";
import markdown from "~/styles/common/markdown.module.scss";
import { formatText } from "~/utils/dom";
interface IProps extends ICommentBlockProps {}

13
src/components/comment/LocalCommentFormTextarea/index.tsx
View file

@ -1,12 +1,7 @@
import React, {
forwardRef,
KeyboardEventHandler,
TextareaHTMLAttributes,
useCallback,
} from 'react';
import { Textarea } from '~/components/input/Textarea';
import { useCommentFormContext } from '~/hooks/comments/useCommentFormFormik';
import { useRandomPhrase } from '~/constants/phrases';
import React, { forwardRef, KeyboardEventHandler, TextareaHTMLAttributes, useCallback } from "react";
import { Textarea } from "~/components/input/Textarea";
import { useCommentFormContext } from "~/hooks/comments/useCommentFormFormik";
import { useRandomPhrase } from "~/constants/phrases";
interface IProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
isLoading?: boolean;