diff --git a/.phpactor.json b/.phpactor.json new file mode 100644 index 0000000..4933b4b --- /dev/null +++ b/.phpactor.json @@ -0,0 +1,3 @@ +{ + "indexer.exclude_patterns": ["/node_modules/**/*", "/backend/**/*"] +} diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index f6736f3..3e3354b 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -19,4 +19,9 @@ export const routes: Routes = [ canActivate: [authGuard, roleGuard], data: { roles: ["admin", "broker"] }, }, + { + path: "checkout", + loadChildren: () => + import("./features/checkout/checkout.routes").then((routes) => routes.checkoutRoutes), + }, ]; diff --git a/src/app/core/layouts/header/header.html b/src/app/core/layouts/header/header.html index 70f585c..7a74d77 100644 --- a/src/app/core/layouts/header/header.html +++ b/src/app/core/layouts/header/header.html @@ -20,14 +20,14 @@
+ +
+ + diff --git a/src/app/features/checkout/components/address-form/address-form.spec.ts b/src/app/features/checkout/components/address-form/address-form.spec.ts new file mode 100644 index 0000000..413f20a --- /dev/null +++ b/src/app/features/checkout/components/address-form/address-form.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { AddressForm } from "./address-form"; + +describe("AddressForm", () => { + let component: AddressForm; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [AddressForm], + }).compileComponents(); + + fixture = TestBed.createComponent(AddressForm); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it("should create", () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/features/checkout/components/address-form/address-form.ts b/src/app/features/checkout/components/address-form/address-form.ts new file mode 100644 index 0000000..12e9728 --- /dev/null +++ b/src/app/features/checkout/components/address-form/address-form.ts @@ -0,0 +1,20 @@ +import { Component } from "@angular/core"; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms"; +import { Error } from "@app/shared/components/error/error"; + +@Component({ + selector: "app-address-form", + imports: [ReactiveFormsModule, Error], + templateUrl: "./address-form.html", + styleUrl: "./address-form.css", +}) +export class AddressForm { + addressForm = new FormGroup({ + firstName: new FormControl("", { validators: Validators.required }), + lastName: new FormControl("", { validators: Validators.required }), + streetAddress: new FormControl("", { validators: Validators.required }), + city: new FormControl("", { validators: Validators.required }), + state: new FormControl("", { validators: Validators.required }), + pinCode: new FormControl("", { validators: Validators.required }), + }); +} diff --git a/src/app/features/checkout/components/address-select/address-select.css b/src/app/features/checkout/components/address-select/address-select.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/features/checkout/components/address-select/address-select.html b/src/app/features/checkout/components/address-select/address-select.html new file mode 100644 index 0000000..1fb2a0e --- /dev/null +++ b/src/app/features/checkout/components/address-select/address-select.html @@ -0,0 +1,10 @@ +
+
+ +

Kushal Saha

+

48 St, Park Avenue, New Towm, 700021

+
+
+ +
+
diff --git a/src/app/features/checkout/components/address-select/address-select.spec.ts b/src/app/features/checkout/components/address-select/address-select.spec.ts new file mode 100644 index 0000000..d9d477d --- /dev/null +++ b/src/app/features/checkout/components/address-select/address-select.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { AddressSelect } from "./address-select"; + +describe("AddressSelect", () => { + let component: AddressSelect; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [AddressSelect], + }).compileComponents(); + + fixture = TestBed.createComponent(AddressSelect); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it("should create", () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/features/checkout/components/address-select/address-select.ts b/src/app/features/checkout/components/address-select/address-select.ts new file mode 100644 index 0000000..18a7490 --- /dev/null +++ b/src/app/features/checkout/components/address-select/address-select.ts @@ -0,0 +1,9 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: "app-address-select", + imports: [], + templateUrl: "./address-select.html", + styleUrl: "./address-select.css", +}) +export class AddressSelect {} diff --git a/src/app/features/checkout/components/order-summery/order-summery.css b/src/app/features/checkout/components/order-summery/order-summery.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/features/checkout/components/order-summery/order-summery.html b/src/app/features/checkout/components/order-summery/order-summery.html new file mode 100644 index 0000000..4d21641 --- /dev/null +++ b/src/app/features/checkout/components/order-summery/order-summery.html @@ -0,0 +1,3 @@ +
+

Order Summery

+
diff --git a/src/app/features/checkout/components/order-summery/order-summery.spec.ts b/src/app/features/checkout/components/order-summery/order-summery.spec.ts new file mode 100644 index 0000000..aca8d57 --- /dev/null +++ b/src/app/features/checkout/components/order-summery/order-summery.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { OrderSummery } from "./order-summery"; + +describe("OrderSummery", () => { + let component: OrderSummery; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [OrderSummery], + }).compileComponents(); + + fixture = TestBed.createComponent(OrderSummery); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it("should create", () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/features/checkout/components/order-summery/order-summery.ts b/src/app/features/checkout/components/order-summery/order-summery.ts new file mode 100644 index 0000000..3a03579 --- /dev/null +++ b/src/app/features/checkout/components/order-summery/order-summery.ts @@ -0,0 +1,9 @@ +import { Component } from "@angular/core"; + +@Component({ + selector: "app-order-summery", + imports: [], + templateUrl: "./order-summery.html", + styleUrl: "./order-summery.css", +}) +export class OrderSummery {} diff --git a/src/app/features/checkout/services/address-service.spec.ts b/src/app/features/checkout/services/address-service.spec.ts new file mode 100644 index 0000000..b8c5e22 --- /dev/null +++ b/src/app/features/checkout/services/address-service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from "@angular/core/testing"; + +import { AddressService } from "./address-service"; + +describe("AddressService", () => { + let service: AddressService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(AddressService); + }); + + it("should be created", () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/features/checkout/services/address-service.ts b/src/app/features/checkout/services/address-service.ts new file mode 100644 index 0000000..1ddc4c6 --- /dev/null +++ b/src/app/features/checkout/services/address-service.ts @@ -0,0 +1,6 @@ +import { Injectable } from "@angular/core"; + +@Injectable({ + providedIn: "root", +}) +export class AddressService {} diff --git a/src/app/shared/components/cart/cart.html b/src/app/shared/components/cart/cart.html index df526c5..8ee49df 100644 --- a/src/app/shared/components/cart/cart.html +++ b/src/app/shared/components/cart/cart.html @@ -24,3 +24,6 @@
} +Proceed to checkout diff --git a/src/app/shared/components/cart/cart.ts b/src/app/shared/components/cart/cart.ts index 121b0ef..6334750 100644 --- a/src/app/shared/components/cart/cart.ts +++ b/src/app/shared/components/cart/cart.ts @@ -4,10 +4,11 @@ import { CartItem } from "../cart-item/cart-item"; import { AuthService, AuthState } from "@app/features/auth/services/auth-service"; import { CartService } from "@app/core/services/cart-service"; import { finalize, tap } from "rxjs"; +import { RouterLink } from "@angular/router"; @Component({ selector: "app-cart", - imports: [CartItem], + imports: [CartItem, RouterLink], templateUrl: "./cart.html", styleUrl: "./cart.css", }) diff --git a/src/app/shared/components/go-back/go-back.css b/src/app/shared/components/go-back/go-back.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/shared/components/go-back/go-back.html b/src/app/shared/components/go-back/go-back.html new file mode 100644 index 0000000..c21331c --- /dev/null +++ b/src/app/shared/components/go-back/go-back.html @@ -0,0 +1,4 @@ + + +

{{ text }}

+ diff --git a/src/app/shared/components/go-back/go-back.spec.ts b/src/app/shared/components/go-back/go-back.spec.ts new file mode 100644 index 0000000..8b2a9b0 --- /dev/null +++ b/src/app/shared/components/go-back/go-back.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { GoBack } from "./go-back"; + +describe("GoBack", () => { + let component: GoBack; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [GoBack], + }).compileComponents(); + + fixture = TestBed.createComponent(GoBack); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it("should create", () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/shared/components/go-back/go-back.ts b/src/app/shared/components/go-back/go-back.ts new file mode 100644 index 0000000..b690ada --- /dev/null +++ b/src/app/shared/components/go-back/go-back.ts @@ -0,0 +1,15 @@ +import { Component, Input } from "@angular/core"; +import { RouterLink } from "@angular/router"; +import { LucideAngularModule, MoveLeft } from "lucide-angular"; + +@Component({ + selector: "app-go-back", + imports: [RouterLink, LucideAngularModule], + templateUrl: "./go-back.html", + styleUrl: "./go-back.css", +}) +export class GoBack { + @Input() route: string = "#"; + @Input() text: string = ""; + MoveLeftIcon = MoveLeft; +} diff --git a/src/app/shared/components/stepper/stepper.css b/src/app/shared/components/stepper/stepper.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/shared/components/stepper/stepper.html b/src/app/shared/components/stepper/stepper.html new file mode 100644 index 0000000..91b4b16 --- /dev/null +++ b/src/app/shared/components/stepper/stepper.html @@ -0,0 +1,29 @@ +
    + @for (step of steps; track step) { +
  1. +
    + + + + @if (!$last) { +
    + } +
    +

    {{ step.label }}

    +
    2. + } +
diff --git a/src/app/shared/components/stepper/stepper.spec.ts b/src/app/shared/components/stepper/stepper.spec.ts new file mode 100644 index 0000000..53af7c4 --- /dev/null +++ b/src/app/shared/components/stepper/stepper.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { Stepper } from "./stepper"; + +describe("Stepper", () => { + let component: Stepper; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [Stepper], + }).compileComponents(); + + fixture = TestBed.createComponent(Stepper); + component = fixture.componentInstance; + await fixture.whenStable(); + }); + + it("should create", () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/shared/components/stepper/stepper.ts b/src/app/shared/components/stepper/stepper.ts new file mode 100644 index 0000000..af56031 --- /dev/null +++ b/src/app/shared/components/stepper/stepper.ts @@ -0,0 +1,20 @@ +import { Component, Input } from "@angular/core"; +import { Check, Circle, LucideAngularModule } from "lucide-angular"; + +export type Steps = { + label: string; +}; + +@Component({ + selector: "app-stepper", + imports: [LucideAngularModule], + templateUrl: "./stepper.html", + styleUrl: "./stepper.css", +}) +export class Stepper { + @Input() currentStep: number = 0; + @Input() steps: Steps[] = []; + + CheckIcon = Check; + CirecleIcon = Circle; +} diff --git a/src/styles.css b/src/styles.css index 0f9fd15..09b81b8 100644 --- a/src/styles.css +++ b/src/styles.css @@ -13,7 +13,7 @@ } body { - @apply bg-gray-100 antialiased m-0; + @apply bg-gray-50 antialiased m-0; } .wrapper { @@ -33,11 +33,11 @@ body { } .btn-primary { - @apply text-blue-100 bg-blue-600 border border-b-3 border-blue-900 hover:bg-blue-700; + @apply text-blue-100 bg-blue-600 border-b border-b-3 border-blue-900 hover:bg-blue-700; } .card { - @apply bg-gray-50 rounded-xl border border-gray-300 hover:border-gray-400 p-4 hover:shadow-xl transition-all duration-300 ease-in-out; + @apply bg-white rounded-xl border-2 border-gray-200 p-4; } .fieldset {