itaditya

const Aditya = () => (
  <article>
    <h1>Frontend Dev</h1>
    <p>Builds Quality Software</p>
  </article>
);

itaditya

Find me on these platforms

Platform	Link
Website	https://adi.netlify.app/me
Twitter	https://adi.netlify.app/twitter

itaditya

const Tab = ({ id, children }) => (
  <Consumer>
    {({ changeTab }) => <div onClick={() => changeTab(id)}>{children}</div>}
  </Consumer>
);

itaditya

// App.js
function App() {
  const stateAPIStatus = useLoadFoodData();

  return (
    <div className="food-app">
      <header>
        <h1>Ordux</h1>
      </header>
      <Message status={stateAPIStatus} />

itaditya

function useLoadFoodData() {
  const [stateAPIStatus, setAPIStatus] = useState('idle');
  const dispatch = useDispatch();

  useEffect(() => {
    setAPIStatus('loading');
    loadFoodData()
      .then((data) => {
        dispatch({
          type: ACTIONS.LOAD_MENU,

itaditya

import { render, fireEvent, screen, waitForElementToBeRemoved } from '@testing-library/react';

import * as utils from './utils';

jest.mock('./utils');

const foodData = [
  {
    id: 'SM',
    label: 'Sausage McMuffin',

itaditya

import React from 'react';
import { Provider } from 'react-redux';
import { render, screen, waitForElementToBeRemoved } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';

import App from './App';
import { createReduxStore } from './redux';

describe('Test App', () => {
  function renderApp(store = createReduxStore(), props = {}) {

itaditya

// redux.js

const enableReduxDevTools = window.__REDUX_DEVTOOLS_EXTENSION__?.();

export function createReduxStore() {
  const store = createStore(foodReducer, enableReduxDevTools);
  return store;
}

itaditya

test('only show veg food when veg filter is applied', () => {
  // arrange
  render(<App {...props} />);

  // act
  fireEvent.click(screen.getByRole('checkbox', { name: /Veg Only/i }));

  // assert
  expect(screen.queryByText(/Sausage McMuffin/i)).toBe(null);
  expect(screen.getByText(/Mushroom Pizza/i)).toBeInTheDocument();

itaditya

export default function App() {
  const diet = useSelector((state) => state.diet);
  const dispatch = useDispatch();

  function handleVegToggle() {
    dispatch({
      type: ACTIONS.CHANGE_DIET,
    });
  }