Skip to content

Commit

Permalink
auth translate
Browse files Browse the repository at this point in the history
  • Loading branch information
junaid900 committed Nov 24, 2023
1 parent 93d57d6 commit 4510ff0
Show file tree
Hide file tree
Showing 20 changed files with 224 additions and 61 deletions.
2 changes: 1 addition & 1 deletion ios/App/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -124,4 +124,4 @@ SPEC CHECKSUMS:

PODFILE CHECKSUM: 8e6a2a27555a43af8fdcda646e72fe803c20f937

COCOAPODS: 1.14.2
COCOAPODS: 1.11.3
41 changes: 41 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 2 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,8 @@
"@fortawesome/free-solid-svg-icons": "6.4.2",
"@ionic/angular": "7.5.5",
"@ionic/pwa-elements": "^3.1.1",
"@ngx-translate/core": "^15.0.0",
"@ngx-translate/http-loader": "^8.0.0",
"@tailwindcss/forms": "0.5.6",
"@tailwindcss/typography": "0.5.10",
"@trapezedev/configure": "7.0.10",
Expand Down
6 changes: 4 additions & 2 deletions src/app/app.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { onAuthStateChanged } from "@angular/fire/auth";
import { UserProfileService } from "./services/firebase/user-profile.service";
import { Device, DeviceId, DeviceInfo } from "@capacitor/device";
import { Network, ConnectionStatus } from '@capacitor/network';
import { TranslateService } from "@ngx-translate/core";

@Component({
selector: "app-root",
Expand All @@ -36,7 +37,8 @@ export class AppComponent implements OnInit {
private readonly fbService: FirebaseService,
private readonly profileService: UserProfileService,
private readonly router: Router,
public readonly menuCtrl: MenuController
public readonly menuCtrl: MenuController,
private translate: TranslateService,
) {
this.initializeApp();
// this.initializeFirebase();
Expand Down Expand Up @@ -158,7 +160,7 @@ export class AppComponent implements OnInit {

initializeApp(): void {
this.showSplashScreen();

this.translate.setDefaultLang('de');
this.swUpdate.versionUpdates.subscribe((event: VersionEvent) => {
if (event.type === "VERSION_READY") {
this.presentAlertUpdateVersion();
Expand Down
14 changes: 13 additions & 1 deletion src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { ServiceWorkerModule } from '@angular/service-worker';
import { environment } from '../environments/environment';
import { HttpClientModule } from '@angular/common/http';
import { HttpClientModule,HttpClient } from '@angular/common/http';

// import { GraphQLModule } from './graphql.module';

Expand Down Expand Up @@ -38,6 +38,8 @@ import { EventDetailPage } from './pages/event/event-detail/event-detail.page';
import { ClubPage } from './pages/club/club.page';
import { TeamPage } from './pages/team/team.page';
import { Capacitor } from '@capacitor/core';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';


@NgModule({
Expand Down Expand Up @@ -66,6 +68,13 @@ import { Capacitor } from '@capacitor/core';
}),
// GraphQLModule,
HttpClientModule,
TranslateModule.forRoot({ // <--- add this
loader: { // <--- add this
provide: TranslateLoader, // <--- add this
useFactory: (createTranslateLoader), // <--- add this
deps: [HttpClient] // <--- add this
} // <--- add this
}),
provideFirebaseApp(() => {
const init = initializeApp(environment.firebase);
return init;
Expand Down Expand Up @@ -96,3 +105,6 @@ import { Capacitor } from '@capacitor/core';
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}
export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, './assets/lang/', '.json');
}
4 changes: 3 additions & 1 deletion src/app/pages/auth/login/login.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,16 @@ import { IonicModule } from '@ionic/angular';
import { LoginPageRoutingModule } from './login-routing.module';

import { LoginPage } from './login.page';
import { TranslateModule } from '@ngx-translate/core';

@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
LoginPageRoutingModule
LoginPageRoutingModule,
TranslateModule
],
declarations: [LoginPage]
})
Expand Down
19 changes: 10 additions & 9 deletions src/app/pages/auth/login/login.page.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@
</picture>

<h2 i18n class="mt-6 text-3xl font-extrabold text-gray-900">
Melden Dich mit deinem Konto an
{{"login__title" | translate}}
</h2>
<p class="mt-2 text-sm text-gray-600" i18n>
Oder
<span routerLink="/signup" class="font-medium text-myclublight hover:text-myclubdark">
erstelle einen neuen Account
{{"or"|translate}}
<span routerLink="/signup" class="font-medium text-myclublight hover:text-myclubdark">
{{"signin_create__account"|translate}}
</span>
</p>
</div>
Expand All @@ -25,7 +25,7 @@ <h2 i18n class="mt-6 text-3xl font-extrabold text-gray-900">
<form class="space-y-6" [formGroup]="authForm">
<div>
<label for="email" class="block text-sm font-medium text-gray-700" i18n>
E-Mail Adresse
{{"email__address"| translate}}
</label>
<div class="mt-1">
<input id="email" name="email" type="email" autocomplete="email" formControlName="email" required
Expand All @@ -35,7 +35,7 @@ <h2 i18n class="mt-6 text-3xl font-extrabold text-gray-900">

<div class="space-y-1">
<label for="password" class="block text-sm font-medium text-gray-700" i18n>
Passwort
{{"password"| translate}}
</label>
<div class="mt-1">

Expand All @@ -55,15 +55,16 @@ <h2 i18n class="mt-6 text-3xl font-extrabold text-gray-900">

<div class="text-sm">
<span routerLink="/reset-password" class="font-medium text-myclublight hover:text-myclubdark" i18n>
Passwort vergessen?
{{"forget__password" | translate}}
</span>
</div>
</div>

<div>
<button (click)="submitCredentials(authForm)"
class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white dark:text-white bg-myclublight dark:bg-myclubdark hover:bg-myclubdark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bg-myclubdark" i18n>
Anmelden
class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white dark:text-white bg-myclublight dark:bg-myclubdark hover:bg-myclubdark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bg-myclubdark"
i18n>
{{"register"|translate}}
</button>
</div>
</form>
Expand Down
26 changes: 14 additions & 12 deletions src/app/pages/auth/login/login.page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ import {
} from "@angular/forms";
import { AlertController, MenuController } from "@ionic/angular";
import { AuthService } from "src/app/services/auth.service";

import { TranslateService } from "@ngx-translate/core";
import { lastValueFrom } from 'rxjs';
@Component({
selector: "app-login",
templateUrl: "./login.page.html",
Expand All @@ -27,17 +28,18 @@ export class LoginPage implements OnInit {
private readonly authService: AuthService,
private readonly router: Router,
private readonly formBuilder: UntypedFormBuilder,
public readonly menuCtrl: MenuController
public readonly menuCtrl: MenuController,
private translate: TranslateService
) {
this.menuCtrl.enable(true,"menu");
this.menuCtrl.enable(true, "menu");
this.authForm = this.formBuilder.group({
email: ["", Validators.compose([Validators.required, Validators.email])],
password: ["", Validators.minLength(6)],
});
}

ngOnInit() {
this.menuCtrl.enable(true,"menu");
this.menuCtrl.enable(true, "menu");
this.user = {
email: "",
password: "",
Expand All @@ -60,20 +62,20 @@ export class LoginPage implements OnInit {
console.error(err.code);

if (err.code == "auth/user-not-found") {
message = "Kein Account mit dieser E-Mail-Adresse gefunden.";
message = await lastValueFrom(this.translate.get("error__no_acount_found"));
} else if (err.code == "auth/wrong-password") {
message = "Die Kombination aus Benutzername und Passwort ist falsch.";
message = await lastValueFrom(this.translate.get("error__no_acount_found"));
} else if (err.code == "auth/network-request-failed") {
message = "Es gibt ein Problem mit der Netzwerkverbindung.";
message = await lastValueFrom(this.translate.get("error__network_connection"));
} else {

}

const alert = await this.alertCtrl.create({
message: message,
buttons: [{ text: "OK", role: "cancel" }],
});
alert.present();
message: message,
buttons: [{ text: await lastValueFrom(this.translate.get("ok")), role: "cancel" }],
});
alert.present();
}
}
}
4 changes: 3 additions & 1 deletion src/app/pages/auth/logout/logout.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,16 @@ import { IonicModule } from '@ionic/angular';
import { LogoutPageRoutingModule } from './logout-routing.module';

import { LogoutPage } from './logout.page';
import { TranslateModule } from '@ngx-translate/core';

@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
LogoutPageRoutingModule
LogoutPageRoutingModule,
TranslateModule,
],
declarations: [LogoutPage]
})
Expand Down
6 changes: 3 additions & 3 deletions src/app/pages/auth/logout/logout.page.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,14 @@
</picture>

<h2 class="mt-6 text-3xl font-extrabold text-gray-900">
Logout war erfolgreich!
{{"logout__success"|translate}}
</h2>
<p class="mt-2 text-sm text-gray-600">
<span
routerLink="/login"
class="font-medium text-myclublight hover:text-myclubdark"
>
zurück zum Login
{{"back_to__login"| translate}}
</span>
</p>
</div>
Expand All @@ -35,7 +35,7 @@ <h2 class="mt-6 text-3xl font-extrabold text-gray-900">
<img
class="absolute inset-0 h-full w-full object-cover"
src="assets/bg/mountain-3.jpg"
alt="Hintergrundbild"
[alt]='"backgroud_image__alt"|translate'
/>
</div>
</div>
Expand Down
4 changes: 3 additions & 1 deletion src/app/pages/auth/reset-password/reset-password.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,16 @@ import { IonicModule } from '@ionic/angular';
import { ResetPasswordPageRoutingModule } from './reset-password-routing.module';

import { ResetPasswordPage } from './reset-password.page';
import { TranslateModule } from '@ngx-translate/core';

@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
IonicModule,
ResetPasswordPageRoutingModule
ResetPasswordPageRoutingModule,
TranslateModule
],
declarations: [ResetPasswordPage]
})
Expand Down
12 changes: 6 additions & 6 deletions src/app/pages/auth/reset-password/reset-password.page.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,15 +18,15 @@
</picture>

<h2 class="mt-6 text-3xl font-extrabold text-gray-900">
Passwort vergessen
{{"forget__password"| translate}}
</h2>
<p class="mt-2 text-sm text-gray-600">
oder
{{"or"| translate}}
<span
routerLink="/login"
class="font-medium text-myclublight hover:text-myclubdark"
>
Login nochmals probieren?
{{"try__login_again"| translate}}
</span>
</p>
</div>
Expand All @@ -39,7 +39,7 @@ <h2 class="mt-6 text-3xl font-extrabold text-gray-900">
for="email"
class="block text-sm font-medium text-gray-700"
>
E-Mail Adresse
{{"email__address"| translate}}
</label>
<div class="mt-1">
<input
Expand Down Expand Up @@ -72,7 +72,7 @@ <h2 class="mt-6 text-3xl font-extrabold text-gray-900">
(click)="submitCredentials(authForm)"
class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white dark:text-white bg-myclublight dark:bg-myclubdark hover:bg-myclubdark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bg-myclubdark"
>
Passwort zurücksetzen
{{"reset__password"| translate}}
</button>
</div>
</form>
Expand All @@ -84,7 +84,7 @@ <h2 class="mt-6 text-3xl font-extrabold text-gray-900">
<img
class="absolute inset-0 h-full w-full object-cover"
src="assets/bg/mountain-5.jpg"
alt="background image mountains"
[alt]='"mountain_background__alt" | translate'
/>
</div>
</div>
Expand Down
Loading

0 comments on commit 4510ff0

Please sign in to comment.