Adding google scholar field and 2 other without url verification

[Suryansh5545]

Changes proposed in this pull request: Added Google scholar and other field in profile page

-added 3 input field for google scholar , linkedin , github.

-

[codecov-io]

Codecov Report

Merging #234 into master will decrease coverage by 0.08%. The diff coverage is 0%.

@@            Coverage Diff             @@
##           master     #234      +/-   ##
==========================================
- Coverage   51.66%   51.57%   -0.09%     
==========================================
  Files          66       66              
  Lines        3666     3672       +6     
  Branches      414      420       +6     
==========================================
  Hits         1894     1894              
- Misses       1677     1683       +6     
  Partials       95       95

Impacted Files	Coverage Δ
src/app/components/profile/profile.component.ts	47.67% <0%> (-3.58%)	:arrow_down:

Impacted Files	Coverage Δ
src/app/components/profile/profile.component.ts	47.67% <0%> (-3.58%)	:arrow_down:

---

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 a67df46...8b1aaae. Read the comment docs.

[yashdusing]

@Suryansh5545 the main EvalAI repo segregates the fields to two columns. Can you try doing the same for consistency purposes

[Suryansh5545]

I was able to achieve this . is this ok?

[Suryansh5545]

I have changed it sir

[pushkalkatara]

@Suryansh5545 As @yashdusing suggested, we would need the UI to be consistent as it was previously. Try to keep the same 3 column format and add the new fields.

[Suryansh5545]

So i have to make sure that these field are in a card style container just like the current version of evalai?

[pushkalkatara]

Yes, you got that right.

[Suryansh5545]

i put them in card like style but it is with static margins . i tried make page dynamic but i wasn't successful .

[pushkalkatara]

Hi @Suryansh5545 You can remake the whole component again. There are several examples available online.

[Suryansh5545]

I have rebuild component it is more dynamic then before look almost same but i still cant get the card to get full screen when the app-side-bar collapse because of short screen. please help me .

When screen app-side-bar collapse then it look like this

[Sanji515]

Hey @Suryansh5545 You need to set width to 100% of right container for smaller devices. Please let me know if you need some more hints :smiley:

[Suryansh5545]

Successfully made the document work and look like evalai profile page also i have removed and check for empty line and wrong indent. if require more changes please let me know

[Suryansh5545]

Sir i have made it look almost similar to current evalai profile page with everything in place. an also have checked for empty line and indent

[Sanji515]

@Suryansh5545 Change password functionality also not working, Please look into it.

[Suryansh5545]

i have made the request changes

[Suryansh5545]

i have pushed them

[Sanji515]

@Suryansh5545 On the Get Auth token modal, Copy token button and token input should align on the same line, please take a look at the current version at (https://evalai.cloudcv.org/web/profile).

[Sanji515]

@Suryansh5545 You should make the Update-profile modal scroll-able.

Also on clicking Get auth token or update profile button, it's color changes. Please check.

[Suryansh5545]

sir i cant make update profile scroll-able as the model is being generated at the time of click and i don't know how can i influence it .

[Sanji515]

sir i cant make update profile scroll-able as the model is being generated at the time of click and i don't know how can i influence it .

You should look into the modal component under utility.

[Suryansh5545]

i have added scroll bar and other requested thing . please check

[Sanji515]

@Suryansh5545 The Submit button not enabling if I make any change in linkedin url or github url or google scholar url field. And please add some validation for a valid url in these 3 fields.

Also, when the fields are empty then on the modal input field it should show blank instead of hyphen -.

[Sanji515]

@Suryansh5545 validateModalInput function gets called whenever any change happens in any input so first we check which input has been changed through e.target.name (where e is the current event which has been triggered after the change in the input field) which we have already sended here (https://github.com/Cloud-CV/EvalAI-ngx/pull/234/files#diff-fe711722081e104396ff5117802737e8R178) and then we compare e.target.value with the current user details like for affiliation >>> this.user.affiliation, if they are equal then it means there is no change we set isDisabled to true or false.

Please let me know if I'm not clear.

[Suryansh5545]

i figured that out but now i am stuck on url validation

[Suryansh5545]

in basic html if input type is url then it auto check for it but how can i do same in this

[Sanji515]

in basic html if input type is url then it auto check for it but how can i do same in this

Please use regex for url validation.

[Suryansh5545]

i tried that if value is equal to hyphen then it become 0 but it also affects outside the update profile . how can i resolve this sir?

[Sanji515]

i tried that if value is equal to hyphen then it become 0 but it also affects outside the update profile . how can i resolve this sir?

Are you trying to empty the input field instead of hyphen? Why it become 0?

[Suryansh5545]

sorry my mistake i am trying to put value equal to '' dual quote with blank space

[Suryansh5545]

but it affects outside update profile also

Like where it affecting? It would be more better if you can push your code so that I can see what you're doing?

[Suryansh5545]

i was able to complete 2 requested changes but was unable change value of hyphen

[Sanji515]

i was able to complete 2 requested changes but was unable change value of hyphen

Can you please tell or push your code how you're trying to change value of hyphen?

[Suryansh5545]

can i remove the hyphen completely?

[Suryansh5545]

can i assign user[i] value to another variable and then change it ?

[Suryansh5545]

sir i have pushed my code with code to change hyphen to blank but it is not working

[Suryansh5545]

i dont know why but my uservalue is influsing the global user variable

[Sanji515]

@Suryansh5545 Instead of using another variable, how about doing this way let first_name = (this.user['first_name'] == '-') ? '' : this.user['first_name'] for all the 6 variables?

[Suryansh5545]

I have completed all requested changes

[Suryansh5545]

i have reverted deleted line

[Suryansh5545]

i have added all the lines back

[Suryansh5545]

how can change the colour of the error message displayed?

[Sanji515]

how can change the colour of the error message displayed?

Don't change it for now

[Suryansh5545]

i made a [message] = InputErrorUrl in the model.component just affter the InputErrorMessage and declared it in the model.component.ts also but it is not working. so should i use inpurtErrorMessage

[Sanji515]

i made a [message] = InputErrorUrl in the model.component just affter the InputErrorMessage and declared it in the model.component.ts also but it is not working. so should i use inpurtErrorMessage

No, Don't add another [message] on the input. Please make span or div tag which will display error message just before the Cancel or Submit button. You have to toggle that div inner html and its visibility according to the validation message.

[Suryansh5545]

sir i solved the problem and have put urlval in validatemodelinput as it will be dynamic now

[Suryansh5545]

and what i do about this error src/app/components/utility/modal/modal.component.ts(273,42): error TS2341: Property '_results' is private and only accessible within class 'QueryList'.

[Sanji515]

and what i do about this error src/app/components/utility/modal/modal.component.ts(273,42): error TS2341: Property '_results' is private and only accessible within class 'QueryList'.

You can iterate on this.formComponents this way

this.formComponents.map((item) => {
        console.log(item.value);
      });

[Suryansh5545]

sir i can you please explain how can i use this as it is giving two outputs

[pushkalkatara]

Also, we should display an error if the URL is invalid. Currently, the pop-up shows - "something went wrong". Ideally, the URL should be checked on the form itself.

[Suryansh5545]

Well i tried to do but was unable to do it with my current knowledge and the deadline i have