Skip to content

Commit f0b3f6d

Browse files
authored
Merge pull request #115 from oslabs-beta/kevin
SeeQR V13
2 parents 56e056c + 6698644 commit f0b3f6d

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+3071
-1185
lines changed

Diff for: .eslintignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,5 @@ tsCompiled
33
assets
44
dist
55
node_modules
6-
frontendOld
6+
frontendOld
7+
jest.config.ts

Diff for: DEV_README.md

+33-10
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66

77
<b>`Developer's Read Me`</b>
88

9-
<b>`** v12.0.0 **`</b>
9+
<b>`** v13.0.0 **`</b>
1010

1111
<p>In this version our team focused on refactoring the broken code base from all previous versions. </p>
1212

@@ -16,15 +16,20 @@ Run npm run dev twice if you do not manually run tsc to compile the files first.
1616

1717
<p><b> WHAT WE UPDATED: </b></p>
1818

19-
<p>1. trimmed dependency issues from 54 down to 1. this one cannot be resolved because it is from the 30 viewers</p>
20-
<p>2. Broke backend into MVVM/MVC model</p>
21-
<p>3. Made sure types are enforced in typescript</p>
22-
<p>4. Fixed import and export local files</p>
23-
<p>5. Fixed Authentication</p>
19+
<p>1. Refactored UX/UI to enhance user's performance by streamlining key features</p>
20+
<p>2. Implemented Query History and selected query will populate on Monaco Editor</p>
21+
<p>3. Changed from CodeMirror to Monaco Editor to bring back in colors for selected keywords</p>
22+
<p>4. Reimplemented table rows to display in Table View</p>
23+
<p>5. Fixed import and export local files for Postgres and MySQL</p>
24+
<p>6. Fixed Authentication</p>
25+
<p>7. Added additional testing suites</p>
26+
<p>8. Introduced layout saving for ERD view</p>
2427

2528
<p><b> WHAT NEEDS TO BE DONE: </b></p>
2629

27-
<p><b>1. Isolating Database</b> <br> One of the biggest tasks that we tried but <b>did not finish</b> is isolating the concerns of each database type (DBType). The current application has multiple</p>
30+
<p>1. Refractor tableTabBar </p>
31+
32+
<p><b>2. Isolating Database</b> <br> One of the biggest tasks that we tried but <b>did not finish</b> is isolating the concerns of each database type (DBType). The current application has multiple</p>
2833
<code>if (database === DBType.postgres) {}<br>
2934
else if (database === DBType.mysql) {}<br>
3035
else (database === DBType.sqlite) {}<br>
@@ -34,15 +39,15 @@ else (database === DBType.sqlite) {}<br>
3439

3540
<img src="./assets/readmeImages/erdArchitecture.png" height=500/>
3641

37-
<p>The road map is finish connecting the siloed pieces for postgres, then moving on to mysql <br><br> <b>***Important*** <br> There is not an entry for this system yet but this file frontend/components/iews/ERTables/ERDisplayWindow.tsx will replace frontend/components/iews/ERTables/ERTabling.tsx when this is ready</b></p>
42+
<p>The road map is finish connecting the siloed pieces for postgres, then moving on to mysql <br><br> <b>***Important*** <br> There is not an entry for this system yet but this file frontend/components/iews/ERTables/ERDisplayWindow.tsx will be the entry</b></p>
3843

39-
<p><b>2. ERD Logic Update</b><br>Currently, previous wrote the frontend to send back a big bundle of all the operations done in the frontend ERD Table. This ERD table object is divided by add, drop, and alter. All the add operations will execute first then drop, then alter. This is <b>BAD</b>. <br><br> We need to redesign frontend to send back "sequental" operations instead of bundling operations by add, drop, alter because it takes care of multiple edge cases and users in the front can do as many operations they want to ensure <b>SAVE</b> works. I illustrated the problem below. The current backend is written out already. We just need to make sure the frontend is send back the appropriate logic</p>
44+
<p><b>3. ERD Logic Update</b><br>Currently, previous wrote the frontend to send back a big bundle of all the operations done in the frontend ERD Table. This ERD table object is divided by add, drop, and alter. All the add operations will execute first then drop, then alter. This is <b>BAD</b>. <br><br> We need to redesign frontend to send back "sequental" operations instead of bundling operations by add, drop, alter because it takes care of multiple edge cases and users in the front can do as many operations they want to ensure <b>SAVE</b> works. I illustrated the problem below. The current backend is written out already. We just need to make sure the frontend is send back the appropriate logic</p>
4045

4146
<img src="./assets/readmeImages/ERD_before_after.png" height=500/>
4247

4348
<br><br> <b>**_Important_** <br> This is wrtten at backend/src/ipcHandlers/dbCRUDHandlerERD.ts and will replace backend/src/ipcHandlers/dbCRUDHandler.ts when this is ready</b>
4449

45-
<p><b>3. Async event emmiters between front/backend</b></p>
50+
<p><b>4. Async event emmiters between front/backend</b></p>
4651
<p>Currently, the way the feedback modal works is by handling events that are emitted from both the frontend and the backend. Ideally, this should be refactored to be state dependent rather than event dependent, as it controls the display of the modal. This can be tied into the centralized async event emitter added to frontend/components/app.tsx, in conjunction with migration to reducers from state variables. The goal will be to house modal messages in the store tied to the main app reducer. From there, the async handler can send new messages to the state via main app dispatch, and any other front end feedback can do the same.<br><br>
4752
The main roadblock in the way of finalizing the transfer of event handlers out of the frontend is the way the dblist (list of databases in the sidebar) gets updated. Many event handlers in the backend send a dblist update event out to update the front end. Ideally, this should be handled by returning the new dblist changes out of the handler and using that resolved value to update state whenever an action would cause a dblist change. Right now, app.tsx has a useEffect running that listens for those dblist updates every frame. This is inefficient as a frontend concern.<br><br>
4853
The spinner currently works in a similar way to feedback. Once all async is completely migrated (including dblist update changes), this spinner can simply be tied to the loading property in the main app state.<br><br>
@@ -52,3 +57,21 @@ There are still some filesystem read/write calls in the front end. This should b
5257
<p>5. </p>
5358

5459
<p><b> WHAT IS BROKEN: </b></p>
60+
61+
<p>1. The application on Windows may periodically crash.</p>
62+
<p>2. There are import issues on mac computers.</p>
63+
64+
- Unable to import pg or mySQL database files
65+
<p>3. Duplicates appear on previous queries.</p>
66+
67+
- In 'queryView', the 'queriesRan' state is defined, set, and passed down as a prop to its child component 'queryHistory'. On line 54 of 'queryHistory', duplicate query saved in the queriesRan state are removed. However, there's a problem: when we click the format button in QuerySqlInput and then run the query, it saves the query again. This happens because the new Set method doesn't recognize the formatted SQL strings due to the presence of '\n' characters. Consequently, clicking the run query button for both unformatted and formatted SQL strings results in duplicates being saved in the query history.
68+
69+
<p>4. Label and Group field disappears.</p>
70+
71+
- In the queries tab, the Label and Group text in input field will disappear when selecting the Monaco Editor.
72+
- The bug may arise from the useEffect hook, which triggers every time the component updates. Any changes detected in the editor results in a new Monaco Editor instance, potentially resetting the label and group text inputs.
73+
74+
<p>5. Foreign and Primary keys.</p>
75+
76+
- Unable to select the primary and/or foreign key of a newly added column until the column is saved onto the database. Once saved onto the database, we can then select the primary and foreign key and save them onto the database.
77+

Diff for: README.md

+13-12
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<img src="./assets/readmeImages/logo_readme.png" height=300/>
44

55
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/oslabs-beta/SeeQR)
6-
![Release: 12.0.0](https://img.shields.io/badge/Release-12.0.0-red)
6+
![Release: 13.0.0](https://img.shields.io/badge/Release-13.0.0-red)
77
![License: MIT](https://img.shields.io/badge/License-MIT-orange.svg)
88
![Contributions Welcome](https://img.shields.io/badge/Contributions-welcome-blue.svg)
99
[![Twitter](https://img.shields.io/twitter/url?style=social&url=https%3A%2F%2Ftwitter.com%2Ftheseeqr)](https://twitter.com/theseeqr)
@@ -15,7 +15,7 @@
1515

1616
</div>
1717

18-
### For the latest in-depth docs for v12.0.0, please visit our [docs site](http://www.seeqrapp.com/docs).
18+
### For the latest in-depth docs for v13.0.0, please visit our [docs site](http://www.seeqrapp.com/docs).
1919

2020
## Table of Contents
2121

@@ -49,7 +49,7 @@ To get started on contributing and editing databases to this project:
4949
- [React-Flow](https://reactflow.dev/)
5050
- [Chart.js](https://github.com/chartjs)
5151
- [Faker.js](https://github.com/Marak/faker.js)
52-
- [CodeMirror](https://codemirror.net/)
52+
- [Monaco](https://microsoft.github.io/monaco-editor/)
5353
- [React-Force-Graph](https://github.com/vasturiano/react-force-graph)
5454
- [Three.js](https://github.com/mrdoob/three.js/)
5555
- [D3.js](https://github.com/d3/d3)
@@ -76,6 +76,8 @@ To get started on contributing and editing databases to this project:
7676
- Databases
7777

7878
- In the 'DATABASES' view, an interactive Entity Relationship Diagram (`ER DIAGRAM`) is displayed for the selected database.
79+
- Users can now save table layout in version 13.
80+
7981
- Users can select `TABLE` to see selected database in tabular form.
8082

8183
- Users can select a table from a list of all the tables in the schema of the currently selected database.
@@ -96,7 +98,7 @@ To get started on contributing and editing databases to this project:
9698
</div>
9799
<br>
98100

99-
- <strong>NEW</strong> 3D Database Visualization
101+
- 3D Database Visualization
100102
- From the 'DATABASES' view, select the '3D View' tab on the far right of the sidebar to launch the brand new 3D database visualizer.
101103
- Individual table nodes are distinguished by their different colors
102104
- Column nodes are joined to table nodes and match their source table color
@@ -132,20 +134,19 @@ To get started on contributing and editing databases to this project:
132134

133135
- Queries
134136

135-
- In the 'QUERIES' view, the main panel is where the query input text field is located, utilizing CodeMirror. The paint button in the top right corner of the panel auto-formats the inputted query.
137+
- In the 'QUERIES' view, the main panel is where the query input text field is located, utilizing Monaco. The paint button in the top right corner of the panel auto-formats the inputted query.
136138
- Users can select the database to use in the 'Database' dropdown above the main panel.
137139
- Users also have the option to execute a labelled/grouped or unlabelled/ungrouped query — simply provide a label/group in the 'Label'/'Group' field above the main panel to identify the query in later comparisons against other queries.
138140
- Please note that only labelled queries will be saved in the current session for future references.
139141
- To execute the query, simply select the 'RUN QUERY' button at the bottom of the panel or press 'Ctrl-Enter' on the keyboard.
140-
- The 11th version now includes the functionality to run multiple queries, allowing users to obtain more reliable testing results.
141-
<br />
142+
- Users have the option to run multiple queries, allowing users to obtain more reliable testing results.
143+
- Version 13 introduces a new feature that enables users to access and view previous queries. Upon selecting a previous query, it populates the query input field, allowing users to make edits before executing.
144+
</br>
145+
<br>
142146
<div align="center">
143-
<img src="./assets/readmeImages/gifs/multisample.gif" width=800/>
147+
<img src="./assets/readmeImages/gifs/query.gif" width=800/>
144148
</div>
145149
<br />
146-
<div align="center">
147-
<img src="./assets/readmeImages/gifs/Query_Execution.gif" width=800/>
148-
</div>
149150

150151
- Save/Load Queries
151152

@@ -202,7 +203,7 @@ We've released SeeQR because it's a useful tool to help optimize SQL databases.
202203

203204
## Core Team
204205

205-
[Annabelle Ni](https://github.com/annni11) | [Derek Koh](https://github.com/derekoko) | [Peter Zepf](https://github.com/peterzepf) | [Tony Gao](https://github.com/tgao17) | [Ching-Yuan Lai (Eric)](https://github.com/paranoidFrappe) | [Jamie Zhang](https://github.com/haemie) | [Julian Macalalag](https://github.com/juzi3) | [Nathan Chong](https://github.com/nathanhchong) | [Junaid Ahmed](https://github.com/junaid-ahmed7) | [Chase Sizemore](https://github.com/ChaseSizemore) | [Oscar Romero](https://github.com/creaturenex) | [Anthony Deng](https://github.com/anthonyadeng) | [Aya Moosa](https://github.com/Hiya-its-Aya) | [Trevor Ferguson](https://github.com/TrevorJFerguson) | [Pauline Nguyen](https://github.com/paulinekpn) | [Utkarsh Uppal](https://github.com/utyvert) | [Fred Jeong](https://github.com/fred-jeong) | [Gabriel Kime](https://github.com/wizardbusiness) | [Chris Fryer](github.com/frynoceros) | [Ian Grepo](https://github.com/RadiantGH) | [Michelle Chang](https://github.com/mkchang168) | [Jake Bradbeer](https://github.com/JBradbeer) | [Bryan Santos](https://github.com/santosb93) | [William Trey Lewis](https://github.com/treyfrog128) | [Brandon Lee](https://github.com/BrandonW-Lee) | [Casey Escovedo](https://github.com/caseyescovedo) | [Casey Walker](https://github.com/cwalker3011) | [Catherine Chiu](https://github.com/catherinechiu) | [Chris Akinrinade](https://github.com/chrisakinrinade) | [Cindy Chau](https://github.com/cindychau) | [Claudio Santos](https://github.com/Claudiohbsantos) | [Eric Han](https://github.com/ericJH92) | [Faraz Akhtar](https://github.com/faraza22) | [Frank Norton](https://github.com/FrankNorton32) | [Harrison Nam](https://github.com/harrynam07) | [James Kolotouros](https://github.com/dkolotouros) | [Jennifer Courtner](https://github.com/jcourtner) | [John Wagner](https://github.com/jwagner988) | [Justin Dury-Agri](https://github.com/justinD-A) | [Justin Hicks](https://github.com/JuiceBawks) | [Katie Klochan](https://github.com/kklochan) | [May Wirapa Boonyasurat](https://github.com/mimiwrp) | [Mercer Stronck](https://github.com/mercerstronck) | [Muhammad Trad](https://github.com/muhammadtrad) | [Richard Guo](https://github.com/richardguoo) | [Richard Lam](https://github.com/rlam108) | [Sam Frakes](https://github.com/frakes413) | [Serena Kuo](https://github.com/serenackuo) | [Timothy Sin](https://github.com/timothysin) | [Vincent Trang](https://github.com/vincentt114)
206+
[Kevin Chou](https://github.com/choukevin612) |[Zoren Labrador](https://github.com/zorenal) |[Elaine Wong](https://github.com/user-byte123) | [Cathy Luong](https://github.com/cyliang93) | [Derek Koh](https://github.com/derekoko) | [Peter Zepf](https://github.com/peterzepf) | [Tony Gao](https://github.com/tgao17) | [Ching-Yuan Lai (Eric)](https://github.com/paranoidFrappe) | [Jamie Zhang](https://github.com/haemie) | [Julian Macalalag](https://github.com/juzi3) | [Nathan Chong](https://github.com/nathanhchong) | [Junaid Ahmed](https://github.com/junaid-ahmed7) | [Chase Sizemore](https://github.com/ChaseSizemore) | [Oscar Romero](https://github.com/creaturenex) | [Anthony Deng](https://github.com/anthonyadeng) | [Aya Moosa](https://github.com/Hiya-its-Aya) | [Trevor Ferguson](https://github.com/TrevorJFerguson) | [Pauline Nguyen](https://github.com/paulinekpn) | [Utkarsh Uppal](https://github.com/utyvert) | [Fred Jeong](https://github.com/fred-jeong) | [Gabriel Kime](https://github.com/wizardbusiness) | [Chris Fryer](github.com/frynoceros) | [Ian Grepo](https://github.com/RadiantGH) | [Michelle Chang](https://github.com/mkchang168) | [Jake Bradbeer](https://github.com/JBradbeer) | [Bryan Santos](https://github.com/santosb93) | [William Trey Lewis](https://github.com/treyfrog128) | [Brandon Lee](https://github.com/BrandonW-Lee) | [Casey Escovedo](https://github.com/caseyescovedo) | [Casey Walker](https://github.com/cwalker3011) | [Catherine Chiu](https://github.com/catherinechiu) | [Chris Akinrinade](https://github.com/chrisakinrinade) | [Cindy Chau](https://github.com/cindychau) | [Claudio Santos](https://github.com/Claudiohbsantos) | [Eric Han](https://github.com/ericJH92) | [Faraz Akhtar](https://github.com/faraza22) | [Frank Norton](https://github.com/FrankNorton32) | [Harrison Nam](https://github.com/harrynam07) | [James Kolotouros](https://github.com/dkolotouros) | [Jennifer Courtner](https://github.com/jcourtner) | [John Wagner](https://github.com/jwagner988) | [Justin Dury-Agri](https://github.com/justinD-A) | [Justin Hicks](https://github.com/JuiceBawks) | [Katie Klochan](https://github.com/kklochan) | [May Wirapa Boonyasurat](https://github.com/mimiwrp) | [Mercer Stronck](https://github.com/mercerstronck) | [Muhammad Trad](https://github.com/muhammadtrad) | [Richard Guo](https://github.com/richardguoo) | [Richard Lam](https://github.com/rlam108) | [Sam Frakes](https://github.com/frakes413) | [Serena Kuo](https://github.com/serenackuo) | [Timothy Sin](https://github.com/timothysin) | [Vincent Trang](https://github.com/vincentt114)
206207

207208
## License
208209

0 commit comments

Comments
 (0)