Refactor React-Native Components: Convert to TypeScript, Add Unit Tests, Improve Documentation, and Separate Logic

[acezard]

This issue aims to address the following concerns with three files in our React-Native app:

1. Convert .js files to TypeScript:

   • Currently, the two component files are written in JavaScript. To take advantage of TypeScript's type-checking and better maintainability, we should convert these files to TypeScript.

2. Add unit tests:

   • There are no existing unit tests for these components. In order to ensure their functionality and make future changes more reliable, we need to create unit tests for each component.

3. Improve documentation:

   • The current documentation for these components is lacking or insufficient. To make it easier for team members to understand and work with these components, we should add clear and concise documentation, including descriptions of props, functions, and the overall purpose of each component.

4. Separate view logic from components:

   • The view components currently embed too much logic inside them, which makes them difficult to maintain and test. We need to extract the logic from the view components and separate it into appropriate functions or custom hooks, making the components more modular and easier to manage.

To resolve this issue, we will refactor the three files according to the points above. This will improve the codebase maintainability, make it easier for team members to understand the components, and ensure that the components are well-tested.