diff --git a/src/data/INIT_LIST.js b/data/INIT_LIST.js similarity index 100% rename from src/data/INIT_LIST.js rename to data/INIT_LIST.js diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index a11777c..0000000 Binary files a/public/favicon.ico and /dev/null differ diff --git a/public/logo192.png b/public/logo192.png deleted file mode 100644 index fc44b0a..0000000 Binary files a/public/logo192.png and /dev/null differ diff --git a/public/logo512.png b/public/logo512.png deleted file mode 100644 index a4e47a6..0000000 Binary files a/public/logo512.png and /dev/null differ diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 080d6c7..0000000 --- a/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/src/ChangeTitle/index.js b/src/ChangeTitle.js similarity index 100% rename from src/ChangeTitle/index.js rename to src/ChangeTitle.js diff --git a/src/HitCounter/index.js b/src/HitCounter.js similarity index 100% rename from src/HitCounter/index.js rename to src/HitCounter.js diff --git a/src/HitCounter/HitCounter.test.js b/src/HitCounter.test.js similarity index 93% rename from src/HitCounter/HitCounter.test.js rename to src/HitCounter.test.js index 2a1fef6..87b2286 100644 --- a/src/HitCounter/HitCounter.test.js +++ b/src/HitCounter.test.js @@ -1,7 +1,7 @@ import React from "react"; import '@testing-library/jest-dom/extend-expect' import { render, fireEvent } from '@testing-library/react'; -import HitCounter from "./index"; +import HitCounter from "./HitCounter"; describe('on mount', () => { test('renders the button', () => { @@ -14,4 +14,4 @@ describe('on mount', () => { fireEvent.click(getByRole('button')); expect(getByText(/1/)).toHaveTextContent('1'); }); -}); +}); \ No newline at end of file diff --git a/src/MemberListComplex/MemberListComplex.test.js b/src/MemberListComplex/MemberListComplex.test.js deleted file mode 100644 index cd75295..0000000 --- a/src/MemberListComplex/MemberListComplex.test.js +++ /dev/null @@ -1,43 +0,0 @@ -import '@testing-library/jest-dom/extend-expect'; -import { render, fireEvent, waitFor } from '@testing-library/react'; -import MemberList from './index'; - -const INIT_LIST = { - team: { - currentMembers: [ - { id: 0, name: 'Badrock' }, - { id: 1, name: 'Vogue' }, - ], - }, -}; - -const renderComponent = () => render(); - -const submitForm = ({ getByText, getByLabelText }, { name }) => { - fireEvent.change(getByLabelText('Add new member'), { - target: { value: name }, - }); - fireEvent.click(getByText(/Update/i)); -}; - -describe('on mount', () => { - test('displays list items', () => { - const { getAllByRole } = renderComponent(); - expect(getAllByRole('listitem')).toHaveLength(2); - }); - - test('removes first item in list', () => { - const { getAllByRole } = renderComponent(); - fireEvent.click(getAllByRole('button')[0]); - expect(getAllByRole('listitem')).toHaveLength(1); - }); - - test('adds item to list', async () => { - const component = renderComponent(); - submitForm(component, { name: 'Trevor' }); - await waitFor(() => { - expect(component.getByText(/Trevor/i)).toHaveTextContent('Trevor'); - expect(component.getAllByRole('listitem')).toHaveLength(3); - }); - }); -}); diff --git a/src/MemberListComplex/index.js b/src/MemberListComplex/index.js deleted file mode 100644 index 7034dd0..0000000 --- a/src/MemberListComplex/index.js +++ /dev/null @@ -1,76 +0,0 @@ -import React, { useReducer, useState } from "react"; - -// Imagin this function in its own file. -function reducer(state, action) { - const { currentMembers } = state.team; - switch (action.type) { - case 'addMember': - return { - ...state, - team: { - ...state.team, - currentMembers: [ - ...state.team.currentMembers, - {id: currentMembers.length, name: action.payload} - ] - } - } - case 'removeMember': - return { - ...state, - team: { - ...state.team, - currentMembers: currentMembers.filter(m => m.name !== action.payload) - } - }; - default: - throw new Error(); - } -} - -const MemberList = function({ initList }) { - const [list, dispatch] = useReducer(reducer, initList); - const [newMember, setNewMember] = useState(''); - - return ( - <> - - - { - setNewMember(e.target.value); - }} - placeholder="New member..." - /> - - - ); -} - -export default MemberList; diff --git a/src/useDarkMode/index.js b/src/useDarkMode.js similarity index 100% rename from src/useDarkMode/index.js rename to src/useDarkMode.js diff --git a/src/useDarkMode/useDarkMode.test.js b/src/useDarkMode/useDarkMode.test.js deleted file mode 100644 index aabb44f..0000000 --- a/src/useDarkMode/useDarkMode.test.js +++ /dev/null @@ -1,36 +0,0 @@ -import { renderHook, act } from '@testing-library/react-hooks'; -import { useDarkMode } from './index'; - -test('allows you to undo and redo', () => { - const { result } = renderHook(() => useDarkMode()); - expect(result.current.theme).toBe('light'); - act(() => { - result.current.toggleTheme(); - }); - expect(result.current.theme).toBe('dark'); -}); - -/* -##Another example: - -Just to see the difference, this test is using -`react-test-renderer` -- a low level testing framework. -The most common way to test custom hooks is to mock them. -In this example we've created an example component alongside -our hook for testing purposes only. This is an acceptable practice, -though it feels wrong. - -import renderer, { act } from "react-test-renderer"; -import { useDarkMode, DarkModeExample } from './index'; - -test("Returns string 'theme-dark'", () => { - const component = renderer.create( - - ); - act(() => { - component.toJSON().props.onClick(); - }); - expect(component.toJSON().children[1]).toBe('dark'); -}); - -*/