Modified dashboard page #141

sanketbansal · 2019-06-06T05:24:58Z

Changes proposed in this pull request:

Modified dashboard page UI to make it similar to the current EvalAI UI

Link to live demo: http://pr-141-evalai.surge.sh

codecov-io · 2019-06-08T14:51:05Z

Codecov Report

Merging #141 into master will decrease coverage by 0.1%.
The diff coverage is 66.66%.

@@            Coverage Diff             @@
##           master     #141      +/-   ##
==========================================
- Coverage   52.17%   52.06%   -0.11%     
==========================================
  Files          61       61              
  Lines        3178     3196      +18     
  Branches      370      371       +1     
==========================================
+ Hits         1658     1664       +6     
- Misses       1436     1444       +8     
- Partials       84       88       +4

Impacted Files	Coverage Δ
...onents/home/twitter-feed/twitter-feed.component.ts	`100% <ø> (ø)`	⬆️
src/app/components/nav/footer/footer.component.ts	`63.63% <100%> (+2.34%)`	⬆️
...d/dashboard-content/dashboard-content.component.ts	`55% <55%> (ø)`
...nents/nav/header-static/header-static.component.ts	`77.96% <77.77%> (+3.82%)`	⬆️
...rc/app/components/dashboard/dashboard.component.ts	`87.5% <81.81%> (+7.01%)`	⬆️
src/app/services/endpoints.service.ts	`67.1% <0%> (-2.64%)`	⬇️
src/app/services/mock.window.service.ts	`100% <0%> (+16.66%)`	⬆️

Impacted Files	Coverage Δ
...onents/home/twitter-feed/twitter-feed.component.ts	`100% <ø> (ø)`	⬆️
src/app/components/nav/footer/footer.component.ts	`63.63% <100%> (+2.34%)`	⬆️
...d/dashboard-content/dashboard-content.component.ts	`55% <55%> (ø)`
...nents/nav/header-static/header-static.component.ts	`77.96% <77.77%> (+3.82%)`	⬆️
...rc/app/components/dashboard/dashboard.component.ts	`87.5% <81.81%> (+7.01%)`	⬆️
src/app/services/endpoints.service.ts	`67.1% <0%> (-2.64%)`	⬇️
src/app/services/mock.window.service.ts	`100% <0%> (+16.66%)`	⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update ffd35c9...99befb6. Read the comment docs.

sanketbansal · 2019-07-19T13:07:55Z

@lunayach this can be reviewed now

lunayach · 2019-07-20T08:50:15Z

angular.json

              "src/styles/base.scss",
              "./node_modules/froala-editor/css/froala_editor.pkgd.min.css",
              "./node_modules/froala-editor/css/froala_style.min.css",
-              "./node_modules/ng-pick-datetime/assets/style/picker.min.css"
+              "./node_modules/ng-pick-datetime/assets/style/picker.min.css",
+              "src/styles/styles-port/basic.scss"


Didn't we agree on removing styles-port?

I am making a PR for that after merging that It will be removed. I kept it to make the PR functional.

lunayach · 2019-07-20T08:54:58Z

src/app/components/dashboard/dashboard-content/dashboard-content.component.ts

+   */
+  ngOnInit() {
+    if (!this.authService.isLoggedIn()) {
+      this.router.navigate(['/auth/login']);


Don't hard-code the URL, /auth/login, define a separate variable above or get from elsewhere if available.

lunayach · 2019-07-20T08:55:45Z

src/app/components/dashboard/dashboard-content/dashboard-content.component.ts

+  /**
+   * Participant teams list
+   */
+  participantteams = [];


Camel casing in variable names.

lunayach · 2019-07-20T08:57:32Z

src/app/components/dashboard/dashboard.component.ts

-    );
+    this.authServiceSubscription = this.authService.change.subscribe((authState) => {
+      if (!authState.isLoggedIn) {
+        this.router.navigate(['/auth/login']);


Same here for /auth/login.

lunayach · 2019-07-20T09:01:48Z

src/app/components/nav/dash-footer/dash-footer.component.html

@@ -0,0 +1,37 @@
+<footer class="ev-md-container dashboard-footer ev-dark-bg">


I had reviewed the same file in #158!
Should we close/merge that first?

I think we should close that PR

lunayach · 2019-07-20T09:18:42Z

src/app/components/nav/header-static/header-static.component.ts

@@ -165,4 +177,6 @@ export class HeaderStaticComponent implements OnInit, OnDestroy {
    this.isMenuExpanded = !this.isMenuExpanded;
  }

+  profileDropdown(event) {}
+


This function does nothing.

ok i will remove that.

Shekharrajak · 2019-07-20T09:34:49Z

src/app/services/auth.service.ts

@@ -12,12 +12,21 @@ export class AuthService {


  /**
-   * Modifications in Auth Services
+   * Ported From Angular Application


Okay, I will remove these comments.

Shekharrajak · 2019-07-20T09:36:25Z

src/app/services/auth.service.ts

        },
        err => {
+          error();


When this function will be used?

removed changes in it

Shekharrajak · 2019-07-20T09:38:41Z

src/app/components/nav/simple-header/simple-header.component.ts

+  templateUrl: './simple-header.component.html',
+  styleUrls: ['./simple-header.component.scss']
+})
+export class SimpleHeaderComponent implements OnInit, OnDestroy {


Why its name is simple header ?

I named it as per used in angularJS project.

Shekharrajak · 2019-07-20T09:39:35Z

src/app/components/nav/simple-header/simple-header.component.ts

+})
+export class SimpleHeaderComponent implements OnInit, OnDestroy {
+
+  user = {username: ''};


Just want to let you know - If you want to create an object then it would be better to user Angular interface concept and make a model in a separate file.

Okay, I will keep that in mind.

Ported the image assets from angularJs application into 'image-port' directory

Ported styles from angularjs Application inside style-port folder

Made the footer UI similar to the angularjs application one.

Made header UI similar to Angularjs Application one.

Added isAuth parameter in auth service

Added mock window service for calling loadJS method.

Added routerLink proprety for routing through UI

Added github fork and star button using github api

Changes made in auth services to integrate angularJS authentication features

Changes made in static header to handle different authentication cases

Added main.scss file of ported style in the angular.json file to compile it at the time of building project.

Dashboard-content component added to added functionality in the dashboard UI

Added proprtiess in .btn class

Unnecessary changes removed from auth service

lunayach · 2019-07-21T06:57:28Z

@sanketbansal please verify the changes once before pushing. This big image comes when visiting any link in the application:

sanketbansal · 2019-07-21T07:03:29Z

@lunayach it's working fine on my machine.

lunayach · 2019-07-21T07:50:11Z

src/app/components/nav/footer/footer.component.html

-	</div>
-</div>
-</div>
+<footer class="ev-md-container ev-footer ev-dark-bg">


@sanketbansal no need of this footer component again. It has the identical code for dash-footer component which is already merged in #158.

okay, will remove that.

should I rename the dash-footer to footer ?

Yes, please.

lunayach · 2019-07-21T07:51:29Z

src/app/components/nav/header-static/header-static.component.html

+          <div class="btn ev-btn-dark waves-effect waves-dark grad-btn grad-btn-dark fs-14" (click)="logOut()">Logout</div>
+        </li>
+      </ul>
+      <ul class="side-nav" style="width:200px; transform:translateX(0px);" (click)="menuExpander()" *ngIf="!isMenuExpanded" >


Move these inline styles to .scss.

lunayach · 2019-07-21T07:52:33Z

src/app/components/nav/header-static/header-static.component.html

+      </ul>
+      <ul class="right hide-on-med-and-down">
+        <li *ngIf="!authService.isAuth"><a class="waves-effect waves-dark main-header-link" routerLink="/auth/signup" routerLinkActive="active">Sign Up</a></li>
+        <li *ngIf="!authService.isAuth"><a class="btn ev-btn-dark waves-effect waves-dark grad-btn grad-btn-dark fs-14" style="padding: 0 29px; font-size: 14px; display: inline-block" routerLink="/auth/login" routerLinkActive="active">Log In</a></li>


Here, as well, move adding: 0 29px; font-size: 14px; display: inline-block to .scss.

lunayach · 2019-07-21T07:56:16Z

src/app/components/nav/header-static/header-static.component.ts

  @HostListener('window:resize', ['$event'])
  onResize(event) {
    this.innerWidth = window.innerWidth;
-    if (this.innerWidth <= 810) {
-      this.isMenuExpanded = false;
+    if (this.innerWidth > 810) {


Create an expandMenu( ) method to use it in both the places i.e. Line 113 and Line 127 respectively.

lunayach · 2019-07-21T07:58:09Z

src/app/components/nav/simple-header/simple-header.component.html

+          <a class="btn ev-btn-dark waves-effect waves-dark grad-btn grad-btn-dark fs-14" routerLink="/auth/login">Log In</a>
+        </li>
+      </ul>
+      <ul class="side-nav" style="width:200px; transform:translateX(0px);" (click)="menuExpander()" *ngIf="!isMenuExpanded">


Move style="width:200px; transform:translateX(0px);" to .scss. (Also, at other places.)

@lunayach it's working fine on my machine.

Yes, re-building it helped. But as you might see, there is something wrong in the Home-page UI. Would this get fixed in #140?

yes for sure.

lunayach · 2019-07-21T07:59:14Z

src/app/components/nav/simple-header/simple-header.component.html

@@ -0,0 +1,43 @@
+<div class="sim-header padding-lr-header">


Simple Header and Header Static component are very similar. Can you tell why do we need both of them?

okay, I will try to make a single component for both of them.

Thanks! That'll be great.

lunayach · 2019-07-21T08:00:37Z

src/app/components/nav/simple-header/simple-header.component.ts

+  /**
+   * Header is transparent on these URLs
+   */
+  transparentHeaderUrls = ['', '/'];


I don't think, this is used anywhere.

okay, I will check and remove that

lunayach · 2019-07-21T08:04:57Z

@lunayach it's working fine on my machine.

Yes, re-building it helped. But as you might see, there is something wrong in the Home-page UI. Would this get fixed in #140?

UI bugs fixed in static header.

Simple header component has been removed

Added checkInnerwidth method

Added styles of dash footer component

Dash footer has been removed as it has duplicate styles and html with footer component

lunayach · 2019-07-21T11:15:08Z

@sanketbansal when I click on the available options on the side-bar (i.e. All Challenges, Hosted Challenges, etc.), the corresponding side-bar having these options dis-appears. (unlike current version). Can you please check this?

sanketbansal · 2019-07-21T11:26:29Z

@sanketbansal when I click on the available options on the side-bar (i.e. All Challenges, Hosted Challenges, etc.), the corresponding side-bar having these options dis-appears. (unlike current version). Can you please check this?

That's not a bug actually after clicking on the options it gets routed to other components which are
being modified in different PR. There side bar remains intact.

lunayach · 2019-07-21T11:59:45Z

@sanketbansal The stats for the GitHub are not displayed in one go and I have to do a refresh and only then they are displayed.

Added new github forks and star button

lunayach

@RishabhJain2018 Now this can be merged.
It does break some UI of the homepage but that would be taken care with #140.

sanketbansal force-pushed the modified-dashboard branch from 9250b81 to 639df0f Compare June 8, 2019 14:44

sanketbansal mentioned this pull request Jun 25, 2019

Modified styles and assets #154

Merged

sanketbansal force-pushed the modified-dashboard branch from b61c7a7 to 773b6a2 Compare July 14, 2019 11:37

This was referenced Jul 17, 2019

Fixed test cases issue #157

Closed

Added dash footer component #158

Merged

sanketbansal force-pushed the modified-dashboard branch from dc06cf8 to 779593f Compare July 19, 2019 12:58

lunayach reviewed Jul 20, 2019

View reviewed changes

Shekharrajak reviewed Jul 20, 2019

View reviewed changes

This was referenced Jul 20, 2019

Modified challenge create page #150

Merged

Modified challenge list #143

Merged

sanketbansal force-pushed the modified-dashboard branch from e7b7466 to c278c64 Compare July 20, 2019 13:51

sanketbansal added 12 commits July 21, 2019 00:51

Ported image assets

cf7c538

Ported the image assets from angularJs application into 'image-port' directory

Added styles from angularjs

37ef1a0

Ported styles from angularjs Application inside style-port folder

Modified footer

954d187

Made the footer UI similar to the angularjs application one.

Modified static header

9dcdf53

Made header UI similar to Angularjs Application one.

Modified auth service

d1e5701

Added isAuth parameter in auth service

Modified test case of twitter feed component

a1abd0a

Added mock window service for calling loadJS method.

Modified footer component

cf74ea6

Added routerLink proprety for routing through UI

Modified footer component

cebdde0

Added github fork and star button using github api

Modified auth service

56b8c9b

Changes made in auth services to integrate angularJS authentication features

Modifications in header static component

3812f73

Changes made in static header to handle different authentication cases

Modified angular.json file

613f9e1

Added main.scss file of ported style in the angular.json file to compile it at the time of building project.

Added dashboard content component

5668dc3

Dashboard-content component added to added functionality in the dashboard UI

changes in base.scss file

50b8b39

Added proprtiess in .btn class

sanketbansal force-pushed the modified-dashboard branch 2 times, most recently from 9625e1a to 3bfab54 Compare July 21, 2019 05:34

Removed unnecessary changes

096a9d5

Unnecessary changes removed from auth service

sanketbansal force-pushed the modified-dashboard branch from 3bfab54 to 096a9d5 Compare July 21, 2019 05:35

lunayach reviewed Jul 21, 2019

View reviewed changes

sanketbansal added 2 commits July 21, 2019 05:56

Changes made in static-header

3f160f0

UI bugs fixed in static header.

Removed simple header

ab74faa

Simple header component has been removed

lunayach mentioned this pull request Jul 21, 2019

Modified homepage #140

Merged

sanketbansal added 3 commits July 21, 2019 06:22

Changes in static header

6c50e87

Added checkInnerwidth method

Changes in footer component

712efed

Added styles of dash footer component

Removed dash footer component

c2c85bd

Dash footer has been removed as it has duplicate styles and html with footer component

sanketbansal force-pushed the modified-dashboard branch from 2ef4829 to c2c85bd Compare July 21, 2019 10:47

Changes in footer component

af99264

Added new github forks and star button

lunayach approved these changes Jul 21, 2019

View reviewed changes

Merge branch 'master' into modified-dashboard

99befb6

RishabhJain2018 merged commit 8bb735a into Cloud-CV:master Jul 21, 2019

snyk-bot mentioned this pull request Jan 29, 2022

[Snyk] Upgrade tslib from 1.14.1 to 2.3.1 Suryansh5545/EvalAI-ngx#17

Open

		@@ -0,0 +1,37 @@
		<footer class="ev-md-container dashboard-footer ev-dark-bg">

Modified dashboard page #141

Modified dashboard page #141

Conversation

sanketbansal commented Jun 6, 2019 • edited Loading

Changes proposed in this pull request:

codecov-io commented Jun 8, 2019 • edited Loading

Codecov Report

sanketbansal commented Jul 19, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

lunayach commented Jul 21, 2019

sanketbansal commented Jul 21, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

lunayach commented Jul 21, 2019

lunayach commented Jul 21, 2019

sanketbansal commented Jul 21, 2019

lunayach commented Jul 21, 2019

lunayach left a comment

Choose a reason for hiding this comment

sanketbansal commented Jun 6, 2019 •

edited

Loading

codecov-io commented Jun 8, 2019 •

edited

Loading