Merge pull request #61 from oslabs-beta/stephen-crud

Stephen crud

Author: dahae0309

Contributors.md

@@ -2,17 +2,25 @@
 
 Below is a list of features and improvements to which you can contribute. If you have any additional ideas, please raise an issue or implement them as well!
 
-- Delete Table
-  - Add a command to delete a table from the canvas, making sure to implement checks to maintain data integrity
 - Logging needs a default settings list and direct reimport into live database.
-  - The SQL code to import has been placed into the DB_Schemas folder along with SQL Schema dumps. Also, log setting functionality is currently limited to Postgres databases and the code needs to be expanded to query and display log setting info from MySQL databases.
+  - The SQL code to import has been placed into the DB_Schemas folder along with SQL Schema dumps. Also, log setting functionality is currently limited to    Postgres databases and the code needs to be expanded to query and display log setting info from MySQL databases.
 - Db-schemas
   - The schemas are saved under db_schemas and is saved in the server. Have a way to delete the schemas on the server from the front end. It would also be convenient to add these schemas to a list of existing schemas and be able to pull these schemas to display for the user to avoid having to make a new connection to the same database multiple times.
-- Expand compatibility with other SQL database such as Oracle SQL, Microsoft SQL, IBM Db2, etc.
+- Complete the integration of SQLite as an optional database and expand compatibility with other SQL database such as IBM Db2, etc.
 - Add additional themes and graphical options to canvas and tables
 - Live query feedback so users can see what their changes to the canvas look like as queries.
+<<<<<<< HEAD
+- As the ability to manipulate data has been recently added, there are not as many safe guards to prevent users from performing actions that are not allowed for some databases.
+- Limiting the data types to only those possible for the the database the user is currently working on.
+- Adding Account specific functionality and the ability to save data to your account.
+- TypeORM has been implemented to connect to multiple databases but can be modified to further universal database functions
+=======
 - Create login feature to save multiple databases to user account and be able to load multiple past databases.
+>>>>>>> dev
 
 Known bugs/issues
 
 - Undo function will not revert the state of the canvas to the point where it is empty.
+- Attempting to change the name of a column while adding a foreign key will result in the page crashing and going all white. Changing the column name is currently disabled.
+- When creating a new foreign key on a column, if you click submit while there is no table selected, the display area will shrink to a very small square in the top left  corner of the page.
+- Exporting your query has been affected in the course of adding additional databases and needs to be reorganized

README.md

@@ -21,14 +21,14 @@
 
 - Enhanced support for SQL databases with expanded options.
 - Introduction of visualized DATA tables for improved data analysis.
-- Full CRUD functionality enabling the addition, modification, and deletion of rows in DATA tables within the database.
-- Capability to remove tables as needed.
+- Robust CRUD functionality enabling the addition, modification, and deletion of rows in DATA tables within the database.
+- Capability to remove and add tables as needed.
 - Implementation of Google and GitHub OAuth log-ins for streamlined user authentication.
 
 
 ### Use Cases
 
-- Connecting to an existing remote PostgreSQL, MySQL,  MicroSoftSQL, OracleSQL, and SQLite3  database
+- Connecting to an existing remote PostgreSQL, MySQL, MicroSoftSQL, OracleSQL databases
   - Renders an ER diagram for SCHEMA and DATA of the existing database and provides an interface for users to both modify existing tables and create new tables. A log of changes is stored, and at any point, the user can generate a query containing the changes, such that they are reflected in the existing database.
 - Uploading your database's SQL file
   - Renders an ER diagram for the provided SQL file (db dump) and provides an interface for a user to both modify existing tables and create new tables. Changes are converted into the corresponding queries, which the user can view and execute on their own database outside of dbSpy.
@@ -158,6 +158,7 @@ npm run cert:linux
 2. Select the database type from the dropdown.
 3. Input your database URI information OR database connection credentials and click on "Connect".
 4. Once the connection to your database is established, the canvas will render and generate the tables and their relationships.
+    * OracleSQL requires the download of the OCI - [here](https://www.oracle.com/cloud/free/)
 
 <img src="images/withDataButton.png">
 
@@ -173,18 +174,23 @@ npm run cert:linux
 
 ## Adding column(s) to a SCHEMA table or row(s) to a DATA table
 
-1. To add a new column/row in a table, click on the add icon on the top right of the table node. This will render a new column/row in the table in edit mode. The changes made in DATA table will be updated in your database.
+1. To add a new column/row in a table, click on the add/plus icon on the top right of the table node. 
+2. This will render a new column/row in the table in edit mode. 
+3. Add in the data you would like in each column/row. 
+4. Click on the confirm icon to save the column/row. 
+5. The changes made in DATA table will be updated in your database. 
+6. Click on the cancel icon to cancel the addition.
    <img src="images/Create%20tables.png">
    <img src="images/addRow.png">
 
-### Editing an existing column to a SCHEMA table or row to a DATA table
+### Editing an existing row of a DATA table
 
 1. Click on the edit icon of the specific column that you want to edit.
 2. You can make changes to column fields based on the selections provided.
 3. Click on the save icon to keep your changes.
 4. Click on the cancel icon to cancel your changes.
 
-## Deleting an column to a SCHEMA table or row to a DATA table
+### Deleting a column to a SCHEMA table or row of a DATA table
 
 1. Click on the delete icon of the specific column that you want to delete.
 2. Click on the confirm icon to delete the column.
@@ -197,6 +203,18 @@ npm run cert:linux
 3. Click save or cancel to proceed.
 4. Click on the save icon to keep your changes or click on the cancel icon to cancel your changes.
 
+### Adding a table to a database
+
+1. When on the display page, click the 'Add Table' icon after you have either connected to a database or clicked 'Build Database'.
+2. Fill in the required information about the first column of your table along with a name.
+3. If you would like to include additional columns, click the 'Add Column' button in the top right corner.
+3. Click confirm to create your table.
+
+### Deleting a table from a database
+
+1. After you have either connected to a database or started a new database, the 'Delete Table' icon will appear on the left side of the display page
+2. This will open a pop out with a list of tables from the database.
+3. Select which table that you would like to have removed, and confirm to have it deleted.
 
 ### Navigating the canvas
 
@@ -218,9 +236,9 @@ npm run cert:linux
 ---
 
 ### Credits/Contributors
-- Yichung Chiu • [LinkedIn] • [Github]
-- Joseph Tejeda • [LinkedIn] • [Github]
-- Stephen Havig • [LinkedIn] • [Github]
+- Yichung Chiu • [LinkedIn](https://www.linkedin.com/in/yichung-chiu-b14a94272/) • [Github](https://github.com/ychiu5896)
+- Joseph Tejeda • [LinkedIn](https://www.linkedin.com/in/atxjtejeda/) • [Github](https://github.com/JosephTejeda)
+- Stephen Havig • [LinkedIn](https://www.linkedin.com/in/stephen-havig-199340145/) • [Github](https://github.com/Stephen-Havig)
 - Das Kang • [LinkedIn](https://www.linkedin.com/in/das-kang/) • [Github](https://github.com/dahae0309)
 - Alexander Tu • [LinkedIn](https://www.linkedin.com/in/atu816/) • [Github](http://github.com/atu816)
 - Michael Costello • [LinkedIn](https://www.linkedin.com/in/mcostello-swe/) • [Github](https://github.com/neighbor-peace)

server/controllers/helperFunctions/universal.helpers.ts

@@ -2,6 +2,7 @@ import { RequestHandler, Request, Response, NextFunction } from 'express';
 import { DataSource } from 'typeorm';
 
 
+// HELPER FUNCTIONS FOR THE HELPER FUNCTIONS
 
 const tableNameFormat = async (req: Request, dbDataSource: DataSource) => {
   const { db_type, username } = req.session;
@@ -304,18 +305,19 @@ export const addNewDbColumn: RequestHandler = async (req: Request, _res: Respons
 
 export const updateDbColumn: RequestHandler = async (req: Request, _res: Response, next: NextFunction,) => {
   const dbDataSource = await dbConnect(req);
-  const { db_type, username } = req.session;
-  const { tableName, columnName, schemaData, columnData } = req.body;
+  const { db_type } = req.session;
+  const { columnName, schemaData, columnData } = req.body;
 
   try{
     const tableNameUpdateColumn = await Promise.resolve(tableNameFormat(req, dbDataSource));
     console.log('schemaData: ', schemaData)
     console.log('columnData: ', columnData)
 
-    // const updatedColumn: Promise<unknown> = await dbDataSource.query(`
-    //   ALTER TABLE ${tableNameUpdateColumn}
-    //   ${db_type === 'postgres' || db_type === 'microsoft' ? 'ALTER COLUMN' : 'MODIFY' } "${columnName}" ${db_type} ${db_type === 'postgres' ? updateColumnData.constraintName : null} ${updateColumnData.constraintExpression}
-    //   `);
+
+      await dbDataSource.query(`
+      UPDATE ${tableNameUpdateColumn}
+      ${db_type === 'postgres' || db_type === 'microsoft' ? 'ALTER COLUMN' : 'MODIFY' } "${columnName}" ${db_type} ${ columnData.additional_constraint ? columnData.additional_constraint : ''};
+      `);
 
     dbDataSource.destroy();
     console.log('Database has been disconnected');

server/controllers/microsoftData.controller.ts

@@ -26,12 +26,7 @@ const microsoftController = {
           const references: {[key: string]: string | boolean}[] = []
           if (foreignKey){
             references.push({
-              // isDestination: false,
-              // PrimaryKeyName: foreignKey.column_name,
-              // PrimaryKeyTableName: 'public.' + tableName,
-              // ReferencesPropertyName: foreignKey.referenced_column_name,
-              // ReferencesTableName: 'public.' + foreignKey.referenced_table_name,
-              // constraintName: foreignKey.constraint_name,
+              // These got a little mixed up but are in the right place
               isDestination: false,
               PrimaryKeyName: foreignKey.referenced_column_name,
               PrimaryKeyTableName: 'public.' + foreignKey.referenced_table_name,

server/controllers/mysqlData.controller.ts

@@ -40,12 +40,7 @@ const mysqlController = {
         const references: {[key: string]: string | boolean}[] = [];
         if (foreignKey){
           references.push({
-            // isDestination: false,
-            // PrimaryKeyName: foreignKey.COLUMN_NAME,
-            // PrimaryKeyTableName: 'public.' + tableName,
-            // ReferencesPropertyName: foreignKey.REFERENCED_COLUMN_NAME,
-            // ReferencesTableName: 'public.' + foreignKey.REFERENCED_TABLE_NAME,
-            // constraintName: foreignKey.CONSTRAINT_NAME,
+            // These got a little mixed up but are in the right place
             isDestination: false,
             PrimaryKeyName: foreignKey.REFERENCED_COLUMN_NAME,
             PrimaryKeyTableName: 'public.' + foreignKey.REFERENCED_TABLE_NAME,
@@ -255,196 +250,4 @@ const mysqlController = {
 //---------------------------------------------------------------------------------------------------
 
 };
-export default mysqlController;
-
-// // SSL data stored as environment variable for GitHub Actions access
-// // Also stored in .cert file because Elastic Beanstalk has a ~4000 char limit for its environment variables
-// const SSL_KEY =
-//   typeof process.env.SSL_KEY === 'string'
-//     ? Buffer.from(process.env.SSL_KEY, 'base64').toString('ascii')
-//     : fs.readFileSync('./.cert/key.pem').toString();
-// const SSL_CERT =
-//   typeof process.env.SSL_CERT === 'string'
-//     ? Buffer.from(process.env.SSL_CERT, 'base64').toString('ascii')
-//     : fs.readFileSync('./.cert/cert.pem').toString();
-
-// /**
-// //  * mySQLdataController.getSchema
-// //  * @param {string} hostname - A required string with database hostname
-// //  * @param {string} password - A required string with database password
-// //  * @param {string} port - A required string with database port
-// //  * @param {string} username - A required string with database username
-// //  * @param {string} databaseName - A required string with the database name
-// //  **/
-
-// export const getSchema = async (req: Request, res: Response, next: NextFunction) => {
-//   // // Option 1 - Production
-//   //use mysqldump to download mysql db schema
-//   log.info('Connecting to mySQL database...');
-//   const { hostname, password, port, username, database_name } = req.query;
-//   try {
-//     const result = await mysqldump({
-//       connection: {
-//         host: hostname,
-//         password,
-//         port,
-//         user: username,
-//         database: database_name,
-//         ssl: {
-//           key: SSL_KEY,
-//           cert: SSL_CERT,
-//         },
-//       },
-//       dumpToFile: '../db_schemas',
-//     });
-//     res.locals.data = result;
-//     //const { tables } = result;
-//     next();
-//   } catch (error: unknown) {
-//     log.info((error as Error).message);
-//     next({ message: 'Error with getSchema middleware' });
-//   }
-// };
-
-// /**
-//  * mySQLdataController.objSchema
-//  * Iterates through data tables received from mySQL server
-//  * Builds object to be returned to front-end
-//  */
-// export const objSchema = (_req: Request, res: Response, next: NextFunction) => {
-//   const db = res.locals.data;
-//   const { tables } = db;
-//   const results = {};
-
-//   //create Table class
-//   class TableModel {
-//     [key: string]: any;
-//     constructor(public name: string) {}
-// }
-
-//   //create Properties class
-//   class PropertyModel {
-//     Name: string;
-//     Value: any = null;
-//     data_type: string = 'varchar';
-//     TableName: string | null = null;
-//     References: string[] = [];
-//     IsPrimaryKey: boolean = false;
-//     IsForeignKey: boolean = false;
-//     additional_constraints: string = 'NA';
-//     field_name: string;
-
-//     constructor(name: string) {
-//       this.Name = name;
-//       this.field_name = name;
-//     }
-//   }
-  
-//   // create foreign key class
-//   class ForeignKeyModel {
-//     PrimaryKeyName: string | null = null; //key name at referenced table
-//     PrimaryKeyTableName: string | null = null; //  referenced table name
-//     ReferencesPropertyName: string | null = null; //key name at current table
-//     ReferencesTableName: string | null = null;//current table name
-//     IsDestination: boolean = false;
-//     constraintName: string | null = null; //constraint from SQL query
-//   }
-
-//   //append tables and table properties to results
-//   tables.forEach((table: any) => {
-//     //check if table or view
-//     if (!table.isView) {
-//       //get unique keys
-//       let uKeys = table.schema.slice(table.schema.indexOf('UNIQUE KEY'));
-//       uKeys = uKeys.slice(uKeys.indexOf('(') + 1, uKeys.indexOf(')'));
-//       if (uKeys.includes(',')) uKeys = uKeys.split(', ');
-//       else uKeys = [uKeys];
-//       const uniqueKeys = uKeys.map((key: string) => key.slice(1, -1));
-
-//       //get primary keys
-//       let pKeys = table.schema.slice(table.schema.indexOf('PRIMARY KEY'));
-//       pKeys = pKeys.slice(pKeys.indexOf('(') + 1, pKeys.indexOf(')'));
-//       if (pKeys.includes(',')) pKeys = pKeys.split(', ');
-//       else pKeys = [pKeys];
-//       const primaryKeys = pKeys.map((key: string) => key.slice(1, -1));
-
-//       //create foreign key and reference object (foreign key: references)
-//       const foreignKeyReferences: any = {};
-//       //declare foreign keys/references helper function
-//       type ForeignKeysFn = (string: string) => void;
-//       const foreignKeys: ForeignKeysFn = function(string = '') {
-//         if (string === '') return;
-//         let constraint = null;
-//         //find constraint name
-//         if (string.slice(string.indexOf('CONSTRAINT'))) {
-//           string = string.slice(string.indexOf('CONSTRAINT'));
-//           string = string.slice(string.indexOf('`') + 1);
-//           constraint = string.slice(0, string.indexOf('`'));
-//         }
-//         //find foreign key
-//         string = string.slice(string.indexOf('FOREIGN KEY'));
-//         string = string.slice(string.indexOf('(') + 2);
-//         const fKey = string.slice(0, string.indexOf(')') - 1);
-//         //find primary table name
-//         string = string.slice(string.indexOf('REFERENCES'));
-//         string = string.slice(string.indexOf('`') + 1);
-//         const primaryTable = string.slice(0, string.indexOf('`'));
-//         //find primary table name
-//         const primaryKey = string.slice(string.indexOf('(') + 2, string.indexOf(')') - 1);
-//         //create new ForeignKeyModel and assign properties
-//         foreignKeyReferences[fKey] = new ForeignKeyModel();
-//         foreignKeyReferences[fKey].ReferencesPropertyName = fKey;
-//         foreignKeyReferences[fKey].ReferencesTableName = table.name;
-//         foreignKeyReferences[fKey].PrimaryKeyName = primaryKey;
-//         foreignKeyReferences[fKey].PrimaryKeyTableName = primaryTable;
-//         foreignKeyReferences[fKey].constraintName = constraint;
-
-//         //find additional foreign keys and references
-//         return foreignKeys(string);
-//       };
-//       //invoke foreignKeys function and pass table.schema string
-//       foreignKeys(table.schema);
-
-//       //create and assign new table to results object
-//       //const results: { [key: string]: TableModel } = {}; ---> We Don't need this? -Stephen
-
-
-//       //create new table properties
-//       table.columnsOrdered.forEach((propName: string) => {
-//         const newProp = new PropertyModel(propName);
-//         //assign table name
-//         newProp.TableName = table.name;
-//         //assign field name
-//         newProp.field_name = newProp.Name;
-//         //assign data type
-//         newProp.data_type = table.columns[newProp.Name].type;
-//         //assign additional_constraints (primary, unique or not null)
-//         if (primaryKeys.includes(newProp.Name))
-//           newProp.additional_constraints = 'PRIMARY KEY';
-//         else if (uniqueKeys.includes(newProp.Name))
-//           newProp.additional_constraints = 'UNIQUE';
-//         else if (!table.columns[propName].nullable)
-//           newProp.additional_constraints = 'NOT NULL';
-//         //check if primary key
-//         if (primaryKeys.includes(newProp.Name)) newProp.IsPrimaryKey = true;
-//         // check if foreign key and assign references
-//         if (foreignKeyReferences[newProp.Name]) {
-//           newProp.IsForeignKey = true;
-//           newProp.References = [foreignKeyReferences[newProp.Name]];
-//         }
-
-//         //assign new property to table
-//         const results: {[key: string]: TableModel & {[key: string]: PropertyModel}} = {};
-//         if (!results[table.name]) {
-//           results[table.name] = new TableModel(table.name);
-//         }
-//         results[table.name][newProp.Name] = newProp;
-//       });
-//     }
-//   });
-
-//   res.locals.data = results;
-//   return next();
-// };
-
-// export default mySQLdataController;
+export default mysqlController;