Merge pull request #32 from oslabs-beta/vicky/connect-users-save-query

vicky/connect-users-save-query

Author: reva2024

server/controllers/mysqlData.controller.ts

@@ -300,9 +300,18 @@ const mysqlController = {
 
   //----------Function to save query metrics from database-----------------------------------------------------------------
   mysqlSaveQuery: async (req: Request, res: Response, next: NextFunction) => {
+    // getting user info to save query
+    const user = req.session.user;
+    console.log('CHECKING USER MYQQL: ', user);
+    if (!user) {
+      return res.status(401).json({ error: 'User not authenticated' });
+    }
+
     try {
       // grab queryString from FE
       console.log('REQ QUERY: ', req.body.params);
+
+      const userEmail = user.email;
       const { query_date, exec_time } = req.body.params.extractedQueryRes;
       const { queryString, queryName, hostname, database_name } =
         req.body.params.dbValues;
@@ -322,9 +331,10 @@ const mysqlController = {
       const formatDateForMySql = date.toISOString().split('T')[0];
       console.log('formatted date: ', formatDateForMySql);
 
-      const insertQueryStr = `INSERT INTO queries (query, db_link, exec_time, db_name, query_date, name, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)`;
+      const insertQueryStr = `INSERT INTO queries (email, query, db_link, exec_time, db_name, query_date, name, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)`;
 
       const [saveQuery]: any = await pool.query(insertQueryStr, [
+        userEmail,
         queryString,
         hostname,
         exec_time,
@@ -349,6 +359,7 @@ const mysqlController = {
       if (saveQuery.affectedRows > 0) {
         console.log('saveQuery completed!');
         res.locals.savedQuery = [
+          userEmail,
           queryString,
           hostname,
           exec_time,

server/controllers/oauth.controller.ts

@@ -9,13 +9,24 @@ interface GlobalError {
   message: string | { err: string };
 }
 
+interface GitHubUser {
+  id: number;
+  url: string; // this is equivalent to the user email, is stored in the db as well
+  login: string;
+  type: string;
+}
+
 export const getAccesToken: RequestHandler = (
   req: Request,
   res: Response,
   next: NextFunction
 ) => {
   log.info('[oauthCtrl - getAccToken] Getting user access token...');
-  if (typeof req.session.user === 'string') return res.redirect('/api/me');
+  // checks if user email already exists
+  if (req.session.user?.email) {
+    return res.redirect('/api/me');
+  }
+
   type code = string;
   type state = string | null;
   const { code, state } = req.body;
@@ -115,7 +126,7 @@ export const getUserInfo: RequestHandler = async (
   try {
     let data: any;
     // For Github Oauth
-    let userInfo: {};
+    let userInfo: GitHubUser;
 
     if (type === 'GITHUB') {
       data = await fetch('https://api.github.com/user', {
@@ -129,6 +140,17 @@ export const getUserInfo: RequestHandler = async (
 
         userInfo = await data.json();
         userInfo = { ...userInfo, type: 'github' };
+
+        console.log('userInfo from Github: ', userInfo);
+        if (req.session) {
+          req.session.user = {
+            id: userInfo.id,
+            email: userInfo.url,
+            username: userInfo.login,
+            type: 'github',
+          };
+        }
+        console.log('checking req.session.user: ', req.session.user);
       } else {
         throw new Error(
           `[oauthCtrl - getUserInfo] middleware error (GitHub): Unexpected response status ${data.status}`

server/controllers/postgresData.controller.ts

@@ -233,13 +233,6 @@ const postgresController = {
       };
       const formattedDate = `Date Run: ${now.toLocaleString('en-US', options)}`;
 
-      /************* mysql querymetrics db insert for saved query page retrieval ******/
-      // creating insert query for mysql query metrics db
-      //Todo: figure out how to get the email from the session, if an user logs in and then tests query performance
-      //const email = 'https://api.github.com/users/reva2024';
-      //const db_link = 'postgresql://postgres.gcfszuopjvbjtllgmenw:[email protected]:6543/postgres';
-      //const db_name = 'dbSpy';
-
       // Send query name, query string, date, and execution time on response
       res.locals.metrics = [namedQuery, queryStr, formattedDate, executionTime];
       res.locals.otherMetrics = otherMetrics;
@@ -255,10 +248,17 @@ const postgresController = {
 
   //----------Function to save query metrics after running query-----------------------------------------------------------------
   postgresSaveQuery: async (req: Request, res: Response, next: NextFunction) => {
+    // getting user info to save query
+    const user = req.session.user;
+    if (!user) {
+      return res.status(401).json({ error: 'User not authenticated' });
+    }
+
     try {
       console.log('REACHED postgresSaveMetrics MIDDLEWARE');
       console.log('REQ BODY: ', req.body.params);
 
+      const userEmail = user.email;
       const { query_date, exec_time } = req.body.params.extractedQueryRes;
       const { queryString, queryName, hostname, database_name } =
         req.body.params.dbValues;
@@ -279,10 +279,11 @@ const postgresController = {
       const formatDateForMySql = date.toISOString().split('T')[0];
       console.log('formatted date: ', formatDateForMySql);
 
-      const insertQueryStr = `INSERT INTO queries (query, db_link, exec_time, db_name, query_date, name, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)`;
+      const insertQueryStr = `INSERT INTO queries (email, query, db_link, exec_time, db_name, query_date, name, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)`;
 
       //connect to mysql pool imported from userModel and send the query to update table
       const [savingQuery]: any = await pool.query(insertQueryStr, [
+        userEmail,
         queryString,
         hostname,
         exec_time,
@@ -307,6 +308,7 @@ const postgresController = {
       if (savingQuery.affectedRows > 0) {
         console.log('savingQuery completed!');
         res.locals.savedQuery = [
+          userEmail,
           queryString,
           hostname,
           exec_time,

server/controllers/save.controller.ts

@@ -32,14 +32,20 @@ interface GlobalError {
 const saveController = {
   getSavedQueries: async (req: Request, res: Response, next: NextFunction) => {
     log.info('[saveCtrl - getSavedQueries] Beginning to load saved queries');
+    const user = req.session.user;
+    if (!user) {
+      return res.status(401).json({ error: 'User not authenticated' });
+    }
+
     try {
       // query to get all necessary data to the FE
-      // TODO - add in user data to filter per user
-      const getQueries: string = `SELECT name, query, query_date, exec_time, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks FROM queries ORDER BY id DESC`;
-      const queryVal = await pool.query(getQueries);
+      const userEmail = user.email;
+      const getQueries: string = `SELECT name, query, query_date, exec_time, planning_time, total_cost, actual_total_time, node_type, relation_name, plan_rows, actual_rows, shared_hit_blocks, shared_read_blocks FROM queries WHERE email = ? ORDER BY id DESC`;
+      const queryVal = await pool.query(getQueries, [userEmail]);
       res.locals.savedQueries = queryVal;
       return next();
     } catch (err) {
+      console.error('getSavedQueries ERROR:', err);
       return next({
         log: 'An error occurred in saveController.getSavedQueries',
         message: 'Something went wrong in the loading process',

server/controllers/sessionController.ts

@@ -8,7 +8,12 @@ config();
 
 declare module 'express-session' {
   interface SessionData {
-    user: string;
+    user?: {
+      id: number | 0; // github oauth will provide id, 0 will be if id doesn't exist (n/a)
+      email: string;
+      username: string;
+      type: string;
+    };
     email: string;
   }
 }
@@ -46,7 +51,7 @@ export const setJwtToken: RequestHandler = async (
 
     // store access token and email in the session
     // getCurrentUser uses accessToken, saveSchema and retrieveSchema use the email
-    req.session.user = accessToken;
+    req.session.accessToken = accessToken;
     req.session.email = email;
 
     return next();
@@ -57,8 +62,8 @@ export const setJwtToken: RequestHandler = async (
 };
 
 export const getCurrentUser: RequestHandler = (req, res) => {
-  if (req?.session?.user) {
-    const accessToken = req.session.user;
+  if (req?.session?.accessToken) {
+    const accessToken = req.session.accessToken;
 
     jwt.verify(
       accessToken as string,

server/controllers/user.controller.ts

@@ -206,6 +206,16 @@ export const verifyUser: RequestHandler = async (
         email: foundUser[0][0].email,
       };
 
+      if (req.session) {
+        req.session.user = {
+          id: 0,
+          email: res.locals.userInfo.email,
+          username: res.locals.userInfo.name,
+          type: 'auth',
+        };
+      }
+      console.log('checking req.session.user: ', req.session.user);
+
       return next();
     } else {
       log.error('[userCtrl - verifyUser] Username/Password do not match');
@@ -226,6 +236,13 @@ export const verifyUser: RequestHandler = async (
   }
 };
 
+export const isAuthenticated: RequestHandler = (req, res, next) => {
+  if (!req.session.user) {
+    return res.status(401).json({ error: 'Not logged in' });
+  }
+  return next();
+};
+
 // Save currentSchema into database
 export const saveSchema: RequestHandler = async (
   req: Request,

server/routes/index.ts

@@ -35,6 +35,13 @@ declare module 'express-session' {
     logging?: boolean;
     db_type?: string;
     file_path?: string;
+    user?: {
+      id: number;
+      email: string;
+      username: string;
+      type: string;
+    };
+    accessToken?: string;
   }
 }
 

server/routes/mysql.router.ts

@@ -1,5 +1,6 @@
 import { Router, Response, Request } from 'express';
 import mysqlController from '../controllers/mysqlData.controller';
+import { isAuthenticated } from '../controllers/user.controller';
 
 const mysqlRouter = Router();
 
@@ -18,6 +19,7 @@ mysqlRouter.get(
 
 mysqlRouter.post(
   '/save-query',
+  isAuthenticated,
   mysqlController.mysqlSaveQuery,
   (_req: Request, res: Response) => {
     return res.status(200).json(res.locals.savedQuery);

server/routes/postgres.router.ts

@@ -1,5 +1,6 @@
 import { Router, Response, Request } from 'express';
 import postgresController from '../controllers/postgresData.controller';
+import { isAuthenticated } from '../controllers/user.controller';
 
 const postgresRouter = Router();
 
@@ -22,6 +23,7 @@ postgresRouter.get(
 
 postgresRouter.post(
   '/save-query',
+  isAuthenticated,
   postgresController.postgresSaveQuery,
   (_req: Request, res: Response) => {
     return res.status(200).json(res.locals.savedQuery);

server/routes/save.router.ts

@@ -3,6 +3,8 @@
 import { Router, Response, Request } from 'express';
 import bodyParser from 'body-parser';
 import saveController from '../controllers/save.controller';
+import { isAuthenticated } from '../controllers/user.controller';
+
 const saveRouter = Router();
 
 // Apply bodyParser with a larger limit
@@ -13,6 +15,7 @@ const saveRouter = Router();
 //Load Saved Queries
 saveRouter.get(
   '/saved-queries',
+  isAuthenticated,
   saveController.getSavedQueries,
   (_req: Request, res: Response) => {
     return res.status(200).json(res.locals.savedQueries);

src/pages/ViewSavedQueries.tsx

@@ -54,19 +54,17 @@ const ViewSavedQueries: React.FC = () => {
     <>
       <div className="justify-space-around flex-auto justify-end border-2 border-black pr-2">
         <FeatureTab />
-        <div className="ml-20 pt-20 text-center">
-          <h1 className="mb-12 text-5xl font-bold tracking-tight text-yellow-400">
-            Saved Queries
-          </h1>
-        </div>
         <div
           className={`h-screen transition-all duration-300 ${
             toggleClicked ? 'ml-16' : 'ml-64'
           }`}
         >
-          {/* this wrap aligns the title 'Queries Saved w/ the table  together */}
+          <h1 className="flex items-center justify-center pt-20 text-5xl font-bold tracking-tight text-slate-700 dark:text-white">
+            Saved Queries
+          </h1>
+          {/* this wrap aligns the title 'Saved Queries w/ the table together */}
           <div className="mt-4 flex gap-x-8">
-            {savedQueries.length > 0 && (
+            {savedQueries.length > 0 ? (
               <div className="mt-8 w-full max-w-[1300px] shrink-0 overflow-x-auto px-4 text-white">
                 <table className="min-w-full table-fixed border-collapse border border-white text-white">
                   <thead>
@@ -164,6 +162,10 @@ const ViewSavedQueries: React.FC = () => {
                   </tbody>
                 </table>
               </div>
+            ) : (
+              <div className="flex h-full w-full items-center justify-center text-white">
+                No queries saved.
+              </div>
             )}
           </div>
         </div>