1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00

refactor main components and IProps

This commit is contained in:
Fedor Katurov 2023-11-22 19:59:17 +06:00
parent 85a182c053
commit efbaf13151
124 changed files with 235 additions and 256 deletions

View file

@ -4,12 +4,12 @@ import { describeArc } from '~/utils/dom';
import styles from './styles.module.scss';
interface IProps {
interface Props {
size: number;
progress?: number;
}
export const ArcProgress: FC<IProps> = ({ size, progress = 0 }) => (
export const ArcProgress: FC<Props> = ({ size, progress = 0 }) => (
<svg className={styles.icon} width={size} height={size}>
<path
d={describeArc(

View file

@ -4,12 +4,12 @@ import { observer } from 'mobx-react-lite';
import { useAuth } from '~/hooks/auth/useAuth';
interface IProps {
interface Props {
// don't wait for user refetch, trust hydration
hydratedOnly?: boolean;
}
const Authorized: FC<IProps> = observer(({ children, hydratedOnly }) => {
const Authorized: FC<Props> = observer(({ children, hydratedOnly }) => {
const { isUser, fetched } = useAuth();
if (!isUser || (!hydratedOnly && !fetched)) return null;

View file

@ -7,7 +7,7 @@ import { LoaderCircle } from '~/components/common/LoaderCircle';
import styles from './styles.module.scss';
interface IProps {
interface Props {
children: ReactChild;
header?: JSX.Element;
footer?: JSX.Element;
@ -23,7 +23,7 @@ interface IProps {
onClose?: () => void;
}
const BetterScrollDialog: FC<IProps> = ({
const BetterScrollDialog: FC<Props> = ({
children,
header,
footer,

View file

@ -4,9 +4,9 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = AllHTMLAttributes<HTMLDivElement> & { is_blurred: boolean };
type Props = AllHTMLAttributes<HTMLDivElement> & { is_blurred: boolean };
export const BlurWrapper: FC<IProps> = ({ children, is_blurred }) => (
export const BlurWrapper: FC<Props> = ({ children, is_blurred }) => (
<div className={classNames(styles.blur, { [styles.is_blurred]: is_blurred })}>
{children}
</div>

View file

@ -0,0 +1,11 @@
import styles from './styles.module.scss';
const BottomContainer = ({ children }) => (
<div className={styles.wrap}>
<div className={styles.content}>
<div className={styles.padder}></div>
</div>
</div>
);
export { BottomContainer };

View file

@ -4,12 +4,12 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {
type Props = HTMLAttributes<HTMLDivElement> & {
children: any;
size: number;
};
const CellGrid: FC<IProps> = ({ children, size, className, ...props }) => (
const CellGrid: FC<Props> = ({ children, size, className, ...props }) => (
<div
className={classNames(styles.grid, className)}
style={{ gridTemplateColumns: `repeat(auto-fit, minmax(${size}px, 1fr))` }}

View file

@ -4,11 +4,11 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
interface IProps {
interface Props {
className?: string;
}
const Container: FC<IProps> = ({ className, children }) => (
const Container: FC<Props> = ({ className, children }) => (
<div className={classNames(styles.container, className)}>{children}</div>
);

View file

@ -8,11 +8,11 @@ import { getURL } from '~/utils/dom';
import styles from './styles.module.scss';
interface IProps {
interface Props {
cover: IUser['cover'];
}
const CoverBackdrop: FC<IProps> = ({ cover }) => {
const CoverBackdrop: FC<Props> = ({ cover }) => {
const ref = useRef<HTMLImageElement>(null);
const [is_loaded, setIsLoaded] = useState(false);

View file

@ -2,11 +2,11 @@ import { FC, ReactNode } from 'react';
import styles from './styles.module.scss';
interface IProps {
interface Props {
children: ReactNode;
}
const DialogTitle: FC<IProps> = ({ children }) => (
const DialogTitle: FC<Props> = ({ children }) => (
<h2 className={styles.title}>{children}</h2>
);

View file

@ -4,8 +4,8 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement>;
type Props = HTMLAttributes<HTMLDivElement>;
export const Filler: FC<IProps> = ({ className = '', ...props }) => (
export const Filler: FC<Props> = ({ className = '', ...props }) => (
<div className={classNames(styles.filler, className)} {...props} />
);

View file

@ -2,9 +2,9 @@ import { FC, memo } from 'react';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const Footer: FC<IProps> = memo(() => (
const Footer: FC<Props> = memo(() => (
<footer className={styles.footer}>
<div className={styles.slogan}>Уделяй больше времени тишине. Спасибо</div>
<div className={styles.copy}>2009 - {new Date().getFullYear()}</div>

View file

@ -4,7 +4,7 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {
type Props = HTMLAttributes<HTMLDivElement> & {
horizontal?: boolean;
vertical?: boolean;
columns?: string;
@ -15,7 +15,7 @@ type IProps = HTMLAttributes<HTMLDivElement> & {
stretchy?: boolean;
};
const Grid: FC<IProps> = ({
const Grid: FC<Props> = ({
children,
className = '',
horizontal = false,

View file

@ -4,7 +4,7 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {
type Props = HTMLAttributes<HTMLDivElement> & {
horizontal?: boolean;
top?: boolean;
bottom?: boolean;
@ -12,7 +12,7 @@ type IProps = HTMLAttributes<HTMLDivElement> & {
seamless?: boolean;
};
const Group: FC<IProps> = ({
const Group: FC<Props> = ({
children,
className = '',
horizontal = false,

View file

@ -2,12 +2,12 @@ import { FC, SVGAttributes } from 'react';
import { IIcon } from '~/types';
type IProps = SVGAttributes<SVGElement> & {
type Props = SVGAttributes<SVGElement> & {
size?: number;
icon: IIcon;
};
export const Icon: FC<IProps> = ({ size = 20, icon, style, ...props }) => (
export const Icon: FC<Props> = ({ size = 20, icon, style, ...props }) => (
<svg
width={size}
height={size}

View file

@ -2,13 +2,13 @@ import { FC, HTMLAttributes, useCallback, useEffect, useRef } from 'react';
import styles from './styles.module.scss';
interface IProps extends HTMLAttributes<HTMLDivElement> {
interface Props extends HTMLAttributes<HTMLDivElement> {
hasMore: boolean;
scrollReactPx?: number;
loadMore: () => void;
}
const InfiniteScroll: FC<IProps> = ({
const InfiniteScroll: FC<Props> = ({
children,
hasMore,
scrollReactPx,

View file

@ -6,12 +6,12 @@ import { describeArc } from '~/utils/dom';
import styles from './styles.module.scss';
interface IProps extends SVGAttributes<SVGElement> {
interface Props extends SVGAttributes<SVGElement> {
size: number;
className?: string;
}
const LoaderCircleInner: FC<IProps> = ({ size, className, ...props }) => (
const LoaderCircleInner: FC<Props> = ({ size, className, ...props }) => (
<svg
className={classNames(styles.icon, className)}
width={size}

View file

@ -7,12 +7,12 @@ import { SVGProps } from '~/utils/types';
import { LoaderCircleInner } from './components/LoaderCircleInner';
import styles from './styles.module.scss';
interface IProps extends SVGProps {
interface Props extends SVGProps {
size?: number;
className?: string;
}
export const LoaderCircle: FC<IProps> = ({ size = 24, className }) => (
export const LoaderCircle: FC<Props> = ({ size = 24, className }) => (
<div className={classNames(styles.wrap, 'loader-circle', className)}>
<LoaderCircleInner size={size} />
</div>

View file

@ -5,12 +5,12 @@ import classNames from 'classnames';
import styles from '~/styles/common/markdown.module.scss';
import { formatText } from '~/utils/dom';
interface IProps
interface Props
extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
children?: string;
}
const Markdown: VFC<IProps> = ({ className, children = '', ...props }) => (
const Markdown: VFC<Props> = ({ className, children = '', ...props }) => (
<div
className={classNames(styles.wrapper, className)}
{...props}

View file

@ -4,11 +4,11 @@ import ReactDOM from 'react-dom';
import styles from './styles.module.scss';
type IProps = {
type Props = {
onOverlayClick: MouseEventHandler;
};
const ModalWrapper: FC<IProps> = ({ children, onOverlayClick }) => {
const ModalWrapper: FC<Props> = ({ children, onOverlayClick }) => {
return ReactDOM.createPortal(
<div className={styles.fixed}>
<div className={styles.overlay} onClick={onOverlayClick} />

View file

@ -4,13 +4,13 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {
type Props = HTMLAttributes<HTMLDivElement> & {
padding?: number;
vertical?: boolean;
horizontal?: boolean;
};
const Padder: FC<IProps> = ({
const Padder: FC<Props> = ({
padding,
children,
className,

View file

@ -4,12 +4,12 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {
type Props = HTMLAttributes<HTMLDivElement> & {
seamless?: boolean;
stretchy?: boolean;
};
const Panel: FC<IProps> = ({
const Panel: FC<Props> = ({
className,
children,
seamless,

View file

@ -2,11 +2,11 @@ import { DetailsHTMLAttributes, FC } from 'react';
import StickyBox from 'react-sticky-box';
interface IProps extends DetailsHTMLAttributes<HTMLDivElement> {
interface Props extends DetailsHTMLAttributes<HTMLDivElement> {
offsetTop?: number;
}
const Sticky: FC<IProps> = ({ children, offsetTop = 65 }) => (
const Sticky: FC<Props> = ({ children, offsetTop = 65 }) => (
<StickyBox offsetTop={offsetTop} offsetBottom={10}>
{children}
</StickyBox>

View file

@ -4,9 +4,9 @@ import { observer } from 'mobx-react-lite';
import { useAuth } from '~/hooks/auth/useAuth';
interface IProps {}
interface Props {}
const Superpower: FC<IProps> = observer(({ children }) => {
const Superpower: FC<Props> = observer(({ children }) => {
const { isTester } = useAuth();
if (!isTester) return null;

View file

@ -2,9 +2,9 @@ import { FC, HTMLAttributes } from 'react';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {};
type Props = HTMLAttributes<HTMLDivElement> & {};
const TagField: FC<IProps> = ({ children }) => (
const TagField: FC<Props> = ({ children }) => (
<div className={styles.wrap}>{children}</div>
);

View file

@ -4,8 +4,8 @@ import classNames from 'classnames';
import styles from './styles.module.scss';
type IProps = HTMLAttributes<HTMLDivElement> & {};
type Props = HTMLAttributes<HTMLDivElement> & {};
export const ButtonGroup = ({ children, className }: IProps) => (
export const ButtonGroup = ({ children, className }: Props) => (
<div className={classNames(styles.wrap, className)}>{children}</div>
);

View file

@ -16,7 +16,7 @@ import { useForwardRef } from '~/hooks/dom/useForwardRef';
import styles from './styles.module.scss';
type IProps = DetailedHTMLProps<
type Props = DetailedHTMLProps<
TextareaHTMLAttributes<HTMLTextAreaElement>,
HTMLTextAreaElement
> & {
@ -29,7 +29,7 @@ type IProps = DetailedHTMLProps<
title?: string;
};
const Textarea = forwardRef<HTMLTextAreaElement, IProps>(
const Textarea = forwardRef<HTMLTextAreaElement, Props>(
(
{
placeholder,

View file

@ -8,13 +8,13 @@ import styles from './styles.module.scss';
type ToggleColor = 'primary' | 'secondary' | 'lab' | 'danger' | 'white';
type IProps = Omit<ButtonProps, 'value' | 'color'> & {
type Props = Omit<ButtonProps, 'value' | 'color'> & {
value?: boolean;
handler?: (val: boolean) => void;
color?: ToggleColor;
};
const Toggle: FC<IProps> = ({ value, handler, color = 'primary', ...rest }) => {
const Toggle: FC<Props> = ({ value, handler, color = 'primary', ...rest }) => {
const onClick = useCallback(() => {
if (!handler) {
return;

View file

@ -5,12 +5,12 @@ import { IComment } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
id: IComment['id'];
onDelete: (id: IComment['id'], isLocked: boolean) => void;
}
const CommendDeleted: FC<IProps> = ({ id, onDelete }) => {
const CommendDeleted: FC<Props> = ({ id, onDelete }) => {
const onRestore = useCallback(() => onDelete(id, false), [id, onDelete]);
return (

View file

@ -6,9 +6,9 @@ import { useNodeAudios } from '~/hooks/node/useNodeAudios';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const NodeAudioBlock: FC<IProps> = ({ node }) => {
const NodeAudioBlock: FC<Props> = ({ node }) => {
const audios = useNodeAudios(node);
return (

View file

@ -8,9 +8,9 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const NodeAudioImageBlock: FC<IProps> = ({ node }) => {
const NodeAudioImageBlock: FC<Props> = ({ node }) => {
const images = useNodeImages(node);
if (images.length === 0) return null;

View file

@ -2,9 +2,9 @@ import { FC } from 'react';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const NodeDeletedBadge: FC<IProps> = () => {
const NodeDeletedBadge: FC<Props> = () => {
return (
<div className={styles.badge}>
Эта ячейка заблокирована. Её не никто не увидит.

View file

@ -22,9 +22,9 @@ import { getNodeSwiperImageSizes } from './helpers';
import { NODE_SWIPER_OPTIONS } from './options';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const NodeImageSwiperBlock: FC<IProps> = observer(({ node }) => {
const NodeImageSwiperBlock: FC<Props> = observer(({ node }) => {
const [controlledSwiper, setControlledSwiper] = useState<SwiperClass>();
const showPhotoSwiper = useImageModal();
const { isOpened: isModalActive } = useModal();

View file

@ -8,12 +8,12 @@ import { t } from '~/utils/trans';
import styles from './styles.module.scss';
interface IProps {
interface Props {
loading?: boolean;
count?: number;
}
const NodeNoComments: FC<IProps> = ({ loading = false, count = 3 }) => {
const NodeNoComments: FC<Props> = ({ loading = false, count = 3 }) => {
const items = useMemo(
() =>
[...new Array(count)].map((_, i) => (

View file

@ -8,12 +8,12 @@ import { INode } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
title: ReactElement | string;
items: Partial<INode>[];
}
const NodeRelated: FC<IProps> = ({ title, items }) => {
const NodeRelated: FC<Props> = ({ title, items }) => {
return (
<Group className={styles.wrap}>
<SubTitle className={styles.title}>{title}</SubTitle>

View file

@ -9,9 +9,9 @@ import { range } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const NodeRelatedPlaceholder: FC<IProps> = memo(() => {
const NodeRelatedPlaceholder: FC<Props> = memo(() => {
return (
<Group className={classNames(styles.wrap, styles.placeholder)}>
<div className={styles.title}>

View file

@ -7,13 +7,13 @@ import { useTagSidebar } from '~/hooks/sidebar/useTagSidebar';
import { INode } from '~/types';
import { INodeRelated } from '~/types/node';
interface IProps {
interface Props {
isLoading: boolean;
node: INode;
related: INodeRelated;
}
const NodeRelatedBlock: FC<IProps> = ({ isLoading, node, related }) => {
const NodeRelatedBlock: FC<Props> = ({ isLoading, node, related }) => {
const goToTag = useTagSidebar();
if (isLoading) {

View file

@ -3,7 +3,7 @@ import { FC, memo } from 'react';
import { Tags } from '~/containers/tags/Tags';
import { ITag } from '~/types';
interface IProps {
interface Props {
is_deletable?: boolean;
is_editable?: boolean;
tags: ITag[];
@ -12,7 +12,7 @@ interface IProps {
onTagDelete?: (id: ITag['ID']) => void;
}
const NodeTags: FC<IProps> = memo(
const NodeTags: FC<Props> = memo(
({ is_editable, is_deletable, tags, onChange, onTagClick, onTagDelete }) => {
return (
<Tags

View file

@ -3,9 +3,9 @@ import { FC } from 'react';
import { NodeTags } from '~/components/node/NodeTags';
import { useTagContext } from '~/utils/context/TagsContextProvider';
interface IProps {}
interface Props {}
const NodeTagsBlock: FC<IProps> = () => {
const NodeTagsBlock: FC<Props> = () => {
const {
tags,
canAppend,

View file

@ -3,13 +3,13 @@ import { FC, memo } from 'react';
import { Tags } from '~/containers/tags/Tags';
import { ITag } from '~/types';
interface IProps {
interface Props {
is_editable?: boolean;
tags: ITag[];
onChange?: (tags: string[]) => void;
}
const NodeTagsPlaceholder: FC<IProps> = memo(
const NodeTagsPlaceholder: FC<Props> = memo(
({ is_editable, tags, onChange }) => (
<Tags tags={tags} editable={is_editable} onTagsChange={onChange} />
),

View file

@ -10,9 +10,9 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const NodeTextBlock: FC<IProps> = ({ node }) => {
const NodeTextBlock: FC<Props> = ({ node }) => {
const content = useMemo(
() => formatTextParagraphs(path(['blocks', 0, 'text'], node) || ''),
[node],

View file

@ -11,7 +11,7 @@ import { NodeLikeButton } from '../NodeLikeButton';
import styles from './styles.module.scss';
interface IProps {
interface Props {
id?: number;
title: string;
username?: string;
@ -34,7 +34,7 @@ interface IProps {
onEdit: () => void;
}
const NodeTitle: VFC<IProps> = memo(
const NodeTitle: VFC<Props> = memo(
({
title,
username,

View file

@ -5,9 +5,9 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const NodeVideoBlock: FC<IProps> = ({ node }) => {
const NodeVideoBlock: FC<Props> = ({ node }) => {
const video = useMemo(() => {
const url: string = path(['blocks', 0, 'url'], node) || '';
const match =

View file

@ -6,12 +6,12 @@ import { ERROR_LITERAL } from '~/constants/errors';
import styles from './styles.module.scss';
interface IProps {
interface Props {
onClose: () => void;
error: string;
}
const ProfileAccountsError: FC<IProps> = ({ onClose, error }) => (
const ProfileAccountsError: FC<Props> = ({ onClose, error }) => (
<div className={styles.wrap}>
<Group className={styles.content}>
<div className={styles.title}>О НЕТ!</div>

View file

@ -12,7 +12,7 @@ import {
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const Form = ({ children, className }) => {
const { handleSubmit } = useSettings();
@ -24,7 +24,7 @@ const Form = ({ children, className }) => {
);
};
const ProfileSidebarSettings: FC<IProps> = () => {
const ProfileSidebarSettings: FC<Props> = () => {
const { closeAllTabs } = useStackContext();
return (

View file

@ -6,13 +6,13 @@ import { useCloseOnEscape } from '~/hooks';
import styles from './styles.module.scss';
interface IProps {
interface Props {
onClose?: () => void;
closeOnBackdropClick?: boolean;
backdrop?: ReactNode;
}
const SidebarWrapper: FC<IProps> = ({
const SidebarWrapper: FC<Props> = ({
children,
onClose,
closeOnBackdropClick = true,

View file

@ -5,11 +5,11 @@ import { INode } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
nodes: INode[];
}
const TagSidebarList: FC<IProps> = ({ nodes }) => (
const TagSidebarList: FC<Props> = ({ nodes }) => (
<div className={styles.list}>
{nodes.map((node) => (
<NodeHorizontalCard node={node} key={node.id} />

View file

@ -3,7 +3,7 @@ import { FC, FocusEventHandler, useCallback } from 'react';
import { TagWrapper } from '~/components/tags/TagWrapper';
import { ITag } from '~/types';
interface IProps {
interface Props {
tag: Partial<ITag>;
size?: 'normal' | 'big';
@ -16,7 +16,7 @@ interface IProps {
onDelete?: (id: ITag['ID']) => void;
}
const Tag: FC<IProps> = ({
const Tag: FC<Props> = ({
tag,
deletable: deletable,
hoverable: hoverable,

View file

@ -6,19 +6,14 @@ import { Icon } from '~/components/common/Icon';
import styles from './styles.module.scss';
interface IProps {
interface Props {
selected: boolean;
title: string;
type: 'enter' | 'right' | 'tag';
onSelect: (val: string) => void;
}
const TagAutocompleteRow: FC<IProps> = ({
selected,
type,
title,
onSelect,
}) => {
const TagAutocompleteRow: FC<Props> = ({ selected, type, title, onSelect }) => {
const onClick = useCallback(() => onSelect(title), [title, onSelect]);
return (

View file

@ -6,7 +6,7 @@ import { Icon } from '~/components/common/Icon';
import styles from './styles.module.scss';
interface IProps {
interface Props {
className?: string;
size?: string;
color?: 'primary' | 'danger' | 'info' | 'black' | 'default';
@ -18,7 +18,7 @@ interface IProps {
title?: string;
}
const TagWrapper: FC<IProps> = ({
const TagWrapper: FC<Props> = ({
className,
color = 'default',
children,

View file

@ -7,7 +7,7 @@ import { Icon } from '~/components/common/Icon';
import styles from './styles.module.scss';
interface IProps {
interface Props {
id?: string;
title?: string;
progress?: number;
@ -16,13 +16,7 @@ interface IProps {
uploading?: boolean;
}
const AudioUpload: FC<IProps> = ({
title,
progress,
uploading,
id,
onDrop,
}) => {
const AudioUpload: FC<Props> = ({ title, progress, uploading, id, onDrop }) => {
const onDropFile = useCallback(() => {
if (!id || !onDrop) return;
onDrop(id);

View file

@ -8,7 +8,7 @@ import { IFile } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
id?: IFile['id'];
thumb?: string;
progress?: number;
@ -17,13 +17,7 @@ interface IProps {
uploading?: boolean;
}
const ImageUpload: FC<IProps> = ({
thumb,
progress,
uploading,
id,
onDrop,
}) => {
const ImageUpload: FC<Props> = ({ thumb, progress, uploading, id, onDrop }) => {
const onDropFile = useCallback(() => {
if (!id || !onDrop) return;
onDrop(id);

View file

@ -10,12 +10,12 @@ import { DivProps } from '~/utils/types';
import styles from './styles.module.scss';
interface IProps extends DivProps {
interface Props extends DivProps {
onUpload: (files: File[]) => void;
helperClassName?: string;
}
const UploadDropzone: FC<IProps> = ({
const UploadDropzone: FC<Props> = ({
children,
onUpload,
helperClassName,

View file

@ -1,6 +1,6 @@
import classNames from 'classnames';
import { Container } from '~/containers/main/Container';
import { Container } from '~/components/common/Container';
import markdown from '~/styles/common/markdown.module.scss';
import { WelcomeSlideWrapper } from '../WelcomeSlideWrapper';

View file

@ -2,8 +2,8 @@ import { FC } from 'react';
import classNames from 'classnames';
import { Container } from '~/components/common/Container';
import { Filler } from '~/components/common/Filler';
import { Container } from '~/containers/main/Container';
import { useAuth } from '~/hooks/auth/useAuth';
import markdown from '~/styles/common/markdown.module.scss';

View file

@ -7,11 +7,11 @@ import { OAuthProvider } from '~/types/auth';
import styles from './styles.module.scss';
interface IProps {
interface Props {
openOauthWindow: (provider: OAuthProvider) => void;
}
const LoginDialogButtons: FC<IProps> = ({ openOauthWindow }) => (
const LoginDialogButtons: FC<Props> = ({ openOauthWindow }) => (
<Group className={styles.footer}>
<Button>Войти</Button>

View file

@ -4,9 +4,9 @@ import { Button } from '~/components/input/Button';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const LoginSocialRegisterButtons: FC<IProps> = () => (
const LoginSocialRegisterButtons: FC<Props> = () => (
<div className={styles.wrap}>
<Button>Впустите меня!</Button>
</div>

View file

@ -4,12 +4,12 @@ import { Toggle } from '~/components/input/Toggle';
import styles from './styles.module.scss';
interface IProps {
interface Props {
active?: boolean;
onChange?: (val: boolean) => void;
}
const BorisSuperpowers: FC<IProps> = ({ active, onChange }) => {
const BorisSuperpowers: FC<Props> = ({ active, onChange }) => {
const onToggle = useCallback(() => {
if (!onChange) {
return;

View file

@ -1,7 +1,7 @@
import { FC } from 'react';
import { Footer } from '~/components/common/Footer';
import { Group } from '~/components/common/Group';
import { Footer } from '~/components/main/Footer';
import { NodeNoComments } from '~/components/node/NodeNoComments';
import { NodeCommentFormSSR } from '~/containers/node/NodeCommentForm/ssr';
import { NodeComments } from '~/containers/node/NodeComments';

View file

@ -9,12 +9,12 @@ import { BorisGraphicStats } from '../BorisGraphicStats';
import styles from './styles.module.scss';
interface IProps {
interface Props {
stats: StatBackend;
isLoading: boolean;
}
const BorisStatsBackend: FC<IProps> = ({ isLoading, stats }) => {
const BorisStatsBackend: FC<Props> = ({ isLoading, stats }) => {
const commentsByMonth = useMemo(
() => stats.comments.by_month?.slice(0, -1),
[stats.comments.by_month],

View file

@ -7,12 +7,12 @@ import { BorisStatsGitCard } from '../BorisStatsGitCard';
import styles from './styles.module.scss';
interface IProps {
interface Props {
issues: GithubIssue[];
isLoading: boolean;
}
const BorisStatsGit: FC<IProps> = ({ issues, isLoading }) => {
const BorisStatsGit: FC<Props> = ({ issues, isLoading }) => {
const open = useMemo(
() =>
issues

View file

@ -7,7 +7,7 @@ import { getPrettyDate } from '~/utils/dom';
import styles from './styles.module.scss';
interface IProps {
interface Props {
data: GithubIssue;
}
@ -16,7 +16,7 @@ const stateLabels: Record<GithubIssue['state'], string> = {
closed: 'Сделано',
};
const BorisStatsGitCard: FC<IProps> = ({
const BorisStatsGitCard: FC<Props> = ({
data: { created_at, title, html_url, state },
}) => {
const date = useMemo(() => getPrettyDate(created_at), [created_at]);

View file

@ -5,12 +5,12 @@ import { BorisUsageStats } from '~/types/boris';
import { BorisStatsBackend } from './components/BorisStatsBackend';
import { BorisStatsGit } from './components/BorisStatsGit';
interface IProps {
interface Props {
stats: BorisUsageStats;
isLoading: boolean;
}
const BorisStats: FC<IProps> = ({ stats, isLoading }) => {
const BorisStats: FC<Props> = ({ stats, isLoading }) => {
return (
<>
<BorisStatsBackend stats={stats.backend} isLoading={isLoading} />

View file

@ -4,11 +4,11 @@ import { Button } from '~/components/input/Button';
import { ButtonGroup } from '~/components/input/ButtonGroup';
import { COMMENT_FILE_TYPES } from '~/constants/uploads';
interface IProps {
interface Props {
onUpload: (files: File[]) => void;
}
const CommentFormAttachButtons: FC<IProps> = ({ onUpload }) => {
const CommentFormAttachButtons: FC<Props> = ({ onUpload }) => {
const onInputChange = useCallback(
(event) => {
event.preventDefault();

View file

@ -9,12 +9,12 @@ import {
import styles from './styles.module.scss';
interface IProps {
interface Props {
element: HTMLTextAreaElement;
handler: (val: string) => void;
}
const CommentFormFormatButtons: FC<IProps> = ({ element, handler }) => {
const CommentFormFormatButtons: FC<Props> = ({ element, handler }) => {
const wrapper = useFormatWrapper(handler);
const wrap = useCallback(

View file

@ -9,11 +9,11 @@ import { Textarea } from '~/components/input/Textarea';
import { useRandomPhrase } from '~/constants/phrases';
import { useCommentFormContext } from '~/hooks/comments/useCommentFormFormik';
interface IProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
interface Props extends TextareaHTMLAttributes<HTMLTextAreaElement> {
isLoading?: boolean;
}
const CommentFormTextarea = forwardRef<HTMLTextAreaElement, IProps>(
const CommentFormTextarea = forwardRef<HTMLTextAreaElement, Props>(
({ ...rest }, ref) => {
const { values, handleChange, handleSubmit, isSubmitting } =
useCommentFormContext();

View file

@ -18,7 +18,7 @@ import { CommentFormFormatButtons } from './components/CommentFormFormatButtons'
import { CommentFormTextarea } from './components/CommentFormTextarea';
import styles from './styles.module.scss';
interface IProps {
interface Props {
comment?: IComment;
allowUploads?: boolean;
@ -26,7 +26,7 @@ interface IProps {
onCancelEdit?: () => void;
}
const CommentForm: FC<IProps> = observer(
const CommentForm: FC<Props> = observer(
({ comment, allowUploads, saveComment, onCancelEdit }) => {
const [textarea, setTextArea] = useState<HTMLTextAreaElement | null>(null);
const uploader = useUploaderContext();

View file

@ -9,7 +9,7 @@ import { DivProps } from '~/utils/types';
import { CommentAvatar } from './components/CommentAvatar';
import styles from './styles.module.scss';
type IProps = DivProps & {
type Props = DivProps & {
user?: IUser;
isEmpty?: boolean;
isLoading?: boolean;
@ -17,7 +17,7 @@ type IProps = DivProps & {
isNew?: boolean;
};
const CommentWrapper: FC<IProps> = ({
const CommentWrapper: FC<Props> = ({
user,
className,
isEmpty,

View file

@ -4,13 +4,13 @@ import { SortableAudioGrid } from '~/components/sortable/SortableAudioGrid';
import { UploadStatus } from '~/store/uploader/UploaderStore';
import { IFile } from '~/types';
interface IProps {
interface Props {
files: IFile[];
setFiles: (val: IFile[]) => void;
locked: UploadStatus[];
}
const AudioGrid: FC<IProps> = ({ files, setFiles, locked }) => {
const AudioGrid: FC<Props> = ({ files, setFiles, locked }) => {
const onMove = useCallback(
(newFiles: IFile[]) => {
setFiles(newFiles);

View file

@ -4,9 +4,9 @@ import { UploadType } from '~/constants/uploads';
import { EditorUploadButton } from '~/containers/dialogs/EditorDialog/components/EditorButtons/components/EditorActionsPanel/components/EditorUploadButton';
import { IEditorComponentProps } from '~/types/node';
type IProps = IEditorComponentProps & {};
type Props = IEditorComponentProps & {};
const EditorAudioUploadButton: FC<IProps> = () => (
const EditorAudioUploadButton: FC<Props> = () => (
<EditorUploadButton
accept="audio/*"
icon="audio"

View file

@ -5,8 +5,8 @@ import { IEditorComponentProps } from '~/types/node';
import styles from './styles.module.scss';
type IProps = IEditorComponentProps & {};
type Props = IEditorComponentProps & {};
const EditorFiller: FC<IProps> = () => <Filler className={styles.filler} />;
const EditorFiller: FC<Props> = () => <Filler className={styles.filler} />;
export { EditorFiller };

View file

@ -5,9 +5,9 @@ import { IEditorComponentProps } from '~/types/node';
import { EditorUploadButton } from '../EditorUploadButton';
type IProps = IEditorComponentProps & {};
type Props = IEditorComponentProps & {};
const EditorImageUploadButton: FC<IProps> = () => (
const EditorImageUploadButton: FC<Props> = () => (
<EditorUploadButton
accept="image/*"
icon="image"

View file

@ -7,9 +7,9 @@ import { IEditorComponentProps } from '~/types/node';
import styles from './styles.module.scss';
interface IProps extends IEditorComponentProps {}
interface Props extends IEditorComponentProps {}
const EditorPublicSwitch: FC<IProps> = () => {
const EditorPublicSwitch: FC<Props> = () => {
const { values, setFieldValue } = useNodeFormContext();
const onChange = useCallback(

View file

@ -10,14 +10,14 @@ import { getFileType } from '~/utils/uploader';
import styles from './styles.module.scss';
type IProps = IEditorComponentProps & {
type Props = IEditorComponentProps & {
accept?: string;
icon?: string;
type?: UploadType;
label?: string;
};
const EditorUploadButton: FC<IProps> = ({
const EditorUploadButton: FC<Props> = ({
accept = 'image/*',
icon = 'plus',
type = UploadType.Image,

View file

@ -11,9 +11,9 @@ import { getFileType } from '~/utils/uploader';
import styles from './styles.module.scss';
type IProps = IEditorComponentProps & {};
type Props = IEditorComponentProps & {};
const EditorUploadCoverButton: FC<IProps> = () => {
const EditorUploadCoverButton: FC<Props> = () => {
const { values, setFieldValue } = useNodeFormContext();
const { uploadFile, files, pendingImages } = useUploader(
UploadSubject.Editor,

View file

@ -5,12 +5,12 @@ import { Button } from '~/components/input/Button';
import styles from './styles.module.scss';
interface IProps {
interface Props {
onApprove: () => void;
onDecline: () => void;
}
const EditorConfirmClose: FC<IProps> = ({ onApprove, onDecline }) => (
const EditorConfirmClose: FC<Props> = ({ onApprove, onDecline }) => (
<div className={styles.wrap}>
<Group className={styles.content}>
<div className={styles.title}>Точно закрыть?</div>

View file

@ -9,9 +9,9 @@ import { ImageGrid } from '../ImageGrid';
import styles from './styles.module.scss';
type IProps = NodeEditorProps;
type Props = NodeEditorProps;
const ImageEditor: FC<IProps> = () => {
const ImageEditor: FC<Props> = () => {
const { pending, files, setFiles, uploadFiles } = useUploaderContext()!;
return (

View file

@ -5,13 +5,13 @@ import { useWindowSize } from '~/hooks/dom/useWindowSize';
import { UploadStatus } from '~/store/uploader/UploaderStore';
import { IFile } from '~/types';
interface IProps {
interface Props {
files: IFile[];
setFiles: (val: IFile[]) => void;
locked: UploadStatus[];
}
const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
const ImageGrid: FC<Props> = ({ files, setFiles, locked }) => {
const { isTablet } = useWindowSize();
const onMove = useCallback(

View file

@ -8,9 +8,9 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
type IProps = NodeEditorProps & {};
type Props = NodeEditorProps & {};
const TextEditor: FC<IProps> = () => {
const TextEditor: FC<Props> = () => {
const { values, setFieldValue } = useNodeFormContext();
const placeholder = useRandomPhrase('SIMPLE');

View file

@ -10,9 +10,9 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
type IProps = NodeEditorProps & {};
type Props = NodeEditorProps & {};
const VideoEditor: FC<IProps> = () => {
const VideoEditor: FC<Props> = () => {
const { values, setFieldValue } = useNodeFormContext();
const setUrl = useCallback(

View file

@ -7,9 +7,9 @@ import { DIALOG_CONTENT } from '~/constants/modal';
import { useModalStore } from '~/store/modal/useModalStore';
import { has } from '~/utils/ramda';
type IProps = {};
type Props = {};
const Modal: FC<IProps> = observer(() => {
const Modal: FC<Props> = observer(() => {
const { current, hide, props } = useModalStore();
if (!current || !has(current, DIALOG_CONTENT)) {

View file

@ -4,9 +4,9 @@ import { BetterScrollDialog } from '~/components/common/BetterScrollDialog';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const TestDialog: FC<IProps> = () => (
const TestDialog: FC<Props> = () => (
<BetterScrollDialog
header={<div className={styles.head}>HEAD</div>}
footer={<div className={styles.footer}>FOOTER</div>}

View file

@ -5,12 +5,12 @@ import { IFlowNode } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
recent: IFlowNode[];
updated: IFlowNode[];
}
const FlowRecent: FC<IProps> = ({ recent, updated }) => {
const FlowRecent: FC<Props> = ({ recent, updated }) => {
return (
<>
<div className={styles.updates}>

View file

@ -7,14 +7,14 @@ import { INode } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
isLoading: boolean;
results: INode[];
hasMore: boolean;
onLoadMore: () => void;
}
const FlowSearchResults: FC<IProps> = ({ results, onLoadMore, hasMore }) => {
const FlowSearchResults: FC<Props> = ({ results, onLoadMore, hasMore }) => {
if (!results.length) {
return (
<div className={styles.loading}>

View file

@ -15,12 +15,12 @@ import { useSearchContext } from '~/utils/providers/SearchProvider';
import { FlowRecent } from './components/FlowRecent';
import { FlowSearchResults } from './components/FlowSearchResults';
interface IProps {
interface Props {
isFluid: boolean;
onToggleLayout: () => void;
}
const FlowStamp: FC<IProps> = ({ isFluid, onToggleLayout }) => {
const FlowStamp: FC<Props> = ({ isFluid, onToggleLayout }) => {
const {
searchText,
hasMore: searchHasMore,

View file

@ -12,9 +12,9 @@ import { getURL } from '~/utils/dom';
import styles from './styles.module.scss';
interface IProps extends NodeComponentProps {}
interface Props extends NodeComponentProps {}
const LabImage: FC<IProps> = ({ node, isLoading }) => {
const LabImage: FC<Props> = ({ node, isLoading }) => {
const images = useNodeImages(node);
const onClick = useGotoNode(node.id);

View file

@ -8,9 +8,9 @@ import { LabNoResults } from './components/LabNoResults';
import { LabNode } from './components/LabNode';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const LabGrid: FC<IProps> = memo(() => {
const LabGrid: FC<Props> = memo(() => {
const { nodes, hasMore, loadMore, search, setSearch, isLoading } =
useLabContext();

View file

@ -8,11 +8,11 @@ import { useLabContext } from '~/utils/context/LabContextProvider';
import styles from './styles.module.scss';
interface IProps {
interface Props {
isLoading?: boolean;
}
const LabHead: FC<IProps> = ({ isLoading }) => {
const LabHead: FC<Props> = ({ isLoading }) => {
const { sort, setSort, search, setSearch } = useLabContext();
return (

View file

@ -6,9 +6,9 @@ import { DivProps } from '~/utils/types';
import styles from './styles.module.scss';
interface IProps extends DivProps {}
interface Props extends DivProps {}
const LabSquare: FC<IProps> = ({ children, ...rest }) => (
const LabSquare: FC<Props> = ({ children, ...rest }) => (
<div className={styles.square}>
<div {...rest} className={classNames(styles.content, rest.className)}>
{children}

View file

@ -6,14 +6,14 @@ import { INode } from '~/types';
import { LabHero } from './components/LabHero';
interface IProps {
interface Props {
nodes: Partial<INode>[];
isLoading: boolean;
}
const empty = [...new Array(5)].map((_, i) => i);
const LabHeroes: FC<IProps> = ({ nodes, isLoading }) => {
const LabHeroes: FC<Props> = ({ nodes, isLoading }) => {
if (isLoading) {
return (
<Group className={styles.heroes}>

View file

@ -6,12 +6,12 @@ import { ITag } from '~/types';
import styles from './styles.module.scss';
interface IProps {
interface Props {
tags: ITag[];
isLoading: boolean;
}
const LabTags: FC<IProps> = ({ tags, isLoading }) => {
const LabTags: FC<Props> = ({ tags, isLoading }) => {
if (isLoading) {
return (
<div className={styles.tags}>

View file

@ -10,9 +10,9 @@ import { LabFactoryBanner } from './components/LabFactoryBanner';
import { LabTags } from './components/LabTags';
import styles from './styles.module.scss';
interface IProps {}
interface Props {}
const LabStats: FC<IProps> = () => {
const LabStats: FC<Props> = () => {
const { isLoadingStats, tags, heroes, updates } = useLabContext();
return (

View file

@ -1,19 +0,0 @@
import { FC } from 'react';
import { PlayerView } from '~/containers/player/PlayerView';
import styles from './styles.module.scss';
type IProps = {};
const BottomContainer: FC<IProps> = () => (
<div className={styles.wrap}>
<div className={styles.content}>
<div className={styles.padder}>
<PlayerView />
</div>
</div>
</div>
);
export { BottomContainer };

Some files were not shown because too many files have changed in this diff Show more