Final dbSpy4.0 cleanup

Co-authored-by: Michael Costello <[email protected]>
Co-authored-by: Steven Geiger <[email protected]>
Co-authored-by: Yufa Li <[email protected]>
Co-authored-by: Alexander Tu <[email protected]>

Author: 4 people

.ebextensions/psql.config

@@ -13,8 +13,14 @@ Below is a list of features and improvements to which you can contribute. If you
 - Clean up unused dependencies from pre-4.0
 - Connecting to PostgreSQL database
   - When connecting to PostgreSQL to grab the data from the database, it takes a really long time to load (approximately 2 minutes); further investigate pg_dump  alternatives for faster loading.
+- Integration and End-to-End testing for the codebase.
+- Live query feedback so users can see what their changes to the canvas look like as queries.
 
 Known bugs/issues
 
 - Table connection (handle) does not automatically render after a foreign key is added and the column data is saved. 
+- In production, remote postgres database connections do not work. We suspect this is due to container environment (nodeJS) not having access to pg_dump command. 
+- In development, WSL/Ubuntu users may have trouble running pg_dump due to version mismatch. Run `sudo apt-get --purge remove postgresql` to clear configuration files and zombie directories before installing postgresql fresh.
+- Undo function will not regress the state of the canvas to the point where it is empty. Whether this is a design choice or an issue is up to you.
+
 

Contributors.md

@@ -1,6 +1,6 @@
 FROM node:16.17.0
 WORKDIR /usr/src/app
 COPY . /usr/src/app
-RUN npm ci && npm cache clean --force && npm i postgresql-client -g && npm run build 
+RUN npm ci && npm cache clean --force && npm run build 
 EXPOSE 3000
 ENTRYPOINT npm run start

Dockerfile

@@ -15,6 +15,7 @@
 
 <h1 align="center">Visualize, modify, and build your database with dbSpy!</h1>
 <p align="center">An open-source data modeling tool to facilitate relational database development</p>
+<p align="center">dbSpy是一个促进关系数据库开发的开源数据建模工具</p>
 
 ### Use Cases
 
@@ -55,19 +56,21 @@
 ---
 
 ### Getting started
-
+You will need your own mySQL and redis databases for backend functions, and Google Cloud project for OAuth.
 - Fork and clone this repo
-- Add a .env file to the root directory
 - Add a db_schemas folder in server directory
+- Add a .env file to the root directory
 - Go to the Google Cloud Platform Console
-- Set up OAuth 2.0 credentials as laid out in <a href="https://support.google.com/cloud/answer/6158849?hl=en">here</a>
+- Set up OAuth 2.0 credentials as laid out in <a href="https://support.google.com/cloud/answer/6158849?hl=en">here</a>. Make sure 
+  your authorized redirect URI in the credentials you create matches the GOOGLE_AUTH_CALLBACK variable below.
 - Populate the .env file with the newly created code below:
 
 ```bash
 GOOGLE_AUTH_CALLBACK = ''
 DATABASE_URL = [mysql url for storing user data]
 DEV_SERVER_ENDPOINT = 'http://localhost:3000'
 DEV_CLIENT_ENDPOINT = 'http://localhost:8080'
+CLIENT_ENDPOINT = 'http://localhost:3000'
 GOOGLE_AUTH_CALLBACK = 'http://localhost:3000/api/oauth/google'
 GOOGLE_AUTH_CLIENT_ID = [google auth client id]
 GOOGLE_AUTH_CLIENT_SECRET = [google auth client secret]
@@ -167,7 +170,7 @@ npm run cert
    - Zoom On [+] - this button zooms into the canvas.
    - Zoom Out [-] - this button zooms out of the canvas.
    - Fit View [[]] - this button zooms to fit all the tables in focus.
-   - Toggle Interactivity [lock] - this button toggles on and off all table and row interactivity.
+   - Toggle Interactivity [lock] - this button toggles on and off all table and column interactivity.
    - Screenshot [camera] - this button saves a .png file of the current canvas view.
 
 ---
@@ -204,4 +207,4 @@ npm run cert
 
 ### License
 
-dbSpy is developed under the MIT license. See more un
+dbSpy is developed under the MIT license. See more about dbSpy4.0 updates [here](https://github.com/oslabs-beta/dbSpy/releases/tag/v4.0.0).

README.md

@@ -66,10 +66,10 @@ export const handleGoogleAuth: RequestHandler = async (req, res) => {
 
     const queryStr = 'true';
 
-    console.log(client_url);
+    log.info(client_url);
     res.redirect(301, `${client_url}/?success=` + queryStr);
   } catch (error) {
-    log.error(error, 'User authorization failed');
+    log.info(error, 'User authorization failed');
     return res.redirect(301, `${client_url}/login`);
   }
 };

server/controllers/auth.controller.ts

@@ -1,5 +1,5 @@
 import fs from 'fs';
-import log from '../logger';
+import log from '../logger/index';
 const mysqldump = require('mysqldump');
 import dotenv from 'dotenv';
 dotenv.config();
@@ -39,7 +39,7 @@ export const getSchema = async (req, res, next) => {
     const { tables } = result;
     next();
   } catch (error) {
-    console.log(error.message);
+    log.info(error.message);
     next({ message: 'Error with getSchema middleware' });
   }
 };

server/controllers/mysqlData.controller.js

@@ -46,10 +46,10 @@ export const userRegistration: RequestHandler = async (req, res, next) => {
       const values = [full_name, email, hashedPW];
       connection.query(queryStr, values, (err, data) => {
         if (err) {
-          console.log('Error during user registration');
+          log.info('Error during user registration');
           return next(err);
         } else {
-          console.log(`${email} succesfully registered!`);
+          log.info(`${email} succesfully registered!`);
           return res.redirect(200, `/`);
         }
       })

server/controllers/user.controller.ts

@@ -20,6 +20,7 @@ dotenv.config();
 import Redis from 'ioredis';
 import { getCurrentUser } from '../service/session.service';
 import path from 'path';
+import log from '../logger/index'
 
 const client_url =
   process.env.NODE_ENV === 'development'
@@ -71,9 +72,9 @@ const routes = async (app: Express) => {
 
   app.use('/api/logout', (req: Request, res: Response) => {
     req.session.destroy((err) => {
-      if (err) console.log('Error destroying session:', err);
+      if (err) log.info('Error destroying session:', err);
       else {
-        console.log('Succesfully destroyed session');
+        log.info('Succesfully destroyed session');
         return res.redirect(`/`);
       }
     });

server/routes/index.ts

@@ -1,6 +1,7 @@
 import mysql from 'mysql2';
 import dotenv from 'dotenv'
 dotenv.config()
+import log from '../logger/index'
 
 // Connect to SQL db and create users table
 if (!process.env.DATABASE_URL) throw new Error('DATABASE_URL not found');
@@ -18,7 +19,7 @@ const loadData = () => {
         pg_schema TEXT
         )`;
     try { connection.query(createUserTable) } 
-    catch (err) { console.log(err) }
+    catch (err) { log.info(err) }
 }
 
 loadData();

server/seed/seed.ts

@@ -1,14 +1,12 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
 import { Routes, Route, BrowserRouter } from "react-router-dom";
 import Home from "./pages/Home";
 import DBDisplay from "./pages/DBDisplay";
 import Login from "./pages/Login";
 import Signup from "./pages/Signup";
-import "./styles/index.css"
 import Shared from "./pages/Shared";
-// TODO: Delete? Remove barrier to entry.
-import ProtectedRoute from "./pages/ProtectedRoute";
 import useCredentialsStore from "./store/credentialsStore";
+import "./styles/index.css"
 
 export default function App() {
   //STATE DECLARATION (dbSpy3.0)