client__App.js

import React from "react";
import axios from "axios";
import Export from "./Export";
import Login from "./Login";

class App extends React.Component {
  state = {
    user: null
  };

  fetchUser = async () => {
    const url = "http://localhost:5000/api/user/profile";
    const options = { withCredentials: true };
    const { data: user } = await axios.get(url, options);
    this.setState({ user });
  }

  setUser = (user) => {
    this.setState({ user });
  };

  componentDidMount = () => {
    this.fetchUser();
  }

  render = () => {
    if (this.state.user) {
      return <Export />;
    }
    return <Login onLogin={this.setUser} />;
  }
}

export default App;

client__Export.js

import React, { Component } from "react";
import TopNav from "./TopNav";
import Records from "./Records";
import axios from "axios";
import ObjectsToCsv from "objects-to-csv";

class Export extends Component {
  state = {
    data: [],
    paymentStatus: "PENDING",
    dataCount: 0
  };

  componentDidMount() {}

  submitForm = e => {
    e.preventDefault();
    console.log("submitting form ...");
    axios
      .get("http://localhost:5000/api/dbase/get-rows", {
        // paymentStatus: this.state.paymentStatus
      })
      .then(res => {
        console.log(res);
        this.setState(
          { data: res.data, dataCount: this.state.data.length },
          () => {
            console.log(this.state.data);
          }
        );
      })
      .catch(e => console.log(e));
  };

  selectPaymentStatus = e => {
    this.setState({ paymentStatus: e.target.value }, () => {
      console.log(this.state.paymentStatus);
    });
  };

  sendCsv = () => {
    axios.get("http://localhost:5000/api/dbase/send-csv")
      .then(data => {
        console.log(data);
      })
      .catch(err => {
        console.log(err);
      });
  };

  render() {
    return (
      <div>
        <TopNav sendCsv={this.sendCsv} />
        <div className="container">
          <div className="form-group">
            <form>
              <div />
            </form>
          </div>
          <div className="row">
            <div className="col-12 select">
              <button className="btn btn-primary" onClick={this.submitForm}>
                Select Records
              </button>
            </div>
          </div>
          <div className="row">
            <div className="col-12 grid">
              <Records data={this.state.data} />
            </div>
          </div>
        </div>
      </div>
    );
  }
}

export default Export;

client__Login.js

import React from "react";
import axios from "axios";
import TopNav from "./TopNav";

class Login extends React.Component {
  state = {
    user: {
      username: "",
      password: ""
    },
  };

  handleSubmit = async (e) => {
    e.preventDefault();
    const url = "http://localhost:5000/api/user/login";
    const options = { withCredentials: true };
    try {
      const { data } = await axios.post(url, this.state.user, options);
      this.props.onLogin(data); // Update parent component
    } catch (err) {
      console.log(err);
    }
  };

  handleChange = (e) => {
    e.preventDefault();
    const { user } = this.state;
    user[e.target.name] = e.target.value;
    this.setState({ user });
  }

  render = () => {
    return (
      <div>
        <TopNav />
        <form className="login-form" onSubmit={this.handleSubmit}>
          <h1>Login</h1>
          <input name="username" 
            placeholder="Username"
            className="form-control"
            value={this.state.user.username}
            onChange={this.handleChange} />

          <input name="password" 
            placeholder="Password"
            className="form-control"
            value={this.state.user.password}
            onChange={this.handleChange} />

          <button className="btn btn-primary" type="submit">Log in</button>
        </form>
      </div>
    );
  };
};

export default Login;

dbRoutes.js

const express = require("express");
const router = express.Router();
const sftp = require("../../config/sftp");
const mysql = require("../../config/mysql");
const raw = require("../../database/raw");
const fs = require("fs");
const o2csv = require("objects-to-csv");

router.get("/", (req, res) => {
  db.select("id", "fullname", "statusname")
    .from("dbase")
    .limit(10)
    .then(data => {
      res.send(data);
    });
});

router.get("/get-rows", (req, res) => {
  // const { paymentStatus } = req.body;
  mysql.connect();
  mysql.query(raw.getNumbers, (err, rows) => {
    if (err) console.log(err);
    console.log("RESPONSE:", rows);
    res.status(200).json(rows);
  });
  mysql.end();
});

const dateString = (d) => {
  return `${d.getMonth() + 1}-${d.getDate()}-${d.getYear() % 100}`;
}

router.get("/send-csv", (req, res) => {
  mysql.connect();
  mysql.query(raw.getNumbers, (err, rows) => {
    if (err) console.log(err);
    console.log("RESPONSE:", rows);
    csv = new o2csv(rows);
    csv.toString().then(str => {
      const dateStr = dateString(new Date());
      const path = `${process.env.FTP_ROOT}/DLC UPLOAD ${dateStr}.csv`;
      sftp.connect()
        .then(() => { return sftp.put(new Buffer(str), path) })
        .then(data => console.log(data))
        .then(() => res.status(200).json({ 
          message: `Successfully sent ${rows.length} records.` 
        }));
    });
  });
  mysql.end();
});

module.exports = router;

passport.js

const passport = require("passport");
const LocalStrategy = require("passport-local").Strategy;

passport.serializeUser((user, done) => {
  done(null, user);
});

passport.deserializeUser((user, done) => {
  done(null, user);
});

// Currently accepts any username and password
// TODO: Implement username and password
passport.use(new LocalStrategy(
  function(username, password, done) {
    console.log(`Authenticating - username: ${username} pass: ${password}`);
    return done(null, { username: "J" });
  }
));

module.exports = passport;

userRoutes.js

const express = require("express");
const passport = require("../../config/passport");
const router = express.Router();

// Allows client to verify login state
router.get("/profile", (req, res) => {
  if (req.isAuthenticated()) { 
    console.log("sending user data");
    res.send(req.user);
  } else {
    res.send(null);
  }
});

// TODO: Logout route

router.post("/login", passport.authenticate("local"), (req, res, next) => {
  if (req.user) {
    // Start a passport session
    req.logIn(req.user, (err) => {
      if (err) {
        return next(err);
      }
      res.send(req.user);
    });
  } else {
    res.send({ error: "Failed to log in" });
  }
});

module.exports = router;