Update '.drone.yml'

.drone.yml

@@ -8,6 +8,8 @@ steps:
     commands:
       - cd src
       - npm install
+      #- npm test
+      #- npm run coverage
       - sonar-scanner -Dsonar.projectKey=JokesAppReact_A-PE -Dsonar.sources=. -Dsonar.host.url=$${PLUGIN_SONAR_HOST} 
         -Dsonar.login=$${PLUGIN_SONAR_TOKEN}
     secrets: [ SECRET_SONAR_LOGIN ]

src/components/JokeDetailTest.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render, fireEvent } from '@testing-library/react-native';
-import JokeDetail from '../path/to/JokeDetail';
+import JokeDetail from './JokeDetail';
-import {describe} from "@jest/globals"; // Remplacez le chemin par le bon chemin
+import {describe, expect, test} from "@jest/globals";
 
 describe('JokeDetail Component', () => {
     const sampleJoke = {
@@ -49,6 +49,6 @@ describe('JokeDetail Component', () => {
         const deleteButton = getByTestId('delete-button');
         fireEvent.press(deleteButton);
         expect(deleteMock).toHaveBeenCalledWith(customJoke.id);
-        expect(dispatchMock).toHaveBeenCalledTimes(2); // Assuming one dispatch for delete and one for update list
+        expect(dispatchMock).toHaveBeenCalledTimes(2);
     });
 });

src/components/JokeHomeSquareTest.test.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import JokeHomeSquare from './JokeHomeSquare';
+import { SampleJoke } from '../model/SampleJoke';
+import { CustomJoke } from '../model/CustomJoke';
+import {describe, expect, it} from "@jest/globals";
+
+const sampleJoke = new SampleJoke(1, 'Type', 'Setup', 'Image', 'Punchline');
+const customJoke = new CustomJoke('ID', 'Type', 'Setup', 'Image', 'Punchline');
+
+describe('JokeHomeSquare Component', () => {
+    it('renders correctly with SampleJoke', () => {
+        const { getByText, getByTestId } = render(<JokeHomeSquare joke={sampleJoke} />);
+
+        expect(getByTestId('topBackground')).toBeTruthy();
+        expect(getByTestId('bottomBackground')).toBeTruthy();
+        expect(getByTestId('jokeImage')).toBeTruthy();
+        expect(getByText('Résumé de la blague')).toBeTruthy();
+        expect(getByText('Type, Punchline')).toBeTruthy();
+    });
+
+    it('renders correctly with CustomJoke', () => {
+        const { getByText, getByTestId } = render(<JokeHomeSquare joke={customJoke} />);
+
+        expect(getByTestId('topBackground')).toBeTruthy();
+        expect(getByTestId('bottomBackground')).toBeTruthy();
+        expect(getByTestId('jokeImage')).toBeTruthy();
+        expect(getByText('Résumé de la blague')).toBeTruthy();
+        expect(getByText('Type, Punchline')).toBeTruthy();
+    });
+});

src/components/JokeItemTest.test.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import JokeItem from './JokeItem';
+import { SampleJoke } from '../model/SampleJoke';
+import { CustomJoke } from '../model/CustomJoke';
+import {describe, expect, it} from "@jest/globals";
+
+const sampleJoke = new SampleJoke(1, 'Type', 'Setup', 'Image', 'Punchline');
+const customJoke = new CustomJoke('ID', 'Type', 'Setup', 'Image', 'Punchline');
+
+describe('JokeItem Component', () => {
+    it('renders correctly with SampleJoke', () => {
+        const { getByText, getByTestId } = render(<JokeItem joke={sampleJoke} />);
+
+        expect(getByTestId('color')).toBeTruthy();
+        expect(getByTestId('jokeImage')).toBeTruthy();
+        expect(getByText('Résumé de la blague')).toBeTruthy();
+        expect(getByText('Type, Punchline')).toBeTruthy();
+        expect(getByText('Type')).toBeTruthy();
+    });
+
+    it('renders correctly with CustomJoke', () => {
+        const { getByText, getByTestId } = render(<JokeItem joke={customJoke} />);
+
+        expect(getByTestId('color')).toBeTruthy();
+        expect(getByTestId('jokeImage')).toBeTruthy();
+        expect(getByText('Résumé de la blague')).toBeTruthy();
+        expect(getByText('Type, Punchline')).toBeTruthy();
+        expect(getByText('Type')).toBeTruthy();
+    });
+});

src/components/JokeItems.tsx

@@ -18,7 +18,7 @@ export default function JokeItems(props: JokeListItemProps) {
             data={props.jokes}
             keyExtractor={(item) => item.id.toString()}
             renderItem={
-                ({ item }: { item: CustomJoke | SampleJoke }) => (
+                ({item}: { item: CustomJoke | SampleJoke }) => (
                     // @ts-ignore
                     <TouchableHighlight onPress={() => navigation.navigate("JokeDetails", {"idJoke": item.id})}>
                         <JokeItem joke={item}/>
@@ -28,8 +28,3 @@ export default function JokeItems(props: JokeListItemProps) {
         />
     );
 }
-
-
-const styles = StyleSheet.create({
-
-})

src/components/JokesHomeSquareTest.test.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import JokesHomeSquare from './JokesHomeSquare';
+import { SampleJoke } from '../model/SampleJoke';
+import { CustomJoke } from '../model/CustomJoke';
+import {describe, expect, it} from "@jest/globals";
+
+const sampleJokes = [
+    new SampleJoke(1, 'Type1', 'Setup1', 'Image1', 'Punchline1'),
+    new SampleJoke(2, 'Type2', 'Setup2', 'Image2', 'Punchline2'),
+];
+const customJokes = [
+    new CustomJoke('ID1', 'Type1', 'Setup1', 'Image1', 'Punchline1'),
+    new CustomJoke('ID2', 'Type2', 'Setup2', 'Image2', 'Punchline2'),
+];
+
+describe('JokesHomeSquare Component', () => {
+    it('renders correctly with SampleJokes', () => {
+        const { getAllByTestId } = render(<JokesHomeSquare jokes={sampleJokes} />);
+
+        expect(getAllByTestId('jokeHomeSquare')).toHaveLength(sampleJokes.length);
+    });
+
+    it('renders correctly with CustomJokes', () => {
+        const { getAllByTestId } = render(<JokesHomeSquare jokes={customJokes} />);
+
+        expect(getAllByTestId('jokeHomeSquare')).toHaveLength(customJokes.length);
+    });
+});

src/components/JokesItemTest.test.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import JokeItems from './JokeItems';
+import { SampleJoke } from '../model/SampleJoke';
+import { CustomJoke } from '../model/CustomJoke';
+import {describe, expect, it} from "@jest/globals";
+
+const sampleJokes = [
+    new SampleJoke(1, 'Type1', 'Setup1', 'Image1', 'Punchline1'),
+    new SampleJoke(2, 'Type2', 'Setup2', 'Image2', 'Punchline2'),
+];
+const customJokes = [
+    new CustomJoke('ID1', 'Type1', 'Setup1', 'Image1', 'Punchline1'),
+    new CustomJoke('ID2', 'Type2', 'Setup2', 'Image2', 'Punchline2'),
+];
+
+describe('JokeItems Component', () => {
+    it('renders correctly with SampleJokes', () => {
+        const { getAllByTestId } = render(<JokeItems jokes={sampleJokes} />);
+
+        expect(getAllByTestId('jokeItem')).toHaveLength(sampleJokes.length);
+    });
+
+    it('renders correctly with CustomJokes', () => {
+        const { getAllByTestId } = render(<JokeItems jokes={customJokes} />);
+
+        expect(getAllByTestId('jokeItem')).toHaveLength(customJokes.length);
+    });
+});

src/model/CustomJokeTest.test.js

@@ -1,5 +1,5 @@
 import { CustomJoke } from './CustomJoke';
-import {describe, expect, test} from "@jest/globals"; // Remplacez le chemin par le bon chemin
+import {describe, expect, test} from "@jest/globals";
 
 describe('CustomJoke Class', () => {
     const id = '1';

src/model/JokeFactoryTest.test.js

@@ -0,0 +1,44 @@
+import { JokeFactory } from './JokeFactory';
+import { CustomJoke } from './CustomJoke';
+import { SampleJoke } from './SampleJoke';
+import {describe, expect, it} from "@jest/globals";
+
+describe('JokeFactory', () => {
+    describe('createCustomJokes', () => {
+        it('should create CustomJoke instances from JSON array', () => {
+            const jsonArray = '[{"id": "1", "type": "Type1", "setup": "Setup1", "punchline": "Punchline1", "image": "Image1"}, {"id": "2", "type": "Type2", "setup": "Setup2", "punchline": "Punchline2", "image": "Image2"}]';
+            const customJokes: CustomJoke[] = JokeFactory.createCustomJokes(jsonArray);
+
+            expect(customJokes).toHaveLength(2);
+            expect(customJokes[0]).toBeInstanceOf(CustomJoke);
+            expect(customJokes[0].id).toBe('1');
+            expect(customJokes[0].type).toBe('Type1');
+        });
+
+        it('should return an empty array if JSON array is empty', () => {
+            const jsonArray = '[]';
+            const customJokes: CustomJoke[] = JokeFactory.createCustomJokes(jsonArray);
+
+            expect(customJokes).toHaveLength(0);
+        });
+    });
+
+    describe('createSampleJokes', () => {
+        it('should create SampleJoke instances from JSON array', () => {
+            const jsonArray = '[{"id": 1, "type": "Type1", "setup": "Setup1", "punchline": "Punchline1", "image": "Image1"}, {"id": 2, "type": "Type2", "setup": "Setup2", "punchline": "Punchline2", "image": "Image2"}]';
+            const sampleJokes: SampleJoke[] = JokeFactory.createSampleJokes(jsonArray);
+
+            expect(sampleJokes).toHaveLength(2);
+            expect(sampleJokes[0]).toBeInstanceOf(SampleJoke);
+            expect(sampleJokes[0].id).toBe(1);
+            expect(sampleJokes[0].type).toBe('Type1');
+        });
+
+        it('should return an empty array if JSON array is empty', () => {
+            const jsonArray = '[]';
+            const sampleJokes: SampleJoke[] = JokeFactory.createSampleJokes(jsonArray);
+
+            expect(sampleJokes).toHaveLength(0);
+        });
+    });
+});

src/model/JokeTest.test.js

@@ -1,14 +1,12 @@
 const { Joke } = require('./Joke');
 const {expect, it, beforeEach, describe} = require("@jest/globals");
 
-// Mock class extending the abstract Joke class
 class MockJoke extends Joke {
     constructor(type, setup, punchline, image) {
         super(type, setup, punchline, image);
     }
 }
 
-// Test the Joke class
 describe('Joke Class', () => {
     let joke;
 
@@ -16,7 +14,6 @@ describe('Joke Class', () => {
         joke = new MockJoke('type', 'setup', 'punchline', 'image');
     });
 
-    // Test the constructor
     it('should create a new Joke object', () => {
         expect(joke).toBeDefined();
         expect(joke.type).toBe('type');
@@ -25,35 +22,29 @@ describe('Joke Class', () => {
         expect(joke.image).toBe('image');
     });
 
-    // Test the summary() method
     it('should return a summary of the joke', () => {
         expect(joke.summary()).toBe('punchline');
     });
 
-    // Test the description() method
     it('should return a textual description of the joke', () => {
         expect(joke.description()).toBe('type, punchline');
     });
 
-    // Test setting and getting the type
     it('should set and get the type correctly', () => {
         joke.type = 'newType';
         expect(joke.type).toBe('newType');
     });
 
-    // Test setting and getting the setup
     it('should set and get the setup correctly', () => {
         joke.setup = 'newSetup';
         expect(joke.setup).toBe('newSetup');
     });
 
-    // Test setting and getting the punchline
     it('should set and get the punchline correctly', () => {
         joke.punchline = 'newPunchline';
         expect(joke.punchline).toBe('newPunchline');
     });
 
-    // Test setting and getting the image
     it('should set and get the image correctly', () => {
         joke.image = 'newImage';
         expect(joke.image).toBe('newImage');

src/model/SampleJokeTest.test.js

@@ -0,0 +1,47 @@
+import { SampleJoke } from './SampleJoke';
+import {describe, expect, it} from "@jest/globals";
+
+describe('SampleJoke', () => {
+    it('should create a SampleJoke instance with provided values', () => {
+        const id = 1;
+        const type = 'Type';
+        const setup = 'Setup';
+        const image = 'Image';
+        const punchline = 'Punchline';
+
+        const sampleJoke = new SampleJoke(id, type, setup, image, punchline);
+
+        expect(sampleJoke).toBeInstanceOf(SampleJoke);
+        expect(sampleJoke.id).toBe(id);
+        expect(sampleJoke.type).toBe(type);
+        expect(sampleJoke.setup).toBe(setup);
+        expect(sampleJoke.image).toBe(image);
+        expect(sampleJoke.punchline).toBe(punchline);
+    });
+
+    it('should create a SampleJoke instance with default punchline if not provided', () => {
+        const id = 1;
+        const type = 'Type';
+        const setup = 'Setup';
+        const image = 'Image';
+
+        const sampleJoke = new SampleJoke(id, type, setup, image);
+
+        expect(sampleJoke).toBeInstanceOf(SampleJoke);
+        expect(sampleJoke.id).toBe(id);
+        expect(sampleJoke.type).toBe(type);
+        expect(sampleJoke.setup).toBe(setup);
+        expect(sampleJoke.image).toBe(image);
+        expect(sampleJoke.punchline).toBe('');
+    });
+
+    it('should correctly modify the id', () => {
+        const sampleJoke = new SampleJoke(1, 'Type', 'Setup', 'Image');
+
+        expect(sampleJoke.id).toBe(1);
+
+        sampleJoke.id = 2;
+
+        expect(sampleJoke.id).toBe(2);
+    });
+});

src/navigation/NavigationBar.tsx

@@ -1,4 +1,4 @@
-import {DarkTheme, DefaultTheme, NavigationContainer, Theme} from '@react-navigation/native';
+import {NavigationContainer, Theme} from '@react-navigation/native';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import {Image, View} from 'react-native';
 
@@ -7,7 +7,7 @@ import Favorites from "../screens/Favorites";
 import Add from "../screens/AddScreen";
 import Settings from "../screens/Settings";
 
-import {darksalmonColor, greyColor, indigoColor} from "../assets/Theme";
+import {darksalmonColor, DarkTheme, greyColor, indigoColor, LightTheme} from "../assets/Theme";
 import StackNavigation from "./StackNavigation";
 import {useEffect, useState} from "react";
 import {getTheme} from "../redux/thunk/ThemeThunk";
@@ -22,7 +22,7 @@ export default function NavigationBar() {
     const favoriteIcon = require("../assets/favorite_icon.png");
     const settingsIcon = require("../assets/settings_icon.png");
 
-    const [themes, setTheme] = useState<Theme>(DefaultTheme);
+    const [themes, setTheme] = useState<Theme>(LightTheme);
 
     useEffect(() => {
         const fetchTheme = async () => {
@@ -38,7 +38,7 @@ export default function NavigationBar() {
     }
 
     return (
-        <NavigationContainer theme={ themes.dark === false ? DefaultTheme :  DarkTheme}>
+        <NavigationContainer theme={ themes.dark === false ? LightTheme :  DarkTheme}>
             <BottomTabNavigator.Navigator initialRouteName="Accueil"
                                           screenOptions={{
                                               headerStyle: {

src/navigation/NavigationBarTest.test.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import NavigationBar from './NavigationBar';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<NavigationBar />', () => {
+    it('renders correctly', () => {
+        const { getByText, getByA11yLabel } = render(<NavigationBar />);
+
+        expect(getByText('Accueil')).toBeTruthy();
+        expect(getByText('Catalogue')).toBeTruthy();
+        expect(getByText("Ajout d'une blague")).toBeTruthy();
+        expect(getByText('Favoris')).toBeTruthy();
+        expect(getByText('Parametres')).toBeTruthy();
+
+        expect(getByA11yLabel('Accueil icon')).toBeTruthy();
+        expect(getByA11yLabel('Catalogue icon')).toBeTruthy();
+        expect(getByA11yLabel('Ajout d\'une blague icon')).toBeTruthy();
+        expect(getByA11yLabel('Favoris icon')).toBeTruthy();
+        expect(getByA11yLabel('Parametres icon')).toBeTruthy();
+    });
+});

src/navigation/StackNavigationTest.test.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import StackNavigation from './StackNavigation';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<StackNavigation />', () => {
+    it('renders correctly', () => {
+        const { getByText } = render(<StackNavigation />);
+
+        expect(getByText('catalogue')).toBeTruthy();
+        expect(getByText('JokeDetails')).toBeTruthy();
+
+        const header = getByText('catalogue').parentNode;
+        expect(header).toHaveStyle({
+            backgroundColor: 'indigo',
+        });
+
+        const headerTitle = getByText('catalogue');
+        expect(headerTitle).toHaveStyle({
+            color: 'darksalmon',
+            fontSize: 24,
+            textAlign: 'center',
+            paddingBottom: 30,
+        });
+    });
+});

src/package.json

@@ -8,7 +8,8 @@
     "android": "expo start --android",
     "ios": "expo start --ios",
     "web": "expo start --web",
-    "test": "jest"
+    "test": "jest",
+    "coverage": "jest --coverage"
   },
   "dependencies": {
     "@jest/globals": "^29.7.0",

src/screens/AddScreen.tsx

@@ -1,12 +1,9 @@
-import { customJokeStub } from '../data/stub/CustomJokeStub';
-import { sampleJokeStub } from '../data/stub/SampleJokeStub';
-import JokeItems from "../components/JokeItems";
 import '../types/extension';
-import {useDispatch, useSelector} from "react-redux";
+import {useDispatch} from "react-redux";
-import {Image, StyleSheet, Text, TextInput, TouchableOpacity, View} from "react-native";
+import {StyleSheet, Text, TextInput, TouchableOpacity, View} from "react-native";
-import {darksalmonColor, greyColor, indigoColor, purpleColor, whiteColor} from "../assets/Theme";
+import {indigoColor, whiteColor} from "../assets/Theme";
-import {getCustomJokesList, getSampleJokesList} from "../redux/thunk/GetThunk";
+import {getCustomJokesList} from "../redux/thunk/GetThunk";
-import React, {useEffect} from "react";
+import React from "react";
 import {postCustomJoke} from "../redux/thunk/PostThunk";
 import {useTheme} from "@react-navigation/native";
 

src/screens/AddScreenTest.test.js

@@ -0,0 +1,66 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import AddScreen, { themeSettings } from './AddScreen';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<AddScreen />', () => {
+    it('renders correctly', () => {
+        const { getByText, getByPlaceholderText } = render(
+            <Provider store={store}>
+                <AddScreen />
+            </Provider>
+        );
+
+        expect(getByText('Blague')).toBeTruthy();
+        expect(getByPlaceholderText('Inserez votre blague')).toBeTruthy();
+        expect(getByText('Chute de la blague')).toBeTruthy();
+        expect(getByPlaceholderText('Inserez votre blague')).toBeTruthy();
+        expect(getByText('Catégorie')).toBeTruthy();
+        expect(getByPlaceholderText('Inserez votre blague')).toBeTruthy();
+        expect(getByText('CRÉER')).toBeTruthy();
+        expect(getByText('EFFACER')).toBeTruthy();
+    });
+
+    it('handles text input correctly', () => {
+        const { getByPlaceholderText } = render(
+            <Provider store={store}>
+                <AddScreen />
+            </Provider>
+        );
+
+        const jokeInput = getByPlaceholderText('Inserez votre blague');
+        const downgradeInput = getByPlaceholderText('Inserez votre blague');
+        const categoryInput = getByPlaceholderText('Inserez votre blague');
+
+        fireEvent.changeText(jokeInput, 'This is a joke');
+        fireEvent.changeText(downgradeInput, 'This is a downgrade');
+        fireEvent.changeText(categoryInput, 'Funny');
+
+        expect(jokeInput.props.value).toBe('This is a joke');
+        expect(downgradeInput.props.value).toBe('This is a downgrade');
+        expect(categoryInput.props.value).toBe('Funny');
+    });
+
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles for light theme', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+                card: 'lightgrey',
+                text: 'black',
+                primary: 'blue',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+        expect(styles.textInput.backgroundColor).toBe('lightgrey');
+        expect(styles.text.color).toBe('black');
+        expect(styles.eraseButton.backgroundColor).toBe('blue');
+        expect(styles.createButton.backgroundColor).toBe('blue');
+    });
+});

src/screens/Catalogue.tsx

@@ -1,7 +1,6 @@
 import JokeItems from "../components/JokeItems";
 import '../types/extension';
 import {Image, SafeAreaView, StyleSheet, Text, TouchableOpacity, View} from "react-native";
-import {darksalmonColor, purpleColor, whiteColor} from "../assets/Theme";
 import {useDispatch, useSelector} from "react-redux";
 import React, {useEffect, useState} from "react";
 import {getCustomJokesList, getSampleJokesList} from "../redux/thunk/GetThunk";

src/screens/CatalogueTest.test.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import Catalogue, { themeSettings } from './Catalogue';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<Catalogue />', () => {
+    it('renders correctly', () => {
+        const { getByText, getByTestId } = render(
+            <Provider store={store}>
+                <Catalogue />
+            </Provider>
+        );
+
+        expect(getByText('Afficher les exemples')).toBeTruthy();
+        expect(getByTestId('toggle-button')).toBeTruthy();
+    });
+
+    it('toggles jokes display correctly', () => {
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <Catalogue />
+            </Provider>
+        );
+
+        const toggleButton = getByTestId('toggle-button');
+
+        fireEvent.press(toggleButton);
+
+        expect(toggleButton.props.children.props.source).toEqual(hideEye);
+
+        fireEvent.press(toggleButton);
+
+        expect(toggleButton.props.children.props.source).toEqual(eye);
+    });
+
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles for light theme', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+                primary: 'blue',
+                text: 'black',
+                notification: 'grey',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+        expect(styles.Button.backgroundColor).toBe('blue');
+        expect(styles.TextButton.color).toBe('black');
+        expect(styles.imageButton.tintColor).toBe('grey');
+    });
+
+});

src/screens/Favorites.tsx

@@ -1,7 +1,6 @@
 import JokeItems from "../components/JokeItems";
 import '../types/extension';
 import {Image, SafeAreaView, StyleSheet, Text, TouchableOpacity, View} from "react-native";
-import {darksalmonColor, purpleColor, whiteColor} from "../assets/Theme";
 import {useDispatch, useSelector} from "react-redux";
 import React, {useEffect, useState} from "react";
 import {getCustomJokesList, getSampleJokesList} from "../redux/thunk/GetThunk";

src/screens/FavoritesTest.test.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import Favorites, { themeSettings } from './Favorites';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals"; // Assuming you have a configured Redux store
+
+describe('<Favorites />', () => {
+    it('renders correctly', () => {
+        const { getByText, getByTestId } = render(
+            <Provider store={store}>
+                <Favorites />
+            </Provider>
+        );
+
+        expect(getByText('Afficher les exemples')).toBeTruthy();
+        expect(getByTestId('toggle-button')).toBeTruthy();
+    });
+
+    it('toggles jokes display correctly', () => {
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <Favorites />
+            </Provider>
+        );
+
+        const toggleButton = getByTestId('toggle-button');
+
+        fireEvent.press(toggleButton);
+
+        expect(toggleButton.props.children.props.source).toEqual(hideEye);
+
+        fireEvent.press(toggleButton);
+
+        expect(toggleButton.props.children.props.source).toEqual(eye);
+    });
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles for light theme', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+                primary: 'blue',
+                text: 'black',
+                notification: 'grey',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+        expect(styles.Button.backgroundColor).toBe('white');
+        expect(styles.TextButton.color).toBe('grey');
+        expect(styles.imageButton.tintColor).toBe('grey');
+    });
+
+});

src/screens/HomeScreen.tsx

@@ -1,15 +1,13 @@
 import {Image, StyleSheet, Text, View} from 'react-native';
 import '../types/extension';
-import {darksalmonColor, purpleColor, whiteColor} from "../assets/Theme";
 import JokesHomeSquare from "../components/JokesHomeSquare";
 import Categs from "../components/Categs";
 import {useDispatch, useSelector} from "react-redux";
 import {useEffect} from "react";
 import {getCategoriesList, getLastSampleJokesList} from "../redux/thunk/GetThunk";
 import {useTheme} from "@react-navigation/native";
-import styleToBarStyle from "expo-status-bar/build/styleToBarStyle";
 
-export default function Catalogue() {
+export default function HomeScreen() {
     // @ts-ignore
     const allJokes = useSelector(state => state.sampleReducer.jokes);
     // @ts-ignore

src/screens/HomeScreenTest.test.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import HomeScreen, { themeSettings } from './HomeScreen';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<HomeScreen />', () => {
+    it('renders correctly', () => {
+        const { getByText, getByTestId } = render(
+            <Provider store={store}>
+                <HomeScreen />
+            </Provider>
+        );
+
+        expect(getByText('Chat C\'est Drole')).toBeTruthy();
+        expect(getByText('Dernières blagues')).toBeTruthy();
+        expect(getByText('Top Categories')).toBeTruthy();
+        expect(getByTestId('jokes-home-square')).toBeTruthy();
+        expect(getByTestId('categs')).toBeTruthy();
+    });
+
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles for light theme', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+                text: 'black',
+                border: 'grey',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+        expect(styles.textAccueil.color).toBe('black');
+        expect(styles.textLastJokes.color).toBe('grey');
+    });
+
+});

src/screens/JokeDetailScreenTest.test.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import JokeDetailsScreen, { themeSettings } from './JokeDetailsScreen';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<JokeDetailsScreen />', () => {
+    it('renders correctly for sample joke', () => {
+        const mockRoute = {
+            params: {
+                idJoke: 1,
+            },
+        };
+
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <JokeDetailsScreen route={mockRoute} />
+            </Provider>
+        );
+
+        expect(getByTestId('joke-detail')).toBeTruthy();
+    });
+
+    it('renders correctly for custom joke', () => {
+        const mockRoute = {
+            params: {
+                idJoke: 1,
+            },
+        };
+
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <JokeDetailsScreen route={mockRoute} />
+            </Provider>
+        );
+
+        expect(getByTestId('joke-detail')).toBeTruthy();
+    });
+
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+    });
+
+});

src/screens/Settings.tsx

@@ -1,14 +1,14 @@
 import '../types/extension';
 import {Image, StyleSheet, Switch, Text, View} from "react-native";
 import {
-    darksalmonColor, DarkTheme,
+    darksalmonColor, DarkTheme, LightTheme,
     whiteColor
 } from "../assets/Theme";
 import React from "react";
-import {DefaultTheme, useTheme} from "@react-navigation/native";
+import {useTheme} from "@react-navigation/native";
 import {storeTheme} from "../redux/thunk/ThemeThunk";
 
-export default function Catalogue() {
+export default function Settings() {
     const light_mode = require("../assets/light_mode.png")
     const dark_mode = require("../assets/dark_mode.png")
     const [isDark, setDark] = React.useState(false)
@@ -16,7 +16,7 @@ export default function Catalogue() {
     const toggleTheme = () => {
         setDark(previousState => {
             const theme = !previousState;
-            const newTheme = theme ? DarkTheme : DefaultTheme;
+            const newTheme = theme ? DarkTheme : LightTheme;
             storeTheme(newTheme);
             return theme;
         });

src/screens/SettingsTest.test.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react-native';
+import Settings, { themeSettings } from './Settings';
+import { Provider } from 'react-redux';
+import store from '../redux/store';
+import {describe, expect, it} from "@jest/globals";
+
+describe('<Settings />', () => {
+    it('renders correctly', () => {
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <Settings />
+            </Provider>
+        );
+
+        expect(getByTestId('settings-title')).toBeTruthy();
+        expect(getByTestId('settings-switch')).toBeTruthy();
+    });
+
+    it('switches between light and dark mode', () => {
+        const { getByTestId } = render(
+            <Provider store={store}>
+                <Settings />
+            </Provider>
+        );
+
+        const switchElement = getByTestId('settings-switch');
+
+        expect(switchElement.props.value).toBeFalsy();
+
+        fireEvent(switchElement, 'onValueChange', true);
+
+        expect(switchElement.props.value).toBeTruthy();
+    });
+});
+
+describe('themeSettings()', () => {
+    it('returns correct styles', () => {
+        const theme = {
+            colors: {
+                background: 'white',
+                text: 'black',
+                primary: 'blue',
+                card: 'gray',
+            },
+        };
+
+        const styles = themeSettings(theme);
+        expect(styles.container.backgroundColor).toBe('white');
+        expect(styles.title.color).toBe('black');
+    });
+
+});