diff --git a/client/src/app/screens/screen-profile/screen-profile.ts b/client/src/app/screens/screen-profile/screen-profile.ts index f7b3d96..6d0bef7 100644 --- a/client/src/app/screens/screen-profile/screen-profile.ts +++ b/client/src/app/screens/screen-profile/screen-profile.ts @@ -1,5 +1,7 @@ import { CommonModule, CurrencyPipe, DatePipe } from '@angular/common'; -import { Component } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; +import { APIService } from '../../services/api'; +import { Transaction } from '@shared/interfaces/transaction'; @Component({ selector: 'app-screen-profile', @@ -7,14 +9,22 @@ import { Component } from '@angular/core'; templateUrl: './screen-profile.html', styleUrl: './screen-profile.less', }) -export class ScreenProfile { - username = 'John Doe'; +export class ScreenProfile implements OnInit{ + username = 'John Doe'; email = 'john.doe@example.com'; + transactions!: Transaction[]; + + constructor(private api: APIService){} + + ngOnInit(): void { + this.api.getTransactions().subscribe({ + next: (transactions) => { + this.transactions = transactions; + }, + error: (err) => { + console.error('Error fetching transactions:', err); + }, + }) + } - transactions = [ - { partner: 'Alice Smith', amount: 50.00, date: new Date('2026-03-01'), type: 'Received' }, - { partner: 'Bob Johnson', amount: -25.50, date: new Date('2026-02-28'), type: 'Sent' }, - { partner: 'Charlie Brown', amount: 75.25, date: new Date('2026-02-27'), type: 'Received' }, - { partner: 'Diana Prince', amount: -100.00, date: new Date('2026-02-25'), type: 'Sent' }, - ]; } diff --git a/client/src/app/services/api.spec.ts b/client/src/app/services/api.spec.ts new file mode 100644 index 0000000..14e2007 --- /dev/null +++ b/client/src/app/services/api.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { APIService } from './api'; + +describe('Api', () => { + let service: APIService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(APIService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/client/src/app/services/api.ts b/client/src/app/services/api.ts new file mode 100644 index 0000000..d46f016 --- /dev/null +++ b/client/src/app/services/api.ts @@ -0,0 +1,17 @@ +import { HttpClient } from '@angular/common/http'; +import { Injectable } from '@angular/core'; +import { Observable } from 'rxjs'; +import { Transaction } from '@shared/interfaces/transaction' + +@Injectable({ + providedIn: 'root', +}) +export class APIService { + private apiUrl = 'http://localhost:3000/api' + + constructor(private http: HttpClient){} + + getTransactions(): Observable{ + return this.http.get(this.apiUrl + '/transactions'); + } +} diff --git a/server/src/index.ts b/server/src/index.ts index 36ae1a6..ec51312 100644 --- a/server/src/index.ts +++ b/server/src/index.ts @@ -1,6 +1,7 @@ import express, { Express, Request, Response } from "express"; import cors from "cors"; import * as dotenv from "dotenv"; +import transactionsRouter from './routes/transactions'; dotenv.config(); @@ -13,6 +14,8 @@ app.get("/api/health", (req: Request, res: Response) => { res.json({ status: "OK" }); }); +app.use('/api/transactions', transactionsRouter); + const PORT: number = parseInt(process.env.PORT as string) || 3000; app.listen(PORT, () => { console.log(`Server running on port ${PORT}`); diff --git a/server/src/routes/transactions.ts b/server/src/routes/transactions.ts new file mode 100644 index 0000000..8c780a3 --- /dev/null +++ b/server/src/routes/transactions.ts @@ -0,0 +1,17 @@ +import express from 'express'; +import { Transaction } from "@shared/interfaces/transaction" + +const router = express.Router(); + +// Mock data +const mockTransactions: Transaction[] = [ + { id: '1', partner: 'Alice Smith', amount: 50.00, date: new Date('2026-03-01'), type: 'Received' }, + { id: '2', partner: 'Bob Johnson', amount: -25.50, date: new Date('2026-02-28'), type: 'Sent' }, +]; + +// GET /api/transactions +router.get('/', (req, res) => { + res.json(mockTransactions); +}); + +export default router; diff --git a/shared/interfaces/transaction.ts b/shared/interfaces/transaction.ts new file mode 100644 index 0000000..d09c625 --- /dev/null +++ b/shared/interfaces/transaction.ts @@ -0,0 +1,7 @@ +export interface Transaction { + id: string; + partner: string; + amount: number; + date: Date; + type: 'Sent' | 'Received'; +} \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json index 666599c..fe502db 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -8,7 +8,10 @@ "moduleResolution": "bundler", "target": "ES2022", "module": "es2022", - "lib": ["es2022", "dom"] + "lib": ["es2022", "dom"], + "paths": { + "@shared/*": ["shared/*"] + } }, "exclude": ["node_modules"] }