!!DRAFT task-solution Szczepan Micek #1
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Create `crew.d.ts` to define types related to crew members.
- The readJsonFile function reads, validates, and parses data from JSON files. - The readYamlFile function handles reading, validating, and parsing data from YAML files.
- Create constants.ts to manage all data file paths.
- Revise crew type definitions for clarity and precision. - Remove redundant and unused crew type declarations.
…Member methods - Implement mapJsonMemberToValidCrewMember to convert JSON data to a validated crew member structure. - Create mapYamlMemberToValidCrewMember for converting YAML data into a valid crew member format.
- Develop getCrewMembers function to read crew data from specified files. - Integrate data validation within getCrewMembers to ensure data integrity. - Transform validated data into standardized object format for further use.
- Update names to be more descriptive and align with project standards - Remove unused methods for cleaner code maintenance - Fix minor issues identified during the refactor BREAKING CHANGE: Renaming may affect dependent modules. Ensure compatibility before integrating.
…configuration - Added React Testing Library and Vitest as dev dependencies - Configured Vitest for the project - Established a basic structure for writing and running tests
- Shifted all static data values to constants.ts - Updated imports and references in the codebase to use the new constants - Ensured no functional changes to the application
- Implemented comprehensive unit tests covering all functions in utils - Ensured tests validate both positive and edge case scenarios - Updated testing documentation to reflect new test additions
- Included data-testid attributes in key elements of Pagination.tsx - Updated tests to utilize the new data-testid attributes
- Created unit tests for [CrewCard; CrewList;Pagination; PaginationButton ] - Ensured comprehensive coverage including edge cases
- Integrated @testing-library/jest-dom/vitest for enhanced type support in Vitest - Updated relevant test files to utilize the extended type definitions - Improved testing capabilities and assertions specificity
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Hello, this is my proposed solution for Winter Camp 2024. I'm optimistic that this will meet the criteria for the next phase.
Initially, I believed that the most straightforward approach to this challenge would be to use Next.js with SSR via
getServerSideProps, allowing data to be passed directly as props. However, due to the requirements, I had to choose between SWR or React-Query for data fetching. I opted for React-Query, as I am more familiar with this library.Here's the technology stack I used:
yaml: Crucial for parsing YAML files into objects.@tanstack/react-query: Selected to fulfill the task requirements.zod: Integral for data validation, ensuring a high level of confidence in the data structure.Additionally, I incorporated some optional tools:
tailwind-merge: This utility enhances our efficiency with TailwindCSS.prettier: I used this with basic plugins to maintain a consistent styling configuration throughout the application.EDIT:
I have added base unit testing with
VitestandReact Testing Library.You can run this by this command