Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GSOC Final Evaluation Work Submission Report PR - Frontend #110

Open
wants to merge 41 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
41 commits
Select commit Hold shift + click to select a range
b645e9d
test branch with local setting
sunnytarawade Jun 6, 2022
17bfa99
configured environment.ts for local setup
sunnytarawade Jul 22, 2022
1ba78fb
Merge branch 'aksh/angular-material-ui' of https://github.com/FAANG/d…
sunnytarawade Jul 22, 2022
57334d3
Merge branch 'aksh/angular-material-ui' of https://github.com/FAANG/d…
sunnytarawade Jul 31, 2022
ffe48ec
Added new route /data-join-ui
sunnytarawade Jul 31, 2022
a326b17
Added two dropdowns for selecting the first two indices
sunnytarawade Jul 31, 2022
2c8ebed
added details of second indices
sunnytarawade Jul 31, 2022
6531ff3
added select field checkbox
sunnytarawade Aug 1, 2022
8e2c9e2
Added filter input for fields as well
sunnytarawade Aug 1, 2022
dc9def5
added MatCheckboxModule in app.module.ts
sunnytarawade Aug 1, 2022
e742f9b
Added Field and Filters form for second index
sunnytarawade Aug 2, 2022
4e50023
added query display which updates when formdata changed
sunnytarawade Aug 2, 2022
ad0fd89
Added a function to make nested object from string path
sunnytarawade Aug 3, 2022
cc905e7
added npm module jsonToGraphQLQuery
sunnytarawade Aug 3, 2022
5b49252
added todo to gitignore and installed lodash
sunnytarawade Aug 3, 2022
c7efde3
changed fieldName formcontrol type
sunnytarawade Aug 3, 2022
7c6c8c9
added function to remove falsy nested object key values
sunnytarawade Aug 3, 2022
6a0640d
Can get graphQL query from UI forms
sunnytarawade Aug 3, 2022
d0801e9
fixed filter argument error in query
sunnytarawade Aug 3, 2022
162948b
Added multiple record resolver for first index
sunnytarawade Aug 3, 2022
cac24ab
Pretty printed graphQL query
sunnytarawade Aug 3, 2022
93675d4
modified firstIndex array
sunnytarawade Aug 3, 2022
48a74e2
Added component for fetching data through GraphQL
sunnytarawade Aug 4, 2022
7652aff
applied some styling
sunnytarawade Aug 4, 2022
b08c5f4
Added Apollo GraphQL and can make a successful query to GraphQL Server
sunnytarawade Aug 4, 2022
e7fb459
Restricted select fields and filters form height
sunnytarawade Aug 5, 2022
ce8f288
Restricted select fields and filters form height
sunnytarawade Aug 7, 2022
2206af5
Added socket connection on fetching data
sunnytarawade Aug 9, 2022
084049f
socket setup
sunnytarawade Aug 17, 2022
6e66a65
fields added in form for all indices. Partially indices for specimen …
sunnytarawade Aug 17, 2022
3eeab77
hardcoded data fetch flow graphql query
sunnytarawade Aug 22, 2022
b7499e8
Made the graphql query dynamic
sunnytarawade Aug 24, 2022
7c5d6d4
added index names for graphQL queries
sunnytarawade Aug 25, 2022
70f61cb
changed index names from snake_case to camelCase
sunnytarawade Aug 28, 2022
321862a
added logic for converting fetched data to table records data
sunnytarawade Aug 28, 2022
d4ae8f6
added a set of tables columns
sunnytarawade Aug 28, 2022
b3ed824
added table ui for fetched data
sunnytarawade Aug 30, 2022
d84d482
added dist to gitignore
sunnytarawade Sep 1, 2022
e770be2
added updated docker file
sunnytarawade Sep 2, 2022
c46bdd2
added GSOC documentation to README.md file
Sep 15, 2022
7f342a0
added link to final submission report gist in readme file
Sep 15, 2022
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,8 @@ testem.log
# System Files
.DS_Store
Thumbs.db

yarn.lock
todo

dist
6 changes: 3 additions & 3 deletions Dockerfile
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
# Stage 0, "build-stage", based on Node.js, to build and compile the frontend
FROM node:10.9.0 as build-stage
FROM yroochun/new-faang-base as build-stage
WORKDIR /app
COPY package*.json /app/
RUN npm install

COPY ./ /app/
RUN npm install
ARG configuration=production
RUN npm run build -- --output-path=./dist/out --configuration $configuration

Expand Down
39 changes: 39 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,45 @@ Also project contains pipes, services and shared folders for pipes, services and
Each component fetches data from the server only upon creation and then all basic functionality (sorting, filtering, etc...) goes on using pipes
sort.pipe.ts and filter.pipe.ts for sorting and filtering respectively.

# GSOC 2022
## New FAANG Backend with Elasticsearch and GraphQL

### Frontend

This section is only for **Data Join UI** under route '/data-join' (that you can find inside app-routing.module.ts). You can read about the entire GSOC work done **[here](https://gist.github.com/sunnytarawade/342f7c99949bbe1077da48529117bb0e)**.
### Installation

1. Clone the repo (ssh) :
```git clone [email protected]:FAANG/dcc-portal-frontend.git```
2. Change to the branch 'st/data-join-ui'
```git checkout -b st/data-join-ui```
3. Take a pull from origin
```git pull origin st/data-join-ui```
4. Install npm dependencies (will take a while)
```npm install```
5. Start the server. Try the commands below if the first one does not work.
```ng serve --open```
OR
```npm start```
OR
```nvm exec npm start``` (If using nvm)

### Tutorial

Please read the following blog to understand how to use the Data Join UI here: https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-ec09863992b6

### Documentation

Please Read the following blogs to understand more about the code implementation in the following order:

1. [Filtering Data](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-299947f6cd01)
2. [Joins](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-102d6ac164e0)
3. [Exploring Frontend](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-b8dfb29e22b5)
3. [Working with Celery Tasks + GraphQL](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-db0550723fb9)
4. [Building GraphQL Query and Last Steps](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-57e59c512813)
5. [Deployment](https://medium.com/@sunnytarawade000/sunnys-gsoc-adventure-63853c7e4b54)


## Future plans
1. ~~Add comprehensive test suite~~
2. Pre-render application on the fly from the server using Angular Universal
Expand Down
Loading