Skip to content

Commit 8e24240

Browse files
jeroenouwjeroenouw
authored
Merge pull request #19 from jeroenouw/ngx-auth
minor changes
2 parents 4d8126d + c776053 commit 8e24240

File tree

11 files changed

+92
-100
lines changed

11 files changed

+92
-100
lines changed

‎docs/DEVELOPER.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,23 +7,23 @@ Change directory to this project
77
Run `npm install` to install all the dependencies.
88
Run `npm start` to run this project. This will run with the AoT Compiler.
99
Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
10-
Run `npm reset` if you want to install everything again.
10+
Run `npm reset` if you want to re-install everything.
1111

1212
## Development
1313

14-
For own projects please use different keys in `src/app/app.component.ts`:
14+
For own projects please use different keys in `src/app/firebase.config.ts`:
1515

1616
```typescript
1717

18-
firebase.initializeApp({
19-
// For your own projects use different keys
18+
export const firebaseKeys = {
19+
// For your own projects please use different keys
2020
apiKey: 'YOUR_KEY',
2121
authDomain: 'YOUR_DOMAIN',
2222
databaseURL: 'YOUR_URL',
2323
projectId: 'YOUR_ID',
2424
storageBucket: 'YOUR_KEY',
2525
messagingSenderId: 'YOUR_ID'
26-
});
26+
}
2727

2828
```
2929

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "ngxmatfire",
3-
"version": "1.3.0",
3+
"version": "1.3.1",
44
"author": "Jeroen Ouwehand",
55
"description": "Full stack starter app with Angular 7, Material Design and Firebase.",
66
"keywords": [

‎src/app/app.component.ts‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { Component, OnInit } from '@angular/core';
22
import * as firebase from 'firebase';
3+
import { firebaseKeys } from './firebase.config';
34

45
@Component({
56
selector: 'app-root',
@@ -10,14 +11,6 @@ import * as firebase from 'firebase';
1011
export class AppComponent implements OnInit {
1112

1213
public ngOnInit(): void {
13-
firebase.initializeApp({
14-
// For your own projects use different keys
15-
apiKey: 'AIzaSyBUYZcc_HKi1TckbZPpSjSkxyFvml3Is0A',
16-
authDomain: 'angular4materialdesign.firebaseapp.com',
17-
databaseURL: 'https://angular4materialdesign.firebaseio.com',
18-
projectId: 'angular4materialdesign',
19-
storageBucket: 'angular4materialdesign.appspot.com',
20-
messagingSenderId: '136985605193'
21-
});
14+
firebase.initializeApp(firebaseKeys);
2215
}
2316
}

‎src/app/app.module.ts‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ import {
3131
// Main
3232
import { AppComponent } from './app.component';
3333
import { AppRoutingModule } from './app.routing';
34+
import { firebaseKeys } from './firebase.config';
3435

3536
// Pages
3637
import { HomeComponent } from './pages/home/home.component';
@@ -68,14 +69,7 @@ import { EmailMeComponent } from './components/email-me/email-me.component';
6869
BackgroundsModule,
6970
ProfileModule,
7071
MiscModule,
71-
NgxAuthFirebaseUIModule.forRoot({
72-
apiKey: 'AIzaSyBUYZcc_HKi1TckbZPpSjSkxyFvml3Is0A',
73-
authDomain: 'angular4materialdesign.firebaseapp.com',
74-
databaseURL: 'https://angular4materialdesign.firebaseio.com',
75-
projectId: 'angular4materialdesign',
76-
storageBucket: 'angular4materialdesign.appspot.com',
77-
messagingSenderId: '136985605193'
78-
})
72+
NgxAuthFirebaseUIModule.forRoot(firebaseKeys)
7973
],
8074
providers: [
8175
UserService,

‎src/app/firebase.config.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const firebaseKeys = {
2+
// For your own projects please use different keys
3+
apiKey: 'AIzaSyBUYZcc_HKi1TckbZPpSjSkxyFvml3Is0A',
4+
authDomain: 'angular4materialdesign.firebaseapp.com',
5+
databaseURL: 'https://angular4materialdesign.firebaseio.com',
6+
projectId: 'angular4materialdesign',
7+
storageBucket: 'angular4materialdesign.appspot.com',
8+
messagingSenderId: '136985605193'
9+
}

‎src/app/pages/auth/auth.component.html‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
<ngx-auth-firebaseui
22
(onSuccess)="onSuccess()"
3-
(onError)="printError()"
43
appearance="outline">
54
</ngx-auth-firebaseui>

‎src/app/pages/auth/auth.component.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import { AuthService } from '@shared';
99
styleUrls: ['./auth.component.scss']
1010
})
1111
export class AuthComponent {
12-
public loading: boolean = false;
1312

1413
constructor(private authService: AuthService) {}
1514

‎src/app/pages/auth/phone-signin/phone-signin.component.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { WindowService, PhoneNumber, AuthService, AlertService } from '@shared';
1111
})
1212
export class PhoneSigninComponent implements OnInit {
1313
phoneNumber = new PhoneNumber()
14-
isAuthenticated = false;
14+
isAuthenticated: string;
1515

1616
token: string;
1717
windowRef: any;

‎src/app/shared/layout/header/header.component.html‎

Lines changed: 44 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -27,14 +27,9 @@
2727
<hr>
2828

2929
<div *ngIf="!authService.isAuthenticated(); else logout">
30-
<button mat-button routerLink="/signup" (click)="sidenav.close()">
31-
<mat-icon class="signup">person_add</mat-icon>
32-
<span>Signup</span>
33-
</button>
34-
35-
<button mat-button routerLink="/login" (click)="sidenav.close()">
30+
<button mat-button routerLink="/auth" (click)="sidenav.close()">
3631
<mat-icon class="login">lock_open</mat-icon>
37-
<span>Login</span>
32+
<span>Auth</span>
3833
</button>
3934
</div>
4035

@@ -69,47 +64,47 @@
6964

7065
<span class="spacer-light"></span>
7166

72-
<div *ngIf="!authService.isAuthenticated(); else loggedin">
73-
<!-- <a routerLink="/signup"><mat-icon>person_add</mat-icon></a> -->
74-
<a routerLink="/auth"><mat-icon>lock_open</mat-icon></a>
75-
</div>
67+
<div *ngIf="!authService.isAuthenticated(); else loggedin">
68+
<button type="button" routerLink="/auth" mat-icon-button>
69+
<mat-icon>lock_open</mat-icon>
70+
</button>
71+
</div>
72+
73+
74+
<ng-template #loggedin>
75+
<h4>Welcome</h4>
76+
77+
<button mat-icon-button [matMenuTriggerFor]="menu">
78+
<mat-icon>more_vert</mat-icon>
79+
</button>
80+
81+
<mat-menu #menu="matMenu" >
82+
<a
83+
mat-menu-item
84+
[routerLink]="'/profile'">
85+
<mat-icon class="profile">face</mat-icon>
86+
<span>Profile</span>
87+
</a>
88+
89+
<a mat-menu-item *ngFor="let item of menuItems" href="{{item.link}}" target="_blank">
90+
<mat-icon class="login">{{item.icon}}</mat-icon>
91+
<span>{{item.title}}</span>
92+
</a>
93+
94+
<a
95+
mat-menu-item
96+
routerLink="/profile-settings"
97+
[queryParams]="{profile: '1'}"
98+
fragment="editProfile">
99+
<mat-icon class="settings">settings</mat-icon>
100+
<span>Settings</span>
101+
</a>
102+
103+
<a mat-menu-item (click)="onLogout()">
104+
<mat-icon class="logout">lock_outline</mat-icon>
105+
<span>Logout</span>
106+
</a>
107+
</mat-menu>
76108

77-
<ng-template #loggedin>
78-
<h4>(User: {{userEmail()}})</h4>
79-
80-
<button mat-icon-button [matMenuTriggerFor]="menu">
81-
<mat-icon>more_vert</mat-icon>
82-
</button>
83-
84-
<mat-menu #menu="matMenu" >
85-
86-
<!-- [routerLink]="['/profile', userUid(), userName()]" -->
87-
<a
88-
mat-menu-item
89-
[routerLink]="'/profile'">
90-
<mat-icon class="profile">face</mat-icon>
91-
<span>Profile</span>
92-
</a>
93-
94-
<a mat-menu-item *ngFor="let item of menuItems" href="{{item.link}}">
95-
<mat-icon class="login">{{item.icon}}</mat-icon>
96-
<span>{{item.title}}</span>
97-
</a>
98-
99-
<a
100-
mat-menu-item
101-
routerLink="/profile-settings"
102-
[queryParams]="{profile: '1'}"
103-
fragment="editProfile">
104-
<mat-icon class="settings">settings</mat-icon>
105-
<span>Settings</span>
106-
</a>
107-
108-
<a mat-menu-item (click)="onLogout()">
109-
<mat-icon class="logout">lock_outline</mat-icon>
110-
<span>Logout</span>
111-
</a>
112-
</mat-menu>
113-
114-
</ng-template>
109+
</ng-template>
115110
</mat-toolbar>

‎src/app/shared/layout/header/header.component.ts‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,41 @@
11
import { Component } from '@angular/core';
22
import * as firebase from 'firebase';
33

4-
import { AuthService, AlertService, UserService } from '../../services';
4+
import { AuthService, AlertService } from '../../services';
55

66
@Component({
77
selector: 'app-header',
88
templateUrl: 'header.component.html',
99
styleUrls: ['./header.component.scss'],
1010
})
1111
export class HeaderComponent {
12-
public title: string = '';
13-
public isAuthenticated: boolean = false;
12+
public isAuthenticated: string;
1413
public angularImage: string = '/assets/img/angular2.png';
1514

1615
public menuItems: Object[] = [
1716
{
18-
icon: 'description',
17+
icon: 'library_books',
1918
title: 'Medium @jeroenouw',
2019
link: 'https://medium.com/@jeroenouw'
2120
},
21+
{
22+
icon: 'description',
23+
title: 'Generated docs',
24+
link: 'http://ngxmatfire-docs.jerouw.nl/'
25+
},
26+
{
27+
icon: 'description',
28+
title: 'Features',
29+
link: 'https://github.com/jeroenouw/AngularMaterialFirebase/blob/master/docs/FEATURES.md'
30+
},
31+
{
32+
icon: 'flight_takeoff',
33+
title: 'Quick start',
34+
link: 'https://github.com/jeroenouw/AngularMaterialFirebase/blob/master/docs/DEVELOPER.md'
35+
},
2236
{
2337
icon: 'archive',
24-
title: 'Published packages',
38+
title: 'NPM packages',
2539
link: 'https://www.npmjs.com/~jeroenouw'
2640
},
2741
{
@@ -34,23 +48,19 @@ export class HeaderComponent {
3448
constructor(
3549
public authService: AuthService,
3650
private alertService: AlertService,
37-
private userService: UserService
3851
) {
3952
this.isAuthenticated = this.authService.isAuthenticated()
4053
}
4154

42-
public userUid(): string{
43-
this.userService.getUserProfileInformation();
55+
public userUid(): string {
4456
return firebase.auth().currentUser.uid;
4557
}
4658

4759
public userEmail(): string {
48-
this.userService.getUserProfileInformation();
4960
return firebase.auth().currentUser.email;
5061
}
5162

5263
public userName(): string {
53-
this.userService.getUserProfileInformation();
5464
return firebase.auth().currentUser.displayName;
5565
}
5666

0 commit comments

Comments
 (0)