Fix merge conflicts

Author: limcaaarl

.github/pull_request_template.md

@@ -0,0 +1,10 @@
+## Description
+
+Please include a summary of the changes made in this pull request.
+
+## Checklist
+
+- [ ] I have updated documentation
+- [ ] All tests passing
+
+## Screenshots (if applicable)

README.md

@@ -2,7 +2,7 @@
 # CS3219 Project (PeerPrep) - AY2425S1
 ## Group: G03
 
-### Note:
-- You can choose to develop individual microservices within separate folders within this repository **OR** use individual repositories (all public) for each microservice.
-- In the latter scenario, you should enable sub-modules on this GitHub classroom repository to manage the development/deployment **AND** add your mentor to the individual repositories as a collaborator.
-- The teaching team should be given access to the repositories as we may require viewing the history of the repository in case of any disputes or disagreements.
+### Note: 
+- You can choose to develop individual microservices within separate folders within this repository **OR** use individual repositories (all public) for each microservice. 
+- In the latter scenario, you should enable sub-modules on this GitHub classroom repository to manage the development/deployment **AND** add your mentor to the individual repositories as a collaborator. 
+- The teaching team should be given access to the repositories as we may require viewing the history of the repository in case of any disputes or disagreements.

frontend/src/app/account/_validators/invalid-password.validator.ts

@@ -0,0 +1,12 @@
+import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';
+
+const PASSWORD_REGEX = /^[a-zA-Z0-9!"#$%&'()*+,-.:;<=>?@\\/\\[\]^_`{|}~]+$/;
+
+export const PASSWORD_INVALID = 'passwordInvalid';
+
+export function invalidPasswordValidator(): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+        const weak = !PASSWORD_REGEX.test(control.value);
+        return weak ? { [PASSWORD_INVALID]: true } : null;
+    };
+}

frontend/src/app/account/_validators/invalid-username.validator.ts

@@ -0,0 +1,12 @@
+import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';
+
+const USERNAME_REGEX = /^[a-zA-Z0-9._-]+$/;
+
+export const USERNAME_INVALID = 'usernameInvalid';
+
+export function invalidUsernameValidator(): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+        const invalid = !USERNAME_REGEX.test(control.value);
+        return invalid ? { [USERNAME_INVALID]: true } : null;
+    };
+}

frontend/src/app/account/_validators/mismatch-password.validator.ts

@@ -0,0 +1,11 @@
+import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';
+
+export const PASSWORD_MISMATCH = 'passwordMismatch';
+
+export function mismatchPasswordValidator(firstPasswordField: string, secondPasswordField: string): ValidatorFn {
+    return (formGroup: AbstractControl): ValidationErrors | null => {
+        const password = formGroup.get(firstPasswordField)?.value;
+        const confirmPassword = formGroup.get(secondPasswordField)?.value;
+        return password !== confirmPassword ? { [PASSWORD_MISMATCH]: true } : null;
+    };
+}

frontend/src/app/account/_validators/weak-password.validator.ts

@@ -0,0 +1,13 @@
+import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';
+
+export const STRONG_PASSWORD_REGEX =
+    /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})(?=.*[!"#$%&'()*+,-.:;<=>?@\\/\\[\]^_`{|}~])/;
+
+export const PASSWORD_WEAK = 'passwordWeak';
+
+export function weakPasswordValidator(): ValidatorFn {
+    return (control: AbstractControl): ValidationErrors | null => {
+        const weak = !STRONG_PASSWORD_REGEX.test(control.value);
+        return weak ? { [PASSWORD_WEAK]: true } : null;
+    };
+}

frontend/src/app/account/account.component.css

@@ -0,0 +1,22 @@
+.container {
+    padding: 2rem;
+    background-color: var(--surface-section);
+    border-radius: 0.75rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.form-container {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    width: 100%;
+}
+
+.form-field {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    width: 100%;
+}

frontend/src/app/account/account.component.ts

@@ -0,0 +1,24 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { LoginComponent } from './login.component';
+import { RegisterComponent } from './register.component';
+import { LayoutComponent } from './layout.component';
+
+const routes: Routes = [
+    {
+        path: '',
+        component: LayoutComponent,
+        children: [
+            { path: '', redirectTo: 'login', pathMatch: 'full' },
+            { path: 'login', component: LoginComponent },
+            { path: 'register', component: RegisterComponent },
+        ],
+    },
+];
+
+@NgModule({
+    imports: [RouterModule.forChild(routes)],
+    exports: [RouterModule],
+})
+export class AccountRoutingModule {}

frontend/src/app/account/account.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
+
+import { LoginComponent } from './login.component';
+import { RegisterComponent } from './register.component';
+import { LayoutComponent } from './layout.component';
+import { AccountRoutingModule } from './account.component';
+
+@NgModule({
+    imports: [
+        CommonModule,
+        ReactiveFormsModule,
+        AccountRoutingModule,
+        LayoutComponent,
+        LoginComponent,
+        RegisterComponent,
+    ],
+})
+export class AccountModule {}

frontend/src/app/account/layout.component.html

@@ -0,0 +1,4 @@
+<div class="flex flex-column h-full w-full justify-content-center align-items-center p-2">
+    <h2 class="mb-2">Welcome to PeerPrep</h2>
+    <router-outlet></router-outlet>
+</div>