#58 using formik at node submit form

src/components/editors/EditorActionsPanel/index.tsx

@@ -0,0 +1,23 @@
+import React, { FC, createElement } from 'react';
+import styles from './styles.module.scss';
+import { INode } from '~/redux/types';
+import { NODE_PANEL_COMPONENTS } from '~/redux/node/constants';
+import { has } from 'ramda';
+import { useNodeFormContext } from '~/utils/hooks/useNodeFormFormik';
+
+const EditorActionsPanel: FC = () => {
+  const { values } = useNodeFormContext();
+
+  if (!values.type || !has(values.type, NODE_PANEL_COMPONENTS)) {
+    return null;
+  }
+
+  return (
+    <div className={styles.panel}>
+      {NODE_PANEL_COMPONENTS[values.type] &&
+        NODE_PANEL_COMPONENTS[values.type].map((el, key) => createElement(el, { key }))}
+    </div>
+  );
+};
+
+export { EditorActionsPanel };

src/components/editors/EditorActionsPanel/styles.module.scss

@@ -0,0 +1,26 @@
+@import "src/styles/variables";
+
+.panel {
+  height: 72px;
+  position: absolute;
+  left: 0;
+  width: 100%;
+  bottom: 100%;
+  box-sizing: border-box;
+  padding: $gap;
+  z-index: 10;
+  display: flex;
+  flex-direction: row;
+
+  & > * {
+    margin: 0 $gap / 2;
+
+    &:first-child {
+      margin-left: 0;
+    }
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+}