ovc-users's People
ovc-users's Issues
components / table / make the rows clickable
When a row is clicked, the website should show the link you give
- implement on row click
- row background color change when mouse over (#DCDCDC)
- when mouse over on row change mouse icon to hand
- remove cell component background color
views / user / list / row click to connect with user details reducer
logging / implement
css / components / text / improve
test / add default values for data-testids
css / components / table / improve
storybook / remove samples
components / implement input search
For instance if "Lea" is entered, only the "Leanne Graham" row should show in the table.
- renders correctly
- has placeholder that is "Search By Name"
readme / update
readme / add releases section
components / table / add more data to the users
{
name: "Leanne Graham",
email: "[email protected]",
city: "Gwenborough",
company: "Romaguera-Crona",
},
{
name: "Ervin Howell",
email: "[email protected]",
city: "Wisokyburgh",
company: "Deckow-Crist",
},
{
name: "Zebra Stripes",
email: "[email protected]",
city: "McKenziehaven",
company: "Romaguera-Jacobson",
}
components / cell / add children element
look for / https://github.com/testing-library/dom-testing-library/issues/639
components / table / hide id column title and cell text
routes / user / move application routes 'user related routes' to the user routes
views / user / improve package structure
views / user / list / add table component with header
views / user / list / fix should open given link when the row is clicked test case
● component › should open given link when the row is clicked
expect(received).toEqual(expected) // deep equality
Expected: "User Details"
Received: ""
<html>
<head />
<body>
<div />
</body>
</html>
81 |
82 | await waitFor(() => expect(document.title)
> 83 | .toEqual("User Details"));
| ^
84 |
85 | });
86 |
at src/views/User/components/list/UserList.test.tsx:83:18
components / header / implement
- column titles by list of object keys
- style display flex
- content justification is space around
css / components / header / improve
api / user / list / implement
- replace dummy users with list users api for user list component
- add exception handling for api get user list
components / table / fix TableWithHeader test
FAIL src/components/table/TableWithHeader.test.tsx
● Console
console.error
Warning: Each child in a list should have a unique "key" prop.
Check the render method of `Table`. See https://reactjs.org/link/warning-keys for more information.
at div
at Table (/home/runner/work/ovc-users/ovc-users/src/components/table/index.tsx:36:9)
41 |
42 | return (
> 43 | <>
| ^
44 | {header}
45 |
46 | {users.map(user =>
at printWarning (node_modules/react/cjs/react-jsx-dev-runtime.development.js:117:30)
at error (node_modules/react/cjs/react-jsx-dev-runtime.development.js:93:5)
at validateExplicitKey (node_modules/react/cjs/react-jsx-dev-runtime.development.js:986:5)
at validateChildKeys (node_modules/react/cjs/react-jsx-dev-runtime.development.js:1013:11)
at jsxWithValidation (node_modules/react/cjs/react-jsx-dev-runtime.development.js:1174:15)
at Table (src/components/table/index.tsx:43:9)
at renderWithHooks (node_modules/react-dom/cjs/react-dom.development.js:14985:18)
at mountIndeterminateComponent (node_modules/react-dom/cjs/react-dom.development.js:17811:13)
console.error
Error: Uncaught [TypeError: Cannot read property 'map' of undefined]
at reportException (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:62:24)
at innerInvokeEventListeners (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:333:9)
at invokeEventListeners (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
at HTMLUnknownElementImpl._dispatch (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
at HTMLUnknownElementImpl.dispatchEvent (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
at HTMLUnknownElement.dispatchEvent (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
at Object.invokeGuardedCallbackDev (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
at invokeGuardedCallback (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
at beginWork$1 (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:23964:7)
at performUnitOfWork (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22779:12) TypeError: Cannot read property 'map' of undefined
at Header (/home/runner/work/ovc-users/ovc-users/src/components/header/index.tsx:22:27)
at renderWithHooks (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:14985:18)
at mountIndeterminateComponent (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:17811:13)
at beginWork (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:19049:16)
at HTMLUnknownElement.callCallback (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:3945:14)
at HTMLUnknownElement.callTheUserObjectsOperation (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
at innerInvokeEventListeners (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:318:25)
at invokeEventListeners (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
at HTMLUnknownElementImpl._dispatch (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
at HTMLUnknownElementImpl.dispatchEvent (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
at HTMLUnknownElement.dispatchEvent (/home/runner/work/ovc-users/ovc-users/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
at Object.invokeGuardedCallbackDev (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
at invokeGuardedCallback (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
at beginWork$1 (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:23964:7)
at performUnitOfWork (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22779:12)
at workLoopSync (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22707:5)
at renderRootSync (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22670:7)
at performSyncWorkOnRoot (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22293:18)
at scheduleUpdateOnFiber (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:21881:7)
at updateContainer (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:25482:3)
at /home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:26021:7
at unbatchedUpdates (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22431:12)
at legacyRenderSubtreeIntoContainer (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:26020:5)
at Object.render (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:26103:10)
at /home/runner/work/ovc-users/ovc-users/node_modules/@testing-library/react/dist/pure.js:98:25
at batchedUpdates$1 (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom.development.js:22380:12)
at act (/home/runner/work/ovc-users/ovc-users/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1042:14)
at render (/home/runner/work/ovc-users/ovc-users/node_modules/@testing-library/react/dist/pure.js:94:26)
at Object.<anonymous> (/home/runner/work/ovc-users/ovc-users/src/components/table/TableWithHeader.test.tsx:16:13)
at Promise.then.completed (/home/runner/work/ovc-users/ovc-users/node_modules/jest-circus/build/utils.js:276:28)
at new Promise (<anonymous>)
components / table / add key to the users.map to remove warning message
console.error
Warning: Each child in a list should have a unique "key" prop. See https://reactjs.org/link/warning-keys for more information.
at div
41 |
42 | return (
> 43 | <>
| ^
components / table / add search by name capability
css / components / search / improve
css / components / cell / improve
models / user / add id
libraries / redux / configure
- add redux related packages
- configure root reducers template
- configure redux store with thunk
views / user / list / add storybook
reducers / user / list / add search
- list users which is searched by given name keyword
- users not found by given name keyword
api / user / detail / implement
app / test / replace wait to testing library async utils waitFor
remove wait function and replace with waitFor async utility
components / table / implement
- has text component
- has cell component
- has name type cell component, text component value is Leanne Graham
- text component top 16
- text component bottom 16
- text component left 16
views / user / detail / implement
- has table component with header component (column titles are title, body)
components / cell / implement
background : white
width : flex
height : 52
border bottom : 1
border bottom style : solid
border color : #D7D7D7
components / table / with header
- for name
- for name and email
- add storybook knobs add-on to make user content dynamic
reducers / user / details / add failure test
coverage / improve reporting
components / table / add test for user details
components / storybook / change components storybook file names and centralised jest-test-results.json importing for storybook
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.