Skip to content

Conversation

@Irina0313
Copy link
Owner

@Irina0313 Irina0313 commented Nov 9, 2023

✋Hello, my dear Reviewer:))

  • The current week's tasks have been completed in full
  • Jest was used for testing
  • To run tests use the script "test"
  • To run the test coverage check use the script "test-coverage"
  • To make it easier to check the tests, I have marked in which files to look for the required tests. The name of the tests is the same as how the task is written in the requirements:
    image
    See below at point 5 👇
  1. Task: https://github.com/rolling-scopes-school/tasks/tree/master/react/modules/module03

  2. Screenshot:
    image
    image

  3. Deploy:rss-app-iriva0313-week3.netlify.app

  4. Done 12.11.2023 / deadline 13.11.2023

  5. Score: 100 / 100

  • Custom state management using the Context API is implemented - 5 points
  • The Search component value is stored in the context - 5 points
  • The list of items received from the API is stored in the context - 5 points
  • The context is used in components that need access to the data - 5 points
  • React Testing Library and Jest or Vitest are added and configured - 10 points
  • Test cases - 60 points (5 points per each)
  • Tests for the Card List component:
    -- Verify that the component renders the specified number of cards - Data.test.tsx;
    -- Check that an appropriate message is displayed if no cards are present. - HomePage.test.tsx
  • Tests for the Card component:
    -- Ensure that the card component renders the relevant card data; -ProductImage.test.tsx, Product.test.tsx
    -- Validate that clicking on a card opens a detailed card component;-App.test.tsx
    -- Check that clicking triggers an additional API call to fetch detailed information.-App.test.tsx
  • Tests for the Detailed Card component:
    -- Check that a loading indicator is displayed while fetching data;-ProductPage.test.tsx
    -- Make sure the detailed card component correctly displays the detailed card data;-ProductPage.test.tsx
    -- Ensure that clicking the close button hides the component.-ProductPage.test.tsx
  • Tests for the Pagination component:
    -- Make sure the component updates URL query parameter when page changes.-Pagination.test.tsx
  • Tests for the Search component:
    -- Verify that clicking the Search button saves the entered value to the local storage;-App.test.tsx
    -- Check that the component retrieves the value from the local storage upon mounting.-App.test.tsx
  • Tests for the 404 Page component:
    -- Ensure that the 404 page is displayed when navigating to an invalid route. - HomePage.test.tsx
  • Husky runs tests on pre-push - 10 points

const [loading, setLoading] = useState(false);
const [showError, setShowError] = useState(false);
const [searchParams, setSearchParams] = useState<string | null>(
safeJsonParse(localStorage.savedSearch)
Copy link
Collaborator

@GizmoGrem GizmoGrem Nov 10, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

если идут сложные вычисления то лучше использовать
(влияет на инициализацию стейта перед первым рендером)

const [searchParams, setSearchParams] = useState<string | null>(()=>
    safeJsonParse(localStorage.savedSearch)
}

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ясно, поправила

src/App.tsx Outdated
const [isDataLoaded, setIsDataLoaded] = useState(false);
const [itemsPerPage, setItemsPerPage] = useState(30);
const [currPageNum, setCurrPageNum] = useState(
(segments[1].length > 5 && Number(segments[1].slice(5))) || null
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

тоже самое

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

поправила

@@ -0,0 +1,35 @@
import { useState, useContext } from 'react';
import './ProductImage.css';
import { ProductsContext } from '../../context/context';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

может index? context/context не очень семантично выглядит

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

да, логично, поправила

src/main.tsx Outdated
import App from './App';
import './index.css';
import ErrorBoundary from './Components/ErrorBoundary/ErrorBoundary';
import { BrowserRouter } from 'react-router-dom';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

порядок зависимостей, обычно с пэкэджей идут в начале

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ясно, исправлю везде

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants