From 0599ecc57630aab34fce418f182992a16b79b4d8 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Sat, 1 Feb 2020 09:24:56 +0530 Subject: [PATCH 01/17] Update deprecated lifecycle functions --- __tests__/app/containers/SideBar.test.tsx | 2 +- .../__snapshots__/SideBar.test.tsx.snap | 107 +- src/app/components/Leaderboard/index.tsx | 2 +- src/app/components/SubmitBar/RunOptions.tsx | 5 +- src/app/components/UserProfileModal/index.tsx | 31 +- .../code/CommitLog/CommitElement.tsx | 2 +- yarn.lock | 12028 ++++++++++++++++ 7 files changed, 12108 insertions(+), 69 deletions(-) create mode 100644 yarn.lock diff --git a/__tests__/app/containers/SideBar.test.tsx b/__tests__/app/containers/SideBar.test.tsx index bd3398ba..6ef1a3ba 100644 --- a/__tests__/app/containers/SideBar.test.tsx +++ b/__tests__/app/containers/SideBar.test.tsx @@ -43,7 +43,7 @@ describe('SideBar Container', () => { it('Should Dispatch setSidePanelTab Leaderboard or None', () => { const button = wrapper.find('.leaderboard-btn-ctrl').at(1); button.simulate('click'); - expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.LEADERBOARD); + expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.NONE); button.simulate('click'); expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.NONE); }); diff --git a/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap b/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap index c73d2784..e12389af 100644 --- a/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap +++ b/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap @@ -236,66 +236,75 @@ exports[`SideBar Container Should render 1`] = ` bsStyle="default" className="py-2 px-auto leaderboard-btn-ctrl" disabled={false} + href="/leaderboard" id="leaderboard_button" - onClick={[Function]} title="Leaderboard" > - + viewBox="0 0 576 512" + xmlns="http://www.w3.org/2000/svg" + > + + + + + ) : null} + +
-
- - - -
+ +
{ - inputEnabler( - InputState.isUserNameDisabled, - !listDisabled.isUserNameDisabled, - ); - this.setState( (prevState) => ({ - isUsernameClicked:!prevState.isUsernameClicked - })) - }} > {this.state.isUsernameClicked?:}
+
Username must have minimum 5 characters.
+
-
- - - -
+ +
onInputChange(InputName.fullName, e.target.value)} + onChange={(e) => { + onInputChange(InputName.fullName, e.target.value) + console.log(InputName.fullName)} + } required disabled={listDisabled.isFullNameDisabled} /> @@ -112,31 +136,21 @@ export class EditProfile extends React.Component { - inputEnabler( - InputState.isFullNameDisabled, - !listDisabled.isFullNameDisabled, - ); - this.setState( (prevState) => ({ - isNameClicked:!prevState.isNameClicked - })) - }} > {this.state.isNameClicked?:}
Name must have minimum 5 characters.
+
+
-
-
- - - -
+
+ +
{ - inputEnabler( - InputState.isFlagSelectDisabled, - !listDisabled.isFlagSelectDisabled, - ); - this.setState( (prevState) => ({ - isFlagClicked:!prevState.isFlagClicked - })) - }} > {this.state.isFlagClicked?:}
+
Please select a country.
+
@@ -200,6 +207,7 @@ export class EditProfile extends React.Component
+
diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx old mode 100644 new mode 100755 diff --git a/src/app/styles/Register.css b/src/app/styles/Register.css index 5341b76b..d2b5296e 100644 --- a/src/app/styles/Register.css +++ b/src/app/styles/Register.css @@ -34,7 +34,7 @@ input[type='checkbox'] { visibility: hidden; } -label { +.flaglabel { cursor: pointer; text-indent: -9999px; width: 35px; @@ -45,7 +45,7 @@ label { position: relative; } -label:after { +.flaglabel:after { content: ''; position: absolute; top: 1px; @@ -57,15 +57,26 @@ label:after { transition: 0.3s; } -input:checked + label { +input:checked + .flaglabel { background: #bada55; } -input:checked + label:after { +input:checked + .flaglabel:after { left: calc(100% - 1px); transform: translateX(-110%); } -label:active:after { +.flaglabel:active:after { width: 20px; } + +.input-group{ + display:block !important; +} + +.labeltext{ + color:rgba(0, 0, 32, 0.8); + font-size: 14px; + font-family: 'Montserrat', sans-serif; + font-weight: 600; +} diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index b4b13e61..e997ac4b 100644 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -125,6 +125,7 @@ font-size: 20px; border-bottom: 2px solid #ebebeb; margin: 0 0 10px 0px; + width:100%; } .avatar-select-container { @@ -187,3 +188,4 @@ .userEdit-wrap::-webkit-scrollbar-thumb { background-color: #ddd; } + \ No newline at end of file diff --git a/src/assets/index.html b/src/assets/index.html index f594f67f..66e82c4a 100644 --- a/src/assets/index.html +++ b/src/assets/index.html @@ -4,6 +4,8 @@ + + Code Character From 38f9f55fc4abc0bd32c17e9265c8aa5b9ba58416 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Tue, 4 Feb 2020 21:13:51 +0530 Subject: [PATCH 04/17] Made Change in EditPassword --- src/app/components/UserProfileModal/EditPassword.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index 545c4639..8b3c285e 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -1,4 +1,4 @@ -import { faLock, faPen ,faUnlock} from '@fortawesome/free-solid-svg-icons'; +import { faLock, faPen ,faUnlock } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import * as styles from 'app/styles/UserProfileModal.module.css'; import { InputName, InputState } from 'app/types/UserProfileModal'; From c4e2420b801b6a6fe18e702123f2f893dcbadf4f Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Thu, 6 Feb 2020 00:50:22 +0530 Subject: [PATCH 05/17] Change the UI of UserProfileModel - Remove Input Disable Feature - Remove Icons - Made Changes in CSS --- .../app/components/EditPassword.test.tsx | 6 +- .../UserProfileModal/EditPassword.tsx | 47 +------ .../UserProfileModal/EditProfile.tsx | 108 ++------------- src/app/components/UserProfileModal/index.tsx | 128 +++++------------- src/app/styles/UserProfileModal.module.css | 16 +++ .../types/UserProfileModal/EditPassword.ts | 4 +- src/app/types/UserProfileModal/EditProfile.ts | 4 +- src/app/types/UserProfileModal/index.ts | 10 +- 8 files changed, 75 insertions(+), 248 deletions(-) diff --git a/__tests__/app/components/EditPassword.test.tsx b/__tests__/app/components/EditPassword.test.tsx index 08c8734a..f9f9b8af 100644 --- a/__tests__/app/components/EditPassword.test.tsx +++ b/__tests__/app/components/EditPassword.test.tsx @@ -1,5 +1,5 @@ import { EditPassword } from 'app/components/UserProfileModal/EditPassword'; -import { InputName, InputState } from 'app/types/UserProfileModal'; +import { InputName } from 'app/types/UserProfileModal'; import { mount } from 'enzyme'; import * as React from 'react'; @@ -12,11 +12,7 @@ describe('EditPassword Component', () => { onInputChange={(inputName: InputName, value: string) => { return; }} - inputEnabler={(inputState: InputState, value: boolean) => { - return; - }} editPasswordRef={React.createRef()} - listDisabled={{}} oldPassword={'oldPassword'} password={'password'} repeatPassword={'repeatPassword'} diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index 8b3c285e..5596de81 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -1,11 +1,9 @@ -import { faLock, faPen ,faUnlock } from '@fortawesome/free-solid-svg-icons'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import * as styles from 'app/styles/UserProfileModal.module.css'; -import { InputName, InputState } from 'app/types/UserProfileModal'; +import { InputName } from 'app/types/UserProfileModal'; import * as EditPasswordInterfaces from 'app/types/UserProfileModal/EditPassword'; import classnames from 'classnames'; import * as React from 'react'; -import { Button, Row } from 'react-bootstrap'; +import { Row } from 'react-bootstrap'; export class EditPassword extends React.Component { public constructor(props:any){ @@ -15,9 +13,9 @@ export class EditPassword extends React.Component @@ -30,22 +28,6 @@ export class EditPassword extends React.Component {' '} Credentials -
- - {this.state.isClicked?:} - onInputChange(InputName.oldPassword, e.target.value)} required - disabled={listDisabled.isPasswordDisabled} />
@@ -85,9 +63,6 @@ export class EditPassword extends React.Component
- - {this.state.isClicked?:} - onInputChange(InputName.password, e.target.value)} required - disabled={listDisabled.isPasswordDisabled} />
- {listDisabled.isPasswordDisabled ? ( -
Passwords should match.
- ) : null} +
Passwords should match.
@@ -112,9 +84,6 @@ export class EditPassword extends React.Component
- - {this.state.isClicked?:} - onInputChange(InputName.repeatPassword, e.target.value)} required - disabled={listDisabled.isPasswordDisabled} />
- {listDisabled.isPasswordDisabled ? ( -
Passwords should match.
- ) : null} +
Passwords should match.
@@ -145,7 +111,6 @@ export class EditPassword extends React.Component Save Changes diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index e07a87bf..13b45574 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -1,9 +1,6 @@ -import { faPen,faLock,faUnlock} from '@fortawesome/free-solid-svg-icons'; -import { Button } from 'react-bootstrap'; -import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import * as styles from 'app/styles/UserProfileModal.module.css'; import { Avatar } from 'app/types/Authentication/Register'; -import { InputName, InputState } from 'app/types/UserProfileModal'; +import { InputName } from 'app/types/UserProfileModal'; import * as EditProfileInterfaces from 'app/types/UserProfileModal/EditProfile'; import classnames from 'classnames'; import * as React from 'react'; @@ -11,24 +8,14 @@ import * as React from 'react'; import ReactFlagsSelect from 'react-flags-select'; import 'react-flags-select/css/react-flags-select.css'; -export class EditProfile extends React.Component { - public constructor(props:any){ - super(props); - this.state={ - isUsernameClicked:false, - isNameClicked:false, - isFlagClicked:false - } - } +export class EditProfile extends React.Component { public render() { - const { handleEditProfile, onInputChange, inputEnabler } = this.props; + const { handleEditProfile, onInputChange } = this.props; const { editProfileRef, reactFlagRef } = this.props; const { - username, - listDisabled, - fullName, - country, + username:currentUsername, + fullName:currentFullName, + country:currentCountry, userDetails, avatar: currentAvatar, } = this.props; @@ -38,36 +25,6 @@ export class EditProfile extends React.Component
Basic Information -
onInputChange(InputName.username, e.target.value)} pattern="[a-zA-Z0-9]+" required - disabled={listDisabled.isUserNameDisabled} /> -
- - {this.state.isUsernameClicked?:} - -
Username must have minimum 5 characters.
@@ -123,23 +70,13 @@ export class EditProfile extends React.Component { onInputChange(InputName.fullName, e.target.value) console.log(InputName.fullName)} } required - disabled={listDisabled.isFullNameDisabled} /> -
- - {this.state.isNameClicked?:} - -
Name must have minimum 5 characters.
@@ -155,22 +92,12 @@ export class EditProfile extends React.Component onInputChange(InputName.country, countryCode) } ref={reactFlagRef} - disabled={listDisabled.isFlagSelectDisabled} /> -
- - {this.state.isFlagClicked?:} - -
Please select a country.
@@ -218,19 +145,12 @@ export class EditProfile extends React.Component { - this.setState( (prevState) => ({ - isNameClicked:!prevState.isNameClicked, - isUsernameClicked:!prevState.isUsernameClicked, - isFlagClicked:!prevState.isFlagClicked - })) - }} > Save Changes diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index 649d8135..a82cc29c 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -6,7 +6,7 @@ import classnames from 'classnames'; import * as React from 'react'; import { Col, Grid, Row } from 'react-bootstrap'; // tslint:disable-next-line:import-name -import ReactFlagsSelect from 'react-flags-select'; +import ReactFlagsSelect from 'react-flags-select'; export class UserProfileModal extends React.Component< UserProfileInterfaces.Props, @@ -23,31 +23,15 @@ export class UserProfileModal extends React.Component< avatar: userDetails.country, country: userDetails.country, fullName: userDetails.fullName, - listDisabled: { - isFlagSelectDisabled: true, - isFullNameDisabled: true, - isPasswordDisabled: true, - isUserNameDisabled: true, - }, oldPassword: '', password: '', repeatPassword: '', username: userDetails.username, + isPasswordPage:false }; this.props.getUserDetails(); } - public componentWillReceiveProps(nextProps: UserProfileInterfaces.Props) { - const { country, username, fullName, avatar } = this.state; - const { userDetails } = nextProps; - this.setState({ - avatar: userDetails.avatar !== avatar ? userDetails.avatar : avatar, - country: userDetails.country !== country ? userDetails.country : country, - fullName: userDetails.fullName !== fullName ? userDetails.fullName : fullName, - username: userDetails.username !== country ? username : userDetails.username, - }); - } - public render() { const { fullName, @@ -56,7 +40,6 @@ export class UserProfileModal extends React.Component< oldPassword, password, repeatPassword, - listDisabled, avatar, } = this.state; const { userDetails } = this.props; @@ -65,72 +48,54 @@ export class UserProfileModal extends React.Component< USER DETAILS -
+ -
- -
-
- -
+ {this.state.isPasswordPage?( + + ): + ( + + )} + {this.props.userDetails.errorMessage} -
); } private handleEditProfile = (event: React.FormEvent) => { const { editUserProfile } = this.props; - const { country, fullName, username, listDisabled, avatar } = this.state; + const { country, fullName, username, avatar } = this.state; const form = this.editProfileRef.current; event.preventDefault(); if (form) { if (form.checkValidity()) { editUserProfile({ - ...(!listDisabled.isFlagSelectDisabled && { country }), - ...(!listDisabled.isFullNameDisabled && { fullName }), - ...(!listDisabled.isUserNameDisabled && { username }), + country, + fullName, + username, avatar, }); - - this.setState({ - listDisabled: { - ...listDisabled, - // isEmailDisabled: true, - isFlagSelectDisabled: true, - isFullNameDisabled: true, - isUserNameDisabled: true, - }, - }); } form.classList.add('was-validated'); } @@ -138,26 +103,18 @@ export class UserProfileModal extends React.Component< private handleEditPassword = (event: React.FormEvent) => { const { editUserPassword } = this.props; - const { oldPassword, repeatPassword, password, listDisabled } = this.state; + const { oldPassword, repeatPassword, password } = this.state; const form = this.editPasswordRef.current; event.preventDefault(); if (form) { if (form.checkValidity()) { - if (!listDisabled.isPasswordDisabled && password === repeatPassword) { + if (password === repeatPassword) { editUserPassword({ - ...(!listDisabled.isPasswordDisabled && { oldPassword, password, - }), }); } - this.setState({ - listDisabled: { - ...listDisabled, - isPasswordDisabled: true, - }, - }); } form.classList.add('was-validated'); } @@ -171,10 +128,6 @@ export class UserProfileModal extends React.Component< this.setState(this.updateInputState(inputName, value)); }; - private inputEnabler = (inputState: UserProfileInterfaces.InputState, value: boolean) => { - this.setState(this.updateListDisabledState(inputState, value)); - }; - private updateInputState = ( key: keyof UserProfileInterfaces.State, value: T, @@ -182,15 +135,4 @@ export class UserProfileModal extends React.Component< ...prevState, [key]: value, }); - - private updateListDisabledState = ( - key: keyof UserProfileInterfaces.ListDisabled, - value: T, - ) => (prevState: UserProfileInterfaces.State): UserProfileInterfaces.State => ({ - ...prevState, - listDisabled: { - ...prevState.listDisabled, - [key]: value, - }, - }); } diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index e997ac4b..cb1d011b 100644 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -188,4 +188,20 @@ .userEdit-wrap::-webkit-scrollbar-thumb { background-color: #ddd; } + +.editProfileElement{ + overflow-x: hidden; + padding-left: 10px; + padding-right: 10px; + margin-left: 30%; + margin-top: 5%; +} + +.editPasswordElement{ + overflow-x: hidden; + padding-left: 10px; + padding-right: 10px; + margin-left: 33%; + margin-top: 5%; +} \ No newline at end of file diff --git a/src/app/types/UserProfileModal/EditPassword.ts b/src/app/types/UserProfileModal/EditPassword.ts index bbf73517..9cde6c5f 100644 --- a/src/app/types/UserProfileModal/EditPassword.ts +++ b/src/app/types/UserProfileModal/EditPassword.ts @@ -1,12 +1,10 @@ import * as UserInterfaces from 'app/types/User'; -import { InputName, InputState, ListDisabled } from 'app/types/UserProfileModal'; +import { InputName } from 'app/types/UserProfileModal'; import * as React from 'react'; export interface ElementOwnProps { handleEditPassword: (event: React.FormEvent) => void; onInputChange: (inputName: InputName, value: string) => void; - inputEnabler: (inputState: InputState, value: boolean) => void; editPasswordRef: React.Ref; - listDisabled: ListDisabled; userDetails: UserInterfaces.UserStoreState; oldPassword: string; password: string; diff --git a/src/app/types/UserProfileModal/EditProfile.ts b/src/app/types/UserProfileModal/EditProfile.ts index 76cea0ae..9401b752 100644 --- a/src/app/types/UserProfileModal/EditProfile.ts +++ b/src/app/types/UserProfileModal/EditProfile.ts @@ -1,5 +1,5 @@ import * as UserInterfaces from 'app/types/User'; -import { InputName, InputState, ListDisabled } from 'app/types/UserProfileModal'; +import { InputName } from 'app/types/UserProfileModal'; import * as React from 'react'; // tslint:disable-next-line:import-name import ReactFlagsSelect from 'react-flags-select'; @@ -7,11 +7,9 @@ import ReactFlagsSelect from 'react-flags-select'; export interface ElementOwnProps { handleEditProfile: (event: React.FormEvent) => void; onInputChange: (inputName: InputName, value: string) => void; - inputEnabler: (inputState: InputState, value: boolean) => void; editProfileRef: React.Ref; reactFlagRef: React.Ref; username: string; - listDisabled: ListDisabled; fullName: string; userDetails: UserInterfaces.UserStoreState; country: string; diff --git a/src/app/types/UserProfileModal/index.ts b/src/app/types/UserProfileModal/index.ts index 6571eb95..8bef86c9 100644 --- a/src/app/types/UserProfileModal/index.ts +++ b/src/app/types/UserProfileModal/index.ts @@ -5,13 +5,6 @@ export interface StateProps { userDetails: UserInterfaces.UserStoreState; } -export interface ListDisabled { - isUserNameDisabled?: boolean; - isFullNameDisabled?: boolean; - isFlagSelectDisabled?: boolean; - isPasswordDisabled?: boolean; -} - export interface State { avatar: string; username: string; @@ -20,7 +13,7 @@ export interface State { repeatPassword: string; country: string; fullName: string; - listDisabled: ListDisabled; + isPasswordPage: boolean; } export enum InputName { @@ -31,7 +24,6 @@ export enum InputName { repeatPassword = 'repeatPassword', country = 'country', fullName = 'fullName', - listDisabled = 'listDisabled', } export enum InputState { From e0160a6aa87d1888418b0bcd6ba1decf087cc54f Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Thu, 6 Feb 2020 00:53:00 +0530 Subject: [PATCH 06/17] Fix the Username Change bug --- .../components/Authentication/Register.tsx | 4 +- src/app/components/SubmitBar/RunOptions.tsx | 2 +- .../UserProfileModal/EditPassword.tsx | 87 ++++----- .../UserProfileModal/EditProfile.tsx | 168 +++++++++--------- src/app/components/UserProfileModal/index.tsx | 74 ++++---- .../code/CommitLog/CommitElement.tsx | 2 +- src/app/index.tsx | 2 +- src/app/styles/Register.css | 8 +- src/app/styles/UserProfileModal.module.css | 7 +- 9 files changed, 180 insertions(+), 174 deletions(-) diff --git a/src/app/components/Authentication/Register.tsx b/src/app/components/Authentication/Register.tsx index 3e34030e..890c01a2 100644 --- a/src/app/components/Authentication/Register.tsx +++ b/src/app/components/Authentication/Register.tsx @@ -192,7 +192,9 @@ export class Register extends React.Component - + {isStudent ? ( diff --git a/src/app/components/SubmitBar/RunOptions.tsx b/src/app/components/SubmitBar/RunOptions.tsx index 14e35f74..94edbe4d 100644 --- a/src/app/components/SubmitBar/RunOptions.tsx +++ b/src/app/components/SubmitBar/RunOptions.tsx @@ -23,7 +23,7 @@ export class RunOptions extends React.Component< this.props.loadMaps(); this.props.getAiIds(); } - + public componentWillUnmount(): void { window.removeEventListener('click', this.props.closeOptions, false); } diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index 5596de81..a134e19b 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -5,12 +5,15 @@ import classnames from 'classnames'; import * as React from 'react'; import { Row } from 'react-bootstrap'; -export class EditPassword extends React.Component { - public constructor(props:any){ +export class EditPassword extends React.Component< + EditPasswordInterfaces.Props, + { isClicked: boolean } +> { + public constructor(props: any) { super(props); - this.state={ - isClicked:false, - } + this.state = { + isClicked: false, + }; } public render() { const { handleEditPassword, onInputChange } = this.props; @@ -40,17 +43,17 @@ export class EditPassword extends React.Component
- onInputChange(InputName.oldPassword, e.target.value)} - required - /> + onInputChange(InputName.oldPassword, e.target.value)} + required + />
Password should have minimum 5 characters. @@ -61,19 +64,19 @@ export class EditPassword extends React.Component
- +
- onInputChange(InputName.password, e.target.value)} - required - /> + onInputChange(InputName.password, e.target.value)} + required + />
Passwords should match.
@@ -82,19 +85,19 @@ export class EditPassword extends React.Component
- +
- onInputChange(InputName.repeatPassword, e.target.value)} - required - /> + onInputChange(InputName.repeatPassword, e.target.value)} + required + />
Passwords should match.
@@ -108,8 +111,8 @@ export class EditPassword extends React.Component Save Changes diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index 13b45574..a927a5c3 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -13,31 +13,27 @@ export class EditProfile extends React.Component -
-
-
Basic Information -
-
- -
-
-
- -
+
+
+
Basic Information
+
+ +
+
+
+ +
-
-
Username must have minimum 5 characters.
+
Username must have minimum 5 characters.
+
-
-
-
- -
+
+
+
+ +
{ - onInputChange(InputName.fullName, e.target.value) - console.log(InputName.fullName)} - } + onInputChange(InputName.fullName, e.target.value); + console.log(InputName.fullName); + }} required />
Name must have minimum 5 characters.
-
+
-
-
-
- -
+
+
+
+ +
-
-
Please select a country.
+
Please select a country.
+
-
-
-
-
Edit your spirit animal
-
-
- {avatars.map((avatar: string) => ( -
{ - onInputChange(InputName.avatar, avatar); - }} - title={avatar} - > - { - // @ts-ignore - - } -
- ))} -
-
+
+
+
+
Edit your spirit animal
+
+
+ {avatars.map((avatar: string) => ( +
{ + onInputChange(InputName.avatar, avatar); + }} + title={avatar} + > + { + // @ts-ignore + + } +
+ ))} +
+
-
-
- -
+
+
+
- -
+
+ +
); } diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index a82cc29c..2b81e342 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -6,7 +6,7 @@ import classnames from 'classnames'; import * as React from 'react'; import { Col, Grid, Row } from 'react-bootstrap'; // tslint:disable-next-line:import-name -import ReactFlagsSelect from 'react-flags-select'; +import ReactFlagsSelect from 'react-flags-select'; export class UserProfileModal extends React.Component< UserProfileInterfaces.Props, @@ -27,7 +27,7 @@ export class UserProfileModal extends React.Component< password: '', repeatPassword: '', username: userDetails.username, - isPasswordPage:false + isPasswordPage: false, }; this.props.getUserDetails(); } @@ -45,39 +45,45 @@ export class UserProfileModal extends React.Component< const { userDetails } = this.props; return ( - + USER DETAILS - - {this.state.isPasswordPage?( - - ): - ( - - )} - {this.props.userDetails.errorMessage} - + + {this.state.isPasswordPage ? ( + + ) : ( + + )} + {this.props.userDetails.errorMessage} + ); } @@ -111,8 +117,8 @@ export class UserProfileModal extends React.Component< if (form.checkValidity()) { if (password === repeatPassword) { editUserPassword({ - oldPassword, - password, + oldPassword, + password, }); } } diff --git a/src/app/components/code/CommitLog/CommitElement.tsx b/src/app/components/code/CommitLog/CommitElement.tsx index 5e9a2d93..c290fe98 100644 --- a/src/app/components/code/CommitLog/CommitElement.tsx +++ b/src/app/components/code/CommitLog/CommitElement.tsx @@ -155,4 +155,4 @@ export class CommitElement extends React.Component ); } -} \ No newline at end of file +} diff --git a/src/app/index.tsx b/src/app/index.tsx index daeb91bd..2f4da644 100644 --- a/src/app/index.tsx +++ b/src/app/index.tsx @@ -3,7 +3,7 @@ import Register from 'app/containers/Authentication/Register'; import Dashboard from 'app/containers/Dashboard'; import { Routes } from 'app/routes'; import Leaderboard from 'app/containers/Leaderboard'; -import UserProfileModal from 'app/containers/UserProfileModal' +import UserProfileModal from 'app/containers/UserProfileModal'; // @ts-ignore import { initializeRendererAssets } from 'codecharacter-renderer'; import * as React from 'react'; diff --git a/src/app/styles/Register.css b/src/app/styles/Register.css index d2b5296e..ee8cc655 100644 --- a/src/app/styles/Register.css +++ b/src/app/styles/Register.css @@ -70,12 +70,12 @@ input:checked + .flaglabel:after { width: 20px; } -.input-group{ - display:block !important; +.input-group { + display: block !important; } -.labeltext{ - color:rgba(0, 0, 32, 0.8); +.labeltext { + color: rgba(0, 0, 32, 0.8); font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: 600; diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index cb1d011b..97726870 100644 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -125,7 +125,7 @@ font-size: 20px; border-bottom: 2px solid #ebebeb; margin: 0 0 10px 0px; - width:100%; + width: 100%; } .avatar-select-container { @@ -189,7 +189,7 @@ background-color: #ddd; } -.editProfileElement{ +.editProfileElement { overflow-x: hidden; padding-left: 10px; padding-right: 10px; @@ -197,11 +197,10 @@ margin-top: 5%; } -.editPasswordElement{ +.editPasswordElement { overflow-x: hidden; padding-left: 10px; padding-right: 10px; margin-left: 33%; margin-top: 5%; } - \ No newline at end of file From a0e184837564c0f3ef396b0c8dfe057aa4544fb8 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Sat, 8 Feb 2020 05:13:44 +0530 Subject: [PATCH 07/17] Change Snapshots and Tests --- .../__snapshots__/EditPassword.test.tsx.snap | 492 +- __tests__/app/containers/SideBar.test.tsx | 2 +- __tests__/app/containers/SidePanel.test.tsx | 2 +- .../__snapshots__/SideBar.test.tsx.snap | 170 +- .../__snapshots__/SidePanel.test.tsx.snap | 2 +- src/app/components/Authentication/Login.tsx | 14 +- .../UserProfileModal/EditPassword.tsx | 52 +- .../UserProfileModal/EditProfile.tsx | 37 +- src/app/components/UserProfileModal/index.tsx | 41 +- src/app/index.tsx | 2 +- src/app/styles/Authentication.module.css | 6 +- src/app/styles/Register.css | 18 + src/app/styles/UserProfileModal.module.css | 9 +- src/assets/index.html | 1 + yarn.lock | 12028 ---------------- 15 files changed, 342 insertions(+), 12534 deletions(-) delete mode 100644 yarn.lock diff --git a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap index 5d67493d..b48c7a08 100644 --- a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap +++ b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap @@ -17,43 +17,29 @@ exports[`EditPassword Component Should render 1`] = `
+
- +
- - -
- -
- Password should have minimum 5 characters. + Password should have minimum 5 characters. +
@@ -67,39 +53,30 @@ exports[`EditPassword Component Should render 1`] = `
+
- +
- - + Password should have minimum 5 characters. +
-
@@ -112,39 +89,30 @@ exports[`EditPassword Component Should render 1`] = `
+
- +
- - + Passwords should match. +
-
@@ -156,7 +124,7 @@ exports[`EditPassword Component Should render 1`] = ` > - + User Credentials
+
- +
- - - - -
- -
- Password should have minimum 5 characters. + Password should have minimum 5 characters. +
@@ -377,73 +239,36 @@ exports[`EditPassword Component Should render 1`] = `
+
- +
- - - - + Password should have minimum 5 characters. +
-
@@ -456,73 +281,36 @@ exports[`EditPassword Component Should render 1`] = `
+
- +
- - - - + Passwords should match. +
-
@@ -536,6 +324,8 @@ exports[`EditPassword Component Should render 1`] = ` className="btn btn-success" style={ Object { + "backgroundColor": "rgb(70, 48, 235)", + "borderColor": "rgb(70, 48, 235)", "marginBottom": "10px", "width": "100%", } diff --git a/__tests__/app/containers/SideBar.test.tsx b/__tests__/app/containers/SideBar.test.tsx index 6ef1a3ba..bd3398ba 100644 --- a/__tests__/app/containers/SideBar.test.tsx +++ b/__tests__/app/containers/SideBar.test.tsx @@ -43,7 +43,7 @@ describe('SideBar Container', () => { it('Should Dispatch setSidePanelTab Leaderboard or None', () => { const button = wrapper.find('.leaderboard-btn-ctrl').at(1); button.simulate('click'); - expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.NONE); + expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.LEADERBOARD); button.simulate('click'); expect(wrapper.find(Sidebar).props().sidePanelTab).toBe(SidePanelTab.NONE); }); diff --git a/__tests__/app/containers/SidePanel.test.tsx b/__tests__/app/containers/SidePanel.test.tsx index 2b9bc59b..09fb0b21 100644 --- a/__tests__/app/containers/SidePanel.test.tsx +++ b/__tests__/app/containers/SidePanel.test.tsx @@ -48,4 +48,4 @@ describe('SidePanel Container', () => { expect(wrapper.find('.SidePanel').children()).toHaveLength(0); expect(wrapper).toMatchSnapshot(); }); -}); +}); \ No newline at end of file diff --git a/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap b/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap index e12389af..afc663cf 100644 --- a/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap +++ b/__tests__/app/containers/__snapshots__/SideBar.test.tsx.snap @@ -236,25 +236,95 @@ exports[`SideBar Container Should render 1`] = ` bsStyle="default" className="py-2 px-auto leaderboard-btn-ctrl" disabled={false} - href="/leaderboard" id="leaderboard_button" + onClick={[Function]} title="Leaderboard" > - + + + + + + - - diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index a134e19b..af09626e 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -1,3 +1,4 @@ +import * as styles1 from 'app/styles/Authentication.module.css'; import * as styles from 'app/styles/UserProfileModal.module.css'; import { InputName } from 'app/types/UserProfileModal'; import * as EditPasswordInterfaces from 'app/types/UserProfileModal/EditPassword'; @@ -9,6 +10,7 @@ export class EditPassword extends React.Component< EditPasswordInterfaces.Props, { isClicked: boolean } > { + // tslint:disable-next-line public constructor(props: any) { super(props); this.state = { @@ -27,10 +29,12 @@ export class EditPassword extends React.Component< className={classnames('text-dark', styles.formHeading)} style={{ display: 'flex', + marginBottom: '5%', + marginLeft: '10%', + textAlign: 'center', }} > - {' '} - Credentials + User Credentials
-
+
onInputChange(InputName.oldPassword, e.target.value)} required /> -
-
- Password should have minimum 5 characters. +
+ Password should have minimum 5 characters. +
@@ -65,20 +71,24 @@ export class EditPassword extends React.Component<
-
+
onInputChange(InputName.password, e.target.value)} required /> +
+ Password should have minimum 5 characters. +
-
Passwords should match.
@@ -86,33 +96,37 @@ export class EditPassword extends React.Component<
-
+
onInputChange(InputName.repeatPassword, e.target.value)} required /> +
+ Passwords should match. +
-
Passwords should match.
+ {userDetails.errorMessage!=''?
+ {userDetails.errorMessage} +
:null}
diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index 78add2c4..e772dd90 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -96,7 +96,7 @@ export class UserProfileModal extends React.Component< ) : (

- {this.props.userDetails.errorMessage} + { '' }

)} diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index 9fa0e41f..9594e877 100644 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -205,3 +205,9 @@ margin-left: 33%; margin-top: 5%; } + +.UsernameError{ + width: 100%; + font-size: 85%; + color: #dc3545 +} From 218409b9d7f437c8be7e99e158ce828609f752f0 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Mon, 10 Feb 2020 19:47:52 +0530 Subject: [PATCH 09/17] Made Minor CSS changes --- src/app/styles/Register.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/app/styles/Register.css b/src/app/styles/Register.css index 2052138a..f7b219db 100644 --- a/src/app/styles/Register.css +++ b/src/app/styles/Register.css @@ -6,11 +6,17 @@ } .flag-select { + display: flex !important; + align-items: center !important; width: 100% !important; border: 1px solid black !important; text-align: left !important; } +.flag-options { + margin-top: 100px !important; +} + .flag-select img { width: 1.5em; position: relative; From 307513d239497bf8f63ca27a1eb61f32cf5077d5 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Mon, 10 Feb 2020 21:23:10 +0530 Subject: [PATCH 10/17] Change the error message position --- src/app/components/UserProfileModal/EditProfile.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index 753fbc66..b5a18181 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -136,6 +136,10 @@ export class EditProfile extends React.Component
+
+ {userDetails.errorMessage!=''?
+ {userDetails.errorMessage} +
:null} - {userDetails.errorMessage!=''?
- {userDetails.errorMessage} -
:null} +
From a261621afe4de6cfb71436f3d80db1c0d3574dca Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Tue, 11 Feb 2020 22:30:34 +0530 Subject: [PATCH 11/17] Add Minor Changes --- __tests__/app/containers/SidePanel.test.tsx | 2 +- .../__snapshots__/SidePanel.test.tsx.snap | 2 +- src/app/components/SideBar.tsx | 7 ++-- src/app/components/SidePanel.tsx | 4 --- .../UserProfileModal/EditPassword.tsx | 12 ++----- .../UserProfileModal/EditProfile.tsx | 1 + src/app/components/UserProfileModal/index.tsx | 2 +- src/app/reducers/Dashboard.ts | 1 - src/app/styles/Authentication.module.css | 0 src/app/styles/CodeStatus.module.css | 0 src/app/styles/CommitLog.module.css | 0 src/app/styles/CommitMessageBox.module.css | 0 src/app/styles/Dashboard.css | 0 src/app/styles/Docs.module.css | 0 src/app/styles/EditorSettings.module.css | 0 src/app/styles/Flags.css | 35 ++++++++++++++++++ src/app/styles/Leaderboard.module.css | 0 src/app/styles/MatchView.module.css | 0 src/app/styles/Notification.module.css | 0 src/app/styles/Pagination.css | 0 src/app/styles/Register.css | 36 ------------------- src/app/styles/RunOptions.module.css | 0 src/app/styles/SidePanel.module.css | 0 src/app/styles/Sidebar.module.css | 0 src/app/styles/SubmitBar.module.css | 0 src/app/styles/UserProfileModal.module.css | 11 ++++-- src/app/styles/Welcome.module.css | 0 src/assets/index.html | 2 -- 28 files changed, 53 insertions(+), 62 deletions(-) mode change 100644 => 100755 src/app/styles/Authentication.module.css mode change 100644 => 100755 src/app/styles/CodeStatus.module.css mode change 100644 => 100755 src/app/styles/CommitLog.module.css mode change 100644 => 100755 src/app/styles/CommitMessageBox.module.css mode change 100644 => 100755 src/app/styles/Dashboard.css mode change 100644 => 100755 src/app/styles/Docs.module.css mode change 100644 => 100755 src/app/styles/EditorSettings.module.css create mode 100644 src/app/styles/Flags.css mode change 100644 => 100755 src/app/styles/Leaderboard.module.css mode change 100644 => 100755 src/app/styles/MatchView.module.css mode change 100644 => 100755 src/app/styles/Notification.module.css mode change 100644 => 100755 src/app/styles/Pagination.css mode change 100644 => 100755 src/app/styles/Register.css mode change 100644 => 100755 src/app/styles/RunOptions.module.css mode change 100644 => 100755 src/app/styles/SidePanel.module.css mode change 100644 => 100755 src/app/styles/Sidebar.module.css mode change 100644 => 100755 src/app/styles/SubmitBar.module.css mode change 100644 => 100755 src/app/styles/UserProfileModal.module.css mode change 100644 => 100755 src/app/styles/Welcome.module.css diff --git a/__tests__/app/containers/SidePanel.test.tsx b/__tests__/app/containers/SidePanel.test.tsx index 09fb0b21..2b9bc59b 100644 --- a/__tests__/app/containers/SidePanel.test.tsx +++ b/__tests__/app/containers/SidePanel.test.tsx @@ -48,4 +48,4 @@ describe('SidePanel Container', () => { expect(wrapper.find('.SidePanel').children()).toHaveLength(0); expect(wrapper).toMatchSnapshot(); }); -}); \ No newline at end of file +}); diff --git a/__tests__/app/containers/__snapshots__/SidePanel.test.tsx.snap b/__tests__/app/containers/__snapshots__/SidePanel.test.tsx.snap index 3a405537..6c5a2a7f 100644 --- a/__tests__/app/containers/__snapshots__/SidePanel.test.tsx.snap +++ b/__tests__/app/containers/__snapshots__/SidePanel.test.tsx.snap @@ -30,4 +30,4 @@ exports[`SidePanel Container Should render empty
initially 1`] = ` sidePanelTab="NONE" sidePanelWidth={350} /> -`; \ No newline at end of file +`; diff --git a/src/app/components/SideBar.tsx b/src/app/components/SideBar.tsx index 1eb591d3..ebaef102 100644 --- a/src/app/components/SideBar.tsx +++ b/src/app/components/SideBar.tsx @@ -18,6 +18,7 @@ import * as SideBarInterfaces from 'app/types/SideBar'; import classnames from 'classnames'; import * as React from 'react'; import { Button, ButtonGroup } from 'react-bootstrap'; +import { Routes } from 'app/routes' export class Sidebar extends React.Component { public render() { @@ -119,10 +120,8 @@ export class Sidebar extends React.Component { ) : null} +
+ ) : null} +
diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index 95b71da2..35bd16c6 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -95,9 +95,7 @@ export class UserProfileModal extends React.Component< {this.props.userDetails.errorMessage === 'Unauthorised' ? ( ) : ( -

- { '' } -

+

{''}

)} ) : null} diff --git a/src/app/styles/Flags.css b/src/app/styles/Flags.css index 3d4399cf..1a7bd71b 100644 --- a/src/app/styles/Flags.css +++ b/src/app/styles/Flags.css @@ -1,35 +1,35 @@ .flag-select { - display: flex !important; - align-items: center !important; - width: 100% !important; - border: 1px solid black !important; - text-align: left !important; - } - - .flag-options { - margin-top: 100px !important; - } - - .flag-select img { - width: 1.5em; - position: relative; - top: 0 !important; - } - - .flag-select .arrow-down { - padding: 0px !important; - position: absolute; - right: 10px; - } - - .flag-select .flag-option.has-label { - padding-left: 30% !important; - } - - .flag-select .flag-options { - width: 90% !important; - } - - .flag-select .filterBox input { - padding-left: 5px !important; - } \ No newline at end of file + display: flex !important; + align-items: center !important; + width: 100% !important; + border: 1px solid black !important; + text-align: left !important; +} + +.flag-options { + margin-top: 100px !important; +} + +.flag-select img { + width: 1.5em; + position: relative; + top: 0 !important; +} + +.flag-select .arrow-down { + padding: 0px !important; + position: absolute; + right: 10px; +} + +.flag-select .flag-option.has-label { + padding-left: 30% !important; +} + +.flag-select .flag-options { + width: 90% !important; +} + +.flag-select .filterBox input { + padding-left: 5px !important; +} diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index 4eccf94e..62673411 100755 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -118,7 +118,7 @@ .form { padding: 10px 25px; - width:90%; + width: 90%; margin-left: 5%; } @@ -126,8 +126,8 @@ padding: 0px 10px; font-size: 30px; font-family: 'Poppins', sans-serif; - text-align: center ; - margin-bottom: 5% ; + text-align: center; + margin-bottom: 5%; width: 100%; } @@ -208,13 +208,13 @@ margin-top: 5%; } -.UsernameError{ +.UsernameError { width: 100%; font-size: 85%; - color: #dc3545 + color: #dc3545; } -.passwordInput{ - display: flex; +.passwordInput { + display: flex; flex-direction: column; } From fa343d105e398df142a6609a3c98869ae950ab44 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Tue, 11 Feb 2020 22:47:08 +0530 Subject: [PATCH 13/17] Update Snapshots --- .../components/__snapshots__/EditPassword.test.tsx.snap | 7 ------- 1 file changed, 7 deletions(-) diff --git a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap index b48c7a08..3f2f6dc1 100644 --- a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap +++ b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap @@ -96,7 +96,6 @@ exports[`EditPassword Component Should render 1`] = `
Date: Tue, 11 Feb 2020 23:57:30 +0530 Subject: [PATCH 14/17] Minor Bug Fixes --- src/app/components/UserProfileModal/EditPassword.tsx | 3 +-- src/app/components/UserProfileModal/EditProfile.tsx | 4 ++-- src/app/components/UserProfileModal/index.tsx | 2 +- src/app/styles/UserProfileModal.module.css | 8 +++++++- 4 files changed, 11 insertions(+), 6 deletions(-) diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index 04225822..ee44c1cf 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -18,9 +18,8 @@ export class EditPassword extends React.Component diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index e21aab27..2c240f1f 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -24,7 +24,7 @@ export class EditProfile extends React.Component -
+
User Details
@@ -140,7 +140,7 @@ export class EditProfile extends React.Component {userDetails.errorMessage != '' ? (
{userDetails.errorMessage} diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index 35bd16c6..d9964bfe 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -80,7 +80,7 @@ export class UserProfileModal extends React.Component< { this.setState((prevState) => ({ isPasswordPage: !prevState.isPasswordPage, diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index 62673411..0c2737ee 100755 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -118,10 +118,16 @@ .form { padding: 10px 25px; - width: 90%; + width: 100%; margin-left: 5%; } +.form1 { + padding: 10px 25px; + width: 85%; + margin-left: 12%; +} + .formHeading { padding: 0px 10px; font-size: 30px; From b8941171164b66ad6dbf938b730b7a242f20a202 Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Wed, 12 Feb 2020 00:30:37 +0530 Subject: [PATCH 15/17] Minor CSS Changes --- .../app/components/__snapshots__/EditPassword.test.tsx.snap | 3 +-- src/app/components/UserProfileModal/EditProfile.tsx | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap index 3f2f6dc1..3bbbfd49 100644 --- a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap +++ b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap @@ -173,9 +173,8 @@ exports[`EditPassword Component Should render 1`] = ` className="text-dark" style={ Object { - "display": "flex", "marginBottom": "5%", - "marginLeft": "10%", + "marginLeft": "-1px", "textAlign": "center", } } diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index 2c240f1f..97e3d1ce 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -140,7 +140,7 @@ export class EditProfile extends React.Component {userDetails.errorMessage != '' ? (
{userDetails.errorMessage} From 7a0ad2d3c616b3c445fdf9c5ffa4b3423e68ee8f Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Wed, 12 Feb 2020 19:06:23 +0530 Subject: [PATCH 16/17] Update Snapshots --- .../__snapshots__/EditPassword.test.tsx.snap | 23 ----------------- src/app/components/SideBar.tsx | 2 +- .../UserProfileModal/EditPassword.tsx | 14 +++-------- .../UserProfileModal/EditProfile.tsx | 9 +++---- src/app/components/UserProfileModal/index.tsx | 5 ++-- src/app/index.tsx | 2 +- src/app/routes.ts | 2 +- src/app/styles/UserProfileModal.module.css | 25 +++++++++++++++++++ 8 files changed, 37 insertions(+), 45 deletions(-) diff --git a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap index 3bbbfd49..9b1346c9 100644 --- a/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap +++ b/__tests__/app/components/__snapshots__/EditPassword.test.tsx.snap @@ -24,7 +24,6 @@ exports[`EditPassword Component Should render 1`] = `
) : null} diff --git a/src/app/components/UserProfileModal/EditProfile.tsx b/src/app/components/UserProfileModal/EditProfile.tsx index 97e3d1ce..7672c2bc 100755 --- a/src/app/components/UserProfileModal/EditProfile.tsx +++ b/src/app/components/UserProfileModal/EditProfile.tsx @@ -35,7 +35,7 @@ export class EditProfile extends React.Component Username -
+
-
+
-
+
-
+
{userDetails.errorMessage != '' ? (
{userDetails.errorMessage} diff --git a/src/app/components/UserProfileModal/index.tsx b/src/app/components/UserProfileModal/index.tsx index d9964bfe..6e8062a3 100755 --- a/src/app/components/UserProfileModal/index.tsx +++ b/src/app/components/UserProfileModal/index.tsx @@ -79,8 +79,7 @@ export class UserProfileModal extends React.Component< { this.setState((prevState) => ({ isPasswordPage: !prevState.isPasswordPage, @@ -95,7 +94,7 @@ export class UserProfileModal extends React.Component< {this.props.userDetails.errorMessage === 'Unauthorised' ? ( ) : ( -

{''}

+

{''}

)} ) : null} diff --git a/src/app/index.tsx b/src/app/index.tsx index 7f6ba1fd..0a83d041 100644 --- a/src/app/index.tsx +++ b/src/app/index.tsx @@ -22,7 +22,7 @@ export const App = hot(module)(() => ( - + diff --git a/src/app/routes.ts b/src/app/routes.ts index 7411b1de..8ed19b53 100644 --- a/src/app/routes.ts +++ b/src/app/routes.ts @@ -3,5 +3,5 @@ export enum Routes { LOGIN = '/login', REGISTER = '/register', LEADERBOARD = '/leaderboard', - USERPROFILEMODEL = '/profile', + USER_PROFILE_MODEL = '/profile', } diff --git a/src/app/styles/UserProfileModal.module.css b/src/app/styles/UserProfileModal.module.css index 0c2737ee..8d0728bc 100755 --- a/src/app/styles/UserProfileModal.module.css +++ b/src/app/styles/UserProfileModal.module.css @@ -134,6 +134,7 @@ font-family: 'Poppins', sans-serif; text-align: center; margin-bottom: 5%; + margin-left: -1px; width: 100%; } @@ -218,9 +219,33 @@ width: 100%; font-size: 85%; color: #dc3545; + margin: 0px; + margin-bottom: 10px; } .passwordInput { display: flex; flex-direction: column; } + +.inputGroup{ + display: flex; + flex-direction: column; +} + +.loginButton{ + background-color: rgb(70, 48, 235); + border-color: rgb(70, 48, 235); + margin-bottom: 10px; + width: 100%; +} + +.loginPageLink{ + cursor: pointer; + margin-left: 38%; +} + +.passwordPageLink{ + cursor: pointer; + margin-left: 37%; +} From 18a44e4951db30fbd1d111b027764666feb93e3f Mon Sep 17 00:00:00 2001 From: Chethan2k1 <40890937+Chethan2k1@users.noreply.github.com> Date: Wed, 12 Feb 2020 20:43:34 +0530 Subject: [PATCH 17/17] Made CSS Changes --- .../components/UserProfileModal/EditPassword.tsx | 14 +++++++------- .../components/UserProfileModal/EditProfile.tsx | 4 +--- src/app/components/UserProfileModal/index.tsx | 6 +++++- src/app/styles/UserProfileModal.module.css | 10 +++++----- 4 files changed, 18 insertions(+), 16 deletions(-) diff --git a/src/app/components/UserProfileModal/EditPassword.tsx b/src/app/components/UserProfileModal/EditPassword.tsx index 8576b788..279dd725 100755 --- a/src/app/components/UserProfileModal/EditPassword.tsx +++ b/src/app/components/UserProfileModal/EditPassword.tsx @@ -35,9 +35,7 @@ export class EditPassword extends React.Component
-
+
-
+