Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

created centralized route management feature for frontend #161

Closed
wants to merge 1 commit into from
Closed

created centralized route management feature for frontend #161

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions tensormap-client/src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,9 @@ import { Route, Router } from "react-router-dom";
import styles from "./App.styles";
import { history } from "./helpers";
import { Dashboard } from "./pages/dashboard";
import { Home } from "./pages/dashboard/scenes/home";
import { Home } from "./pages/dashboard/scenes/home";
import * as ENDPOINT from "./constants/URLs";


class App extends React.Component {
render() {
Expand All @@ -15,7 +17,7 @@ class App extends React.Component {
<div className={classes.root}>
<Router history={history}>
<div>
<Route path="/" component={Dashboard} />
<Route path={ENDPOINT.TOP_URL} component={Dashboard} />
{/*<PrivateRoute exact path="/" component={Dashboard}/>*/}
{/*<Route path="/login" component={SignIn}/>*/}
{/*<Route path="/register" component={SignUp}/>*/}
Expand Down
18 changes: 18 additions & 0 deletions tensormap-client/src/constants/URLs.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
export const TOP_URL = "/";
export const BACKEND_BASE_URL = "http://127.0.0.1:5000";
export const CREATE_EXPERIMENT_URL = "/createExperiment";
export const NEURAL_NET_URL = "/neuralnet";
export const HOME_URL = "/home";
export const DATA_URL = "/data";
export const ADD_DATA_URL = "/adddata";
export const VIEW_DATA_URL = "/viewdata";
export const DELETE_DATA_URL = "/deleteData";
export const UPDATE_DATA_URL = "/updateData";
export const VISUALIZE_DATA_URL = "/visualizeData"
export const SAVE_CONFIG_URL = "/saveConfig";
export const ADD_ROW_URL = "/addRow";
export const DELETE_ROW_URL = "/deleteRow";
export const EDIT_ROW_URL = "/editRow";
export const DOWNLOAD_CSV_URL = "/downloadCSV"
export const DELETE_COLUMN_URL = "/deleteColumn"
// test
18 changes: 10 additions & 8 deletions tensormap-client/src/pages/dashboard/Dashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,15 @@ import { ViewData } from "../viewdata";
import { VisualizeData } from "../visualizedata";
import styles from "./Dashboard.styles";
import { Error404 } from "../error404";
import * as ENDPOINT from "../../constants/URLs";

class Dashboard extends React.Component {
componentWillMount() {
var obj = { user_id: "1", experimet_type: "regression" };
var data = JSON.stringify(obj);
console.log(data);
fetch("http://127.0.0.1:5000/createExperiment", {
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.CREATE_EXPERIMENT_URL;
fetch( URI, {
method: "POST",
headers: {
"Content-Type": "application/json"
Expand All @@ -45,19 +47,19 @@ class Dashboard extends React.Component {
return (
<div className={classes.root}>
<CssBaseline />
{url_.pathname !== "/neuralnet" && <Header />}
{url_.pathname !== ENDPOINT.NEURAL_NET_URL && <Header />}
<Sidebar />
<main className={classes.content}>
{url_.pathname !== "/neuralnet" && (
{url_.pathname !== ENDPOINT.NEURAL_NET_URL && (
<div className={classes.toolbar} />
)}

<Route exact path="/home" component={Home} />
<Route exact path="/neuralnet" component={A} />
<Route exact path="/data" component={B} />
<Route exact path="/adddata" component={AddData} />
<Route exact path={ENDPOINT.HOME_URL} component={Home} />
<Route exact path={ENDPOINT.NEURAL_NET_URL} component={A} />
<Route exact path={ENDPOINT.DATA_URL} component={B} />
<Route exact path={ENDPOINT.ADD_DATA_URL} component={AddData} />
<Route exact path="/visualize/:id" component={VisualizeData} />
<Route exact path="/viewdata" component={ViewData} />
<Route exact path={ENDPOINT.VIEW_DATA_URL} component={ViewData} />
<Route component={Error404} />
</main>
</div>
Expand Down
4 changes: 3 additions & 1 deletion tensormap-client/src/pages/viewdata/ViewData.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,14 @@ import PropTypes from 'prop-types'
import * as React from 'react'
import styles from './ViewData.styles'
import Table from './assets/Table'
import * as ENDPOINT from '../../constants/URLs';

class ViewData extends React.Component {
constructor() {
super();
var Httpreq = new XMLHttpRequest();
Httpreq.open("GET", 'http://localhost:5000/viewData', false);
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.VIEW_DATA_URL;
Httpreq.open("GET", URI, false);
Httpreq.send(null);
this.state = {
data:JSON.parse(Httpreq.responseText),
Expand Down
10 changes: 7 additions & 3 deletions tensormap-client/src/pages/viewdata/ViewData_.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,16 @@ import {withStyles} from '@material-ui/core'
import PropTypes from 'prop-types'
import * as React from 'react'
import styles from './ViewData.styles'
import * as ENDPOINT from '../../constants/URLs';

class ViewData extends React.Component {
constructor() {
super();
this.handleClick = this.handleClick.bind(this);
this.getDeleteHandler = this.getDeleteHandler.bind(this);
var Httpreq = new XMLHttpRequest();
Httpreq.open("GET", 'http://localhost:5000/viewData', false);
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.VIEW_DATA_URL;
Httpreq.open("GET", URI, false);
Httpreq.send(null);
this.state = {
currentPage: 1,
Expand Down Expand Up @@ -37,7 +39,8 @@ class ViewData extends React.Component {
return function () {
var string = document.getElementById('name_' + idx).childNodes[0].value;
var Httpreq = new XMLHttpRequest();
Httpreq.open("GET", 'http://localhost:5000/updateData?id=' + idx + '&name=' + string, true);
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.UPDATE_DATA_URL;
Httpreq.open("GET", URI + '?id=' + idx + '&name=' + string, true);
Httpreq.send(null);
document.getElementById('edit_' + idx).style.display = '';
document.getElementById('save_' + idx).style.display = 'none';
Expand All @@ -58,7 +61,8 @@ class ViewData extends React.Component {
getDeleteHandler(idx) {
return function() {
var Httpreq = new XMLHttpRequest();
Httpreq.open("GET", 'http://localhost:5000/deleteData?id=' + idx, true);
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.DELETE_DATA_URL;
Httpreq.open("GET", URI + '?id=' + idx, true);
Httpreq.send(null);
document.getElementById('datarow_' + idx).remove();
}
Expand Down
4 changes: 3 additions & 1 deletion tensormap-client/src/pages/viewdata/assets/Table.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import DeleteIcon from '@material-ui/icons/Delete';
import OpenInNew from '@material-ui/icons/OpenInNew';
import FilterListIcon from '@material-ui/icons/FilterList';
import { lighten } from '@material-ui/core/styles/colorManipulator';
import * as ENDPOINT from "../../../constants/URLs";

let counter = 0;
function createData(id, name, dtype) {
Expand All @@ -30,7 +31,8 @@ function createData(id, name, dtype) {

function getDeleteHandler(idx) {
var Httpreq = new XMLHttpRequest();
Httpreq.open("GET", 'http://localhost:5000/deleteData?id=' + idx, true);
const URI = ENDPOINT.BACKEND_BASE_URL+ ENDPOINT.DELETE_DATA_URL;
Httpreq.open("GET", URI+'?id=' + idx, true);
Httpreq.send(null);
console.log("completed")
}
Expand Down
28 changes: 16 additions & 12 deletions tensormap-client/src/pages/visualizedata/VisualizeData.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import { saveAs } from 'file-saver';
import { forwardRef } from 'react';
import { template } from '@babel/core';
import {Button,ButtonGroup,Collapse,Tabs,Tab} from 'react-bootstrap';
import * as ENDPOINT from '../../constants/URLs';


const tableIcons = {
Expand Down Expand Up @@ -85,7 +86,7 @@ class VisualizeData extends React.Component {

this.setState({fileName: this.props.location.state.fileName })

let url = "http://127.0.0.1:5000/visualizeData?fileName="
let url = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.VISUALIZE_DATA_URL + "?fileName="
url = url.concat(this.props.location.state.fileName)

console.log(this.props.location.state.fileName)
Expand Down Expand Up @@ -121,7 +122,8 @@ class VisualizeData extends React.Component {
var obj = {trainPercentage: this.state.trainPercentage, fileName: this.state.fileName, features:this.state.features, labels:this.state.labels}
var data = JSON.stringify(obj)
console.log(data)
fetch("http://127.0.0.1:5000/saveConfig", {
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.SAVE_CONFIG_URL;
fetch(URI, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
Expand All @@ -143,8 +145,8 @@ class VisualizeData extends React.Component {
var obj = {rowdata: newData, fileName: this.state.fileName, columnData:this.state.columns}
var data = JSON.stringify(obj)
console.log(data)

fetch("http://127.0.0.1:5000/addRow", {
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.ADD_ROW_URL;
fetch(URI, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
Expand All @@ -162,9 +164,10 @@ class VisualizeData extends React.Component {
sendDeleteRequest(oldData){
var obj = {oldRowData: oldData, fileName: this.state.fileName}
var data = JSON.stringify(obj)
console.log(data)
console.log(data)
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.DELETE_ROW_URL;

fetch("http://127.0.0.1:5000/deleteRow", {
fetch(URI, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
Expand All @@ -184,9 +187,10 @@ class VisualizeData extends React.Component {

var obj = {newRowData: newData, fileName: this.state.fileName, columnData:this.state.columns}
var data = JSON.stringify(obj)
console.log(data)
console.log(data)
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.EDIT_ROW_URL;

fetch("http://127.0.0.1:5000/editRow", {
fetch(URI, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
Expand All @@ -206,8 +210,8 @@ class VisualizeData extends React.Component {
var obj = {fileName: this.state.fileName}
var data = JSON.stringify(obj)
console.log(data)

fetch("http://127.0.0.1:5000/downloadCSV", {
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.DOWNLOAD_CSV_URL
fetch(URI, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
Expand All @@ -232,8 +236,8 @@ class VisualizeData extends React.Component {
var obj = {columnData: this.state.columnCheckBoxes, fileName: this.state.fileName}
var data = JSON.stringify(obj)
console.log(data)

fetch("http://127.0.0.1:5000/deleteColumn", {
const URI = ENDPOINT.BACKEND_BASE_URL + ENDPOINT.DELETE_COLUMN_URL;
fetch(URI, {
method: 'POST',
headers: {
'Accept': 'application/json',
Expand Down