Skip to content

PB-1428 : complete migration to Vue 3.5#1233

Merged
pakb merged 2 commits intodevelopfrom
feat-PB-1428-finish-vue3-5-migration
Feb 11, 2025
Merged

PB-1428 : complete migration to Vue 3.5#1233
pakb merged 2 commits intodevelopfrom
feat-PB-1428-finish-vue3-5-migration

Conversation

@pakb
Copy link
Contributor

@pakb pakb commented Feb 10, 2025

  • use of the new useTemplateRef when applicable (when linking element from the template)
  • rework all props to refs logic to match Vue doc https://vuejs.org/guide/components/props.html#reactive-props-destructure
  • rework TippyJS composable to be able to receive template ref directly, and be able to receive an array of content. This makes it possible to configure it only through JS params, removing the need for the custom data-tippy-content HTML attribute (and makes the Tippy composable a bit more reactive too)

Also moving any remaining Option API component to the Composition API notation.

Test link

@pakb pakb requested a review from schtibe February 10, 2025 12:21
@cypress
Copy link

cypress bot commented Feb 10, 2025

web-mapviewer    Run #4497

Run Properties:  status check passed Passed #4497  •  git commit 1d5b1d4f81: Merge pull request #1233 from geoadmin/feat-PB-1428-finish-vue3-5-migration
Project web-mapviewer
Branch Review v1.52.0-beta.14
Run status status check passed Passed #4497
Run duration 01m 38s
Commit git commit 1d5b1d4f81: Merge pull request #1233 from geoadmin/feat-PB-1428-finish-vue3-5-migration
Committer Pascal Barth
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 1
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 48
View all changes introduced in this branch ↗︎

@pakb pakb force-pushed the feat-PB-1428-finish-vue3-5-migration branch 2 times, most recently from f26a958 to 96fe59e Compare February 10, 2025 14:39
Copy link
Contributor

@schtibe schtibe left a comment

Choose a reason for hiding this comment

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

Very nice! 🚀

function getImageStrokeStyle(isColorable, isSelected, color) {
if (isColorable) {
return {
filter: `drop-shadow(1px 1px 0 ${color.border}) drop-shadow(-1px -1px 0 ${color.border})`,
Copy link
Contributor

Choose a reason for hiding this comment

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

You know you can also return it as a list IIRC, and vue will put it together in the :style attribute. To me this usually seems a bit more graceful than concating strings, but it's surely just a matter of style

@@ -22,7 +23,7 @@ import { calculateTextOffset } from '@/utils/featureStyleUtils'

const dispatcher = { dispatcher: 'FeatureStyleEdit.vue' }
Copy link
Contributor

Choose a reason for hiding this comment

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

Maybe use upper case here to connotate this as being a "true" constant? It had me confused further down the code


// 2. Put all the props (input)
const props = defineProps({
const { myProp } = defineProps({
Copy link
Contributor

Choose a reason for hiding this comment

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

Unrelated to your change: we haven't specified where to put injects.

- use of the new useTemplateRef when applicable (when linking element from the template)
- rework all props to refs logic to match Vue doc https://vuejs.org/guide/components/props.html#reactive-props-destructure
- rework TippyJS composable to be able to receive template ref directly, and be able to receive an array of content. This makes it possible to configure it only through JS params, removing the need for the custom data-tippy-content HTML attribute (and makes the Tippy composable a bit more reactive too)

Also moving any remaining Option API component to the Composition API notation.
@pakb pakb force-pushed the feat-PB-1428-finish-vue3-5-migration branch from 506e0d9 to 2777db0 Compare February 11, 2025 08:26
@pakb pakb force-pushed the feat-PB-1428-finish-vue3-5-migration branch from 2777db0 to 16f53ea Compare February 11, 2025 08:39
@pakb pakb merged commit 1d5b1d4 into develop Feb 11, 2025
6 checks passed
@pakb pakb deleted the feat-PB-1428-finish-vue3-5-migration branch February 11, 2025 08:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants