Merge pull request #18 from jetbrains-academy/frontend

Add the Frontend section

Author: kochaika

.courseignore

@@ -0,0 +1,2 @@
+syntax: regexp
+^\.git/

.gitignore

@@ -73,7 +73,7 @@ web_modules/
 .yarn-integrity
 
 # dotenv environment variable files
-.env
+#.env
 .env.development.local
 .env.test.local
 .env.production.local

Frontend/BackendConnection/lesson-info.yaml

@@ -0,0 +1,9 @@
+type: framework
+custom_name: Backend Connection
+content:
+  - lesson_overview
+  - register_form
+  - login_form
+  - routing_update
+  - retrieving_messages
+  - sending_messages

Frontend/BackendConnection/lesson_overview/task-info.yaml

@@ -0,0 +1,6 @@
+type: theory
+custom_name: Lesson overview
+files:
+  - name: task.js
+    visible: true
+    propagatable: false

Frontend/BackendConnection/lesson_overview/task.js

@@ -0,0 +1,19 @@
+We've already had some practice with React, so now it's time to get started on our project:
+specifically, setting up interaction with the backend.
+
+In this lesson, you will learn how to:
+- Communicate with the backend using a REST API.
+- Handle authentication tokens on the frontend.
+
+### Project structure
+Next in the course, you will encounter the familiar project structure from the backend part of the course:
+```text
+.
+├── backend/ 
+├── frontend/
+└── package.json  // project configuration file
+```
+
+### Backend API
+To remind yourself about the backend API, take a look at the [Backend connection](course://Frontend/Introduction/backend_connection) task described in the Introduction lesson.
+Feel free to look into the backend source code if you need it.

Frontend/BackendConnection/lesson_overview/task.md

@@ -0,0 +1 @@
+JWT_SECRET=testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttestte==

Frontend/BackendConnection/login_form/backend/.env

@@ -0,0 +1,107 @@
+import request from 'supertest';
+import { httpServer } from '../src/index.js';
+import {dbReset} from "../src/data/dataServices.js";
+
+describe('Authentication API', () => {
+
+    afterAll((done) => {
+        httpServer.close(done);
+    });
+
+    describe('POST /api/auth/register', () => {
+        beforeEach(async() => {
+            await dbReset();
+
+        });
+
+        it('should register a new user successfully', async () => {
+            const response = await request(httpServer)
+                .post('/api/auth/register')
+                .send({
+                    username: 'testuser',
+                    password: 'password123'
+                })
+                .timeout(4000);
+
+            expect(response.status).toBe(201);
+            expect(response.body).toHaveProperty('username', 'testuser');
+        });
+
+        it('should not allow duplicate usernames', async () => {
+            // Register first user
+            await request(httpServer)
+                .post('/api/auth/register')
+                .send({
+                    username: 'testuser',
+                    password: 'password123'
+                })
+                .timeout(4000);
+
+            // Try to register the same username
+            const response = await request(httpServer)
+                .post('/api/auth/register')
+                .send({
+                    username: 'testuser',
+                    password: 'differentpassword'
+                })
+                .timeout(4000);
+
+            expect(response.status).toBe(409);
+            expect(response.body).toHaveProperty('message', 'Username already exists');
+        });
+    });
+
+    describe('POST /api/auth/login', () => {
+        beforeAll(async () => {
+            await dbReset();
+            // Create a test user before login test
+            await request(httpServer)
+                .post('/api/auth/register')
+                .send({
+                    username: 'testuser',
+                    password: 'password123'
+                })
+                .timeout(4000);
+        });
+
+        it('should log in successfully with correct credentials', async () => {
+            const response = await request(httpServer)
+                .post('/api/auth/login')
+                .send({
+                    username: 'testuser',
+                    password: 'password123'
+                })
+                .timeout(4000);
+
+            expect(response.status).toBe(200);
+            expect(response.body).toHaveProperty('username', 'testuser');
+            expect(response.body).toHaveProperty('token');
+        });
+
+        it('should fail with incorrect password', async () => {
+            const response = await request(httpServer)
+                .post('/api/auth/login')
+                .send({
+                    username: 'testuser',
+                    password: 'wrongpassword'
+                })
+                .timeout(4000);
+
+            expect(response.status).toBe(401);
+            expect(response.body).toHaveProperty('message', 'Invalid username or password');
+        });
+
+        it('should fail with non-existent username', async () => {
+            const response = await request(httpServer)
+                .post('/api/auth/login')
+                .send({
+                    username: 'nonexistent',
+                    password: 'password123'
+                })
+                .timeout(4000);
+
+            expect(response.status).toBe(401);
+            expect(response.body).toHaveProperty('message', 'Invalid username or password');
+        });
+    });
+});

Frontend/BackendConnection/login_form/backend/__tests__/auth.test.js

@@ -0,0 +1,80 @@
+import {dbReset, userService, messageService} from '../src/data/dataServices.js';
+
+describe('Test database-backed data layer', () => {
+    beforeEach(async () => {
+        await dbReset();
+    });
+
+    describe('Test userService', () => {
+        it('Test new user creation', async () => {
+            const newUser = await userService.createUser('Tom', 'password123');
+            expect(newUser.username).toBe('Tom');
+        });
+
+        it('Test existing user creation', async () => {
+            await userService.createUser('John', '1234567890');
+
+            await expect(userService.createUser('John', 'newPassword'))
+                .rejects
+                .toThrow('Username already exists');
+        });
+
+        it('Test get existing user', async () => {
+            const existingUser = await userService.createUser('Alice', 'mypassword');
+            const fetchedUser = await userService.getUser('Alice');
+            expect(fetchedUser.username).toEqual(existingUser.username);
+        });
+
+        it('Test get non-existing user', async () => {
+            const nonExistentUser = await userService.getUser('NonExistentUser');
+            expect(nonExistentUser).toBeUndefined();
+        });
+    });
+
+    describe('Test messageService', () => {
+        it('Test add new message', async () => {
+            const message = await messageService.addMessage('Alice', 'Test message');
+            expect(message.username).toBe('Alice');
+            expect(message.content).toBe('Test message');
+            expect(message.id).toBeDefined();
+        });
+
+        it('Test get messages', async () => {
+            await messageService.addMessage('Tom', 'Message 1');
+            await messageService.addMessage('John', 'Message 2');
+
+            const messages = await messageService.getMessages();
+            expect(messages.length).toBe(2);
+            expect(messages[0].content).toBe('Message 1');
+            expect(messages[1].content).toBe('Message 2');
+        });
+
+        xit('Test delete the only message', async () => {
+            const newMessage = await messageService.addMessage('Alice', 'Single message');
+            const result = await messageService.deleteMessage(newMessage.id);
+            expect(result).toBe(true);
+
+            const messages = await messageService.getMessages();
+            expect(messages.length).toBe(0);
+        });
+
+        xit('Test delete message with others', async () => {
+            await messageService.addMessage('Alice', 'Message A');
+            const messageToDelete = await messageService.addMessage('Alice', 'Message B');
+            await messageService.addMessage('Alice', 'Message C');
+
+            const result = await messageService.deleteMessage(messageToDelete.id);
+            expect(result).toBe(true);
+
+            const messages = await messageService.getMessages();
+            expect(messages.length).toBe(2);
+            expect(messages[0].content).toBe('Message A');
+            expect(messages[1].content).toBe('Message C');
+        });
+
+        xit('Test delete non-existing message', async () => {
+            const result = await messageService.deleteMessage(999999);
+            expect(result).toBe(false);
+        });
+    });
+});