Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dashboard: Refector dashboard to a dashboard framework library. #1007

Merged
merged 35 commits into from
Nov 7, 2024

Conversation

koonpeng
Copy link
Collaborator

@koonpeng koonpeng commented Sep 3, 2024

This is built on top of koonpeng/microapps-v2. This builds upon the architecture and refactor the existing dashboard into a dashboard framework library, the existing dashboard is now a demo example and can be started with pnpm start:example examples/demo. There is also a custom theme example using the awesome nord theme.

rmf-dashboard-nord

@koonpeng koonpeng marked this pull request as draft September 3, 2024 08:20
@koonpeng koonpeng mentioned this pull request Sep 3, 2024
Base automatically changed from koonpeng/microapp-v2 to main September 5, 2024 01:48
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
@koonpeng koonpeng force-pushed the koonpeng/merge-react-components branch 2 times, most recently from 658930e to 549b42e Compare September 5, 2024 02:41
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
@koonpeng koonpeng force-pushed the koonpeng/merge-react-components branch from 549b42e to 3b4c1e9 Compare September 5, 2024 03:10
…components

Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
@koonpeng koonpeng force-pushed the koonpeng/merge-react-components branch from b8a6ebc to 4c0de1c Compare September 19, 2024 04:25
@koonpeng koonpeng marked this pull request as ready for review September 19, 2024 04:42
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
…components

Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
…components

Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
…components

Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Copy link
Member

@aaronchongth aaronchongth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for putting this together! I have a few comments and nitpicks, here and there, but overall it's looking great!

This is not part of the diff, so I'll write it out here, our codecov.yml still references react-components

README.md Outdated Show resolved Hide resolved
README.md Outdated Show resolved Hide resolved
README.md Show resolved Hide resolved
README.md Show resolved Hide resolved
packages/rmf-dashboard-framework/docs/getting-started.md Outdated Show resolved Hide resolved
At this point, you should be able to follow the [demo dashboard example](../examples/demo/main.tsx). You may need to install additional deps if you want to use the same fonts as the demo.

```bash
pnpm add -w @fontsource/roboto
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
pnpm add -w @fontsource/roboto
pnpm add @fontsource/roboto

packages/rmf-dashboard-framework/docs/getting-started.md Outdated Show resolved Hide resolved
packages/rmf-dashboard-framework/docs/getting-started.md Outdated Show resolved Hide resolved
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
@koonpeng koonpeng force-pushed the koonpeng/merge-react-components branch from 8c36f1e to 7f2f570 Compare October 18, 2024 05:59
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
…components

Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Copy link
Member

@aaronchongth aaronchongth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks! Most of the instructions are working fine, however it looks like the demo-dashboard docker image is broken. I tested with

built with the fixes I listed,

docker build -t kp-dashboard:latest --build-arg "BRANCH=koonpeng/merge-react-components" demo-dashboard/

run,

docker run   --network host -it --rm   -e RMF_SERVER_URL=http://localhost:8000   -e TRAJECTORY_SERVER_URL=ws://localhost:8006 kp-dashboard:latest

README.md Outdated Show resolved Hide resolved
.github/demo-dashboard/Dockerfile Outdated Show resolved Hide resolved
.github/demo-dashboard/Dockerfile Outdated Show resolved Hide resolved
.github/demo-dashboard/Dockerfile Outdated Show resolved Hide resolved
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
Signed-off-by: Teo Koon Peng <teokoonpeng@gmail.com>
@koonpeng
Copy link
Collaborator Author

koonpeng commented Nov 4, 2024

I had to pin node to 20 because node-canvas does not have prebuilt binary for the latest lts (node 22). Going to make an issue about this.

Copy link
Member

@aaronchongth aaronchongth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the massive refactor! LGTM

@aaronchongth aaronchongth mentioned this pull request Nov 4, 2024
5 tasks
@koonpeng koonpeng merged commit 9a3e725 into main Nov 7, 2024
3 checks passed
@koonpeng koonpeng deleted the koonpeng/merge-react-components branch November 7, 2024 01:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

2 participants