reactsocialnetwork
reactsocialnetwork copied to clipboard
gbowne1
[TODO] Complete the Dashboard component
Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
Describe the solution you'd like
Using Material UI etc
Complete the dashboard for ome of the following
- User Dashboard (General items not in settings)
- Admin & Moderator dashboard (for chat and posts)
- Analytics Dashboard
- Groups & Events dashboard (Creating and managing groups and events)
Could be a tabbed view controlled by buttons or breadcrumbs or..
Describe alternatives you've considered I have considered using this as several things
- Analytics dashboard
- Admin / Moderator dashboard
- User dashboard for general thing
Ideally we would have all 3. whether that be separate components or available via a nav inside the component??
Additional context Add any other context or screenshots about the feature request here.
I think Admin & Moderator dashboard could be in form of modal popup which can be opened by clicking on any user post to handle moderation etc.
If it goes about user dashboard not sure what can be included there. I think all needed things could be gathered in user profile settings like, writing description, including profile picture etc.
Analytics could be separate admin panel.
@pawel975 I totally agree on this.with a few comments.
Users Analytics can be seperate from Admin Analytics
We havent implemented userland stuff much yet so yeah.
User actually would have a lot of controls and settings.
Analytics overall can be a big thing for both staff and users.
I would like to give admin and mod rights to all posts and comments etc. within Controls for banning or warning users with a heavy emphasis on warnings.
Show me a first iteration of this.
The user controls for Groups on Facebook and Nextdoor are terrible. This was my main reason for starting this project.
My thoughts for Dashboard
The box changes with the button clicked on the left
Hey @gbowne1. I would like to work upon the design of Dashboard component.
Let me know what you want to including in this component. I've gone through the issue description you have provided on top.
Here are my thoughts for this Dashboard component.
1) USER DASHBOARD
In this component, we can show his posts, friends, followers,following and profile followed by bio. And we can provide him full control of this dashboard..
2) ANALYTICS DASHBOARD
My thoughts for this component is to view the activity of users based on the location. We can gathere what kind of meetings they are attending and what posts they are liking or interested in. And what are the age groups of people mostly are from that region. And how much time he is spending time on our website. And there are lot to do with their data.
3) ADMIN DASHBOARD
Well, this is our main component in the entire application and for sure it must be very secure. We can include all users data and we can take control of every user, and we can include what kind of content they are viewing, and also we can get better ideas by working on this in the future.
Screenshot for context:
The actual component style we use across all components:
This sounds great to me. This page is in /src/pages/Dashboard with a css and a jsx file. If you need to seperate the 3 into components, I would probably even just copy the code from Dashboard.jsx and Dashboard.css and reuse it to make the components you need to save rework on componentry and just so everyones on the same page.
Our css is typically defined like .Component-section { ... };
MUI 5.11 includes a lot of great icons. Like I showed in the post above I made on March 13.. you could build the different sections within the Dashboard.jsx component.
Components typically go into /src/pages/{Componentname/{Componentname}.jsx
I think we need to make a boilerplate component people can reuse for our component panel(s). (there will be a few)
Ideas? @pawel975 @manuel
Hey I worked on designing user dashboard.
Here is the screenshot what I've done so far.
You can now take a look at what I've done.
https://www.figma.com/file/8G8ZfMDBQPBbskNwJo74O6/Untitled?node-id=0%3A1&t=DNQ86EchUmhXc47g-1
Hey I worked on designing user dashboard.
Here is the screenshot what I've done so far.
You can now take a look at what I've done.
https://www.figma.com/file/8G8ZfMDBQPBbskNwJo74O6/Untitled?node-id=0%3A1&t=DNQ86EchUmhXc47g-1
Looks good but be sure to follow colors, font's etc from /src/variables.css
@pawel975 yes. It's just a design though.
@goutham03062001 We already have a theme switch that controls the entire theme. There's no need for one in the User Dashboard. We could do some userland settings in a display/settings page, outside of the user icon / avatar settings page. Thats a nice design for a user dashboard though, but will need some internal componentry. I am on board with everything there.
To see the actual dashboard to use in your development go to:
http://localhost:3000/dashboard
the files you will need to modify are:
client/src/pages/Dashboard.css client/src/pages/Dashboard.jsx
You will need to retain the component <Panel /> in your code.. this sets up the component panel you will use for the dashboard.
Also retain the themeMode so that it changes theme with the switch properly.