12.0 support drag side nav (#6340)

* 01 optimize resize bar

* 02 app side panel support resize

* 03 side panel is folded do not support resize

* 04 optimise code

* 05 use localStorage

frontend/src/components/resize-bar/index.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import './index.css';
+
+function ResizeBar(props) {
+  return (
+    <div
+      className="resize-bar"
+      ref={props.resizeBarRef}
+      style={props.resizeBarStyle}
+      onMouseDown={props.onResizeMouseDown}
+      onMouseOver={props.onResizeMouseOver}
+    >
+      <div className="resize-bar-line"></div>
+      <div className="resize-bar-drag-handler" ref={props.dragHandlerRef} style={props.dragHandlerStyle}></div>
+    </div>
+  );
+}
+
+ResizeBar.propTypes = {
+  resizeBarRef: PropTypes.object.isRequired,
+  resizeBarStyle: PropTypes.object.isRequired,
+  dragHandlerRef: PropTypes.object.isRequired,
+  dragHandlerStyle: PropTypes.object.isRequired,
+  onResizeMouseDown: PropTypes.func.isRequired,
+  onResizeMouseOver: PropTypes.func.isRequired,
+};
+
+export default ResizeBar;