src/index.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from 'react';
   6 import * as ReactDOM from 'react-dom';
   7 import { Provider } from "react-redux";
   8 import Workbench from './views/workbench/workbench';
   9 import ProjectList from './components/project-list/project-list';
  10 import './index.css';
  11 import { Route, Router } from "react-router";
  12 import createBrowserHistory from "history/createBrowserHistory";
  13 import configureStore from "./store/store";
  14 import { ConnectedRouter } from "react-router-redux";
  15 import { TreeItem } from "./components/tree/tree";
  16 import { Project } from "./models/project";
  17
  18 const sampleProjects = [
  19     [
  20         'Project 1', [
  21             ['Project 1.1', [['Project 1.1.1'], ['Project 1.1.2']]],
  22             ['Project 1.2', [['Project 1.2.1'], ['Project 1.2.2'], ['Project 1.2.3']]]
  23         ]
  24     ],
  25     [
  26         'Project 2'
  27     ],
  28     [
  29         'Project 3', [['Project 3.1'], ['Project 3.2']]
  30     ]
  31 ];
  32
  33
  34 function buildProjectTree(tree: any[], level = 0): Array<TreeItem<Project>> {
  35     const projects = tree.map((t, idx) => ({
  36         id: `l${level}i${idx}${t[0]}`,
  37         open: false,
  38         data: {
  39             name: t[0],
  40             icon: level === 0 ? <i className="icon-th"/> : <i className="fas fa-folder"/>,
  41             createdAt: '2018-05-05',
  42         },
  43         items: t.length > 1 ? buildProjectTree(t[1], level + 1) : []
  44     }));
  45     return projects;
  46 }
  47
  48
  49 const history = createBrowserHistory();
  50 const projects = buildProjectTree(sampleProjects);
  51
  52 const store = configureStore({
  53     projects,
  54     router: {
  55         location: null
  56     }
  57 }, history);
  58
  59 const App = () =>
  60     <Provider store={store}>
  61         <ConnectedRouter history={history}>
  62             <div>
  63                 <Route path="/" component={Workbench} />
  64             </div>
  65         </ConnectedRouter>
  66     </Provider>;
  67
  68 ReactDOM.render(
  69     <App />,
  70     document.getElementById('root') as HTMLElement
  71 );