text: import React, { useState }  from "react";
  import styled from "styled-components";
  
  const RightMenu = React.memo(props => {
     
      const MainWrapper = styled.div`
          height: 400px;
          width: 36%;
          background-color: ${props.theme.colorThree};
          border: 4px ridge ${props.theme.colorTwo};
          color:${props.theme.colorFive};
          margin: auto auto;
          text-align: center;
          display: flex;
          
      `;
      const Click = styled.div`
      width: 30px;
      height: 100%;
      background-color: ${props.theme.colorFour};
      writing-mode: vertical-rl;
          text-orientation: upright;
      `
      return <MainWrapper
      >     {!props.moved ? (
          <Click
              onClick={() => {
                  props.moveSection(-64);
              }}
          >
              Open
          </Click>
      ) : (
          <Click
              onClick={() => {
                  props.moveSection(-32);
              }}
          >
              Close
          </Click>
      )}
          <div>Riht Menu</div>
      </MainWrapper>;
  });
  
  export default RightMenu;
  