creating youtube node

src/components/editors/EditorPanel/index.tsx

@@ -2,6 +2,7 @@ import React, { FC } from 'react';
 import * as styles from './styles.scss';
 import { INode } from '~/redux/types';
 import { EditorUploadButton } from '~/components/editors/EditorUploadButton';
+import { NODE_UPLOAD_TYPES } from '~/redux/node/constants';
 
 interface IProps {
   data: INode;
@@ -12,7 +13,9 @@ interface IProps {
 
 const EditorPanel: FC<IProps> = ({ data, setData, temp, setTemp }) => (
   <div className={styles.panel}>
-    <EditorUploadButton data={data} setData={setData} temp={temp} setTemp={setTemp} />
+    {data.type && NODE_UPLOAD_TYPES[data.type] && (
+      <EditorUploadButton data={data} setData={setData} temp={temp} setTemp={setTemp} />
+    )}
   </div>
 );
 

src/components/editors/VideoEditor/index.tsx

@@ -3,6 +3,7 @@ import { INode } from '~/redux/types';
 import * as styles from './styles.scss';
 import path from 'ramda/es/path';
 import { InputText } from '~/components/input/InputText';
+import classnames from 'classnames';
 
 interface IProps {
   data: INode;
@@ -29,7 +30,7 @@ const VideoEditor: FC<IProps> = ({ data, setData }) => {
   return (
     <div className={styles.preview} style={{ backgroundImage: preview && `url("${preview}")` }}>
       <div className={styles.input_wrap}>
-        <div className={styles.input}>
+        <div className={classnames(styles.input, { active: !!preview })}>
           <InputText value={url} handler={setUrl} placeholder="Адрес видео" />
         </div>
       </div>

src/components/editors/VideoEditor/styles.scss

@@ -1,6 +1,7 @@
 .preview {
   padding-top: 56.25%;
   position: relative;
+  border-radius: $radius;
   // background: darken($color: $content_bg, $amount: 2%);
 }
 
@@ -19,12 +20,16 @@
   // @include outer_shadow();
 
   flex: 1 0 50%;
-  padding: $gap * 2 $gap $gap * 2 $gap;
-  // border-radius: $radius;
+  padding: $gap * 2;
+  border-radius: $radius;
   background: $content_bg;
-  // margin: 20px;
+  margin: 20px;
 
   input {
     text-align: center;
   }
+
+  &:global(.active) {
+    background: $red;
+  }
 }

src/constants/errors.ts

@@ -5,6 +5,7 @@ export const ERRORS = {
   NO_COMMENTS: 'No_Comments',
   FILES_REQUIRED: 'Files_Required',
   TEXT_REQUIRED: 'Text_Required',
+  UNKNOWN_NODE_TYPE: 'Unknown_Node_Type',
 };
 
 export const ERROR_LITERAL = {
@@ -14,4 +15,5 @@ export const ERROR_LITERAL = {
   [ERRORS.EMPTY_RESPONSE]: 'Пустой ответ сервера',
   [ERRORS.FILES_REQUIRED]: 'Добавьте файлы',
   [ERRORS.TEXT_REQUIRED]: 'Нужно немного текста',
+  [ERRORS.UNKNOWN_NODE_TYPE]: 'Неизвестный тип поста',
 };

src/containers/dialogs/ScrollDialog/styles.scss

@@ -133,7 +133,7 @@
 }
 
 .error {
-  background: linear-gradient(transparentize($orange, 1), $red);
+  background: linear-gradient(transparentize($orange, 1), $red 90%);
   position: absolute;
   width: 100%;
   height: auto;

src/redux/node/constants.ts

@@ -5,6 +5,7 @@ import { NodeTextBlock } from '~/components/node/NodeTextBlock';
 import { ImageEditor } from '~/components/editors/ImageEditor';
 import { TextEditor } from '~/components/editors/TextEditor';
 import { VideoEditor } from '~/components/editors/VideoEditor';
+import { UPLOAD_TYPES } from '../uploads/constants';
 
 const prefix = 'NODE.';
 export const NODE_ACTIONS = {
@@ -86,6 +87,10 @@ export const NODE_EDITORS = {
   [NODE_TYPES.VIDEO]: VideoEditor,
 };
 
+export const NODE_UPLOAD_TYPES = {
+  [NODE_TYPES.IMAGE]: [UPLOAD_TYPES.IMAGE],
+};
+
 export const NODE_EDITOR_DATA: Record<
   typeof NODE_TYPES[keyof typeof NODE_TYPES],
   Partial<INode>