Configure Shell/Terminal location

[torchiaf]

Summary

Fixes #4733

Technical notes summary

Please, feel free to suggest any visual/effect improvement of drag&pin animations

Areas or cases that should be tested

Terminal window

Areas which could experience regressions

Terminal window

Screenshot/Video

[torchiaf]

The solution is actually not working on Firefox. I'am pretty sure I found a cross-browsers solution, It requires some changes to the drag mechanism. It should be nice to have draggable mechanism in a Draggable component as well.

[torchiaf]

@aalves08 Just pushd another version. I think it requires another quick review but now it is works fine in every browsers now. :partying_face: I have created the Utils/DraggableZone component, so it is reusable.

Even if the new functionality is complete, there are some open points:

• I should add some unit tests for DraggableZone component.
• ~~In Chrome, the dragged image is still not visible.~~ It's fixed!

[codecov-commenter]

Codecov Report

Base: 36.78% // Head: 36.86% // Increases project coverage by +0.07% :tada:

Coverage data is based on head (7fd0b01) compared to base (b77d5c7). Patch coverage: 27.27% of modified lines in pull request are covered.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #7147      +/-   ##
==========================================
+ Coverage   36.78%   36.86%   +0.07%     
==========================================
  Files         986      988       +2     
  Lines       17647    17658      +11     
  Branches     4544     4545       +1     
==========================================
+ Hits         6492     6509      +17     
+ Misses      11155    11149       -6     

Flag	Coverage Δ
e2e	47.41% <60.00%> (+0.11%)	:arrow_up:
merged	36.86% <27.27%> (+0.07%)	:arrow_up:
unit	5.20% <0.00%> (-0.01%)	:arrow_down:

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
...c/components/Utils/DraggableZone/DraggableZone.vue	0.00% <0.00%> (ø)
...onents/src/components/Utils/DraggableZone/index.ts	0.00% <0.00%> (ø)
...ll/components/nav/WindowManager/ContainerShell.vue	0.00% <ø> (ø)
shell/components/nav/WindowManager/index.vue	0.00% <ø> (ø)
shell/layouts/default.vue	0.00% <ø> (ø)
shell/store/wm.js	24.39% <50.00%> (+2.76%)	:arrow_up:
shell/utils/platform.js	77.41% <100.00%> (+0.75%)	:arrow_up:
shell/plugins/dashboard-store/resource-class.js	47.63% <0.00%> (-0.16%)	:arrow_down:
shell/store/index.js	66.89% <0.00%> (+0.45%)	:arrow_up:
shell/utils/socket.js	61.76% <0.00%> (+0.49%)	:arrow_up:
... and 3 more

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

:umbrella: View full report at Codecov.
:loudspeaker: Do you have feedback about the report comment? Let us know in this issue.

[aalves08]

@aalves08 Just pushd another version. I think it requires another quick review but now it is works fine in every browsers now. 🥳 I have created the Utils/DraggableZone component, so it is reusable.

Even if the new functionality is complete, there are some open points:

• I should add some unit tests for DraggableZone component.
• ~In Chrome, the dragged image is still not visible.~ It's fixed!

Congrats mate! tested on "all" browsers (Chrome, Brave, Edge, Firefox, Safari) and it works great. 💪 👏

[torchiaf]

Minor issues are fixed, thanks for the review @aalves08 .

[aalves08]

All other comments i've resolved, but yesterday Neil had a good point with the dark mode (I always forget about that). Can you give a quick look at this on dark mode and make the necessary adjustments, please?

You can enable in user preferences (top-right corner) a shortcut (shift + T) to toggle the theme, which is very useful.

we use the variables specified in: https://github.com/rancher/dashboard/blob/master/shell/assets/styles/themes/_light.scss https://github.com/rancher/dashboard/blob/master/shell/assets/styles/themes/_dark.scss

You might need to extend this according to your needs...

Thanks! 🙏

[torchiaf]

Hi @aalves08 , theme variables are fixed, I pushed a new commit so the review should be easier, thanks!

[catherineluse]

@torchiaf I believe this can be merged to master now.