#107-Create-Dynamic-Graph

a24hirsa commented

2026-04-08 13:28:26 +00:00

Collaborator

Finsihed creating WeatherGraph Component. Created mockup data by modifying useTemprature to store an array and manually changing values in that array in WeatherGraph. CSS styling file for WeatherGraph was also created and tempratureView now does no data handling and instead only displays the weather graph in the card. Data handling of stored useTemprature data is now instead done in WeatherGraph

a24hirsa added 4 commits

2026-04-08 13:28:27 +00:00

WeatherGraph Component 6f2721c8c8

added a skeleton Graph component for the weather
todo:
Hook to the api
shift height and color based on tempratue
create css file for styling

Added External CSS and Data handling 26731eb16e

Added a external css file for the WeatherGraph and started moving weather data getting away from temperature view into the WeatherGraph.

API hooking and Theme.css matchign will be added after the next merge

Removed Gettign data from temprature view fully df8b8e55ee

Added comments, cleaned up some code and removed data getting from temperature view fully and moved it to weather graph

Mockup Data bdcd14660f

Created mockup data by making useTemperature store an array of data elements and modifying them in the WeatherGraph.

a24hirsa changed target branch from main to team_1_week_1

2026-04-08 13:28:47 +00:00

a24hirsa was assigned by c24elipe

2026-04-09 07:44:32 +00:00

c24elipe added the

needs review

label

2026-04-09 07:44:38 +00:00

a24hirsa added 1 commit

2026-04-09 08:11:40 +00:00

Bug Fix 9411823eb5

Fixed Decimal issue for temprature in graph and current time temp not matching in right side view and graph

c24elipe referenced this pull request from a commit

2026-04-10 07:25:32 +00:00

Fix merge conflict

c24elipe added 1 commit

2026-04-10 07:25:33 +00:00

Fix merge conflict ea109f6b00

This is simply a fix for the pr #188 merge conflict.

The new .sln file is just from the main team 1 branch.

c24elipe added 1 commit

2026-04-10 07:26:10 +00:00

Retry fix merge 2479915501

a24noabe was assigned by c24elipe

2026-04-10 07:56:14 +00:00

a24noabe commented

2026-04-10 09:27:06 +00:00

Collaborator

Files i've checked:

/frontend/src/components/Graphs/WeatherGraph.js
/frontend/src/components/Graphs/WeatherGraph.module.css
/frontend/src/features/temperature/TemperatureView.js
/frontend/src/features/temperature/useTemperature.js

JavaScript code follows code standards and is commented well. Website works well and the graph looks good:
I'm unsure however if changes should be made to files in the /frontend/src/features/temperature/ directory. useTemperature.js will be changed during the weekly merge so it might not matter. TemperatureView should probably not be changed, I think it might be a better idea to use a dedicated view for the graph (TemperatureGraphView.js) instead of changing the one for sensor temperature.

(This part is very nit-picky)
CSS code doesn't quite meet some standards:

Use hex codes for colors, check the design document (issue #16) for the correct hex code.

Considering the colors here represent temperature it might be a non issue, but topas might work well.

Indentation should be done with two spaces. Tab can be used if your local settings is set to two spaces.

All classes, id and attributes should be named with all lowercase. When separation is needed, use a dash (hyphen) “ - “.

I don't think it's super important, but check through the standards and fix anything you find, för säkerhets skull.

Files i've checked: - `/frontend/src/components/Graphs/WeatherGraph.js` - `/frontend/src/components/Graphs/WeatherGraph.module.css` - `/frontend/src/features/temperature/TemperatureView.js` - `/frontend/src/features/temperature/useTemperature.js` JavaScript code follows code standards and is commented well. Website works well and the graph looks good: ![image](/attachments/2a0e0d3c-7398-4794-a019-a96f4a5ed086) I'm unsure however if changes should be made to files in the `/frontend/src/features/temperature/` directory. useTemperature.js will be changed during the weekly merge so it might not matter. TemperatureView should probably not be changed, I think it might be a better idea to use a dedicated view for the graph (TemperatureGraphView.js) instead of changing the one for sensor temperature. (This part is very nit-picky) CSS code doesn't quite meet some [standards](https://git.webug.se/Andras/BoundlessFlowCampus2K/wiki/CSS-Standards): > Use hex codes for colors, check the design document (issue #16) for the correct hex code. Considering the colors here represent temperature it might be a non issue, but [topas](https://git.webug.se/Andras/BoundlessFlowCampus2K/wiki/Webpage-Design#colour-palette) might work well. > Indentation should be done with two spaces. Tab can be used if your local settings is set to two spaces. > All classes, id and attributes should be named with all lowercase. When separation is needed, use a dash (hyphen) “ - “. I don't think it's super important, but check through the standards and fix anything you find, för säkerhets skull.

image.png

25 KiB

a24hirsa added 2 commits

2026-04-10 10:14:06 +00:00

Fixed CSS styling and created new TempratureViewGraph.js 469b0c42b4

Merge branch '#107-Create-Dynamic-Graph' of https://git.webug.se/Andras/BoundlessFlowCampus2K into #107-Create-Dynamic-Graph c63330badc

a24hirsa commented

2026-04-10 10:15:13 +00:00

Author

Collaborator

Fixed CSS styling to match standards and added a new TempratureGraphView component that will dispaly weather graph instead of TemperatureView

a24hirsa added 1 commit