flow: real resources!

package.json

@@ -35,6 +35,7 @@
     "express": "^4.17.1",
     "express-session": "^1.17.1",
     "express-socket.io-session": "^1.3.5",
+    "glob": "^7.1.6",
     "html-entities": "1.3.1",
     "immer": "^7.0.1",
     "lodash.debounce": "^4.0.8",
@@ -47,6 +48,7 @@
     "react-hot-loader": "^4.12.21",
     "react-markdown": "^4.3.1",
     "react-redux": "^7.2.0",
+    "react-sortable-tree": "^2.7.1",
     "react-tabs": "^3.1.1",
     "redux": "^4.0.5",
     "scwp": "1.x",

src/client/app.jsx

@@ -4,11 +4,16 @@ import {hot} from 'react-hot-loader';
 
 import classnames from 'classnames';
 import React, {useState} from 'react';
+import {useSelector} from 'react-redux';
 
 import TypeRenderersContext from './context/typeRenderers';
 import Resources from './resources';
 import Sidebar from './sidebar';
 import SidebarIcons from './sidebar-icons';
+import {
+  activeResourceUriSelector,
+  resourceUrisSelector,
+} from './state';
 import {all as allTypeRenderers} from './type-renderers.scwp';
 
 const typeRenderMap = () => Object.values(allTypeRenderers()).reduce((r, M) => {
@@ -18,6 +23,8 @@ const typeRenderMap = () => Object.values(allTypeRenderers()).reduce((r, M) => {
 
 const App = () => {
   const [typeRenderers] = useState(typeRenderMap());
+  const activeResourceUri = useSelector(activeResourceUriSelector);
+  const resourceUris = useSelector(resourceUrisSelector);
   const [activeSidebar, setActiveSidebar] = useState(0);
   const [isSidebarExpanded, setIsSidebarExpanded] = useState(true);
   return (
@@ -48,7 +55,10 @@ const App = () => {
               {'sidebar-expanded': isSidebarExpanded},
             )}
           >
-            <Resources />
+            <Resources
+              activeUri={activeResourceUri}
+              uris={resourceUris}
+            />
           </div>
         </div>
       </TypeRenderersContext.Provider>

src/client/hooks/useSocket.js

@@ -0,0 +1,12 @@
+import {useEffect} from 'react';
+
+import {SocketClient} from '@avocado/net/client/socket';
+
+const frontendOrigin = window.location.href;
+const isSecure = 'https' === frontendOrigin.substr(0, 5);
+export const socket = new SocketClient(frontendOrigin, {secure: isSecure});
+
+export default function useSocket(fn) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  useEffect(() => fn(socket), []);
+}

src/client/index.jsx

@@ -1,4 +1,5 @@
 import './index.scss';
+
 import 'react-hot-loader';
 
 import {enableMapSet} from 'immer';

src/client/index.scss

@@ -140,7 +140,6 @@ select {
 }
 
 *:focus {
-  position: relative;
   box-shadow: 0 0 2px 0 var(--active-color);
   outline: none;
   z-index: 1;

src/client/resources.jsx

@@ -1,6 +1,8 @@
 import {compose} from '@avocado/core';
 import contempo from 'contempo';
-import React, {useState} from 'react';
+import PropTypes from 'prop-types';
+import React from 'react';
+import {useDispatch} from 'react-redux';
 import {
   Tab,
   Tabs,
@@ -9,22 +11,20 @@ import {
 } from 'react-tabs';
 
 import Resource from './resource';
+import {setActiveResourceUri} from './state';
 
 const decorate = compose(
   contempo(require('./resources.raw.scss')),
 );
 
-const Sidebar = (props) => {
+const Resources = (props) => {
-  const [tabIndex, setTabIndex] = useState(0);
+  const {activeUri, uris} = props;
-  const uris = [
+  const dispatch = useDispatch();
-    '/resources/cha0s/initial/kitty.entity.json',
-    '/resources/cha0s/initial/mama-kitty.entity.json',
-  ];
   return (
     <div className="resources">
       <Tabs
-        selectedIndex={tabIndex}
+        selectedIndex={uris.indexOf(activeUri)}
-        onSelect={(index) => setTabIndex(index)}
+        onSelect={(index) => dispatch(setActiveResourceUri(uris[index]))}
       >
         <TabList>
           {uris.map((uri) => (
@@ -38,8 +38,8 @@ const Sidebar = (props) => {
           ))}
         </TabList>
         {uris.map((uri) => (
-          <TabPanel>
+          <TabPanel key={uri}>
-            <Resource key={uri} uri={uri} />
+            <Resource uri={uri} />
           </TabPanel>
         ))}
       </Tabs>
@@ -47,7 +47,9 @@ const Sidebar = (props) => {
   );
 };
 
-Sidebar.propTypes = {
+Resources.propTypes = {
+  activeUri: PropTypes.string.isRequired,
+  uris: PropTypes.arrayOf(PropTypes.string).isRequired,
 };
 
-export default decorate(Sidebar);
+export default decorate(Resources);

src/client/sidebar.jsx

@@ -1,16 +1,96 @@
 import {compose} from '@avocado/core';
-// import classnames from 'classnames';
 import contempo from 'contempo';
-import React from 'react';
+import React, {useState} from 'react';
+import {useDispatch} from 'react-redux';
+import SortableTree, {changeNodeAtPath, getTreeFromFlatData} from 'react-sortable-tree';
+
+import ResourcesPacket from '~/common/packets/resources.packet';
+
+import useSocket from './hooks/useSocket';
+import FileExplorerTheme from './react-sortable-tree-theme-file-explorer';
+import {
+  setActiveResourceUri,
+} from './state';
 
 const decorate = compose(
   contempo(require('./sidebar.raw.scss')),
 );
 
+const rootUri = '/resources/cha0s/initial';
+
 const Sidebar = () => {
-  // const [active, setActive] = useState(false);
+  const dispatch = useDispatch();
+  const [treeData, setTreeData] = useState([]);
+  useSocket((socket) => socket.send(new ResourcesPacket(), (uris) => {
+    const visited = {};
+    const nodes = uris
+      .map((uri) => uri.slice(rootUri.length + 1))
+      .reduce((r, uri) => {
+        const parts = uri.split('/');
+        if (parts.length > 1) {
+          for (let i = 0; i < parts.length - 1; ++i) {
+            r.push({
+              id: parts.slice(0, i + 1).join('/'),
+              parentId: parts.slice(0, i).join('/'),
+              title: parts[i],
+            });
+          }
+        }
+        const title = parts.pop();
+        return r.concat({
+          id: uri,
+          parentId: parts.join('/'),
+          title,
+          uri: `${rootUri}/${uri}`,
+        });
+      }, [])
+      .filter((node) => {
+        if (visited[node.id]) {
+          return false;
+        }
+        visited[node.id] = true;
+        return true;
+      });
+    const sortTree = (tree) => {
+      tree.sort((l, r) => l.title.localeCompare(r.title));
+      if (tree.children) {
+        // eslint-disable-next-line no-param-reassign
+        tree.children = sortTree(tree.children);
+      }
+      return tree;
+    };
+    setTreeData(sortTree(getTreeFromFlatData({
+      flatData: nodes,
+      rootKey: '',
+    })));
+  }));
   return (
-    <div className="sidebar" />
+    <div className="sidebar">
+      <SortableTree
+        generateNodeProps={({node}) => ({
+          onClick: () => {
+            if (node.uri) {
+              dispatch(setActiveResourceUri(node.uri));
+            }
+            else {
+              const isExpanded = !!node.expanded;
+              setTreeData(changeNodeAtPath({
+                treeData,
+                path: node.id.split('/'),
+                newNode: {
+                  ...node,
+                  expanded: !isExpanded,
+                },
+                getNodeKey: ({node: {id}}) => id,
+              }));
+            }
+          },
+        })}
+        treeData={treeData}
+        onChange={setTreeData}
+        theme={FileExplorerTheme}
+      />
+    </div>
   );
 };
 

src/client/sidebar.raw.scss

@@ -1,5 +1,10 @@
 :scope {
   background-color: #242424;
+  padding: 1em;
   width: 100%;
   height: 100%;
 }
+
+.rst__virtualScrollOverride:focus {
+  box-shadow: none;
+}

src/client/state.js

@@ -0,0 +1,49 @@
+/* eslint-disable no-param-reassign */
+import {
+  createSelector,
+  createSlice,
+} from '@reduxjs/toolkit';
+
+export const appSelector = (state) => state.app;
+
+export const activeResourceUriSelector = createSelector(
+  appSelector,
+  (app) => app.activeResourceUri,
+);
+
+export const sidebarIsOpenedSelector = createSelector(
+  appSelector,
+  (app) => app.sidebarIsOpened,
+);
+
+export const resourceUrisSelector = createSelector(
+  appSelector,
+  (app) => app.resourceUris,
+);
+
+const slice = createSlice({
+  name: 'app',
+  initialState: {
+    activeResourceUri: '',
+    resourceUris: [],
+    sidebarIsOpened: false,
+  },
+  reducers: {
+    setActiveResourceUri: (state, {payload: uri}) => {
+      state.activeResourceUri = uri;
+      if (-1 === state.resourceUris.indexOf(uri)) {
+        state.resourceUris.push(uri);
+      }
+    },
+    setSidebarIsOpened: (state, {payload: isOpened}) => {
+      state.sidebarIsOpened = isOpened;
+    },
+  },
+});
+
+export const {
+  setActiveResourceUri,
+  setSidebarIsOpened,
+} = slice.actions;
+
+export default slice.reducer;

src/client/store.js

@@ -5,12 +5,14 @@ import {combineReducers} from 'redux';
 import createCommonStore from '~/common/store';
 
 import {all} from './resources.scwp';
+import appReducer from './state';
 
 const resources = Object.values(all()).map((M) => M.default);
 const reducerMap = resources.reduce(
   (r, {keys, state: {default: reducer}}) => ({...r, [keys[1]]: reducer}),
   {},
 );
+reducerMap.app = appReducer;
 
 export default function createStore(options = {}) {
   return createCommonStore(

src/common/packets/resources.packet.js

@@ -0,0 +1,12 @@
+import {Packet} from '@avocado/net';
+
+export default class ResourcesPacket extends Packet {
+
+  static get schema() {
+    return {
+      ...super.schema,
+      data: {},
+    };
+  }
+
+}

src/server/sockets/index.js

@@ -1,15 +1,21 @@
 /* eslint-disable import/no-extraneous-dependencies */
+import {stat} from 'fs';
+import glob from 'glob';
+import {join} from 'path';
 import redisAdapter from 'socket.io-redis';
 
 import {SocketServer} from '@avocado/net/server/socket';
 import socketSession from 'express-socket.io-session';
 
 import {redisOrigin} from '~/common/environment';
+import ResourcesPacket from '~/common/packets/resources.packet';
 
 import {session} from '~/server/app';
 
 // const debug = require('debug')('persea:server:sockets');
 
+const basePath = join(__dirname, '..', '..');
+
 export function createSocketServer(httpServer) {
   const [redisHost, redisPort] = redisOrigin.split(':');
   const socketServer = new SocketServer(httpServer, {
@@ -18,6 +24,32 @@ export function createSocketServer(httpServer) {
       port: redisPort || 11346,
     }),
   });
+  socketServer.on('connect', (socket) => {
+    socket.on('packet', (packet, fn) => {
+      if (packet instanceof ResourcesPacket) {
+        glob(join(basePath, 'resources', '**'), (globError, filenames) => {
+          if (globError) {
+            return;
+          }
+          const promises = filenames
+            .map((filename) => new Promise((resolve, reject) => {
+              stat(filename, (statError, stats) => (
+                statError
+                  ? reject(statError)
+                  : resolve(stats.isDirectory() ? '' : filename)
+              ));
+            }));
+          Promise.all(promises).then((filenames) => {
+            const resourceUris = filenames
+              .filter((filename) => !!filename)
+              .map((filename) => filename.slice(basePath.length));
+            fn(resourceUris);
+          });
+        });
+      }
+    });
+  });
+
   socketServer.io.use(socketSession(session()));
   return socketServer;
 }
@@ -26,6 +58,5 @@ export function destroySocketServer(socketServer) {
   if (!socketServer) {
     return;
   }
-  socketServer.removeTicker();
   socketServer.close();
 }

yarn.lock

@@ -989,7 +989,7 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.5.5":
+"@babel/runtime@^7.5.5", "@babel/runtime@^7.8.7":
   version "7.10.3"
   resolved "https://npm.i12e.cha0s.io/@babel%2fruntime/-/runtime-7.10.3.tgz#670d002655a7c366540c67f6fd3342cd09500364"
   integrity sha512-RzGO0RLSdokm9Ipe/YD+7ww8X2Ro79qiXZF3HU9ljrM+qnJmH1Vqth+hbiQZy761LnMJTMitHDuKVYTk3k4dLw==
@@ -1542,6 +1542,11 @@
   resolved "https://npm.i12e.cha0s.io/@types%2fanymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
   integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==
 
+"@types/asap@^2.0.0":
+  version "2.0.0"
+  resolved "https://npm.i12e.cha0s.io/@types%2fasap/-/asap-2.0.0.tgz#d529e9608c83499a62ae08c871c5e62271aa2963"
+  integrity sha512-upIS0Gt9Mc8eEpCbYMZ1K8rhNosfKUtimNcINce+zLwJF5UpM3Vv7yz3S5l/1IX+DxTa8lTkUjqynvjRXyJzsg==
+
 "@types/color-name@^1.1.1":
   version "1.1.1"
   resolved "https://npm.i12e.cha0s.io/@types%2fcolor-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
@@ -1555,11 +1560,24 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
+"@types/hoist-non-react-statics@^3.3.1":
+  version "3.3.1"
+  resolved "https://npm.i12e.cha0s.io/@types%2fhoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
+  integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
+  dependencies:
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+
 "@types/html-minifier-terser@^5.0.0":
   version "5.1.0"
   resolved "https://npm.i12e.cha0s.io/@types%2fhtml-minifier-terser/-/html-minifier-terser-5.1.0.tgz#551a4589b6ee2cc9c1dff08056128aec29b94880"
   integrity sha512-iYCgjm1dGPRuo12+BStjd1HiVQqhlRhWDOQigNxn023HcjnhsiFz9pc6CzJj4HwDCSQca9bxTL4PxJDbkdm3PA==
 
+"@types/invariant@^2.2.30":
+  version "2.2.33"
+  resolved "https://npm.i12e.cha0s.io/@types%2finvariant/-/invariant-2.2.33.tgz#ec5eec29c63bf5e4ca164e9feb3ef7337cdcbadb"
+  integrity sha512-/jUNmS8d4bCKdqslfxW6dg/9Gksfzxz67IYfqApHn+HvHlMVXwYv2zpTDnS/yaK9BB0i0GlBTaYci0EFE62Hmw==
+
 "@types/json-schema@^7.0.4":
   version "7.0.5"
   resolved "https://npm.i12e.cha0s.io/@types%2fjson-schema/-/json-schema-7.0.5.tgz#dcce4430e64b443ba8945f0290fb564ad5bac6dd"
@@ -1580,6 +1598,24 @@
   resolved "https://npm.i12e.cha0s.io/@types%2fnode/-/node-14.0.13.tgz#ee1128e881b874c371374c1f72201893616417c9"
   integrity sha512-rouEWBImiRaSJsVA+ITTFM6ZxibuAlTuNOCyxVbwreu6k6+ujs7DfnU9o+PShFhET78pMBl3eH+AGSI5eOTkPA==
 
+"@types/prop-types@*":
+  version "15.7.3"
+  resolved "https://npm.i12e.cha0s.io/@types%2fprop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
+  integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
+
+"@types/react@*":
+  version "16.9.41"
+  resolved "https://npm.i12e.cha0s.io/@types%2freact/-/react-16.9.41.tgz#925137ee4d2ff406a0ecf29e8e9237390844002e"
+  integrity sha512-6cFei7F7L4wwuM+IND/Q2cV1koQUvJ8iSV+Gwn0c3kvABZ691g7sp3hfEQHOUBJtccl1gPi+EyNjMIl9nGA0ug==
+  dependencies:
+    "@types/prop-types" "*"
+    csstype "^2.2.0"
+
+"@types/shallowequal@^1.1.1":
+  version "1.1.1"
+  resolved "https://npm.i12e.cha0s.io/@types%2fshallowequal/-/shallowequal-1.1.1.tgz#aad262bb3f2b1257d94c71d545268d592575c9b1"
+  integrity sha512-Lhni3aX80zbpdxRuWhnuYPm8j8UQaa571lHP/xI4W+7BAFhSIhRReXnqjEgT/XzPoXZTJkCqstFMJ8CZTK6IlQ==
+
 "@types/source-list-map@*":
   version "0.1.2"
   resolved "https://npm.i12e.cha0s.io/@types%2fsource-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"
@@ -2011,6 +2047,11 @@ arraybuffer.slice@~0.0.7:
   resolved "https://npm.i12e.cha0s.io/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz#3bbc4275dd584cc1b10809b89d4e8b63a69e7675"
   integrity sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog==
 
+asap@^2.0.6:
+  version "2.0.6"
+  resolved "https://npm.i12e.cha0s.io/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
+  integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
+
 asn1.js@^4.0.0:
   version "4.10.1"
   resolved "https://npm.i12e.cha0s.io/asn1.js/-/asn1.js-4.10.1.tgz#b9c2bf5805f1e64aadeed6df3a2bfafb5a73f5a0"
@@ -2819,7 +2860,7 @@ clone-deep@^2.0.1:
     kind-of "^6.0.0"
     shallow-clone "^1.0.0"
 
-clsx@^1.1.0:
+clsx@^1.0.1, clsx@^1.1.0:
   version "1.1.1"
   resolved "https://npm.i12e.cha0s.io/clsx/-/clsx-1.1.1.tgz#98b3134f9abbdf23b2663491ace13c5c03a73188"
   integrity sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==
@@ -3252,6 +3293,11 @@ cssesc@^3.0.0:
   resolved "https://npm.i12e.cha0s.io/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
+csstype@^2.2.0, csstype@^2.6.7:
+  version "2.6.10"
+  resolved "https://npm.i12e.cha0s.io/csstype/-/csstype-2.6.10.tgz#e63af50e66d7c266edb6b32909cfd0aabe03928b"
+  integrity sha512-D34BqZU4cIlMCY93rZHbrq9pjTAQJ3U8S8rfBqjwHxkGPThWFjzZDQpgMJY0QViLxth6ZKYiwFBo14RdN44U/w==
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://npm.i12e.cha0s.io/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -3465,6 +3511,17 @@ dir-glob@^2.0.0:
   dependencies:
     path-type "^3.0.0"
 
+dnd-core@^9.5.1:
+  version "9.5.1"
+  resolved "https://npm.i12e.cha0s.io/dnd-core/-/dnd-core-9.5.1.tgz#e9ec02d33529b68fa528865704d40ac4b14f2baf"
+  integrity sha512-/yEWFF2jg51yyB8uA2UbvBr9Qis0Oo/4p9cqHLEKZdxzHHVSPfq0a/ool8NG6dIS6Q4uN+oKGObY0rNWiopJDA==
+  dependencies:
+    "@types/asap" "^2.0.0"
+    "@types/invariant" "^2.2.30"
+    asap "^2.0.6"
+    invariant "^2.2.4"
+    redux "^4.0.4"
+
 dns-equal@^1.0.0:
   version "1.0.0"
   resolved "https://npm.i12e.cha0s.io/dns-equal/-/dns-equal-1.0.0.tgz#b39e7f1da6eb0a75ba9c17324b34753c47e0654d"
@@ -3514,6 +3571,14 @@ dom-converter@^0.2:
   dependencies:
     utila "~0.4"
 
+dom-helpers@^5.0.0:
+  version "5.1.4"
+  resolved "https://npm.i12e.cha0s.io/dom-helpers/-/dom-helpers-5.1.4.tgz#4609680ab5c79a45f2531441f1949b79d6587f4b"
+  integrity sha512-TjMyeVUvNEnOnhzs6uAn9Ya47GmMo3qq7m+Lr/3ON0Rs5kHvb8I+SQYjLUSYn7qhEm0QjW0yrBkvz9yOrwwz1A==
+  dependencies:
+    "@babel/runtime" "^7.8.7"
+    csstype "^2.6.7"
+
 dom-serializer@0, dom-serializer@^0.2.1:
   version "0.2.2"
   resolved "https://npm.i12e.cha0s.io/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
@@ -4503,6 +4568,19 @@ from2@^2.1.0:
     inherits "^2.0.1"
     readable-stream "^2.0.0"
 
+frontend-collective-react-dnd-scrollzone@^1.0.2:
+  version "1.0.2"
+  resolved "https://npm.i12e.cha0s.io/frontend-collective-react-dnd-scrollzone/-/frontend-collective-react-dnd-scrollzone-1.0.2.tgz#cf5ed6165335f7d26504a40126f8e972ee644698"
+  integrity sha512-me/D9PZJq9j/sjEjs/OPmm6V6nbaHbhgeQiwrWu0t35lhwAOKWc+QBzzKKcZQeboYTkgE8UvCD9el+5ANp+g5Q==
+  dependencies:
+    hoist-non-react-statics "^3.1.0"
+    lodash.throttle "^4.0.1"
+    prop-types "^15.5.9"
+    raf "^3.2.0"
+    react "^16.3.0"
+    react-display-name "^0.2.0"
+    react-dom "^16.3.0"
+
 fs-extra@^8.1.0:
   version "8.1.0"
   resolved "https://npm.i12e.cha0s.io/fs-extra/-/fs-extra-8.1.0.tgz#49d43c45a88cd9677668cb7be1b46efdb8d2e1c0"
@@ -4647,7 +4725,7 @@ glob@7.1.3:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@7.1.6, glob@^7.0.0, glob@^7.0.3, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@~7.1.1:
+glob@7.1.6, glob@^7.0.0, glob@^7.0.3, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6, glob@~7.1.1:
   version "7.1.6"
   resolved "https://npm.i12e.cha0s.io/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
   integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
@@ -4891,7 +4969,7 @@ hmac-drbg@^1.0.0:
     minimalistic-assert "^1.0.0"
     minimalistic-crypto-utils "^1.0.1"
 
-hoist-non-react-statics@^3.3.0:
+hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0:
   version "3.3.2"
   resolved "https://npm.i12e.cha0s.io/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -5924,6 +6002,11 @@ lodash.debounce@^4.0.8:
   resolved "https://npm.i12e.cha0s.io/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
   integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168=
 
+lodash.isequal@^4.5.0:
+  version "4.5.0"
+  resolved "https://npm.i12e.cha0s.io/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+  integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
+
 lodash.mapvalues@4.6.0:
   version "4.6.0"
   resolved "https://npm.i12e.cha0s.io/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz#1bafa5005de9dd6f4f26668c30ca37230cc9689c"
@@ -5969,6 +6052,11 @@ lodash.templatesettings@^4.0.0:
   dependencies:
     lodash._reinterpolate "^3.0.0"
 
+lodash.throttle@^4.0.1:
+  version "4.1.1"
+  resolved "https://npm.i12e.cha0s.io/lodash.throttle/-/lodash.throttle-4.1.1.tgz#c23e91b710242ac70c37f1e1cda9274cc39bf2f4"
+  integrity sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=
+
 lodash.without@4.4.0:
   version "4.4.0"
   resolved "https://npm.i12e.cha0s.io/lodash.without/-/lodash.without-4.4.0.tgz#3cd4574a00b67bae373a94b748772640507b7aac"
@@ -5991,7 +6079,7 @@ loglevel@^1.6.8:
   resolved "https://npm.i12e.cha0s.io/loglevel/-/loglevel-1.6.8.tgz#8a25fb75d092230ecd4457270d80b54e28011171"
   integrity sha512-bsU7+gc9AJ2SqpzxwU3+1fedl8zAntbtC5XYlt3s2j1hJcn2PsXSmgN8TaLG/J1/2mod4+cE/3vNL70/c1RNCA==
 
-loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://npm.i12e.cha0s.io/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -7434,7 +7522,7 @@ promise-inflight@^1.0.1:
   resolved "https://npm.i12e.cha0s.io/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
   integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
 
-prop-types@^15, prop-types@^15.5.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15, prop-types@^15.5.0, prop-types@^15.5.9, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://npm.i12e.cha0s.io/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -7556,6 +7644,13 @@ querystringify@^2.1.1:
   resolved "https://npm.i12e.cha0s.io/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
   integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
 
+raf@^3.2.0:
+  version "3.4.1"
+  resolved "https://npm.i12e.cha0s.io/raf/-/raf-3.4.1.tgz#0742e99a4a6552f445d73e3ee0328af0ff1ede39"
+  integrity sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==
+  dependencies:
+    performance-now "^2.1.0"
+
 ramda@^0.27:
   version "0.27.0"
   resolved "https://npm.i12e.cha0s.io/ramda/-/ramda-0.27.0.tgz#915dc29865c0800bf3f69b8fd6c279898b59de43"
@@ -7604,6 +7699,29 @@ raw-loader@1.x:
     loader-utils "^1.1.0"
     schema-utils "^1.0.0"
 
+react-display-name@^0.2.0:
+  version "0.2.5"
+  resolved "https://npm.i12e.cha0s.io/react-display-name/-/react-display-name-0.2.5.tgz#304c7cbfb59ee40389d436e1a822c17fe27936c6"
+  integrity sha512-I+vcaK9t4+kypiSgaiVWAipqHRXYmZIuAiS8vzFvXHHXVigg/sMKwlRgLy6LH2i3rmP+0Vzfl5lFsFRwF1r3pg==
+
+react-dnd-html5-backend@^9.3.4:
+  version "9.5.1"
+  resolved "https://npm.i12e.cha0s.io/react-dnd-html5-backend/-/react-dnd-html5-backend-9.5.1.tgz#e6a0aed3ece800c1abe004f9ed9991513e2e644c"
+  integrity sha512-wUdzjREwLqHxFkA6E+XDVL5IFjRDbBI3SHVKil9n3qrGT5dm2tA2oi1aIALdfMKsu00c+OXA9lz/LuKZCE9KXg==
+  dependencies:
+    dnd-core "^9.5.1"
+
+react-dnd@^9.3.4:
+  version "9.5.1"
+  resolved "https://npm.i12e.cha0s.io/react-dnd/-/react-dnd-9.5.1.tgz#907e55c791d6c50cbed1a4021c14b989b86ac467"
+  integrity sha512-j2MvziPNLsxXkb3kIJzLvvOv/TQ4sysp6U4CmxAXd4C884dXm/9UGdB7K1wkTW3ZxVpI1K7XhKbX0JgNlPfLcA==
+  dependencies:
+    "@types/hoist-non-react-statics" "^3.3.1"
+    "@types/shallowequal" "^1.1.1"
+    dnd-core "^9.5.1"
+    hoist-non-react-statics "^3.3.0"
+    shallowequal "^1.1.0"
+
 react-dom@16.8.6:
   version "16.8.6"
   resolved "https://npm.i12e.cha0s.io/react-dom/-/react-dom-16.8.6.tgz#71d6303f631e8b0097f56165ef608f051ff6e10f"
@@ -7614,6 +7732,16 @@ react-dom@16.8.6:
     prop-types "^15.6.2"
     scheduler "^0.13.6"
 
+react-dom@^16.3.0:
+  version "16.13.1"
+  resolved "https://npm.i12e.cha0s.io/react-dom/-/react-dom-16.13.1.tgz#c1bd37331a0486c078ee54c4740720993b2e0e7f"
+  integrity sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+    prop-types "^15.6.2"
+    scheduler "^0.19.1"
+
 react-hot-loader@^4.12.21:
   version "4.12.21"
   resolved "https://npm.i12e.cha0s.io/react-hot-loader/-/react-hot-loader-4.12.21.tgz#332e830801fb33024b5a147d6b13417f491eb975"
@@ -7663,6 +7791,20 @@ react-redux@^7.2.0:
     prop-types "^15.7.2"
     react-is "^16.9.0"
 
+react-sortable-tree@^2.6.0, react-sortable-tree@^2.7.1:
+  version "2.7.1"
+  resolved "https://npm.i12e.cha0s.io/react-sortable-tree/-/react-sortable-tree-2.7.1.tgz#99bce93fe838ed90258c1796ccd7ac59b70f8fbd"
+  integrity sha512-J78/6AXv9RN0XxoBAIDz8a7aNFdi/Mezcv/9lKNYTYzqAWxEyOTMeqZjpmvwLhM2HRpChTn0yYLHTdRSNHRACw==
+  dependencies:
+    frontend-collective-react-dnd-scrollzone "^1.0.2"
+    lodash.isequal "^4.5.0"
+    prop-types "^15.6.1"
+    react-dnd "^9.3.4"
+    react-dnd-html5-backend "^9.3.4"
+    react-lifecycles-compat "^3.0.4"
+    react-sortable-tree "^2.6.0"
+    react-virtualized "^9.19.1"
+
 react-tabs@^3.1.1:
   version "3.1.1"
   resolved "https://npm.i12e.cha0s.io/react-tabs/-/react-tabs-3.1.1.tgz#b363a239f76046bb2158875a1e5921b11064052f"
@@ -7671,6 +7813,18 @@ react-tabs@^3.1.1:
     clsx "^1.1.0"
     prop-types "^15.5.0"
 
+react-virtualized@^9.19.1:
+  version "9.21.2"
+  resolved "https://npm.i12e.cha0s.io/react-virtualized/-/react-virtualized-9.21.2.tgz#02e6df65c1e020c8dbf574ec4ce971652afca84e"
+  integrity sha512-oX7I7KYiUM7lVXQzmhtF4Xg/4UA5duSA+/ZcAvdWlTLFCoFYq1SbauJT5gZK9cZS/wdYR6TPGpX/dqzvTqQeBA==
+  dependencies:
+    babel-runtime "^6.26.0"
+    clsx "^1.0.1"
+    dom-helpers "^5.0.0"
+    loose-envify "^1.3.0"
+    prop-types "^15.6.0"
+    react-lifecycles-compat "^3.0.4"
+
 react@16.8.6:
   version "16.8.6"
   resolved "https://npm.i12e.cha0s.io/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
@@ -7681,7 +7835,7 @@ react@16.8.6:
     prop-types "^15.6.2"
     scheduler "^0.13.6"
 
-react@^16.5.0:
+react@^16.3.0, react@^16.5.0:
   version "16.13.1"
   resolved "https://npm.i12e.cha0s.io/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
   integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==
@@ -7811,7 +7965,7 @@ redux-thunk@^2.3.0:
   resolved "https://npm.i12e.cha0s.io/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"
   integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw==
 
-redux@^4.0.0, redux@^4.0.5:
+redux@^4.0.0, redux@^4.0.4, redux@^4.0.5:
   version "4.0.5"
   resolved "https://npm.i12e.cha0s.io/redux/-/redux-4.0.5.tgz#4db5de5816e17891de8a80c424232d06f051d93f"
   integrity sha512-VSz1uMAH24DM6MF72vcojpYPtrTUu3ByVWfPL1nPfVRb5mZVTve5GnNCUV53QM/BZ66xfWrm0CTWoM+Xlz8V1w==
@@ -8170,6 +8324,14 @@ scheduler@^0.13.6:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+scheduler@^0.19.1:
+  version "0.19.1"
+  resolved "https://npm.i12e.cha0s.io/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196"
+  integrity sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 schema-utils@2.6.6:
   version "2.6.6"
   resolved "https://npm.i12e.cha0s.io/schema-utils/-/schema-utils-2.6.6.tgz#299fe6bd4a3365dc23d99fd446caff8f1d6c330c"