dhrjarun / blood-buddy-react Goto Github PK

Document section of storybook is not working, as doc section is clicked, it throws an error, fix it.

the size of the Dot will depend on the font size

and can also have different sizes like sm, md, lg.

make using may be span and svg, path

bug is:
you have two field, one is password and another is field for confirming the password. first enter the password, and then enter the same password on the confirm field.
if the passwords are same no error will be on the confirm password field, if they are not same, error will be on the confirm password filed.

but lets say you've entered passwords on the both field, and then you go the password filed and changed the password, there will be no error on the confirm password field this is the error.

add the functionality to make buttonsGroup to full width

can be done using justifyContent to stretch.

Context is not working with the buttonGroup fix it, may be create custom buttonGroup instead of wrapping the chakra buttonGroup

Avatar component in sm size is very small and does not looks good with blood badge compnen, so make it a bit bigger so that it look good.

first migrate to yarn

then either user yarn workspace with lerna or use Nx

I don't know to do this

adding the foundation like

• color
• typography
• spacing
• z-indexes
• sizes
• radii
• shadows

use "use-sound" hook to add sound effect to themeSwitcher button so that, if it gets clicked the switched will play.

created a branch for that "fix/theme-switcher-fx", add the futer inside that branch and merge,
have added the sfx file, already

head some error while importing the sound file so stopped implementing it. find the solution and do the job..

since I am using only first letter, make it bigger.
and change the bg of avatar so that it look neutral, use some gray with no that much black
and may be add support for dark theme

Location of problem

I found the problem inside of Avatar Component, Avatar component has a StylesProvider in it, consumer of this is AvatarBadge, so when I call useStyles hook inside of AvatarBadge Component it throw an error.

ContextError: useStyles: `styles` is undefined. Seems you forgot to wrap the components in `<StylesProvider />` 
    at avatar-badge.tsx:18:1
    at renderWithHooks (react-dom.development.js:16175:1)
    at updateForwardRef (react-dom.development.js:20023:1)
    at beginWork (react-dom.development.js:22465:1)
    at beginWork$1 (react-dom.development.js:27381:1)
    at performUnitOfWork (react-dom.development.js:26513:1)
    at workLoopSync (react-dom.development.js:26422:1)
    at renderRootSync (react-dom.development.js:26390:1)
    at performSyncWorkOnRoot (react-dom.development.js:26041:1)
    at flushSyncCallbacks (react-dom.development.js:12009:1)

One more thing to note, In the react dev tools it is showing that AvatarBadge is being wrapped with StyleProvider and everything is working there

some hints to resolve

This could be the error of node_modules, I deleted it and then reinstalled everythinng but got no fix

one solution might be
by default use margin to space out then you padding to space out in hover state

These two cards are same.

Description

Setting up the storybook in root of the repo will be great instead of setting up in every package which needs. This way will also able to put all the components in a single storybook host. Otherwise will have to start more than one storybook host.

Problems

I tried setting it up by running npx storybook init, but it is throwing so many errors