search

themesberg / flowbite-react

Official React components built for Flowbite and Tailwind CSS
https://flowbite-react.com
MIT License
1.77k stars 395 forks source link

Allow Avatar as a Timeline.Point #1276

Open codercody opened 4 months ago

codercody commented 4 months ago

Summary + Context

I'm trying to make a feed of user posts. I'd like the Timeline.Point to be an Avatar that shows the user's profile picture. It'd also be nice to be able to put text to the right of the Avatar, like the username but that seems way easier to hack with Timeline.Time

rluders commented 4 months ago

@codercody is it supported by standard flowbite library? Can you give us any example from the official documentation?

codercody commented 4 months ago

In the activity log section of the timeline component on the flowbite website there's an example of what I had in mind - the avatar in the spot of the Timeline.Point

rluders commented 4 months ago

OK, so... the request is to add the support to Timeline.Point to support iconRender function, so you can use Avatar or any other component as inner content of the Timeline.Point.

AhmedSwisi commented 2 months ago

Hello, Is anyone working on this? Id like to give this a shot

SutuSebastian commented 2 months ago

Hello, Is anyone working on this? Id like to give this a shot

Sure, go ahead

AhmedSwisi commented 2 months ago

Hello, So sorry to hassle you with me but I got some free time to give this a shot today and I keep running into a lot of issues. The main one seems to be a client/server components issue where it says, for example 'Accordion' imports useRef which means it has to be a client component. This is an easy fix but I think I am doing something wrong. This is in .mjs files when i try to run the nextJS App. I followed the steps in the documentation for contributing so please let me know if theres anything im missing misunderstanding on how to get everything to run properly locally. Thank you in advance. Edit: To be clear I did get it working by just using use client at root of the tree so what Im really asking is is this right and then I revert it back before pushing or am I doing something off? any pointers are appreciated as well. Thank you again

SutuSebastian commented 2 months ago

Hello, So sorry to hassle you with me but I got some free time to give this a shot today and I keep running into a lot of issues. The main one seems to be a client/server components issue where it says, for example 'Accordion' imports useRef which means it has to be a client component. This is an easy fix but I think I am doing something wrong. This is in .mjs files when i try to run the nextJS App. I followed the steps in the documentation for contributing so please let me know if theres anything im missing misunderstanding on how to get everything to run properly locally. Thank you in advance. Edit: To be clear I did get it working by just using use client at root of the tree so what Im really asking is is this right and then I revert it back before pushing or am I doing something off? any pointers are appreciated as well. Thank you again

Best way to work on the UI library (flowbite-react) is by starting the storybook app (apps/storybook) since it watches the files in the packages/ui.

All the management should be done from the root package.json which contains multiple scripts, but to start storybook u must run bun dev:storybook, a new browser tab will be opened after with the stories.

Note: the docs (apps/web) consume the UI library (packages/ui) just like any other npm package, to ensure correct functionality both in client and server env, thats why when u want to go to the source of a component, it sends u to either the .d.ts file or the .mjs file, since thats the build output of flowbite-react (UI package).

I'll find some time to enrich the docs contributing page in the close future for easier onboarding and better DX.