Commit 4108b7d3 authored by chris's avatar chris

sideMenu in progress

parent 3a5bc698
......@@ -2,7 +2,7 @@ import React, { Component } from "react";
import styled, { createGlobalStyle } from "styled-components";
import { Wax, CreateSchema } from "wax-prosemirror-core";
import { EditoriaSchema } from "wax-prosemirror-schema";
import { MainMenuBar } from "wax-prosemirror-components";
import { MainMenuBar, SideMenuBar } from "wax-prosemirror-components";
import "wax-prosemirror-layouts/layouts/editoria-layout.css";
import "wax-prosemirror-themes/themes/editoria-theme.css";
......@@ -44,7 +44,10 @@ class Editoria extends Component {
renderLayout={({ editor, ...props }) => (
<React.Fragment>
<MainMenuBar {...props} />
<div className="wax-surface-container">{editor}</div>
<div className="wax-surface-container">
<SideMenuBar {...props} />
{editor}
</div>
</React.Fragment>
)}
/>
......
export { default as MainMenuBar } from "./src/mainMenuBar/MainMenuBar";
export { default as SideMenuBar } from "./src/sideMenuBar/SideMenuBar";
import React from "react";
import { forEach, map } from "lodash";
// import classes from "./MenuBar.css";
import SideMenuItems from "./SideMenuItems";
const filtered = (menu, menuItems) =>
......@@ -29,12 +28,12 @@ const SideMenuBar = ({
className,
fileUpload
}) => (
<div className={`${className} main-menu-container`}>
<div className="main-menu-inner">
<div className="main-menu">
<div className={`${className} side-menu-container`}>
<div className="side-menu-inner">
<div className="side-menu">
{
<span className={classes.group}>
{map(setMenuItems(menu, menuItems), item =>
<span>
{map(setMenuItems(SideMenuItems, menuItems), item =>
item.menu({ state, dispatch, item, fileUpload })
)}
</span>
......
import React from "react";
import { forEach, map } from "lodash";
import SideMenuItems from "./SideMenuItems";
const filtered = (menu, menuItems) =>
Object.keys(menu)
.filter(key => menuItems.includes(key))
.reduce((obj, key) => {
obj[key] = menu[key];
return obj;
}, {});
const setMenuItems = (menu, menuItems) => {
let items = menuItems;
if (menuItems.length === 0) {
forEach(menu, (key, index) => {
items.push(index);
});
}
return filtered(menu, items);
};
const SideMenuBar = ({
menuItems = [],
children,
state,
dispatch,
className,
fileUpload
}) => (
<div className={`${className} side-menu-container`}>
<div className="side-menu-inner">
<div className="side-menu">
{
<span>
{map(setMenuItems(SideMenuItems, menuItems), item =>
item.menu({ state, dispatch, item, fileUpload })
)}
</span>
}
</div>
</div>
</div>
);
export default SideMenuBar;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment