From 2c1c8c0da3c849085a1f15e3172410595181ba6a Mon Sep 17 00:00:00 2001 From: Gururajj77 Date: Thu, 11 Jan 2024 00:17:42 +0530 Subject: [PATCH] sign up page validations, stylings and feed component created --- src/app/app.routes.ts | 2 ++ src/app/feed/feed.component.html | 1 + src/app/feed/feed.component.scss | 0 src/app/feed/feed.component.spec.ts | 23 +++++++++++++++++++++++ src/app/feed/feed.component.ts | 12 ++++++++++++ src/app/sign-in/sign-in.component.ts | 4 ++++ src/app/sign-up/sign-up.component.html | 8 +++++--- src/app/sign-up/sign-up.component.scss | 7 ++++++- src/app/sign-up/sign-up.component.ts | 7 +++---- 9 files changed, 56 insertions(+), 8 deletions(-) create mode 100644 src/app/feed/feed.component.html create mode 100644 src/app/feed/feed.component.scss create mode 100644 src/app/feed/feed.component.spec.ts create mode 100644 src/app/feed/feed.component.ts diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index 8248620..a5e6857 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -1,9 +1,11 @@ import { Routes } from '@angular/router'; import { SignInComponent } from './sign-in/sign-in.component'; import { SignUpComponent } from './sign-up/sign-up.component'; +import { FeedComponent } from './feed/feed.component'; export const routes: Routes = [ { path: '', redirectTo: '/sign-in', pathMatch: 'full' }, { path: 'sign-in', component: SignInComponent }, { path: 'register-user', component: SignUpComponent }, + { path: 'feed', component: FeedComponent } ]; diff --git a/src/app/feed/feed.component.html b/src/app/feed/feed.component.html new file mode 100644 index 0000000..e469260 --- /dev/null +++ b/src/app/feed/feed.component.html @@ -0,0 +1 @@ +

feed works!

diff --git a/src/app/feed/feed.component.scss b/src/app/feed/feed.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/feed/feed.component.spec.ts b/src/app/feed/feed.component.spec.ts new file mode 100644 index 0000000..e35cbc2 --- /dev/null +++ b/src/app/feed/feed.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FeedComponent } from './feed.component'; + +describe('FeedComponent', () => { + let component: FeedComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [FeedComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(FeedComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/feed/feed.component.ts b/src/app/feed/feed.component.ts new file mode 100644 index 0000000..268256c --- /dev/null +++ b/src/app/feed/feed.component.ts @@ -0,0 +1,12 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-feed', + standalone: true, + imports: [], + templateUrl: './feed.component.html', + styleUrl: './feed.component.scss' +}) +export class FeedComponent { + +} diff --git a/src/app/sign-in/sign-in.component.ts b/src/app/sign-in/sign-in.component.ts index 9b4ba41..e91a620 100644 --- a/src/app/sign-in/sign-in.component.ts +++ b/src/app/sign-in/sign-in.component.ts @@ -34,6 +34,9 @@ export class SignInComponent { const email = this.loginForm.get('email')!.value; const password = this.loginForm.get('password')!.value; signInWithEmailAndPassword(this.auth, email, password) + .then((result) => { + this.router.navigateByUrl('/feed'); + }) .catch((error) => { this.ERROR_CODE = error.code console.log(this.ERROR_CODE) @@ -47,6 +50,7 @@ export class SignInComponent { signInWithPopup(this.auth, provider) .then((result) => { const credential = GoogleAuthProvider.credentialFromResult(result); + this.router.navigateByUrl('/feed') }).catch((error) => { const credential = GoogleAuthProvider.credentialFromError(error); }); diff --git a/src/app/sign-up/sign-up.component.html b/src/app/sign-up/sign-up.component.html index 8f06300..a6b702a 100644 --- a/src/app/sign-up/sign-up.component.html +++ b/src/app/sign-up/sign-up.component.html @@ -55,9 +55,11 @@

Create Account

- +
+ +

Already have an account? Log in

diff --git a/src/app/sign-up/sign-up.component.scss b/src/app/sign-up/sign-up.component.scss index 46421b6..ab7e6d3 100644 --- a/src/app/sign-up/sign-up.component.scss +++ b/src/app/sign-up/sign-up.component.scss @@ -98,9 +98,14 @@ button:disabled { } .google-sign-in { + background: none; + border: none; color: #757575; + cursor: pointer; + font-size: inherit; + font-family: inherit; font-size: 14px; - margin-top: 16px; + margin-top: 10px; text-decoration: none; } diff --git a/src/app/sign-up/sign-up.component.ts b/src/app/sign-up/sign-up.component.ts index d433d6a..76ed030 100644 --- a/src/app/sign-up/sign-up.component.ts +++ b/src/app/sign-up/sign-up.component.ts @@ -1,7 +1,7 @@ import { Component, inject } from '@angular/core'; import { Auth, GoogleAuthProvider, createUserWithEmailAndPassword, signInWithPopup, updateProfile } from '@angular/fire/auth'; import { Router } from '@angular/router'; -import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; +import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; @Component({ selector: 'app-sign-up', @@ -37,7 +37,7 @@ export class SignUpComponent { return updateProfile(userCredential.user, { displayName: name }); }) .then(() => { - // this.router.navigate(['/some-success-route']); + this.router.navigateByUrl('/feed'); }) .catch(error => { console.error('Registration error:', error); @@ -50,12 +50,11 @@ export class SignUpComponent { signInWithPopup(this.auth, provider) .then((result) => { const credential = GoogleAuthProvider.credentialFromResult(result); + this.router.navigateByUrl('/feed'); }).catch((error) => { - const errorCode = error.code; const credential = GoogleAuthProvider.credentialFromError(error); }); } - toLoginPage() { this.router.navigateByUrl('sign-in') }