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

rename NodeComponentProps

Browse source
This commit is contained in:
Fedor Katurov 2023-11-04 10:48:57 +06:00
parent 8553f91429
commit 65196bbbbb
15 changed files with 59 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/lab/LabAudioBlock/index.tsx
View file

@ -2,9 +2,9 @@ import React, { FC } from 'react';
import { NodeAudioBlock } from '~/components/node/NodeAudioBlock';
import { Placeholder } from '~/components/placeholders/Placeholder';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
const LabAudio: FC<INodeComponentProps> = ({ node, isLoading }) => (
const LabAudio: FC<NodeComponentProps> = ({ node, isLoading }) => (
<Placeholder active={isLoading} width="100%" height={100}>
<NodeAudioBlock node={node} isLoading={isLoading} />
</Placeholder>

4
src/components/lab/LabDescription/index.tsx
View file

@ -2,13 +2,13 @@ import React, { FC } from 'react';
import { Markdown } from '~/components/containers/Markdown';
import { Paragraph } from '~/components/placeholders/Paragraph';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useGotoNode } from '~/hooks/node/useGotoNode';
import { formatText } from '~/utils/dom';
import styles from './styles.module.scss';
const LabDescription: FC<INodeComponentProps> = ({ node, isLoading }) => {
const LabDescription: FC<NodeComponentProps> = ({ node, isLoading }) => {
const onClick = useGotoNode(node.id);
if (!node.description) {

4
src/components/lab/LabImage/index.tsx
View file

@ -4,7 +4,7 @@ import Image from 'next/future/image';
import SwiperCore, { A11y, Navigation, Pagination } from 'swiper';
import { Placeholder } from '~/components/placeholders/Placeholder';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { imagePresets } from '~/constants/urls';
import { useGotoNode } from '~/hooks/node/useGotoNode';
import { useNodeImages } from '~/hooks/node/useNodeImages';
@ -15,7 +15,7 @@ import styles from './styles.module.scss';
SwiperCore.use([Navigation, Pagination, A11y]);
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const LabImage: FC<IProps> = ({ node, isLoading }) => {
const images = useNodeImages(node);

4
src/components/lab/LabLine/index.tsx
View file

@ -1,11 +1,11 @@
import React, { FC } from 'react';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useColorGradientFromString } from '~/hooks/color/useColorGradientFromString';
import styles from './styles.module.scss';
interface Props extends INodeComponentProps {}
interface Props extends NodeComponentProps {}
const LabLine: FC<Props> = ({ node: { title } }) => {
const background = useColorGradientFromString(title, 5, 3, 270);

4
src/components/lab/LabNodeTitle/index.tsx
View file

@ -5,12 +5,12 @@ import Tippy from '@tippyjs/react';
import { Group } from '~/components/containers/Group';
import { Icon } from '~/components/input/Icon';
import { Placeholder } from '~/components/placeholders/Placeholder';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useGotoNode } from '~/hooks/node/useGotoNode';
import styles from './styles.module.scss';
const LabNodeTitle: FC<INodeComponentProps> = ({ node, isLoading }) => {
const LabNodeTitle: FC<NodeComponentProps> = ({ node, isLoading }) => {
const onClick = useGotoNode(node.id);
if (!node.title) return null;

4
src/components/lab/LabPad/index.tsx
View file

@ -1,11 +1,11 @@
import React, { FC } from 'react';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useGotoNode } from '~/hooks/node/useGotoNode';
import styles from './styles.module.scss';
const LabPad: FC<INodeComponentProps> = ({ node }) => {
const LabPad: FC<NodeComponentProps> = ({ node }) => {
const onClick = useGotoNode(node.id);
return <div className={styles.pad} onClick={onClick} />;
};

4
src/components/lab/LabText/index.tsx
View file

@ -2,14 +2,14 @@ import React, { FC, useMemo } from 'react';
import { Markdown } from '~/components/containers/Markdown';
import { Paragraph } from '~/components/placeholders/Paragraph';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useGotoNode } from '~/hooks/node/useGotoNode';
import { formatTextParagraphs } from '~/utils/dom';
import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
const LabText: FC<INodeComponentProps> = ({ node, isLoading }) => {
const LabText: FC<NodeComponentProps> = ({ node, isLoading }) => {
const content = useMemo(
() => formatTextParagraphs(path(['blocks', 0, 'text'], node) || ''),
[node],

4
src/components/lab/LabVideo/index.tsx
View file

@ -2,9 +2,9 @@ import React, { FC } from 'react';
import { NodeVideoBlock } from '~/components/node/NodeVideoBlock';
import { Placeholder } from '~/components/placeholders/Placeholder';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
const LabVideo: FC<INodeComponentProps> = ({ node, isLoading }) => (
const LabVideo: FC<NodeComponentProps> = ({ node, isLoading }) => (
<Placeholder active={isLoading} width="100%" height={400}>
<NodeVideoBlock node={node} isLoading={isLoading} />
</Placeholder>

6
src/components/node/NodeAudioBlock/index.tsx
View file

@ -1,19 +1,19 @@
import React, { FC } from 'react';
import { AudioPlayer } from '~/components/media/AudioPlayer';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useNodeAudios } from '~/hooks/node/useNodeAudios';
import styles from './styles.module.scss';
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const NodeAudioBlock: FC<IProps> = ({ node }) => {
const audios = useNodeAudios(node);
return (
<div className={styles.wrap}>
{audios.map(file => (
{audios.map((file) => (
<AudioPlayer key={file.id} file={file} />
))}
</div>

4
src/components/node/NodeAudioImageBlock/index.tsx
View file

@ -1,6 +1,6 @@
import React, { FC } from 'react';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { imagePresets } from '~/constants/urls';
import { useNodeImages } from '~/hooks/node/useNodeImages';
import { getURL } from '~/utils/dom';
@ -8,7 +8,7 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const NodeAudioImageBlock: FC<IProps> = ({ node }) => {
const images = useNodeImages(node);

4
src/components/node/NodeImageSwiperBlock/index.tsx
View file

@ -13,7 +13,7 @@ import { Swiper, SwiperSlide } from 'swiper/react';
import SwiperClass from 'swiper/types/swiper-class';
import { ImageLoadingWrapper } from '~/components/common/ImageLoadingWrapper/index';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { imagePresets } from '~/constants/urls';
import { useModal } from '~/hooks/modal/useModal';
import { useImageModal } from '~/hooks/navigation/useImageModal';
@ -26,7 +26,7 @@ import styles from './styles.module.scss';
SwiperCore.use([Navigation, Pagination, Keyboard, Lazy]);
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const breakpoints: SwiperOptions['breakpoints'] = {
599: {

11
src/components/node/NodeTextBlock/index.tsx
View file

@ -2,7 +2,7 @@ import React, { FC, useMemo } from 'react';
import classNames from 'classnames';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { useColorGradientFromString } from '~/hooks/color/useColorGradientFromString';
import markdown from '~/styles/common/markdown.module.scss';
import { formatTextParagraphs } from '~/utils/dom';
@ -10,12 +10,13 @@ import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const NodeTextBlock: FC<IProps> = ({ node }) => {
const content = useMemo(() => formatTextParagraphs(path(['blocks', 0, 'text'], node) || ''), [
node,
]);
const content = useMemo(
() => formatTextParagraphs(path(['blocks', 0, 'text'], node) || ''),
[node],
);
const background = useColorGradientFromString(node.title, 3, 2);

6
src/components/node/NodeVideoBlock/index.tsx
View file

@ -1,11 +1,11 @@
import React, { FC, useMemo } from 'react';
import { INodeComponentProps } from '~/constants/node';
import { NodeComponentProps } from '~/constants/node';
import { path } from '~/utils/ramda';
import styles from './styles.module.scss';
interface IProps extends INodeComponentProps {}
interface IProps extends NodeComponentProps {}
const NodeVideoBlock: FC<IProps> = ({ node }) => {
const video = useMemo(() => {
@ -13,7 +13,7 @@ const NodeVideoBlock: FC<IProps> = ({ node }) => {
const match =
url &&
url.match(
/http(?:s?):\/\/(?:www\.)?youtu(?:be\.com\/watch\?v=|\.be\/)([\w\-_]*)(&(amp;)?[\w?=]*)?/
/http(?:s?):\/\/(?:www\.)?youtu(?:be\.com\/watch\?v=|\.be\/)([\w\-_]*)(&(amp;)?[\w?=]*)?/,
);
return match && match[1];